# Screens & States

This section provides a complete overview of all possible user-facing states within the **Forms and Data Entry**

***

## Forms empty

Entry point of the data entry module. This screen presents the user with a form containing four customizable required fields: ID number, Email, Country of residence, and Date of Birth . All fields are empty and the "Continue" button is disabled until the user provides valid input.

<Image align="center" src="https://files.readme.io/a68a154902a9d8bce4b6b516043e604bcb9ea4ac9f7f5d7d54824f8d9c1b3ac8-screens-and-states-3.png" />

<br />

## Forms Filled

This state confirms that the user has completed all required fields in the form. All four customizable fields — ID number, Email, Country of residence, and Date of Birth — contain valid input, and the "Continue" button is now enabled, allowing the user to proceed to the next step.

<Image align="center" src="https://files.readme.io/b709b1b0002bfa803f4f8e6394f5b65768c742b03bf49e3c70830b9fb1cace0a-screens-and-states-4.png" />

<br />

## Forms Loading

This state is triggered after the user taps "Continue" with all required fields completed. The form remains visible with the filled data, while the primary button transitions to a loading state, displaying a spinner as the submission is being processed..

<Image align="center" src="https://files.readme.io/9f587da4ef7f5c8fd151f448427f5eccfb06905c278d0384818c3c942762798d-screens-and-states-5.png" />

<br />

## Form Success

This state confirms that the user's information has been successfully submitted. The screen displays a green checkmark icon accompanied by the message "Success!," indicating the process has been completed and the user can proceed to the next step in the flow.

<Image align="center" src="https://files.readme.io/b02df3c890335cb37c15770a2f3cf9fe752a275cc6a3f459d78c70c20da30b2a-screens-and-states-5-1.png" />
