SignIn.EmailForm.SigninButton

Submit button component that handles form submission with loading states, validation, and error display. Provides automatic form submission, loading indicators, and comprehensive error handling with accessibility support.

Quick Start Example

import { SignIn, useAppTheme } from "@ovok/native";
import React from "react";
import { StyleSheet } from "react-native";

// Static styles outside component
const styles = StyleSheet.create({
  form: {
    flex: 1,
  },
});

const SignInButtonExample = () => {
  const theme = useAppTheme();

  return (
    <SignIn.EmailForm
      loginType="Patient"
      tenantCode="your-tenant-code"
      style={[
        styles.form,
        {
          gap: theme.spacing(4),
        },
      ]}
    >
      <SignIn.EmailForm.Inputs />
      <SignIn.EmailForm.SigninButton />
    </SignIn.EmailForm>
  );
};

export default SignInButtonExample;

Props

Prop	Type	Required	Default	Description
containerStyle	StyleProp<ViewStyle>	-	undefined	Container wrapper styles
helperTextProps	Omit<HelperTextProps, "children" | "type">	-	undefined	Props for error text display (omits children, type)
testID	string	-	signin-button	Test identifier

Note: Inherits all ButtonProps from react-native-paper except children.

Localization

The component uses this translation key:

{
  "sign-in": {
    "button": "Sign In"
  }
}

• sign-in.button - Default button text displayed on the submit button

Styling

Theme Variables Used

The SignIn.EmailForm.SigninButton uses these theme values by default that can be changed globally:

• theme.colors.onPrimary - Button text color
• theme.colors.primary - Button background color (inherited from react-native-paper Button)
• theme.colors.error - Error text color for validation messages

Related Components

• SignIn.EmailForm - Email form provider that manages button state
• SignIn.EmailForm.Inputs - Input fields for email and password
• SignIn.EmailForm.ForgotPassword - Password recovery link