User Story: implement InputField component with its useInputField hook

[csantiago132]

Create the components needed for InputField & implement useInputFieldAdapter for Form Input Handling with Conform and React Aria

Component Interaction Diagram

This diagram demonstrates the interaction between the different React Aria hooks (useTextField) and Conform's useField in the useInputFieldAdapter.

graph LR
    A[useInputFieldAdapter Hook] --> B[useField from conform-to/react]
    B --> C[Generates Field State, Error, Events]
    A --> D[useTextField from react-aria/textfield]
    D --> E[Generates Aria Props for Accessibility]
    A --> F[Returns Combined Props for Input, Label, Error Message]
    F --> G[React Form Component]

Loading

Testing Strategy

https://kurocado-studio.github.io/html-forms/a11y-testing-strategy.html

Acceptance Criteria:

• The useInputFieldAdapter hook should utilize the useField from @conform-to/react to manage field state, errors, and validation.
• The hook should incorporate useTextField from @react-aria/textfield to ensure accessibility features like aria properties and error messages.
• The hook must be generic enough to handle various input field types (e.g., text, email, password) via props.
• The hook should handle required fields, showing proper validation and error messages when necessary.
• The mergeProps utility should be used to combine React Aria's inputProps with additional props passed into the input.
• The useRef should be used for the input element to manage focus and DOM interaction.
• There is a default/demo AriaInputField component