FEAT: Text input component

[Arnimag]

User Story

In order to use a consistent and accessible UI building block
As a customer or content manager
I want to use a text input that supports placeholders, various validation states (positive/error), disabled status, and specific types like password and date.

Acceptance Criteria

• Input field correctly displays values and placeholder text.
• Validation states (positive and error) are visually distinct.
• Error states are programmatically exposed using aria-invalid and aria-describedby to link error messages.
• Disabled input is non-editable and visually grayed out in both empty and filled states.
• Component supports specific input types including password and date with appropriate browser behaviour.
• Input is keyboard focusable (Tab) with a clear visual focus indicator.
• Accessible name is provided via a linked label (htmlFor/id), aria-labelledby, or a direct aria-label.
• Looks and works consistent across all supported browsers and devices.
• Can be viewed and manipulable in Storybook.

Background & Resources

https://demo.shopin.dev/storybook/?path=/story/ui-textinput--default