feat(ui): adds useAriaTextField.ts

.eslintignore

@@ -0,0 +1,4 @@
+vitest.config.ts
+setup.react.ts
+coverage
+dist

.eslintrc.js

@@ -8,8 +8,20 @@ module.exports = {
     amd: true,
     node: true,
   },
+  parserOptions: {
+    ecmaVersion: 2020,
+    project: true,
+    sourceType: 'module',
+    tsconfigRootDir: __dirname,
+  },
+  rules: {
+    'import/no-cycle': 'off',
+  },
   settings: {
     'import/resolver': {
+      node: {
+        extensions: ['.js', '.jsx', '.ts', '.tsx'],
+      },
       alias: {
         map: [['~', './src']],
         extensions: ['.ts', '.tsx'],
@@ -19,4 +31,18 @@ module.exports = {
       },
     },
   },
+  overrides: [
+    {
+      files: [
+        '**/*.test.ts',
+        '**/*.test.tsx',
+        '**/__tests__/**/*.ts',
+        '**/__tests__/**/*.tsx',
+      ],
+      rules: {
+        '@typescript-eslint/no-unsafe-call': 'off',
+        'import/order': 'off',
+      },
+    },
+  ],
 };

.prettierignore

@@ -1,3 +1,5 @@
 package-lock.json
 package.json
 pnpm-lock.yaml
+coverage
+dist

Writerside/dcs.tree

@@ -9,4 +9,7 @@
     <toc-element topic="Overview.md"/>
     <toc-element topic="A11y-testing-strategy.md"/>
     <toc-element topic="NPM-Registry.md"/>
+    <toc-element topic="API.md">
+        <toc-element topic="useInputField.md"/>
+    </toc-element>
 </instance-profile>

Writerside/topics/API.md

@@ -0,0 +1,3 @@
+# API
+
+Start typing here...

Writerside/topics/useInputField.md

@@ -1,29 +1,3 @@
 # useInputField
 
-| [User Story on Github](https://github.com/orgs/Kurocado-Studio/projects/3/views/1?pane=issue&itemId=81815500) |
-| ------------------------------------------------------------------------------------------------------------- |
-
-The useInputFieldAdapter hook simplifies form input handling by combining React Aria’s accessibility
-features with field state management from Conform.
-
-## Key Functionality
-
-- Field State Management: Utilizes useField from Conform to handle state, errors, and events.
-- Accessibility: Leverages useTextField from React Aria to ensure ARIA attributes and accessibility
-  standards.
-- Merging Props: Combines additional input props using mergeProps for flexibility.
-
-## Component Interaction Diagram
-
-This diagram demonstrates the interaction between the different React Aria hooks (useTextField) and
-Conform's useField in the useInputFieldAdapter.
-
-```mermaid
-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]
-```
+Start typing here...