From 611133f5db055ad1f1e5c72ef67204fce13f724c Mon Sep 17 00:00:00 2001
From: John Toro <joaltoroc@gmail.com>
Date: Mon, 26 Oct 2026 20:08:35 -0500
Subject: [PATCH 1/3] feat: standardize components, a11y, security hardening,
 upgrade deps & CI to v2.6.0

---
 .agents/skills/create-component/SKILL.md      |  177 +-
 .github/workflows/chromatic.yml               |   16 +-
 .github/workflows/npm-build.yml               |   28 +-
 .github/workflows/publish.yml                 |   19 +-
 .nvmrc                                        |    2 +-
 .prettierrc                                   |    2 +-
 ADR.md                                        |    8 +-
 CONTEXT.md                                    |   10 +-
 Changelog.md                                  |   30 +
 README.md                                     |   13 +-
 package-lock.json                             | 1775 +++++------------
 package.json                                  |   65 +-
 .../react-hook-form/controller.component.tsx  |   19 +-
 src/theme/button.css                          |   26 +
 src/theme/main.css                            |    8 +
 src/types/helpers/controller.types.ts         |   39 +-
 src/types/index.ts                            |    1 +
 .../display/accordion/accordion.component.tsx |    5 +-
 .../display/accordion/accordion.stories.tsx   |    1 +
 .../display/accordion/accordion.types.ts      |    6 +-
 .../avatar-group/avatar-group.component.tsx   |   28 +-
 .../display/avatar/avatar.component.tsx       |    5 +-
 .../display/avatar/avatar.stories.tsx         |    1 +
 .../components/display/avatar/avatar.types.ts |    1 +
 .../display/badge/badge.component.tsx         |    5 +-
 .../display/badge/badge.stories.tsx           |    1 +
 .../components/display/badge/badge.types.ts   |    1 +
 .../display/button/button.component.tsx       |    3 +-
 .../display/button/button.stories.tsx         |    1 +
 .../display/card/card.component.tsx           |    7 +-
 .../display/carousel/carousel.component.tsx   |    3 +-
 .../chat-bubble/chat-bubble.component.tsx     |    3 +-
 .../hover-gallery/hover-gallery.component.tsx |    7 +-
 .../display/mask/mask.component.tsx           |    6 +-
 .../display/rating/rating.component.tsx       |    6 +-
 .../display/swap/swap.component.tsx           |    2 +
 .../display/timeline/timeline.component.tsx   |    2 +-
 .../feedback/alert/alert.component.tsx        |    5 +-
 .../components/feedback/alert/alert.types.ts  |    1 +
 .../feedback/modal/modal.component.tsx        |   26 +-
 .../components/feedback/modal/modal.test.tsx  |   11 +
 .../components/feedback/modal/modal.types.ts  |    1 +
 .../feedback/progress/progress.component.tsx  |    3 +-
 .../feedback/toast/toast.component.tsx        |   11 +-
 .../components/feedback/toast/toast.types.ts  |    1 +
 .../feedback/tooltip/tooltip.component.tsx    |    5 +-
 .../feedback/tooltip/tooltip.types.ts         |    1 +
 .../layout/collapse/collapse.component.tsx    |    8 +-
 .../layout/footer/footer.component.tsx        |    3 +-
 .../components/layout/hero/hero.component.tsx |   12 +-
 .../action-dropdown.component.tsx             |    2 +
 .../breadcrumb/breadcrumb.component.tsx       |   16 +-
 .../navigation/breadcrumb/breadcrumb.types.ts |    1 +
 .../navigation/drawer/drawer.component.tsx    |   16 +-
 .../navigation/drawer/drawer.test.tsx         |   11 +
 .../navigation/link/link.component.tsx        |   12 +-
 .../mega-menu/mega-menu.component.tsx         |    6 +-
 .../navigation/menu/menu.component.tsx        |    3 +-
 .../pagination/pagination.component.tsx       |    6 +-
 .../navigation/pagination/pagination.types.ts |    1 +
 .../navigation/steps/steps.component.tsx      |   10 +-
 .../navigation/steps/steps.types.ts           |    1 +
 .../navigation/tabs/tabs.component.tsx        |   49 +-
 .../components/navigation/tabs/tabs.test.tsx  |   19 +
 .../components/navigation/tabs/tabs.types.ts  |    1 +
 src/ui/forms/calendar/calendar.component.tsx  |    2 +-
 src/ui/forms/calendar/calendar.test.tsx       |   11 +
 .../__snapshots__/checkbox.test.tsx.snap      |    2 +-
 src/ui/forms/checkbox/checkbox.component.tsx  |    5 +-
 src/ui/forms/checkbox/checkbox.stories.tsx    |    1 +
 src/ui/forms/checkbox/checkbox.types.ts       |    1 +
 .../__snapshots__/dropdown.test.tsx.snap      |    2 +-
 src/ui/forms/dropdown/dropdown.component.tsx  |    4 +-
 src/ui/forms/dropdown/dropdown.stories.tsx    |    1 +
 src/ui/forms/dropdown/dropdown.types.ts       |    2 +-
 .../forms/file-input/file-input.component.tsx |   83 +-
 src/ui/forms/file-input/file-input.types.ts   |    9 +-
 src/ui/forms/otp/otp.component.tsx            |  112 +-
 src/ui/forms/otp/otp.types.ts                 |    6 +-
 src/ui/forms/radio-list/index.ts              |    2 +
 .../forms/radio-list/radio-list.component.tsx |   13 +-
 .../forms/radio-list/radio-list.stories.tsx   |    1 +
 src/ui/forms/radio-list/radio-list.types.ts   |    6 +
 .../radio/__snapshots__/radio.test.tsx.snap   |    2 +-
 src/ui/forms/radio/radio.component.tsx        |    5 +-
 src/ui/forms/radio/radio.stories.tsx          |    1 +
 src/ui/forms/radio/radio.types.ts             |    5 +-
 src/ui/forms/range/range.component.tsx        |  100 +-
 src/ui/forms/range/range.types.ts             |    6 +-
 src/ui/forms/select/select.component.tsx      |  117 +-
 src/ui/forms/select/select.types.ts           |    6 +-
 src/ui/forms/textarea/textarea.component.tsx  |   85 +-
 src/ui/forms/textarea/textarea.types.ts       |    6 +-
 .../__snapshots__/textbox.test.tsx.snap       |    2 +-
 src/ui/forms/textbox/textbox.component.tsx    |    6 +-
 src/ui/forms/textbox/textbox.stories.tsx      |    1 +
 src/ui/forms/toggle/toggle.component.tsx      |  102 +-
 src/ui/forms/toggle/toggle.types.ts           |    6 +-
 src/ui/forms/validator/validator.test.tsx     |   10 +
 .../creativecode/creativecode-ui.provider.tsx |   21 +-
 src/ui/provider/index.ts                      |    2 +
 src/utils/string.utils.test.ts                |   44 +-
 src/utils/string.utils.ts                     |   50 +-
 103 files changed, 1715 insertions(+), 1699 deletions(-)
 create mode 100644 src/ui/forms/radio-list/radio-list.types.ts

diff --git a/.agents/skills/create-component/SKILL.md b/.agents/skills/create-component/SKILL.md
index d44b465..0e143b2 100644
--- a/.agents/skills/create-component/SKILL.md
+++ b/.agents/skills/create-component/SKILL.md
@@ -7,7 +7,7 @@ description: >-
 
 # Create Component Workflow for @creativecodeco/ui
 
-Follow this standardized 6-step workflow whenever creating a new component or form control in `@creativecodeco/ui`.
+Follow this standardized workflow and best-practices checklist whenever creating or updating a UI component or Form control in `@creativecodeco/ui`.
 
 ---
 
@@ -17,17 +17,40 @@ Create the props interface co-located in `src/ui/components/<category>/<componen
 
 **Rules:**
 
-- Name the interface `<ComponentName>Type` (e.g. `CardType`, `StepsType`).
-- Mark all optional props with `?`.
-- Use specific types (`React.ReactNode`, `React.Key`, `ColorType`, `SizeType`, etc.).
+- Name the interface `<ComponentName>Type` (e.g. `CardType`, `StepsType`, `SelectType`).
+- **Always include `className?: string`** on every component interface so consumers can compose layout utilities cleanly.
+- **For Form controls (`src/ui/forms/*`)**: Always extend `ErrorType` (`import type { ErrorType } from '@/types'`) so the control supports both `isError?: boolean` and `error?: string`, plus `id?: string`, `name?: string`, `label?: string`, and `disabled?: boolean`.
+- Mark all non-mandatory props as optional with `?` to prevent friction in unit tests, Storybook, and React Hook Form `Controller`.
+- Use specific types (`React.ReactNode`, `React.Key`, `ColorType`, `SizeType`, etc.) — **zero `any` or implicit types**.
 - Re-export the types from the component's `index.ts` (`export type * from './<component-name>.types';`), which automatically flows through `src/types/index.ts`.
 
+### UI Component Interface Example
+
 ```ts
-import type { ColorType } from '@/types';
+import type { ColorType, SizeType } from '@/types';
 
 export interface ComponentNameType {
   children?: React.ReactNode;
-  variant?: ColorType;
+  color?: ColorType;
+  size?: SizeType;
+  disabled?: boolean;
+  className?: string;
+}
+```
+
+### Form Control Interface Example
+
+```ts
+import type { ColorType, ErrorType, SizeType } from '@/types';
+
+export interface FormControlNameType extends ErrorType {
+  id?: string;
+  name?: string;
+  label?: string;
+  value?: string;
+  onChange?: React.ChangeEventHandler<HTMLInputElement>;
+  color?: ColorType;
+  size?: SizeType;
   disabled?: boolean;
   className?: string;
 }
@@ -35,46 +58,128 @@ export interface ComponentNameType {
 
 ---
 
-## Step 2: Implement Component Logic & Layout
+## Step 2: Implement Component Logic, A11y & Responsive Design
 
 Create `src/ui/components/<category>/<component-name>/<component-name>.component.tsx` (or `src/ui/forms/<component-name>/<component-name>.component.tsx`).
 
-**Rules:**
+### 2.1 Core Implementation Rules
 
 - Use `classnames` imported as `import cls from 'classnames'`.
 - Import types from `@/types`.
-- Use default parameters for optional props.
-- Ensure strict React key handling when mapping arrays: `key={item.id || index}`.
+- **Safe `className` Merging**: Always destructure `className` and merge it via `cls('base-class', className, { ... })` **after** or separately from `{...restProps}` so spreading HTML attributes never overwrites internal DaisyUI classes.
+- **Prevent Custom Prop Leakage to DOM**: Always destructure custom library props (`isError`, `error`, `label`, `color`, `size`, `bordered`) before spreading `{...restProps}` onto native DOM elements (`<input>`, `<textarea>`, `<button>`, `<select>`).
+- **Use `forwardRef` on Form Controls**: All form controls (`src/ui/forms/*`) must use `React.forwardRef` and assign `displayName` so `react-hook-form` (`Controller` / `register`) and consumers can attach DOM refs for focus management.
+- **Semantic Theme Colors Only**: Always use DaisyUI theme tokens (`primary`, `secondary`, `accent`, `neutral`, `base-100`, `base-200`, `base-300`, `base-content`, `info`, `success`, `warning`, `error`). Never hardcode raw Tailwind palette colors (e.g., `text-red-500`, `bg-black`, `bg-blue-500`). When a component defines a default `color` prop, default to `'primary'` (or `'info'` for status alerts).
+- **OWASP Security Hardening**:
+  - **URL Sanitization (Anti-XSS)**: Always pass dynamic `href` and `src` props through `sanitizeUrl` from `@/utils` (`href={sanitizeUrl(href)}` for links, `src={sanitizeUrl(src, '')}` for images) and validate external URLs with `isValidUrl` (which enforces `http:` / `https:`) to block `javascript:`, `vbscript:`, and `data:` XSS payloads.
+  - **CSS `url(...)` Injection Prevention**: Never interpolate raw strings directly into inline `backgroundImage: url(...)`; sanitize with `sanitizeUrl(image, '').replace(/["'()\\]/g, '')`.
+  - **Reverse Tabnabbing Protection**: Whenever rendering `<a target='_blank'>`, always enforce `noopener` and `noreferrer` in `rel` even when a custom `rel` prop is passed.
+  - **Forbidden Sinks**: Never use `dangerouslySetInnerHTML`, `innerHTML`, `outerHTML`, `eval`, or `new Function`.
+- **Controlled Input Safety (`readOnly` Fallback)**: For checkable or range inputs (`checked` or `value` prop), add `readOnly={checked !== undefined && !onChange}` (or `value !== undefined && !onChange`) so rendering static states in Storybook or tests never triggers React controlled-input console warnings.
+- **Strict React `key` Handling**: When iterating arrays, `key` must strictly evaluate to `React.Key` (`string | number | bigint`). Never assign a `React.ReactNode` directly to `key` without narrowing its type (`typeof item.label === 'string' || typeof item.label === 'number' ? item.label : index`).
 - Export as `export default ComponentName`.
 
+### 2.2 Accessibility (WAI-ARIA / A11y) Checklist
+
+Every component MUST satisfy these accessibility standards:
+
+- **Form Controls (`src/ui/forms/*`)**:
+  - Link `<label className='label' htmlFor={id}>` with the control's `id={id}`.
+  - Set `aria-invalid={Boolean(isError || error) || undefined}` on the native form control (`<input>`, `<select>`, `<textarea>`).
+  - Render error messages with `role='alert'` (`{error && <span role='alert' className='text-xs text-error mt-1'>{error}</span>}`) so screen readers announce validation errors immediately.
+  - Provide fallback `aria-label` when a visual label is optional or when rendering composite controls (e.g., `Otp`, `Rating`, `Swap`, `Collapse`).
+- **Interactive & Display Elements**:
+  - Use [`useSafeButtonProps`](file:///Users/joaltoroc/Code/creativecodeco/ui/src/hooks/use-safe-button-props.hook.ts) or explicit `type='button'` on non-submit `<button>` elements, plus `aria-disabled` when disabled.
+  - Add descriptive `aria-label` on icon-only buttons, close buttons (`aria-label='Close'`), pagination buttons (`aria-label={'Page X'}`), and hidden/mask inputs (`Rating` radio items, `Swap` checkbox, `Collapse` checkbox).
+  - Group related radio/action controls with `role='radiogroup'` or `role='group'` and `aria-label`.
+- **Feedback & Overlays**:
+  - `Alert`: `role='alert'`.
+  - `Toast` & `Status` & `Countdown`: `role='status'` (or `role='timer'`) with `aria-live='polite'`.
+  - `Modal`: `<dialog open aria-modal='true' aria-label={typeof title === 'string' ? title : 'Modal dialog'}>`.
+  - `Progress` & `RadialProgress` & `Loading`: Include `aria-label` (`'Progress'`, `'Loading'`) and `role='progressbar'` / `aria-valuenow` where applicable.
+- **Navigation**:
+  - Wrap navigation landmarks in `<nav aria-label='...'>`.
+  - Mark active items with `aria-current='page'` (`Breadcrumb`, `Pagination`, `Dock`) or `aria-current='step'` (`Steps`).
+  - Complete WAI-ARIA tab pattern with `role='tablist'`, `role='tab'` + `aria-selected`, and `role='tabpanel'`.
+  - Include `aria-haspopup='true'` and `aria-expanded={open}` on dropdown/megamenu triggers.
+
+### 2.3 Responsive (Mobile-First) & Motion Polish Checklist
+
+- **Prevent Mobile Viewport Overflow**:
+  - Overlays and panels with fixed desktop widths must include fluid mobile constraints:
+    - `Modal`: `modal-box w-11/12` alongside `max-w-xs` / `max-w-sm` / `max-w-lg` / `max-w-3xl`.
+    - `Drawer`: `w-80 max-w-[85vw]`.
+    - `Calendar`: `w-72 max-w-full`.
+    - `MegaMenu`: `w-screen max-w-md sm:max-w-2xl md:min-w-max` and responsive grid (`grid-cols-1 sm:grid-cols-2 md:grid-cols-3`).
+- **Scroll & Wrap Protection**:
+  - Wrap data tables in `<div className='overflow-x-auto'>`.
+  - Add `overflow-x-auto` to horizontal `Steps` and `flex-wrap` to `Pagination` (`join flex-wrap`) and `Tabs` (`tabs flex-wrap`).
+  - Default form controls (`TextBox`, `Select`, `TextArea`, `FileInput`, `Progress`) to `w-full` inside their container.
+- **Animations & Tactile Feedback**:
+  - Use custom CSS easing tokens defined in `src/theme/main.css` (`--ease-out`, `--ease-in-out`, `--ease-drawer`) rather than `linear` or default `ease`.
+  - Animate only compositor-friendly properties (`transform`, `opacity`).
+  - Always honor `@media (prefers-reduced-motion: reduce)` when adding custom CSS transitions or keyframe animations in `src/theme/*.css`.
+
+### Form Control Implementation Example
+
 ```tsx
 import cls from 'classnames';
-import type { ComponentNameType } from '@/types';
 
-const ComponentName = ({
-  children,
-  variant = 'primary',
+import type { FormControlNameType } from '@/types';
+
+const FormControlName = ({
+  id,
+  name,
+  label,
+  value,
+  onChange,
+  color,
+  size = 'md',
   disabled = false,
-  className
-}: ComponentNameType) => {
+  isError,
+  error,
+  className,
+  ...restProps
+}: FormControlNameType) => {
+  const hasError = Boolean(isError || error);
+
   return (
-    <div
-      className={cls('component-base', className, {
-        'component-primary': variant === 'primary',
-        'component-disabled': disabled
-      })}
-    >
-      {children}
+    <div className='form-control w-full'>
+      {label && (
+        <label className='label' htmlFor={id}>
+          <span className='label-text'>{label}</span>
+        </label>
+      )}
+      <input
+        id={id}
+        name={name}
+        value={value}
+        onChange={onChange}
+        readOnly={value !== undefined && !onChange}
+        disabled={disabled}
+        aria-invalid={hasError || undefined}
+        {...restProps}
+        className={cls('input w-full', className, {
+          [`input-${color}`]: Boolean(color),
+          [`input-${size}`]: Boolean(size),
+          'input-error': hasError
+        })}
+      />
+      {error && (
+        <span role='alert' className='text-xs text-error mt-1'>
+          {error}
+        </span>
+      )}
     </div>
   );
 };
 
-export default ComponentName;
+export default FormControlName;
 ```
 
 ---
 
-## Step 3: Configure Module Exports
+## Step 3: Configure Module Exports & RHF Controller (If Form Control)
 
 1. Create `src/ui/components/<category>/<component-name>/index.ts` (or `src/ui/forms/<component-name>/index.ts`):
    ```ts
@@ -85,6 +190,9 @@ export default ComponentName;
    export default ComponentName;
    ```
 2. Re-export the directory in `src/ui/components/<category>/index.ts` (or `src/ui/forms/index.ts`).
+3. **If creating a Form control (`src/ui/forms/*`)**: Register the new control in:
+   - `src/types/helpers/controller.types.ts` (`ControllerType` discriminated union).
+   - `src/helpers/react-hook-form/controller.component.tsx` (`Controller` switch/branch rendering with `isError={Boolean(error)}` and `error={error?.message}`).
 
 ---
 
@@ -94,9 +202,10 @@ Create `src/ui/components/<category>/<component-name>/<component-name>.test.tsx`
 
 **Rules:**
 
-- Test default render and text content.
-- Test active/disabled states and class assignments.
-- Test user interactions (clicks, input changes).
+- Test default render and text/children content.
+- Test `className` prop merging, variant/size/color classes, and `disabled` / `isError` / `error` states.
+- Test accessibility queries (`getByRole`, `getByLabelText`, `aria-invalid`, `role='alert'`).
+- Test user interactions (clicks, input changes) and ensure **zero `console.error` or `console.warn` outputs** during test execution.
 
 ```tsx
 import { render, screen } from '@testing-library/react';
@@ -104,9 +213,11 @@ import '@testing-library/jest-dom';
 import ComponentName from './<component-name>.component';
 
 describe('<ComponentName />', () => {
-  it('renders correctly with children', () => {
-    render(<ComponentName>Test Content</ComponentName>);
-    expect(screen.getByText('Test Content')).toBeInTheDocument();
+  it('renders correctly with children and custom className', () => {
+    render(
+      <ComponentName className='custom-class'>Test Content</ComponentName>
+    );
+    expect(screen.getByText('Test Content')).toHaveClass('custom-class');
   });
 });
 ```
@@ -120,8 +231,8 @@ Create `src/ui/components/<category>/<component-name>/<component-name>.stories.t
 **Rules:**
 
 - Set `title: '@creativecodeco-ui/<Category>/<ComponentName>'` (where `<Category>` is `Display`, `Feedback`, `Layout`, `Navigation`, or `Form`).
-- Include `tags: ['autodocs']`.
-- Provide `Default` and variant stories (`Disabled`, `WithIcons`, etc.).
+- **Always include `tags: ['autodocs']`** in the default meta export.
+- Provide `Default` and key variant stories (`Colors`, `Sizes`, `WithError`, `Disabled`, etc.).
 
 ---
 
diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 2c443ad..170a38b 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -7,6 +7,9 @@ on:
     branches:
       - master
 
+permissions:
+  contents: read
+
 # List of jobs
 jobs:
   chromatic-deployment:
@@ -14,17 +17,26 @@ jobs:
     runs-on: ubuntu-latest
     # Job steps
     steps:
-      - uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.2.2
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
         with:
           fetch-depth: 0
 
+      - name: Set up Node
+        uses: actions/setup-node@949feb2413d6458794dcd2491c4babbbce0c15c1 # v7.1.0
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'npm'
+
+      - name: Update npm to latest
+        run: npm install -g npm@latest
+
       - name: Install dependencies
         # 👇 Install dependencies with the same package manager used in the project (replace it as needed), e.g. yarn, npm, pnpm
         run: npm ci --ignore-scripts
         # 👇 Adds Chromatic as a step in the workflow
 
       - name: Publish to Chromatic
-        uses: chromaui/action@c93e0bc3a63aa176e14a75b61a31847cbfdd341c # v1.11.0
+        uses: chromaui/action@5bcadb5104b09e360e210c54f95a7437c2d82bab # v18.13.3
         # Chromatic GitHub Action options
         with:
           # 👇 Chromatic projectToken, refer to the manage page to obtain it.
diff --git a/.github/workflows/npm-build.yml b/.github/workflows/npm-build.yml
index b28a913..b70f57e 100644
--- a/.github/workflows/npm-build.yml
+++ b/.github/workflows/npm-build.yml
@@ -2,17 +2,39 @@ name: Build
 
 on:
   pull_request:
-    types: [ready_for_review]
+    types: [opened, synchronize, reopened, ready_for_review]
+
+permissions:
+  contents: read
+  pull-requests: write
 
 jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.2.2
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+
+      - name: Set up Node
+        uses: actions/setup-node@949feb2413d6458794dcd2491c4babbbce0c15c1 # v7.1.0
+        with:
+          node-version-file: '.nvmrc'
+          cache: 'npm'
+
+      - name: Update npm to latest
+        run: npm install -g npm@latest
 
       - name: Clean and Install
         run: npm ci --ignore-scripts
 
+      - name: Security Audit
+        run: npm audit --audit-level=high
+
+      - name: Lint and Format Check
+        run: npm run lint && npm run format:check
+
+      - name: TypeScript Check
+        run: npx tsc --noEmit
+
       - name: Build
         run: npm run build
 
@@ -20,7 +42,7 @@ jobs:
         run: npm run test:action
 
       - name: Jest coverage comment
-        uses: MishaKav/jest-coverage-comment@14d08a64515f6fd4b28ae6a67c5c43364cea1357 # v1.0.95
+        uses: MishaKav/jest-coverage-comment@7032bf8e71aa2b267b6b143be3c4480b625c2b12 # v1.0.38
         with:
           coverage-summary-path: ./coverage/coverage-summary.json
           title: Pull Request Coverage - By CreativeCode.com.co
diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
index 2af2fad..1e67116 100644
--- a/.github/workflows/publish.yml
+++ b/.github/workflows/publish.yml
@@ -4,22 +4,33 @@ on:
   release:
     types: [created]
 
+permissions:
+  contents: read
+  id-token: write
+
 jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.2.2
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
 
       # Setup .npmrc file to publish to npm
       - name: Set up Node
-        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.2.0
+        uses: actions/setup-node@949feb2413d6458794dcd2491c4babbbce0c15c1 # v7.1.0
         with:
-          node-version: '20.x'
+          node-version-file: '.nvmrc'
+          cache: 'npm'
           registry-url: 'https://registry.npmjs.org'
 
+      - name: Update npm to latest
+        run: npm install -g npm@latest
+
       - name: Clean and Install
         run: npm ci --ignore-scripts
 
+      - name: Validate and Test
+        run: npm run lint && npm run format:check && npx tsc --noEmit && npm run test
+
       - name: Configure git
         run: |
           git config user.email "joaltoroc@creativecode.com.co"
@@ -31,7 +42,7 @@ jobs:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
 
       - name: Publish package
-        run: npm run release
+        run: npm publish --provenance --access public
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.nvmrc b/.nvmrc
index 54c6511..474d750 100644
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-v24
+v24.22.1
diff --git a/.prettierrc b/.prettierrc
index 33eb6f3..0f58437 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -4,5 +4,5 @@
   "singleQuote": true,
   "jsxSingleQuote": true,
   "bracketSpacing": true,
-  "jsxBracketSameLine": false
+  "bracketSameLine": false
 }
diff --git a/ADR.md b/ADR.md
index 542761c..f018ac4 100644
--- a/ADR.md
+++ b/ADR.md
@@ -14,8 +14,8 @@ El objetivo de `@creativecodeco/ui` es proveer el Sistema de Diseño oficial par
 
 - **Core**: React 19 (v19.3.1)
 - **Estilos**: Tailwind CSS v4 (v4.3.3, CSS-first) + DaisyUI v5 (v5.7.50)
-- **Documentación**: Storybook 10 (v10.6.2) & Chromatic v18 (v18.13.0)
-- **Compilación y Tipado**: Babel 8 (v8.0.7) & TypeScript 6 (v6.0.3)
+- **Documentación**: Storybook 10 (v10.6.4) & Chromatic v18 (v18.13.3)
+- **Compilación, Linting y Tipado**: Babel 8 (v8.0.9), ESLint 10 (v10.13.0) & TypeScript 6 (v6.0.3)
 - **Pruebas**: Jest 30 (v30.5.2) & React Testing Library v16 (v16.3.3)
 
 ---
@@ -38,11 +38,12 @@ El proyecto sigue una arquitectura modular organizada por dominios:
 
 ### 1. Security & Dependency Resolution via Overrides
 
-Para mantener `0 vulnerabilities` en `npm audit` sin introducir cambios disruptivos en herramientas de compilación y pruebas:
+Para mantener `0 vulnerabilities` en `npm audit` y `0` paquetes deprecados en el árbol de dependencias sin introducir cambios disruptivos en herramientas de compilación y pruebas:
 
 - **`webpack-dev-middleware` (`^7.4.5`)**: Mitiga GHSA-g84c-rxfj-3j2c en el servidor de desarrollo de Storybook.
 - **`js-yaml` (`^4.1.1`)**: Reemplaza `js-yaml@3.x` en `@istanbuljs/load-nyc-config` (usado por `jest`/`ts-jest`), eliminando la dependencia transitiva vulnerable `sprintf-js@1.0.3` (GHSA-hp3w-g68c-fv3c).
 - **`tsc-alias > chokidar` (`^4.0.3`) y `braces` (`npm:brace-expansion@^2.1.7`)**: Elimina el uso de `braces@3.0.3` (GHSA-vfj7-8cjw-p6xm) reemplazándolo por `brace-expansion@^2.1.7` con límite de profundidad recursiva (`EXPANSION_MAX_DEPTH`).
+- **`flat-cache` (`^4.0.1`), `glob` (`^13.0.6`), `jsdom` (`^29.1.1`) y `eslint-plugin-react > eslint` (`$eslint`)**: Eliminan las dependencias transitivas obsoletas (`rimraf@3.0.2`, `glob@7.2.3`, `glob@10.5.0`, `inflight@1.0.6` y `whatwg-encoding@3.1.1`) y alinean el soporte de peer dependency de `eslint-plugin-react` con ESLint 10.
 
 ---
 
@@ -50,7 +51,6 @@ Para mantener `0 vulnerabilities` en `npm audit` sin introducir cambios disrupti
 
 - **Conservar TypeScript 6.0.3**:
   Se decidió no forzar la actualización a TypeScript 7.0.2 para evitar incompatibilidades de `peerDependencies` con `typescript-eslint` (`>=4.8.4 <6.1.0`) y `ts-jest` (`>=4.3 <7`). Esto evita configuraciones complejas de aliasing o el uso de flags de instalación inseguros (`--legacy-peer-deps`).
-- **Conservar ESLint 9.39.5**: Se retuvo ESLint en la rama `9.x` debido a que `eslint-plugin-react@7.37.5` aún declara soporte hasta `^9.7`, priorizando la consistencia y la instalación limpia en `npm install`.
 
 ---
 
diff --git a/CONTEXT.md b/CONTEXT.md
index f3ba00e..331c8e8 100644
--- a/CONTEXT.md
+++ b/CONTEXT.md
@@ -1,4 +1,4 @@
-# Project Context: @creativecodeco/ui (v2.5.1)
+# Project Context: @creativecodeco/ui (v2.6.0)
 
 ## Purpose
 
@@ -6,13 +6,15 @@
 
 ## Technical Stack
 
+- **Runtime & Package Manager**: [Node.js 24 LTS](https://nodejs.org/) (v24.22.1 Krypton) & [npm 12](https://www.npmjs.com/) (v12.2.1)
 - **Framework**: [React 19](https://react.dev/) (v19.3.1)
 - **Styling**: [Tailwind CSS v4](https://tailwindcss.com/) (v4.3.3, CSS-first configuration with PostCSS CLI 12)
 - **UI Base**: [DaisyUI v5](https://daisyui.com/) (v5.7.50)
-- **Documentation**: [Storybook 10](https://storybook.js.org/) (v10.6.2)
-- **Compilers**: [Babel 8](https://babeljs.io/) (v8.0.7) & [TypeScript 6](https://www.typescriptlang.org/) (v6.0.3)
+- **Documentation**: [Storybook 10](https://storybook.js.org/) (v10.6.4)
+- **Compilers**: [Babel 8](https://babeljs.io/) (v8.0.9) & [TypeScript 6](https://www.typescriptlang.org/) (v6.0.3)
+- **Linter & Formatter**: [ESLint 10](https://eslint.org/) (v10.13.0) & [Prettier 3](https://prettier.io/) (v3.9.10)
 - **Testing**: [Jest 30](https://jestjs.io/) (v30.5.2) & [React Testing Library 16](https://testing-library.com/docs/react-testing-library/intro/) (v16.3.3)
-- **Visual QA**: [Chromatic](https://www.chromatic.com/) (v18.13.0)
+- **Visual QA**: [Chromatic](https://www.chromatic.com/) (v18.13.3)
 
 ## Architecture & Structure
 
diff --git a/Changelog.md b/Changelog.md
index 5d1636f..d70b05c 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -2,6 +2,36 @@
 
 # Changelog
 
+## v2.6.0 - Component Standardization, A11y, Security Hardening & Dependency Upgrades
+
+### 👾 Component Standardization & Design Polish
+
+- Unify `className?: string` prop support and `classnames` (`cls`) merging across all 67 UI and Form components (`Accordion`, `Avatar`, `Badge`, `Button`, `Alert`, `Modal`, `Toast`, `Tooltip`, `Breadcrumb`, `Pagination`, `Steps`, `Tabs`, `Checkbox`, `Dropdown`, `Radio`, `RadioList`, `TextBox`, `Toggle`).
+- Standardize form validation error contracts by extending `ErrorType` (`isError?: boolean; error?: string`) across `Select`, `TextArea`, `Toggle`, `FileInput`, `Range`, and `Otp`, and prevent `isError` from leaking onto native DOM elements.
+- Add dedicated `radio-list.types.ts` (`RadioListType`) and standardized exports in `src/ui/forms/radio-list/`.
+- Expand React Hook Form `Controller` (`ControllerType`) to support all form controls (`TextBox`, `Dropdown`, `Select`, `TextArea`, `Checkbox`, `Radio`, `RadioList`, `Toggle`, `Range`, `FileInput`, `Otp`).
+- Add `autodocs` tags to all remaining Storybook stories and `readOnly` fallback handling for static `Swap`, `Range`, `Collapse`, and `Toggle` states.
+- Enhance accessibility (WAI-ARIA) and responsive mobile-first design across form, feedback, display, layout, and navigation components (`aria-invalid` and `role="alert"` on form controls, `htmlFor`/`id` label association in `TextArea`, `FileInput`, and `Toggle`, `role="radiogroup"` and `aria-label` in `Rating`, `role="status"` and `aria-live="polite"` in `Toast`, `role="tabpanel"` in `Tabs`, `aria-current` in `Steps` and `Breadcrumb`, `aria-haspopup`/`aria-expanded` in `ActionDropdown` and `MegaMenu`, and responsive viewport sizing in `Modal`, `Drawer`, `Calendar`, `Pagination`, `Tabs`, `Steps`, `Progress`, and `MegaMenu`).
+- Standardize theme color tokens across all components by replacing hardcoded colors (`text-red-500` -> `text-error` in `Checkbox`, `Radio`, `RadioList`, and `TextBox`; `bg-black` -> `bg-neutral/60` in `Hero`; default `color = 'primary'` in `Rating`; `text-secondary` in `Timeline`) and adding `@source inline(...)` in `src/theme/main.css` so all DaisyUI semantic color classes are generated in the compiled stylesheet.
+- Harden components against OWASP frontend security risks: restrict `isValidUrl` to `http:`/`https:`, add `sanitizeUrl` in `src/utils/string.utils.ts` to block `javascript:`/`vbscript:`/`data:` XSS schemes across `Link`, `Breadcrumb`, `Footer`, `Menu`, `MegaMenu`, `Hero`, `Card`, `Carousel`, `ChatBubble`, `HoverGallery`, `Mask`, and `AvatarGroup`, enforce `noopener noreferrer` on `target="_blank"` links, prevent CSS `url(...)` breakout in `Hero`, and set `autoComplete="one-time-code"` in `Otp`.
+- Add `forwardRef` support across `Select`, `TextArea`, `Toggle`, `FileInput`, `Range`, and `Otp`, plus keyboard navigation (`Escape` to close `Modal` and `Drawer`, `ArrowRight`/`ArrowLeft`/`Home`/`End` in `Tabs`).
+- Add `exports` map, `types`, `sideEffects`, `engines` (`node >=24.22.1`, `npm >=12.2.1`), and `packageManager` (`npm@12.2.1`) in `package.json`, update `.nvmrc` to `v24.22.1` (Node 24 LTS Krypton), and harden GitHub Actions workflows (`npm-build.yml`, `publish.yml`, `chromatic.yml`) with least-privilege `permissions`, `npm audit`, lint/type checks, NPM `--provenance`, `npm@latest` upgrade, and latest SHA-pinned stable actions (`actions/checkout@v7.0.1`, `actions/setup-node@v7.1.0`, `chromaui/action@v18.13.3`, and `MishaKav/jest-coverage-comment@v1.0.38`).
+- Add custom easing tokens (`--ease-out`, `--ease-in-out`, `--ease-drawer`) and tactile button active feedback (`scale(0.97)` with `prefers-reduced-motion` support) in `src/theme/`.
+
+### ☝🏻 Upgrade
+
+- Upgrade `eslint` to `v10.13.0` and `@eslint/js` to `v10.0.1` (resolving `eslint@9.x` end-of-life deprecation)
+- Upgrade `storybook`, `@storybook/addon-docs`, `@storybook/addon-links`, `@storybook/react-webpack5`, and `eslint-plugin-storybook` to `v10.6.4`
+- Upgrade `@chromatic-com/storybook` to `v5.6.0` and `chromatic` to `v18.13.3`
+- Upgrade `react-hook-form` to `v7.91.0` and `postcss` to `v8.5.32`
+- Align `peerDependencies` versions in `package.json` with current `dependencies` (`react@19.3.1`, `react-hook-form@7.91.0`, `postcss@8.5.32`, `tailwindcss@4.3.3`, `@tailwindcss/postcss@4.3.3`)
+- Upgrade `@babel/core` to `v8.0.9`, `typescript-eslint` to `v8.72.1`, and `tsc-alias` to `v1.9.9`
+
+### 🧹 Maintenance & Security Audit
+
+- Add `overrides` in `package.json` for `flat-cache` (`^4.0.1`), `glob` (`^13.0.6`), `jsdom` (`^29.1.1`), and `eslint-plugin-react > eslint` (`$eslint`) to eliminate all transitive deprecated packages (`rimraf@3.0.2`, `glob@7.2.3`, `glob@10.5.0`, `inflight@1.0.6`, and `whatwg-encoding@3.1.1`) while maintaining `0 vulnerabilities` in `npm audit`.
+- Replace deprecated `jsxBracketSameLine` option with `bracketSameLine` in `.prettierrc`.
+
 ## v2.5.1 - Repository Metadata, Documentation & MIT License
 
 ### 📝 Documentation & Metadata
diff --git a/README.md b/README.md
index 431a8f2..43bd0b5 100644
--- a/README.md
+++ b/README.md
@@ -17,7 +17,7 @@
 ## Configuration
 
 > [!NOTE]
-> This library is designed for **React 19** and uses **Tailwind CSS v4** and **DaisyUI v5**. The configuration is primarily CSS-first.
+> **Current Version: `v2.6.0`** — This library is designed for **React 19** (`v19.3.1`), **Tailwind CSS v4** (`v4.3.3`), and **DaisyUI v5** (`v5.7.50`), and requires **Node.js 24 LTS** (`>=24.22.1`) and **npm 12** (`>=12.2.1`). The configuration is primarily CSS-first.
 
 ### Install
 
@@ -85,8 +85,8 @@ Add on layout `layout.tsx` (for Next.js) or your root component:
 ```tsx
 import { CreativeCodeUIProvider } from '@creativecodeco/ui';
 
-// Import the design system CSS
-import '@creativecodeco/ui/lib/theme/css/main.css';
+// Import the design system CSS (supports subpath export or legacy lib path)
+import '@creativecodeco/ui/theme/main.css';
 
 export default function RootLayout({ children }) {
   return (
@@ -105,9 +105,10 @@ export default function RootLayout({ children }) {
 - **Feedback Components**: Alert, Countdown, Diff, Modal, Progress, RadialProgress, Skeleton, Spinner, Toast, Tooltip.
 - **Layout Components**: Collapse, Divider, Footer, Hero, Join, Mockup, Stack.
 - **Navigation Components**: ActionDropdown, Breadcrumb, Dock, Drawer, Fab, Link, MegaMenu, Menu, Navbar, Pagination, Steps, Tabs.
-- **Form Controls**: Calendar, Checkbox, Dropdown, Fieldset, FileInput, Filter, Label, Otp, Radio, RadioList, Range, Select, TextArea, TextBox, Toggle, Validator.
-- **Theme Support**: Built on DaisyUI with custom CreativeCode branding.
-- **Visual Testing**: Integrated with Storybook and Chromatic.
+- **Form Controls**: Calendar, Checkbox, Dropdown, Fieldset, FileInput, Filter, Label, Otp, Radio, RadioList, Range, Select, TextArea, TextBox, Toggle, Validator (with full `forwardRef` and React Hook Form `Controller` support).
+- **Accessibility & Security**: WAI-ARIA compliant semantics (`aria-invalid`, `role="alert"`, `role="tabpanel"`, keyboard navigation) and OWASP frontend URL sanitization (`sanitizeUrl`).
+- **Theme Support**: Built on DaisyUI with custom CreativeCode semantic branding tokens.
+- **Visual Testing**: Integrated with Storybook 10 and Chromatic 18.
 
 ## Development
 
diff --git a/package-lock.json b/package-lock.json
index 182985a..e7213fd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,33 +1,33 @@
 {
   "name": "@creativecodeco/ui",
-  "version": "2.5.1",
+  "version": "2.6.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@creativecodeco/ui",
-      "version": "2.5.1",
+      "version": "2.6.0",
       "license": "MIT",
       "dependencies": {
         "@tailwindcss/postcss": "4.3.3",
-        "postcss": "8.5.31",
+        "postcss": "8.5.32",
         "react": "19.3.1",
-        "react-hook-form": "7.90.0",
+        "react-hook-form": "7.91.0",
         "tailwindcss": "4.3.3",
         "usehooks-ts": "3.1.1"
       },
       "devDependencies": {
-        "@babel/core": "8.0.7",
+        "@babel/core": "8.0.9",
         "@babel/preset-env": "8.0.7",
         "@babel/preset-react": "8.0.1",
         "@babel/preset-typescript": "8.0.7",
-        "@chromatic-com/storybook": "5.5.1",
-        "@eslint/js": "9.39.5",
+        "@chromatic-com/storybook": "5.6.0",
+        "@eslint/js": "10.0.1",
         "@jest/globals": "30.5.2",
-        "@storybook/addon-docs": "10.6.2",
-        "@storybook/addon-links": "10.6.2",
+        "@storybook/addon-docs": "10.6.4",
+        "@storybook/addon-links": "10.6.4",
         "@storybook/addon-webpack5-compiler-swc": "4.0.3",
-        "@storybook/react-webpack5": "10.6.2",
+        "@storybook/react-webpack5": "10.6.4",
         "@testing-library/dom": "10.4.2",
         "@testing-library/jest-dom": "7.0.1",
         "@testing-library/react": "16.3.3",
@@ -36,16 +36,16 @@
         "@types/node": "26.6.5",
         "@types/react": "19.3.0",
         "@types/react-dom": "19.3.0",
-        "chromatic": "18.13.0",
+        "chromatic": "18.13.3",
         "classnames": "2.5.1",
         "cpx2": "9.0.3",
         "daisyui": "5.7.50",
-        "eslint": "9.39.5",
+        "eslint": "10.13.0",
         "eslint-config-prettier": "10.1.8",
         "eslint-plugin-prettier": "5.5.7",
         "eslint-plugin-react": "7.37.5",
         "eslint-plugin-react-hooks": "7.1.1",
-        "eslint-plugin-storybook": "10.6.2",
+        "eslint-plugin-storybook": "10.6.4",
         "eslint-plugin-unused-imports": "4.4.1",
         "globals": "17.13.0",
         "husky": "9.1.7",
@@ -58,21 +58,21 @@
         "prop-types": "15.8.1",
         "react-dom": "19.3.1",
         "react-icons": "5.7.0",
-        "storybook": "10.6.2",
+        "storybook": "10.6.4",
         "string-width": "8.3.0",
         "ts-jest": "29.4.15",
         "ts-node": "10.9.2",
-        "tsc-alias": "1.9.8",
+        "tsc-alias": "1.9.9",
         "tsconfig-paths-webpack-plugin": "4.2.0",
         "typescript": "6.0.3",
-        "typescript-eslint": "8.72.0"
+        "typescript-eslint": "8.72.1"
       },
       "peerDependencies": {
-        "@tailwindcss/postcss": "4.1.18",
-        "postcss": "8.5.6",
-        "react": "19.2.8",
-        "react-hook-form": "7.58.1",
-        "tailwindcss": "4.1.18",
+        "@tailwindcss/postcss": "4.3.3",
+        "postcss": "8.5.32",
+        "react": "19.3.1",
+        "react-hook-form": "7.91.0",
+        "tailwindcss": "4.3.3",
         "usehooks-ts": "3.1.1"
       }
     },
@@ -96,19 +96,56 @@
       }
     },
     "node_modules/@asamuzakjp/css-color": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.2.0.tgz",
-      "integrity": "sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==",
+      "version": "5.1.11",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-5.1.11.tgz",
+      "integrity": "sha512-KVw6qIiCTUQhByfTd78h2yD1/00waTmm9uy/R7Ck/ctUyAPj+AEDLkQIdJW0T8+qGgj3j5bpNKK7Q3G+LedJWg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/generational-cache": "^1.0.1",
+        "@csstools/css-calc": "^3.2.0",
+        "@csstools/css-color-parser": "^4.1.0",
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-7.1.1.tgz",
+      "integrity": "sha512-67RZDnYRc8H/8MLDgQCDE//zoqVFwajkepHZgmXrbwybzXOEwOWGPYGmALYl9J2DOLfFPPs6kKCqmbzV895hTQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@csstools/css-calc": "^2.1.3",
-        "@csstools/css-color-parser": "^3.0.9",
-        "@csstools/css-parser-algorithms": "^3.0.4",
-        "@csstools/css-tokenizer": "^3.0.3",
-        "lru-cache": "^10.4.3"
+        "@asamuzakjp/generational-cache": "^1.0.1",
+        "@asamuzakjp/nwsapi": "^2.3.9",
+        "bidi-js": "^1.0.3",
+        "css-tree": "^3.2.1",
+        "is-potential-custom-element-name": "^1.0.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
+    "node_modules/@asamuzakjp/generational-cache": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/generational-cache/-/generational-cache-1.0.1.tgz",
+      "integrity": "sha512-wajfB8KqzMCN2KGNFdLkReeHncd0AslUSrvHVvvYWuU8ghncRJoA50kT3zP9MVL0+9g4/67H+cdvBskj9THPzg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/nwsapi": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/nwsapi/-/nwsapi-2.3.9.tgz",
+      "integrity": "sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@babel/code-frame": {
       "version": "8.0.6",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-8.0.6.tgz",
@@ -134,20 +171,20 @@
       }
     },
     "node_modules/@babel/core": {
-      "version": "8.0.7",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-8.0.7.tgz",
-      "integrity": "sha512-ZIsZWBG6Y1oa+8fkQVp0xeCdjCHBkXFCCIWrmg9SvejVvfcVQgKKRmGrBDWfM7rilhvnRoEuaqa5dkK7KB3pHA==",
+      "version": "8.0.9",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-8.0.9.tgz",
+      "integrity": "sha512-wXtyKlpR/pXf/u0vmib+OBakQaIzLglLcRoKpWxCHW/whqq7YfQYPD0IAAl9H/evi40MyLIjYYdvb6N+9DI2yA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^8.0.6",
         "@babel/generator": "^8.0.6",
         "@babel/helper-compilation-targets": "^8.0.7",
-        "@babel/helpers": "^8.0.7",
-        "@babel/parser": "^8.0.7",
+        "@babel/helpers": "^8.0.8",
+        "@babel/parser": "^8.0.8",
         "@babel/template": "^8.0.0",
         "@babel/traverse": "^8.0.7",
-        "@babel/types": "^8.0.6",
+        "@babel/types": "^8.0.8",
         "@types/gensync": "^1.0.5",
         "convert-source-map": "^2.0.0",
         "empathic": "^2.0.1",
@@ -404,9 +441,9 @@
       }
     },
     "node_modules/@babel/helper-string-parser": {
-      "version": "8.0.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-8.0.6.tgz",
-      "integrity": "sha512-+6HYEBnsDRZHJtUTAEfMQd0zMDqdFHS7C+5vAsEZqBUr3vEMWOWlHJ0Jz1gS8jJIlCvLsuA6ivmeoqzH936YcA==",
+      "version": "8.0.8",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-8.0.8.tgz",
+      "integrity": "sha512-fVM+gSuKbdv9cpmyRNh5EvsDHUZCdxQH3FdnFKSkNYHpbsn95bbrxm+ES3MVeQjcqwi2O5ur/DjLfmTQaO60ng==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -449,27 +486,27 @@
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "8.0.7",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-8.0.7.tgz",
-      "integrity": "sha512-5dMj5kFwS2AY7Dt4PZp4px3c5ThMbbEa7tZfuHTncCGSFYq8uoA1ufDE1IS/lYpQedE+3+GQ3cPZUiplIu195w==",
+      "version": "8.0.8",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-8.0.8.tgz",
+      "integrity": "sha512-FBmhiDWs625wHg03OKiLQDeT6LOc2lWBbW97Yqs2iI1tZcucjpmYnO29NHsQ83XxKvredcvUymW/AAn2UtnakA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/template": "^8.0.0",
-        "@babel/types": "^8.0.6"
+        "@babel/types": "^8.0.8"
       },
       "engines": {
         "node": "^22.18.0 || >=24.11.0"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "8.0.7",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-8.0.7.tgz",
-      "integrity": "sha512-UkDwEbPO1px2JQSrdh4qIgaH1JgG7GO/pFeJkpxhDxIETkT/QvGpnigXIw75ViHYPtIgKITmVUJqLjiO+JuWjA==",
+      "version": "8.0.8",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-8.0.8.tgz",
+      "integrity": "sha512-Gq65JogAr0S2p0BzvfSJboyuiRnxDQApyOqHkKmkrvm+VlLK4gC3pKsiOKEdnhFBemrFbSnOu90mZZWDpiJnmQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^8.0.6"
+        "@babel/types": "^8.0.8"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -1731,13 +1768,13 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "8.0.6",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-8.0.6.tgz",
-      "integrity": "sha512-c+xgSWboV2pdwXP67BUWDVRHi2BO5Q3KwxyFVs7taVTY+fsK47/L51ZXQoV9rozHJDNHvJ4v4WEsI/IlxV2l2A==",
+      "version": "8.0.8",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-8.0.8.tgz",
+      "integrity": "sha512-iXSSZAKQWmaeAwGtFw10v9fg5hUiUs0L+w+Z2K11kym3pDNK+SF0VcAQPsEFvWcTSZ7LMgClMXDBvTbH0IlICg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-string-parser": "^8.0.6",
+        "@babel/helper-string-parser": "^8.0.8",
         "@babel/helper-validator-identifier": "^8.0.6"
       },
       "engines": {
@@ -1751,15 +1788,28 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@bramus/specificity": {
+      "version": "2.4.3",
+      "resolved": "https://registry.npmjs.org/@bramus/specificity/-/specificity-2.4.3.tgz",
+      "integrity": "sha512-0GEz8qJWokkUVYQYRukmkSHIFNoBH8QTreeHrAFbvz1XFYc3Y+puhMs8PQ5x8GNugiC2l5jvDBXKLbBIByeSBw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "css-tree": "^3.2.1"
+      },
+      "bin": {
+        "specificity": "bin/cli.js"
+      }
+    },
     "node_modules/@chromatic-com/storybook": {
-      "version": "5.5.1",
-      "resolved": "https://registry.npmjs.org/@chromatic-com/storybook/-/storybook-5.5.1.tgz",
-      "integrity": "sha512-DOtUEBIJHmqsOWg+Hi1t5m5FTNlyzL0NpZUwQob+ex30nDvL4p+MrYctmvEqH/QT72mf9mLXbz3Uj8aoWD2OYA==",
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/@chromatic-com/storybook/-/storybook-5.6.0.tgz",
+      "integrity": "sha512-Z7YMtr9DVwegQeWcBeQaiK5dLcAvgpX53Qr/eGGYTyAEqTb1meUr5VQNq1wmst0Lj+gT6lQEco0PuFfUuf3jzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@neoconfetti/react": "^1.0.0",
-        "chromatic": "^18.0.1",
+        "chromatic": "^18.12.1",
         "jsonfile": "^6.1.0",
         "strip-ansi": "^7.1.0"
       },
@@ -1796,9 +1846,9 @@
       }
     },
     "node_modules/@csstools/color-helpers": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
-      "integrity": "sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==",
+      "version": "6.1.2",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-6.1.2.tgz",
+      "integrity": "sha512-grhRy3OKmniaAEKXMjua5z/EODX0MSqBGjunw8+j/3HQjOnahs2AGhvEOIYVUWcU6ScApbhLhVrQTX8XqrMrow==",
       "dev": true,
       "funding": [
         {
@@ -1812,13 +1862,13 @@
       ],
       "license": "MIT-0",
       "engines": {
-        "node": ">=18"
+        "node": ">=20.19.0"
       }
     },
     "node_modules/@csstools/css-calc": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-2.1.4.tgz",
-      "integrity": "sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==",
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-3.4.3.tgz",
+      "integrity": "sha512-iex20d8CHVkyvg6B7UKV7uHnI2Bqo9g+EFfT9E0y+GvTvhZ/DwONJ+9aKb1dlqm0ZiGsL5RXjp0fCoJYnkeDjA==",
       "dev": true,
       "funding": [
         {
@@ -1832,17 +1882,17 @@
       ],
       "license": "MIT",
       "engines": {
-        "node": ">=18"
+        "node": ">=20.19.0"
       },
       "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^3.0.5",
-        "@csstools/css-tokenizer": "^3.0.4"
+        "@csstools/css-parser-algorithms": "^4.0.2",
+        "@csstools/css-tokenizer": "^4.0.2"
       }
     },
     "node_modules/@csstools/css-color-parser": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-3.1.0.tgz",
-      "integrity": "sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==",
+      "version": "4.2.6",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-4.2.6.tgz",
+      "integrity": "sha512-iiPQ3iRWwnJkeEn6RIu6SJPr7hYrLz6XZ9s/QZl+2/LI5KQVjpl2fdmDSZKuD4xP6GMmMPgHFFXg6k1Wkz0Trg==",
       "dev": true,
       "funding": [
         {
@@ -1856,21 +1906,21 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "@csstools/color-helpers": "^5.1.0",
-        "@csstools/css-calc": "^2.1.4"
+        "@csstools/color-helpers": "^6.1.2",
+        "@csstools/css-calc": "^3.4.3"
       },
       "engines": {
-        "node": ">=18"
+        "node": ">=20.19.0"
       },
       "peerDependencies": {
-        "@csstools/css-parser-algorithms": "^3.0.5",
-        "@csstools/css-tokenizer": "^3.0.4"
+        "@csstools/css-parser-algorithms": "^4.0.2",
+        "@csstools/css-tokenizer": "^4.0.2"
       }
     },
     "node_modules/@csstools/css-parser-algorithms": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz",
-      "integrity": "sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.2.tgz",
+      "integrity": "sha512-40cSKyMvK+tq4qz6Awrlye2WGuOKt3FwPgtGg6KTfbHOWNw+Rk1rzbAtZnZ6IBhsY491HLRnDXwoyBAijmmILA==",
       "dev": true,
       "funding": [
         {
@@ -1884,16 +1934,41 @@
       ],
       "license": "MIT",
       "engines": {
-        "node": ">=18"
+        "node": ">=20.19.0"
       },
       "peerDependencies": {
-        "@csstools/css-tokenizer": "^3.0.4"
+        "@csstools/css-tokenizer": "^4.0.2"
+      }
+    },
+    "node_modules/@csstools/css-syntax-patches-for-csstree": {
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.1.15.tgz",
+      "integrity": "sha512-J0u7HkVl2nzSlhsiTOp4AmwcUQ3D+mGEEKfBy/7To5/y7F2OHwyLrXfrhR0SMgr4p5Lo+eaMVSeai24zUcBIxA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "peerDependencies": {
+        "css-tree": "^3.2.1"
+      },
+      "peerDependenciesMeta": {
+        "css-tree": {
+          "optional": true
+        }
       }
     },
     "node_modules/@csstools/css-tokenizer": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz",
-      "integrity": "sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.2.tgz",
+      "integrity": "sha512-OoKoR0f76dCY666JlcbhmVTs2drYj1GUXZTYTcbUgJjh9Nv41aFfZ21bPQTERm5+L5cBDo466NltB2lplS5GBw==",
       "dev": true,
       "funding": [
         {
@@ -1907,7 +1982,7 @@
       ],
       "license": "MIT",
       "engines": {
-        "node": ">=18"
+        "node": ">=20.19.0"
       }
     },
     "node_modules/@dual-bundle/import-meta-resolve": {
@@ -2437,190 +2512,107 @@
       }
     },
     "node_modules/@eslint/config-array": {
-      "version": "0.21.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.2.tgz",
-      "integrity": "sha512-nJl2KGTlrf9GjLimgIru+V/mzgSK0ABCDQRvxw5BjURL7WfH5uoWmizbH7QB6MmnMBd8cIC9uceWnezL1VZWWw==",
+      "version": "0.23.5",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.23.5.tgz",
+      "integrity": "sha512-Y3kKLvC1dvTOT+oGlqNQ1XLqK6D1HU2YXPc52NmAlJZbMMWDzGYXMiPRJ8TYD39muD/OTjlZmNJ4ib7dvSrMBA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/object-schema": "^2.1.7",
+        "@eslint/object-schema": "^3.0.5",
         "debug": "^4.3.1",
-        "minimatch": "^3.1.5"
-      },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      }
-    },
-    "node_modules/@eslint/config-array/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@eslint/config-array/node_modules/brace-expansion": {
-      "version": "1.1.21",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.21.tgz",
-      "integrity": "sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "node_modules/@eslint/config-array/node_modules/minimatch": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
+        "minimatch": "^10.2.4"
       },
       "engines": {
-        "node": "*"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
     "node_modules/@eslint/config-helpers": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.4.2.tgz",
-      "integrity": "sha512-gBrxN88gOIf3R7ja5K9slwNayVcZgK6SOUORm2uBzTeIEfeVaIhOpCtTox3P6R7o2jLFwLFTLnC7kU/RGcYEgw==",
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.7.0.tgz",
+      "integrity": "sha512-DObd/KKUsU+FaFv4PLxSRenpXfQWmPXXP3pPZ6/K1PCrMu2vQpMDMuQe/BqYeoLcz8ro0bVDF1RxOJgfVEdhUw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/core": "^0.17.0"
+        "@eslint/core": "^1.2.1"
       },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
     "node_modules/@eslint/core": {
-      "version": "0.17.0",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.17.0.tgz",
-      "integrity": "sha512-yL/sLrpmtDaFEiUj1osRP4TI2MDz1AddJL+jZ7KSqvBuliN4xqYY54IfdN8qD8Toa6g1iloph1fxQNkjOxrrpQ==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-1.2.1.tgz",
+      "integrity": "sha512-MwcE1P+AZ4C6DWlpin/OmOA54mmIZ/+xZuJiQd4SyB29oAJjN30UW9wkKNptW2ctp4cEsvhlLY/CsQ1uoHDloQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
         "@types/json-schema": "^7.0.15"
       },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
-    "node_modules/@eslint/eslintrc": {
-      "version": "3.3.7",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.7.tgz",
-      "integrity": "sha512-F42g89Qd5oAWtp0k0nnSrjziAKza7w8SVT4mStc18LZMaRb4J1HQAHLCalEtDCxrTuksx7NU9qsmeLwpOfPqWw==",
+    "node_modules/@eslint/js": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-10.0.1.tgz",
+      "integrity": "sha512-zeR9k5pd4gxjZ0abRoIaxdc7I3nDktoXZk2qOv9gCNWx3mVwEn32VRhyLaRsDiJjTs0xq/T8mfPtyuXu7GWBcA==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "ajv": "^6.14.0",
-        "debug": "^4.3.2",
-        "espree": "^10.0.1",
-        "globals": "^14.0.0",
-        "ignore": "^5.2.0",
-        "import-fresh": "^3.2.1",
-        "js-yaml": "^4.3.2",
-        "minimatch": "^3.1.5",
-        "strip-json-comments": "^3.1.1"
-      },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       },
       "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
-    "node_modules/@eslint/eslintrc/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@eslint/eslintrc/node_modules/brace-expansion": {
-      "version": "1.1.21",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.21.tgz",
-      "integrity": "sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "node_modules/@eslint/eslintrc/node_modules/globals": {
-      "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
-      "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
+        "url": "https://eslint.org/donate"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "peerDependencies": {
+        "eslint": "^10.0.0"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
       }
     },
-    "node_modules/@eslint/eslintrc/node_modules/ignore": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
-      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+    "node_modules/@eslint/object-schema": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-3.0.5.tgz",
+      "integrity": "sha512-vqTaUEgxzm+YDSdElad6PiRoX4t8VGDjCtt05zn4nU810UIx/uNEV7/lZJ6KwFThKZOzOxzXy48da+No7HZaMw==",
       "dev": true,
-      "license": "MIT",
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">= 4"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
-    "node_modules/@eslint/eslintrc/node_modules/minimatch": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
+    "node_modules/@eslint/plugin-kit": {
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.7.3.tgz",
+      "integrity": "sha512-IkO+/KEUvwbVpiURZg+P7zF74z5Jxe0UgJxVni+RtoHQ6IZieXaO02kmadomap/q+l6bc/jdPGGqTjhuZnuz1Q==",
       "dev": true,
-      "license": "ISC",
+      "license": "Apache-2.0",
       "dependencies": {
-        "brace-expansion": "^1.1.7"
+        "@eslint/core": "^1.2.1",
+        "levn": "^0.4.1"
       },
       "engines": {
-        "node": "*"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
-    "node_modules/@eslint/js": {
-      "version": "9.39.5",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.5.tgz",
-      "integrity": "sha512-QywQuszQh77pIXCsq998c8hbhSTI/azTty1Z6N53dmAudKHhy573j3yvRLsX2BSp8YpLtoCEG8E9DJe+8zUh4A==",
+    "node_modules/@exodus/bytes": {
+      "version": "1.16.0",
+      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.16.0.tgz",
+      "integrity": "sha512-IcpW84uEn3N7ETtNZMlxKhfl6Pec8rUNGOTBtWbK1FKhJxIFAptZyVrvVRVBimAJxJCgc3PxepxkdWWG4DVzfA==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       },
-      "funding": {
-        "url": "https://eslint.org/donate"
-      }
-    },
-    "node_modules/@eslint/object-schema": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.7.tgz",
-      "integrity": "sha512-VtAOaymWVfZcmZbp6E2mympDIHvyjXs/12LqWYjVw6qjrfF+VK+fyG33kChz3nnK+SU5/NeHOqrTEHS8sXO3OA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      }
-    },
-    "node_modules/@eslint/plugin-kit": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.4.1.tgz",
-      "integrity": "sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "@eslint/core": "^0.17.0",
-        "levn": "^0.4.1"
+      "peerDependencies": {
+        "@noble/hashes": "^1.8.0 || ^2.0.0"
       },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      "peerDependenciesMeta": {
+        "@noble/hashes": {
+          "optional": true
+        }
       }
     },
     "node_modules/@humanfs/core": {
@@ -2689,80 +2681,6 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
-    "node_modules/@isaacs/cliui": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
-      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "string-width": "^5.1.2",
-        "string-width-cjs": "npm:string-width@^4.2.0",
-        "strip-ansi": "^7.0.1",
-        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
-        "wrap-ansi": "^8.1.0",
-        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
-      "version": "6.2.3",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
-      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
-      "version": "9.2.2",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@isaacs/cliui/node_modules/string-width": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
-      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "eastasianwidth": "^0.2.0",
-        "emoji-regex": "^9.2.2",
-        "strip-ansi": "^7.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
-      "version": "8.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
-      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-styles": "^6.1.0",
-        "string-width": "^5.0.1",
-        "strip-ansi": "^7.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
-      }
-    },
     "node_modules/@istanbuljs/load-nyc-config": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz",
@@ -3510,16 +3428,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/@jest/transform/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/@jest/transform/node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
@@ -5152,17 +5060,6 @@
         "url": "https://opencollective.com/parcel"
       }
     },
-    "node_modules/@pkgjs/parseargs": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
-      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "engines": {
-        "node": ">=14"
-      }
-    },
     "node_modules/@pkgr/core": {
       "version": "0.3.6",
       "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.3.6.tgz",
@@ -5204,15 +5101,15 @@
       }
     },
     "node_modules/@storybook/addon-docs": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-10.6.2.tgz",
-      "integrity": "sha512-f7Rv/rzX1sk4lUDTeoIRkXWcWvNwLv7vBnfpFGb3f88MliB+M4ZekGKNiKtrmi44uLFt52gzwwPzj2eGDu0DQQ==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-10.6.4.tgz",
+      "integrity": "sha512-rRgf5evcDPo4A0i9IBNkhkubfo4BG0YsqanDdpNDODiYYWDzM8xEgLHtGZf/xs4sLbyMITUhhQJr/c3JmAPZ1A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@mdx-js/react": "^3.0.0",
         "@storybook/icons": "^2.0.2",
-        "@storybook/react-dom-shim": "10.6.2",
+        "@storybook/react-dom-shim": "10.6.4",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "ts-dedent": "^2.0.0",
@@ -5224,7 +5121,7 @@
       },
       "peerDependencies": {
         "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       },
       "peerDependenciesMeta": {
         "@types/react": {
@@ -5233,9 +5130,9 @@
       }
     },
     "node_modules/@storybook/addon-links": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-10.6.2.tgz",
-      "integrity": "sha512-pWwWp+KAcqdX9Cg5i3yGaKcD3+7OEDhHkaiYv8GHv1JIOl7Ao/CaoY07or8BdM785akOqxk5Z+UrY7zNKZJ6Gw==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-10.6.4.tgz",
+      "integrity": "sha512-3472dfNu7fOEmPw4zEkPd5NkIyK5CuyB97uBmWmIuhuaSzjzNuXmS6Vqahrt5n2cwnWkExkvB2jkVcP+86mPXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5248,7 +5145,7 @@
       "peerDependencies": {
         "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       },
       "peerDependenciesMeta": {
         "@types/react": {
@@ -5277,13 +5174,13 @@
       }
     },
     "node_modules/@storybook/builder-webpack5": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/builder-webpack5/-/builder-webpack5-10.6.2.tgz",
-      "integrity": "sha512-rlXEjV1ZH+AKMVvlqUjm+pmimmi0asdGv0kTxNERQPu5Kaer9NmNmyYIUJvBYyeQfAg1KB4OntF3ik71jJl3HA==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/builder-webpack5/-/builder-webpack5-10.6.4.tgz",
+      "integrity": "sha512-pjRSn9Eiw2+l5yrlafREwwUIqIqnpJFmVWcCLiyWM7MHzXQzb5t5OTtBJMjMdHP3htWl1/2SJhr/bqW0vjatcg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/core-webpack": "10.6.2",
+        "@storybook/core-webpack": "10.6.4",
         "case-sensitive-paths-webpack-plugin": "^2.4.0",
         "cjs-module-lexer": "^1.2.3",
         "css-loader": "^7.1.2",
@@ -5305,7 +5202,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       },
       "peerDependenciesMeta": {
         "typescript": {
@@ -5314,9 +5211,9 @@
       }
     },
     "node_modules/@storybook/core-webpack": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/core-webpack/-/core-webpack-10.6.2.tgz",
-      "integrity": "sha512-6nEmDApLKSKr6SWWFJUCI4wIAhR91TV7KpoYkegzS04GpJ6gRW0tZjUdGbCJuKt1hepxULtZxSU4pxddAtNoaA==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/core-webpack/-/core-webpack-10.6.4.tgz",
+      "integrity": "sha512-VM3WTSPjhYassJf9+FECNkFavzGoUPpTHMiVfN4ITAGtnjDsKLEI4F/b2XE8eyrSod9KB/hR22fOd4Lo/4A77Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5327,7 +5224,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       }
     },
     "node_modules/@storybook/global": {
@@ -5348,13 +5245,13 @@
       }
     },
     "node_modules/@storybook/preset-react-webpack": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/preset-react-webpack/-/preset-react-webpack-10.6.2.tgz",
-      "integrity": "sha512-6gIpay0hCKEr/7rS8S+7KWcEvKPj895WCL/e10OiLoaAlPL3RpLIOyLZDN4CRxLhSJcJoSpXhhRqJWG8O5R+HQ==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/preset-react-webpack/-/preset-react-webpack-10.6.4.tgz",
+      "integrity": "sha512-GlWsyTzyHSOpDY+7IXEsQjUO7c5RK3aAI56Xq7luHEWA+TL2f0Yr5FqEvfgggNwzXAxcBuhqas0apiXyTOy9Qw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/core-webpack": "10.6.2",
+        "@storybook/core-webpack": "10.6.4",
         "@storybook/react-docgen-typescript-plugin": "1.0.6--canary.9.0c3f3b7.0",
         "@types/semver": "^7.7.1",
         "magic-string": "^1.1.0",
@@ -5371,7 +5268,7 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       },
       "peerDependenciesMeta": {
         "typescript": {
@@ -5380,14 +5277,14 @@
       }
     },
     "node_modules/@storybook/react": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-10.6.2.tgz",
-      "integrity": "sha512-kNWUU6Q8TrLmEqAzYmNYhC9A3i3kbjFxqIcLL3eu+o4gDu0afp1Of6Sy6jIF2qPGH05A3r6FWMzD03y4Mm5xRw==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-10.6.4.tgz",
+      "integrity": "sha512-5oyUucNrco9xZEpRiKQ7YtWP6Sr63DsOxh/RbpjRTOachM4GChemEFdoOEuRO2Wk18sccPvJAI1fHIdMWTIdcQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@storybook/global": "^5.0.0",
-        "@storybook/react-dom-shim": "10.6.2",
+        "@storybook/react-dom-shim": "10.6.4",
         "react-docgen": "^8.0.2",
         "react-docgen-typescript": "^2.2.2"
       },
@@ -5400,7 +5297,7 @@
         "@types/react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2",
+        "storybook": "^10.6.4",
         "typescript": ">= 4.9.x"
       },
       "peerDependenciesMeta": {
@@ -5436,9 +5333,9 @@
       }
     },
     "node_modules/@storybook/react-dom-shim": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-10.6.2.tgz",
-      "integrity": "sha512-k0262Vqxjk3wHeg3g/QO/ENDrkC7kkbuwsFSXOdYr7Sl888tsF1DAS7uQ/gr+s/BRz1FLYRX7wBY3smEUV4MJg==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-10.6.4.tgz",
+      "integrity": "sha512-5nSuUmDM6qU11Gsugrm/WcQRMMx8ZG1i5ZZPpy9Q3kU40IDCRiEA8MwsYPa7QuqwCuyJEyIwm5I0sgvVxWVCcg==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -5450,7 +5347,7 @@
         "@types/react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2"
+        "storybook": "^10.6.4"
       },
       "peerDependenciesMeta": {
         "@types/react": {
@@ -5462,15 +5359,15 @@
       }
     },
     "node_modules/@storybook/react-webpack5": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/@storybook/react-webpack5/-/react-webpack5-10.6.2.tgz",
-      "integrity": "sha512-83c+YFl3cJU80zAefbwGGQv+qpddcQrxSbuowyy9awXaRYZF9Zon5xRAT/Ujkpm66j6R7P2r5HYjyrX4O4vSrw==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/@storybook/react-webpack5/-/react-webpack5-10.6.4.tgz",
+      "integrity": "sha512-4BQAUUy+8vWLby7BwVo6oH0/BlizQsFs9upDmFC+h3wzHzNkmtkzkfD2tPeklPZJR1XxT2kjfPEB9m2omoA+iA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/builder-webpack5": "10.6.2",
-        "@storybook/preset-react-webpack": "10.6.2",
-        "@storybook/react": "10.6.2"
+        "@storybook/builder-webpack5": "10.6.4",
+        "@storybook/preset-react-webpack": "10.6.4",
+        "@storybook/react": "10.6.4"
       },
       "funding": {
         "type": "opencollective",
@@ -5479,7 +5376,7 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^10.6.2",
+        "storybook": "^10.6.4",
         "typescript": ">= 4.9.x"
       },
       "peerDependenciesMeta": {
@@ -6458,6 +6355,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/esrecurse": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@types/esrecurse/-/esrecurse-4.3.1.tgz",
+      "integrity": "sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/estree": {
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
@@ -6655,17 +6559,17 @@
       "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.72.0.tgz",
-      "integrity": "sha512-aysKgysPX9XOv/dk95UkvUDe++Q3n3dJPG9CEWT3RUccxfkPJ+Qn6nhKPDhZXU6Ofo9kgwGWwKyQCnZIXTgngg==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.72.1.tgz",
+      "integrity": "sha512-5CokTWXpmbylfFabsbvHC0CAw3XLaGnoa+nFJX5FR592h/LoZsENUE6p/rg5xvkKrFEXz6pYmgI29AgXc2N3BQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.12.2",
-        "@typescript-eslint/scope-manager": "8.72.0",
-        "@typescript-eslint/type-utils": "8.72.0",
-        "@typescript-eslint/utils": "8.72.0",
-        "@typescript-eslint/visitor-keys": "8.72.0",
+        "@typescript-eslint/scope-manager": "8.72.1",
+        "@typescript-eslint/type-utils": "8.72.1",
+        "@typescript-eslint/utils": "8.72.1",
+        "@typescript-eslint/visitor-keys": "8.72.1",
         "ignore": "^7.0.5",
         "natural-compare": "^1.4.0",
         "ts-api-utils": "^2.5.0"
@@ -6678,22 +6582,22 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "@typescript-eslint/parser": "^8.72.0",
+        "@typescript-eslint/parser": "^8.72.1",
         "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
         "typescript": ">=4.8.4 <6.1.0"
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.72.0.tgz",
-      "integrity": "sha512-0O+x3ynciD6zuXb1CKSu165haQV6ey53DKhHHUnujP7U+XlltJG+/keT0Xhd1HXCze+IHf7Tvt39ovyepX/LNw==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.72.1.tgz",
+      "integrity": "sha512-ZGwZP4OCfyA0AQTpEAMWz+rtX01DRhQWW5hB0ucKDEIX5U7jdmPSaMx94rQfaPAQzIYz2BimOgKOJtjfpRFQ9g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.72.0",
-        "@typescript-eslint/types": "8.72.0",
-        "@typescript-eslint/typescript-estree": "8.72.0",
-        "@typescript-eslint/visitor-keys": "8.72.0",
+        "@typescript-eslint/scope-manager": "8.72.1",
+        "@typescript-eslint/types": "8.72.1",
+        "@typescript-eslint/typescript-estree": "8.72.1",
+        "@typescript-eslint/visitor-keys": "8.72.1",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -6709,14 +6613,14 @@
       }
     },
     "node_modules/@typescript-eslint/project-service": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.72.0.tgz",
-      "integrity": "sha512-bzHngBbmIgzj6TsTjVUCntGx6FFLgE7mPjpO0PzHycOaZHXqS43XnrkFIHRS16LLr/xO6FHSXG3GJFo/F4bSBQ==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.72.1.tgz",
+      "integrity": "sha512-fAuVMkwdO/huI8nyo/WKnNKf6Gag93S56Rh3Ts5mGcavwSdaN8tRg1gCeIGX8PF+nzp1BjGfO4gHhGzW1J6jTg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/tsconfig-utils": "^8.72.0",
-        "@typescript-eslint/types": "^8.72.0",
+        "@typescript-eslint/tsconfig-utils": "^8.72.1",
+        "@typescript-eslint/types": "^8.72.1",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -6731,14 +6635,14 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.72.0.tgz",
-      "integrity": "sha512-JewPyJOYcXBSAS7PIgufscHOwZqhTGyBRiQJhhuDln66tMchxvvt7nJ90JKKIoOelmdHA3kAQbm9cEUHc4JSEA==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.72.1.tgz",
+      "integrity": "sha512-lC/t6eMCZZQAAKZEYGL6RDVSuFehpdmMT6h+nJIjIa6oylN/PwDgDVtEIbB7O9xFfZYtZAYLoLlDNWKJhtF+uQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.72.0",
-        "@typescript-eslint/visitor-keys": "8.72.0"
+        "@typescript-eslint/types": "8.72.1",
+        "@typescript-eslint/visitor-keys": "8.72.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -6749,9 +6653,9 @@
       }
     },
     "node_modules/@typescript-eslint/tsconfig-utils": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.72.0.tgz",
-      "integrity": "sha512-0vbxCf7xLVPSjcOdm6eQbgViH8EDJ8xnl1laLT9yoqSz2YmcSfSg5Vdl0JUvZf6rcuJ0ZivJIuMD4edTg8obaA==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.72.1.tgz",
+      "integrity": "sha512-e4D5R5vpeAEPBxT2BAzsFQL3sbwyeeeo5+aczgNSRK1V734jE7pTqaGFU+fXapWEQwnZbpFaTn32+Z8DwS6OTg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6766,15 +6670,15 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.72.0.tgz",
-      "integrity": "sha512-gEXxmmbSTSOVTC37IYYvremOM31v+UN2W772bJxmVYPhAOPSUxtacyb7wkm1EhkYKU6KzFJsdU44DCV4to0LWw==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.72.1.tgz",
+      "integrity": "sha512-iY2wlmyrXJmx4yxUGP3aYCFF3cA/6ShddOKmLU2dx7LnEykbAM8WThlxZEfd1NddqceF6eJmZUayxx9oKIYNlg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.72.0",
-        "@typescript-eslint/typescript-estree": "8.72.0",
-        "@typescript-eslint/utils": "8.72.0",
+        "@typescript-eslint/types": "8.72.1",
+        "@typescript-eslint/typescript-estree": "8.72.1",
+        "@typescript-eslint/utils": "8.72.1",
         "debug": "^4.4.3",
         "ts-api-utils": "^2.5.0"
       },
@@ -6791,9 +6695,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.72.0.tgz",
-      "integrity": "sha512-Adfoy59kxNEjT5E5fnyrp7GpHYuWs8ONbdohu4ez6IU46qDq8LltG90tLmkucZB2uhYL8mqBjtXqGd8yhfjXqQ==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.72.1.tgz",
+      "integrity": "sha512-LmE5IhQet1BWOWEXqBrVtBPsMAOQ6Nzk35d+WLh3mk4EUF33sqlfxjio1MdYeSvKSG5skactKKuixBIKXhL4Rw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6805,16 +6709,16 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.72.0.tgz",
-      "integrity": "sha512-gwLfFgWcw15tN2KXDCJvxEOQjPn+P3j/n3eSqkZ5sX4VpW9Cosodr+tWwBZRvJT3TcKx6HnPRGZMCNAiP1Xhug==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.72.1.tgz",
+      "integrity": "sha512-DAlUoUV93hIvrtIQLwCbmZQYVZwOMhiHJrOVUUIWicFZaIYjTRqlY3I/NZevfkLmSqkNHRu2qYDcq9lrn16oOQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/project-service": "8.72.0",
-        "@typescript-eslint/tsconfig-utils": "8.72.0",
-        "@typescript-eslint/types": "8.72.0",
-        "@typescript-eslint/visitor-keys": "8.72.0",
+        "@typescript-eslint/project-service": "8.72.1",
+        "@typescript-eslint/tsconfig-utils": "8.72.1",
+        "@typescript-eslint/types": "8.72.1",
+        "@typescript-eslint/visitor-keys": "8.72.1",
         "debug": "^4.4.3",
         "minimatch": "^10.2.2",
         "semver": "^7.7.3",
@@ -6833,16 +6737,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.72.0.tgz",
-      "integrity": "sha512-0up3oArJZBYnzOaEXKo8DmI43QvMZyPoFEt9LWzRJcyl/RcJjfKKPebknN1VbTgXBf3M/KggUh5uUMdURLnseg==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.72.1.tgz",
+      "integrity": "sha512-5v5liypurJBFHCBNqh/RjsymAD+VWcE0djuGY/BUqp5fC3Qn+luWDEksjuTtWjPn6i5zQlUtkZCRG/CYG0yCkA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.9.1",
-        "@typescript-eslint/scope-manager": "8.72.0",
-        "@typescript-eslint/types": "8.72.0",
-        "@typescript-eslint/typescript-estree": "8.72.0"
+        "@typescript-eslint/scope-manager": "8.72.1",
+        "@typescript-eslint/types": "8.72.1",
+        "@typescript-eslint/typescript-estree": "8.72.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -6857,13 +6761,13 @@
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.72.0.tgz",
-      "integrity": "sha512-E2mroviasaWecDzTGiGMtuEguuLVOeRggnrIn93CJuxYJzQBHbyymlT08aVQydbBal5538o+JkBKXh2sRuCyIA==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.72.1.tgz",
+      "integrity": "sha512-SB8xqipSzZHUePCCLNeYxqnxq83X61/qzNhjQGbTfjxGZIeOEP7tBgWYX05Tcd6CgE02WdTJnh5b8kMZJ/+bnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.72.0",
+        "@typescript-eslint/types": "8.72.1",
         "eslint-visitor-keys": "^5.0.0"
       },
       "engines": {
@@ -6874,19 +6778,6 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
-      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": "^20.19.0 || ^22.13.0 || >=24"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
     "node_modules/@ungap/structured-clone": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.4.0.tgz",
@@ -7536,16 +7427,6 @@
         "node": ">=0.4.0"
       }
     },
-    "node_modules/agent-base": {
-      "version": "7.1.4",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
-      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 14"
-      }
-    },
     "node_modules/ajv": {
       "version": "6.15.0",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
@@ -8284,17 +8165,14 @@
         "node": ">=6.0.0"
       }
     },
-    "node_modules/binary-extensions": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
-      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+    "node_modules/bidi-js": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.1.0.tgz",
+      "integrity": "sha512-fX1Onk0tdVPC7obPWB5EbJ1z7NVhLq4m2xZLq2YXBkxzMXIGRpNMU88n0EPgWseKl12J7zXs7qrDxPK4sRs2fg==",
       "dev": true,
       "license": "MIT",
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+      "dependencies": {
+        "require-from-string": "^2.0.2"
       }
     },
     "node_modules/boolbase": {
@@ -8580,9 +8458,9 @@
       }
     },
     "node_modules/chromatic": {
-      "version": "18.13.0",
-      "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-18.13.0.tgz",
-      "integrity": "sha512-AdN6tHB9anx/sdJKIMQ7JkQQV2RhVe1iTvXOFLlwFBRecbl9rp50h/25N0sZJDdpx22gG7Y81HoUALOORfMuxQ==",
+      "version": "18.13.3",
+      "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-18.13.3.tgz",
+      "integrity": "sha512-86wzIxGIdDMBvyYWCXF+V0RyckI+3kl6ki9lJoZem6a0UfwHtEEg5ruORpryTpu6c9dVtBk2qSTX4xtkz3gwsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8938,6 +8816,20 @@
         "url": "https://github.com/sponsors/fb55"
       }
     },
+    "node_modules/css-tree": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.2.1.tgz",
+      "integrity": "sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.27.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
     "node_modules/css-what": {
       "version": "6.2.2",
       "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.2.2.tgz",
@@ -8971,20 +8863,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/cssstyle": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.6.0.tgz",
-      "integrity": "sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@asamuzakjp/css-color": "^3.2.0",
-        "rrweb-cssom": "^0.8.0"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
     "node_modules/csstype": {
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
@@ -9003,17 +8881,17 @@
       }
     },
     "node_modules/data-urls": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
-      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-7.0.0.tgz",
+      "integrity": "sha512-23XHcCF+coGYevirZceTVD7NdJOqVn+49IHyxgszm+JIiHLoB2TkmPtsYkNWT1pvRSGkc35L6NHs0yHkN2SumA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "whatwg-mimetype": "^4.0.0",
-        "whatwg-url": "^14.0.0"
+        "whatwg-mimetype": "^5.0.0",
+        "whatwg-url": "^16.0.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
     "node_modules/data-view-buffer": {
@@ -9408,13 +9286,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/eastasianwidth": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -9779,45 +9650,43 @@
       }
     },
     "node_modules/eslint": {
-      "version": "9.39.5",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.5.tgz",
-      "integrity": "sha512-DgZS62aPLXKlnxILS/AYCoRvHaZeXceIzlXPkkGGzJWSow1aEk0lbTlxUSlyjC8jcaKxAdOnTDz+o1JFSBsyjw==",
-      "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
+      "version": "10.13.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-10.13.0.tgz",
+      "integrity": "sha512-UohDjD4zSzEwhf58M3O7vc/ycc8O1I7dNlhtD0WxE8Px8EHNJKtUwzBqrzeGhisRuv2ag4sAYswszCJRgKXYUg==",
       "dev": true,
       "license": "MIT",
+      "workspaces": [
+        "packages/*"
+      ],
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
-        "@eslint-community/regexpp": "^4.12.1",
-        "@eslint/config-array": "^0.21.2",
-        "@eslint/config-helpers": "^0.4.2",
-        "@eslint/core": "^0.17.0",
-        "@eslint/eslintrc": "^3.3.6",
-        "@eslint/js": "9.39.5",
-        "@eslint/plugin-kit": "^0.4.1",
+        "@eslint-community/regexpp": "^4.12.2",
+        "@eslint/config-array": "^0.23.5",
+        "@eslint/config-helpers": "^0.7.0",
+        "@eslint/core": "^1.2.1",
+        "@eslint/plugin-kit": "^0.7.3",
         "@humanfs/node": "^0.16.6",
         "@humanwhocodes/module-importer": "^1.0.1",
         "@humanwhocodes/retry": "^0.4.2",
         "@types/estree": "^1.0.6",
         "ajv": "^6.14.0",
-        "chalk": "^4.0.0",
         "cross-spawn": "^7.0.6",
         "debug": "^4.3.2",
         "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^8.4.0",
-        "eslint-visitor-keys": "^4.2.1",
-        "espree": "^10.4.0",
-        "esquery": "^1.5.0",
+        "eslint-scope": "^9.1.2",
+        "eslint-visitor-keys": "^5.0.1",
+        "espree": "^11.2.0",
+        "esquery": "^1.7.0",
         "esutils": "^2.0.2",
         "fast-deep-equal": "^3.1.3",
-        "file-entry-cache": "^8.0.0",
+        "file-entry-cache": "11.1.5 || >11.1.6 <12",
         "find-up": "^5.0.0",
         "glob-parent": "^6.0.2",
         "ignore": "^5.2.0",
         "imurmurhash": "^0.1.4",
         "is-glob": "^4.0.0",
         "json-stable-stringify-without-jsonify": "^1.0.1",
-        "lodash.merge": "^4.6.2",
-        "minimatch": "^3.1.5",
+        "minimatch": "^10.2.5",
         "natural-compare": "^1.4.0",
         "optionator": "^0.9.3"
       },
@@ -9825,7 +9694,7 @@
         "eslint": "bin/eslint.js"
       },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       },
       "funding": {
         "url": "https://eslint.org/donate"
@@ -10197,16 +10066,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/eslint-plugin-react-hooks/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/eslint-plugin-react-hooks/node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
@@ -10283,9 +10142,9 @@
       }
     },
     "node_modules/eslint-plugin-storybook": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-storybook/-/eslint-plugin-storybook-10.6.2.tgz",
-      "integrity": "sha512-lECiiizxoE03N/AujmGN0I/yLuDPweTFuQYowkWhtPHD0bWlc2qYCJxG8HbiGulA9nnALXiaZXFW8t1r8EFBKw==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-storybook/-/eslint-plugin-storybook-10.6.4.tgz",
+      "integrity": "sha512-gV2/9WDrnYqrHXxIHjH3IEoB6YmbyoguNBP0sO0kQeFOrxNv0e/J9+wER9U6sKLXWJYV9AdraDGCmXYdFaPKXw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10313,53 +10172,37 @@
       }
     },
     "node_modules/eslint-scope": {
-      "version": "8.4.0",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
-      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
+      "version": "9.1.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-9.1.2.tgz",
+      "integrity": "sha512-xS90H51cKw0jltxmvmHy2Iai1LIqrfbw57b79w/J7MfvDfkIkFZ+kj6zC3BjtUwh150HsSSdxXZcsuv72miDFQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
+        "@types/esrecurse": "^4.3.1",
+        "@types/estree": "^1.0.8",
         "esrecurse": "^4.3.0",
         "estraverse": "^5.2.0"
       },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
     "node_modules/eslint-visitor-keys": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
-      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/eslint/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/eslint/node_modules/brace-expansion": {
-      "version": "1.1.21",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.21.tgz",
-      "integrity": "sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
     "node_modules/eslint/node_modules/ignore": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -10370,32 +10213,19 @@
         "node": ">= 4"
       }
     },
-    "node_modules/eslint/node_modules/minimatch": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/espree": {
-      "version": "10.4.0",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
-      "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==",
+      "version": "11.2.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-11.2.0.tgz",
+      "integrity": "sha512-7p3DrVEIopW1B1avAGLuCSh1jubc01H2JHc8B4qqGblmg5gI9yumBgACjWo4JlIc04ufug4xJ3SQI8HkS/Rgzw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
-        "acorn": "^8.15.0",
+        "acorn": "^8.16.0",
         "acorn-jsx": "^5.3.2",
-        "eslint-visitor-keys": "^4.2.1"
+        "eslint-visitor-keys": "^5.0.1"
       },
       "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
@@ -10644,30 +10474,13 @@
       }
     },
     "node_modules/file-entry-cache": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
-      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "flat-cache": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=16.0.0"
-      }
-    },
-    "node_modules/file-entry-cache/node_modules/flat-cache": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
-      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
+      "version": "11.1.5",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-11.1.5.tgz",
+      "integrity": "sha512-+PFTHITI08JIGhnNpGNI8T8inUpgZfk3GNEqfT9R2zZV2iFXg3CvqzSl/uEhs7TSGujYRELEANyDvS8Fj7+S7Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "flatted": "^3.2.9",
-        "keyv": "^4.5.4"
-      },
-      "engines": {
-        "node": ">=16"
+        "flat-cache": "^6.1.23"
       }
     },
     "node_modules/find-cache-dir": {
@@ -10713,18 +10526,17 @@
       }
     },
     "node_modules/flat-cache": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.2.0.tgz",
-      "integrity": "sha512-CYcENa+FtcUKLmhhqyctpclsq7QF38pKjZHsGNiSQF5r4FtoKDWabFDl3hzaEQMvT1LHEysw5twgLvpYYb4vbw==",
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
+      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "flatted": "^3.2.9",
-        "keyv": "^4.5.3",
-        "rimraf": "^3.0.2"
+        "keyv": "^4.5.4"
       },
       "engines": {
-        "node": "^10.12.0 || >=12.0.0"
+        "node": ">=16"
       }
     },
     "node_modules/flatted": {
@@ -10760,36 +10572,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/foreground-child": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
-      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "cross-spawn": "^7.0.6",
-        "signal-exit": "^4.0.1"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/foreground-child/node_modules/signal-exit": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-      "dev": true,
-      "license": "ISC",
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/fork-ts-checker-webpack-plugin": {
       "version": "9.1.0",
       "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-9.1.0.tgz",
@@ -10903,28 +10685,6 @@
       "dev": true,
       "license": "Unlicense"
     },
-    "node_modules/fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
-      "dev": true,
-      "license": "ISC"
-    },
-    "node_modules/fsevents": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
-      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
-      "hasInstallScript": true,
-      "license": "MIT",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "engines": {
-        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
-      }
-    },
     "node_modules/function-bind": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -11399,16 +11159,16 @@
       }
     },
     "node_modules/html-encoding-sniffer": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
-      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz",
+      "integrity": "sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "whatwg-encoding": "^3.1.1"
+        "@exodus/bytes": "^1.6.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
     "node_modules/html-entities": {
@@ -11520,34 +11280,6 @@
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
     },
-    "node_modules/http-proxy-agent": {
-      "version": "7.0.2",
-      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
-      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "agent-base": "^7.1.0",
-        "debug": "^4.3.4"
-      },
-      "engines": {
-        "node": ">= 14"
-      }
-    },
-    "node_modules/https-proxy-agent": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
-      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "agent-base": "^7.1.2",
-        "debug": "4"
-      },
-      "engines": {
-        "node": ">= 14"
-      }
-    },
     "node_modules/human-signals": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz",
@@ -11584,19 +11316,6 @@
         "node": ">=10.18"
       }
     },
-    "node_modules/iconv-lite": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "safer-buffer": ">= 2.1.2 < 3.0.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/icss-replace-symbols": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
@@ -11695,25 +11414,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
-      "deprecated": "This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "once": "^1.3.0",
-        "wrappy": "1"
-      }
-    },
-    "node_modules/inherits": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/internal-slot": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
@@ -11790,19 +11490,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-binary-path": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
-      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "binary-extensions": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/is-boolean-object": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
@@ -12557,16 +12244,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/istanbul-lib-instrument/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/istanbul-lib-report": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
@@ -12645,22 +12322,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/jackspeak": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
-      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
-      "dev": true,
-      "license": "BlueOak-1.0.0",
-      "dependencies": {
-        "@isaacs/cliui": "^8.0.2"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      },
-      "optionalDependencies": {
-        "@pkgjs/parseargs": "^0.11.0"
-      }
-    },
     "node_modules/jest": {
       "version": "30.5.2",
       "resolved": "https://registry.npmjs.org/jest/-/jest-30.5.2.tgz",
@@ -13134,16 +12795,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/jest-config/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/jest-config/node_modules/pretty-format": {
       "version": "30.5.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.5.1.tgz",
@@ -14049,16 +13700,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/jest-snapshot/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/jest-snapshot/node_modules/pretty-format": {
       "version": "30.5.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.5.1.tgz",
@@ -14279,35 +13920,36 @@
       }
     },
     "node_modules/jsdom": {
-      "version": "26.1.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-26.1.0.tgz",
-      "integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==",
+      "version": "29.1.1",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-29.1.1.tgz",
+      "integrity": "sha512-ECi4Fi2f7BdJtUKTflYRTiaMxIB0O6zfR1fX0GXpUrf6flp8QIYn1UT20YQqdSOfk2dfkCwS8LAFoJDEppNK5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "cssstyle": "^4.2.1",
-        "data-urls": "^5.0.0",
-        "decimal.js": "^10.5.0",
-        "html-encoding-sniffer": "^4.0.0",
-        "http-proxy-agent": "^7.0.2",
-        "https-proxy-agent": "^7.0.6",
+        "@asamuzakjp/css-color": "^5.1.11",
+        "@asamuzakjp/dom-selector": "^7.1.1",
+        "@bramus/specificity": "^2.4.2",
+        "@csstools/css-syntax-patches-for-csstree": "^1.1.3",
+        "@exodus/bytes": "^1.15.0",
+        "css-tree": "^3.2.1",
+        "data-urls": "^7.0.0",
+        "decimal.js": "^10.6.0",
+        "html-encoding-sniffer": "^6.0.0",
         "is-potential-custom-element-name": "^1.0.1",
-        "nwsapi": "^2.2.16",
-        "parse5": "^7.2.1",
-        "rrweb-cssom": "^0.8.0",
+        "lru-cache": "^11.3.5",
+        "parse5": "^8.0.1",
         "saxes": "^6.0.0",
         "symbol-tree": "^3.2.4",
-        "tough-cookie": "^5.1.1",
+        "tough-cookie": "^6.0.1",
+        "undici": "^7.25.0",
         "w3c-xmlserializer": "^5.0.0",
-        "webidl-conversions": "^7.0.0",
-        "whatwg-encoding": "^3.1.1",
-        "whatwg-mimetype": "^4.0.0",
-        "whatwg-url": "^14.1.1",
-        "ws": "^8.18.0",
+        "webidl-conversions": "^8.0.1",
+        "whatwg-mimetype": "^5.0.0",
+        "whatwg-url": "^16.0.1",
         "xml-name-validator": "^5.0.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^20.19.0 || ^22.13.0 || >=24.0.0"
       },
       "peerDependencies": {
         "canvas": "^3.0.0"
@@ -14318,6 +13960,42 @@
         }
       }
     },
+    "node_modules/jsdom/node_modules/entities": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-8.1.0.tgz",
+      "integrity": "sha512-kxL7msIffSuh9aaFAMD7rxAIuTRMAHMeBtgHW2yUdWw732ZNh4MehkF2gdjvtdmikkaIP9bFDDJOPlsvm7avrA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/jsdom/node_modules/lru-cache": {
+      "version": "11.5.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.3.tgz",
+      "integrity": "sha512-U4N8FgzmWxc8k1VH8Kr6lQg18U7Fjvby6wXHVRX/ZZ7IwWbRMgrRbP0Wrb5q5NVinryp4SQampHKdvtecItxUg==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/jsdom/node_modules/parse5": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-8.0.1.tgz",
+      "integrity": "sha512-z1e/HMG90obSGeidlli3hj7cbocou0/wa5HacvI3ASx34PecNjNQeaHNo5WIZpWofN9kgkqV1q5YvXe3F0FoPw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^8.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
     "node_modules/jsesc": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
@@ -14773,13 +14451,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/lodash.merge": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/loose-envify": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -14818,11 +14489,14 @@
       }
     },
     "node_modules/lru-cache": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
       "dev": true,
-      "license": "ISC"
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
     },
     "node_modules/lz-string": {
       "version": "1.5.0",
@@ -14835,9 +14509,9 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-1.4.3.tgz",
-      "integrity": "sha512-z12OxmaPGE0F4xlpGdjuAUckipLpQlTAuAmyGhNoD7ODpYUzvDfvtxUbjM/jwznyP178oju/KDdyi220wNJ0RQ==",
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-1.4.4.tgz",
+      "integrity": "sha512-jQz9sVhrZuphH4NrAIHSgkDJCluQO7Ioi4KGRLa7aTUjAODQ13hENX0YIytqYE/rIkO485gQG2LeBxJaW53kkQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14887,6 +14561,13 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/mdn-data": {
+      "version": "2.27.1",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.27.1.tgz",
+      "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
     "node_modules/memfs": {
       "version": "3.5.3",
       "resolved": "https://registry.npmjs.org/memfs/-/memfs-3.5.3.tgz",
@@ -15406,13 +15087,6 @@
         "url": "https://github.com/fb55/nth-check?sponsor=1"
       }
     },
-    "node_modules/nwsapi": {
-      "version": "2.2.28",
-      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.28.tgz",
-      "integrity": "sha512-IlVB7OS7qrOsVYlpnFIkETjMwT9jwvmocJmmM+GZU/PAB3uGi9Ezd7vcWhWBUnSc0ya4ppmQITOyP1ez9gg8cg==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -15543,9 +15217,9 @@
       }
     },
     "node_modules/on-finished": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
-      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.2.tgz",
+      "integrity": "sha512-ATWUv387i+nLD49EiDoOft5scf32Vsdz3ktrQJG9bi7jRFmaXTssvyvj1EmeKVVgvesbqUtvQQvaS2TpTukAZQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15553,16 +15227,10 @@
       },
       "engines": {
         "node": ">= 0.8"
-      }
-    },
-    "node_modules/once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "wrappy": "1"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
       }
     },
     "node_modules/onetime": {
@@ -15761,13 +15429,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/package-json-from-dist": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
-      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
-      "dev": true,
-      "license": "BlueOak-1.0.0"
-    },
     "node_modules/param-case": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz",
@@ -15877,16 +15538,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/path-is-absolute": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/path-key": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
@@ -16073,9 +15724,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.31",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.31.tgz",
-      "integrity": "sha512-YUbWYCgErwnMAVkjUnYa+KlMBzGpHwiIt/DE7f0G33AuX2LH9UcTk6KgWxd3zRU+pN3u/C+Xl3EnMLM4Hea7Sg==",
+      "version": "8.5.32",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.32.tgz",
+      "integrity": "sha512-LJlKCCAUFKOuZxipUdYw1NzIITEsPcgyOG9LkvRJvuKj/bRzbuRY0ARXvL0pWGpsZvn8jku+LMep2eU0seHp8g==",
       "funding": [
         {
           "type": "opencollective",
@@ -16858,9 +16509,9 @@
       }
     },
     "node_modules/react-docgen/node_modules/@babel/helper-string-parser": {
-      "version": "7.29.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.29.7.tgz",
-      "integrity": "sha512-Pb5ijPrZ89GDH8223L4UP8i6QApWxs04RbPQJTeWDV0/keR2E36MeKnyr6LYmUUvqRRI+Iv87SuF1W6ErINzYw==",
+      "version": "7.29.11",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.29.11.tgz",
+      "integrity": "sha512-snZbO7MEDOof+hvNa97EjEY7qD7h2kwvQr5AJC3ZhQudKW5dnej6k3kP9NQV88hJwaS8vDqRLFo9rivLEhle2g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16902,13 +16553,13 @@
       }
     },
     "node_modules/react-docgen/node_modules/@babel/parser": {
-      "version": "7.29.9",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.9.tgz",
-      "integrity": "sha512-CjXrNHTnvqBVqHgdBysY3vk2T8tpJHb5/RMeHJBTyVa9xgugCB0CJTx/3oO8RV2QRQP391RWpB7D6hLjm8V9uA==",
+      "version": "7.29.11",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.11.tgz",
+      "integrity": "sha512-OZ6+oaK7GMyg3IfCpj8JOmn8n+w2rJbDT0LLfVDTLb1ZFeKDh3AiNELgCMUw175IJHSkLl74hG0M0VLsvx+gag==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.29.8"
+        "@babel/types": "^7.29.11"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -16952,13 +16603,13 @@
       }
     },
     "node_modules/react-docgen/node_modules/@babel/types": {
-      "version": "7.29.8",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.8.tgz",
-      "integrity": "sha512-Vj1jF3cPfxg7OAfoI7QnVKLoILlm2JF9pnVHrX8qx7AHMiYWT+NDAA7jChlNgRS4WTLc/fD1lXLmPixluj+3Gg==",
+      "version": "7.29.11",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.11.tgz",
+      "integrity": "sha512-WCsemW40Cpc6gouC1SrY6PBaZ+oLRlEVY9XBvZBI7il/HyUrb2nJ505wE1MHEFyDZNnrWDEuy4jL50WVHfTTSQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/helper-string-parser": "^7.29.7",
+        "@babel/helper-string-parser": "^7.29.11",
         "@babel/helper-validator-identifier": "^7.29.7"
       },
       "engines": {
@@ -16996,16 +16647,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/react-docgen/node_modules/lru-cache": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "yallist": "^3.0.2"
-      }
-    },
     "node_modules/react-docgen/node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
@@ -17030,9 +16671,9 @@
       }
     },
     "node_modules/react-hook-form": {
-      "version": "7.90.0",
-      "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.90.0.tgz",
-      "integrity": "sha512-+NdG0FLzCPhFOp2NNxaUYLF9fyZhNjx9FTBBSYWF71/l6BBlmIc/j6xlp3DbaHWLJbIG7Zd8oznA19xJClU97w==",
+      "version": "7.91.0",
+      "resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.91.0.tgz",
+      "integrity": "sha512-5BEBUnCBwa28AFXYTYmOaB/+CSpJ/+CWVASHEvIGUzFdHyUiPHeRhG7r5hOZ8nZi0yP7pbHdFNXO/p31EKTJFQ==",
       "license": "MIT",
       "engines": {
         "node": ">=18.0.0"
@@ -17368,83 +17009,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "deprecated": "Rimraf versions prior to v4 are no longer supported",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/rimraf/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/rimraf/node_modules/brace-expansion": {
-      "version": "1.1.21",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.21.tgz",
-      "integrity": "sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "node_modules/rimraf/node_modules/glob": {
-      "version": "7.2.3",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
-      "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "fs.realpath": "^1.0.0",
-        "inflight": "^1.0.4",
-        "inherits": "2",
-        "minimatch": "^3.1.1",
-        "once": "^1.3.0",
-        "path-is-absolute": "^1.0.0"
-      },
-      "engines": {
-        "node": "*"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/rimraf/node_modules/minimatch": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
-    "node_modules/rrweb-cssom": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz",
-      "integrity": "sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/run-applescript": {
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/run-applescript/-/run-applescript-7.1.0.tgz",
@@ -17537,13 +17101,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/safer-buffer": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/saxes": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
@@ -17842,9 +17399,9 @@
       }
     },
     "node_modules/storybook": {
-      "version": "10.6.2",
-      "resolved": "https://registry.npmjs.org/storybook/-/storybook-10.6.2.tgz",
-      "integrity": "sha512-qHDINMiapxFUxYb+xC3j8u7Y+85X3u+/PlytE/wmnyg+bU0agCW3jUmWP4vIh2MioO2jTK/2B3Lcw6IpRFzQBA==",
+      "version": "10.6.4",
+      "resolved": "https://registry.npmjs.org/storybook/-/storybook-10.6.4.tgz",
+      "integrity": "sha512-pdtErBHV1cUzzZlVenLc7PGklKt1uWtdM9qCgiLa29bn5E3YRKnF2KR7YE4QgJrJ4FJWManzIhzMABqkTL0AUg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -17968,35 +17525,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/string-width-cjs": {
-      "name": "string-width",
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/string-width-cjs/node_modules/strip-ansi": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^5.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/string.prototype.matchall": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.1.0.tgz",
@@ -18112,20 +17640,6 @@
         "url": "https://github.com/chalk/strip-ansi?sponsor=1"
       }
     },
-    "node_modules/strip-ansi-cjs": {
-      "name": "strip-ansi",
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^5.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/strip-ansi/node_modules/ansi-regex": {
       "version": "6.4.0",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.4.0.tgz",
@@ -18503,78 +18017,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/test-exclude/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/test-exclude/node_modules/brace-expansion": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.1.7.tgz",
-      "integrity": "sha512-uZbew1NqdmPDTMJ8ah1y+b+9QEJrfkXFk3RcTQw3X0jW/xRUvFKsg1CfQdSYGdTbXZWExtU3J3ccxtnfw1Fi0g==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/test-exclude/node_modules/glob": {
-      "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/test-exclude/node_modules/glob/node_modules/minimatch": {
-      "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.2"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/test-exclude/node_modules/path-scurry": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
-      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
-      "dev": true,
-      "license": "BlueOak-1.0.0",
-      "dependencies": {
-        "lru-cache": "^10.2.0",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/thenby": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/thenby/-/thenby-1.4.1.tgz",
@@ -18644,49 +18086,49 @@
       }
     },
     "node_modules/tldts": {
-      "version": "6.1.86",
-      "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.86.tgz",
-      "integrity": "sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==",
+      "version": "7.4.19",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.4.19.tgz",
+      "integrity": "sha512-48dH6aSpQnpbzDUc4vIQZ1VjB8tkK+e8c1yx05/SZK+rkssgjEOlxDd/yU8/a4vGYQ9vRgJr9dwMq9TJ0b3X2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tldts-core": "^6.1.86"
+        "tldts-core": "^7.4.19"
       },
       "bin": {
         "tldts": "bin/cli.js"
       }
     },
     "node_modules/tldts-core": {
-      "version": "6.1.86",
-      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.86.tgz",
-      "integrity": "sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==",
+      "version": "7.4.19",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.4.19.tgz",
+      "integrity": "sha512-goNXV6Ho9TIOfpJZanTd6CKG5DyYgYAL+k+22T0SLh8l6+KHIfBUPFuePuSZv05UttIaaLmI9tb7TmGIdK5AkQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/tough-cookie": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-5.1.2.tgz",
-      "integrity": "sha512-FVDYdxtnj0G6Qm/DhNPSb8Ju59ULcup3tuJxkFb5K8Bv2pUXILbf0xZWU8PX8Ov19OXljbUyveOFwRMwkXzO+A==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.2.tgz",
+      "integrity": "sha512-exgYmnmL/sJpR3upZfXG5PoatXQii55xAiXGXzY+sROLZ/Y+SLcp9PgJNI9Vz37HpQ74WvDcLT8eqm+kV3FzrA==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
-        "tldts": "^6.1.32"
+        "tldts": "^7.0.5"
       },
       "engines": {
         "node": ">=16"
       }
     },
     "node_modules/tr46": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
-      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-6.0.0.tgz",
+      "integrity": "sha512-bLVMLPtstlZ4iMQHpFHTR7GAGj2jxi8Dg0s2h2MafAE4uSWF98FC/3MomU51iQAMf8/qDUbKWf5GxuvvVcXEhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "punycode": "^2.3.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": ">=20"
       }
     },
     "node_modules/tree-dump": {
@@ -18840,9 +18282,9 @@
       }
     },
     "node_modules/tsc-alias": {
-      "version": "1.9.8",
-      "resolved": "https://registry.npmjs.org/tsc-alias/-/tsc-alias-1.9.8.tgz",
-      "integrity": "sha512-od5fOkQV3Awws6HuoW+hbampmmMz+U9denraxuAwwT2Q4ZFSAJ4LWPYnyVQfCKOquGlRyk7xQTdjCZ3THTsImw==",
+      "version": "1.9.9",
+      "resolved": "https://registry.npmjs.org/tsc-alias/-/tsc-alias-1.9.9.tgz",
+      "integrity": "sha512-TxUi+OyqQXRwSMUQaB0pqM89VbOEvL/6RkgQa2LrxNvbhCmkQvrp8NX7VyMW9KYVLGlwICxrLwNv3Ik4vtIQxw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -18865,49 +18307,6 @@
         "url": "https://github.com/sponsors/justkey007"
       }
     },
-    "node_modules/tsc-alias/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/tsc-alias/node_modules/braces": {
-      "name": "brace-expansion",
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.1.7.tgz",
-      "integrity": "sha512-uZbew1NqdmPDTMJ8ah1y+b+9QEJrfkXFk3RcTQw3X0jW/xRUvFKsg1CfQdSYGdTbXZWExtU3J3ccxtnfw1Fi0g==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/tsc-alias/node_modules/chokidar": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
-      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "anymatch": "~3.1.2",
-        "braces": "~3.0.2",
-        "glob-parent": "~5.1.2",
-        "is-binary-path": "~2.1.0",
-        "is-glob": "~4.0.1",
-        "normalize-path": "~3.0.0",
-        "readdirp": "~3.6.0"
-      },
-      "engines": {
-        "node": ">= 8.10.0"
-      },
-      "funding": {
-        "url": "https://paulmillr.com/funding/"
-      },
-      "optionalDependencies": {
-        "fsevents": "~2.3.2"
-      }
-    },
     "node_modules/tsc-alias/node_modules/commander": {
       "version": "9.5.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-9.5.0.tgz",
@@ -18918,45 +18317,6 @@
         "node": "^12.20.0 || >=14"
       }
     },
-    "node_modules/tsc-alias/node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "is-glob": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/tsc-alias/node_modules/picomatch": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
-      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=8.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/jonschlinkert"
-      }
-    },
-    "node_modules/tsc-alias/node_modules/readdirp": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
-      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "picomatch": "^2.2.1"
-      },
-      "engines": {
-        "node": ">=8.10.0"
-      }
-    },
     "node_modules/tsconfig-paths": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-4.2.0.tgz",
@@ -19133,16 +18493,16 @@
       }
     },
     "node_modules/typescript-eslint": {
-      "version": "8.72.0",
-      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.72.0.tgz",
-      "integrity": "sha512-r26Fkc8As+mZvqp7SLsMmNFyYUup/6CjK7/eHBHmhOw6GH6n6YFxHVFrG0jN1c5CMpDzelLPxvgeCOzx7BjN+A==",
+      "version": "8.72.1",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.72.1.tgz",
+      "integrity": "sha512-3Li9FfPmQp45nxEtFD1ZCrYFI3cYK5kpyNtmm1H7lMagm8u9sy6PTjy3ytwQZs7KNukOyKFHAZ6z6GjYFeaeXw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/eslint-plugin": "8.72.0",
-        "@typescript-eslint/parser": "8.72.0",
-        "@typescript-eslint/typescript-estree": "8.72.0",
-        "@typescript-eslint/utils": "8.72.0"
+        "@typescript-eslint/eslint-plugin": "8.72.1",
+        "@typescript-eslint/parser": "8.72.1",
+        "@typescript-eslint/typescript-estree": "8.72.1",
+        "@typescript-eslint/utils": "8.72.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -19189,6 +18549,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/undici": {
+      "version": "7.30.1",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.30.1.tgz",
+      "integrity": "sha512-03KrMbjIFDWQR5RNPrSw3bd1r12JpyFQl9/yxjUbJtqkjmllqC5lFjZh6ujeuJCKr8EOQvRW872Oy/az+nLYxg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.18.1"
+      }
+    },
     "node_modules/undici-types": {
       "version": "8.9.0",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-8.9.0.tgz",
@@ -19460,13 +18830,13 @@
       }
     },
     "node_modules/webidl-conversions": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
-      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.1.tgz",
+      "integrity": "sha512-BMhLD/Sw+GbJC21C/UgyaZX41nPt8bUTg+jWyDeg7e7YN4xOM05YPSIXceACnXVtqyEw/LMClUQMtMZ+PGGpqQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
-        "node": ">=12"
+        "node": ">=20"
       }
     },
     "node_modules/webpack": {
@@ -19752,42 +19122,29 @@
         }
       }
     },
-    "node_modules/whatwg-encoding": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
-      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
-      "deprecated": "Use @exodus/bytes instead for a more spec-conformant and faster implementation",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "iconv-lite": "0.6.3"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
     "node_modules/whatwg-mimetype": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
-      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-5.0.0.tgz",
+      "integrity": "sha512-sXcNcHOC51uPGF0P/D4NVtrkjSU2fNsm9iog4ZvZJsL3rjoDAzXZhkm2MWt1y+PUdggKAYVoMAIYcs78wJ51Cw==",
       "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=18"
+        "node": ">=20"
       }
     },
     "node_modules/whatwg-url": {
-      "version": "14.2.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
-      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
+      "version": "16.0.1",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-16.0.1.tgz",
+      "integrity": "sha512-1to4zXBxmXHV3IiSSEInrreIlu02vUOvrhxJJH5vcxYTBDAx51cqZiKdyTxlecdKNSjj8EcxGBxNf6Vg+945gw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tr46": "^5.1.0",
-        "webidl-conversions": "^7.0.0"
+        "@exodus/bytes": "^1.11.0",
+        "tr46": "^6.0.0",
+        "webidl-conversions": "^8.0.1"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
     "node_modules/which": {
@@ -19930,53 +19287,6 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/wrap-ansi-cjs": {
-      "name": "wrap-ansi",
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-styles": "^4.0.0",
-        "string-width": "^4.1.0",
-        "strip-ansi": "^6.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
-      }
-    },
-    "node_modules/wrap-ansi-cjs/node_modules/string-width": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/wrap-ansi-cjs/node_modules/strip-ansi": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^5.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/wrap-ansi/node_modules/string-width": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@@ -20005,13 +19315,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/write-file-atomic": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz",
diff --git a/package.json b/package.json
index 19bf2a4..ec2ebd4 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,7 @@
     "react-hook-form",
     "storybook"
   ],
-  "version": "2.5.1",
+  "version": "2.6.0",
   "homepage": "https://github.com/creativecodeco/ui",
   "repository": {
     "type": "git",
@@ -29,8 +29,27 @@
     "email": "joaltoroc@creativecode.com.co"
   },
   "license": "MIT",
+  "engines": {
+    "node": ">=24.22.1",
+    "npm": ">=12.2.1"
+  },
+  "packageManager": "npm@12.2.1",
   "main": "lib/index.js",
+  "types": "lib/index.d.ts",
   "source": "src/index.ts",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./theme/main.css": "./lib/theme/main.css",
+    "./theme/css/*": "./lib/theme/css/*",
+    "./lib/*": "./lib/*",
+    "./package.json": "./package.json"
+  },
   "scripts": {
     "dev": "npm run build; npm run storybook",
     "dev:css": "postcss src/theme/main.css -o lib/theme/main.css --watch",
@@ -54,33 +73,33 @@
     "test:watch": "jest --watch"
   },
   "peerDependencies": {
-    "@tailwindcss/postcss": "4.1.18",
-    "postcss": "8.5.6",
-    "react": "19.2.8",
-    "react-hook-form": "7.58.1",
-    "tailwindcss": "4.1.18",
+    "@tailwindcss/postcss": "4.3.3",
+    "postcss": "8.5.32",
+    "react": "19.3.1",
+    "react-hook-form": "7.91.0",
+    "tailwindcss": "4.3.3",
     "usehooks-ts": "3.1.1"
   },
   "dependencies": {
     "@tailwindcss/postcss": "4.3.3",
-    "postcss": "8.5.31",
+    "postcss": "8.5.32",
     "react": "19.3.1",
-    "react-hook-form": "7.90.0",
+    "react-hook-form": "7.91.0",
     "tailwindcss": "4.3.3",
     "usehooks-ts": "3.1.1"
   },
   "devDependencies": {
-    "@babel/core": "8.0.7",
+    "@babel/core": "8.0.9",
     "@babel/preset-env": "8.0.7",
     "@babel/preset-react": "8.0.1",
     "@babel/preset-typescript": "8.0.7",
-    "@chromatic-com/storybook": "5.5.1",
-    "@eslint/js": "9.39.5",
+    "@chromatic-com/storybook": "5.6.0",
+    "@eslint/js": "10.0.1",
     "@jest/globals": "30.5.2",
-    "@storybook/addon-docs": "10.6.2",
-    "@storybook/addon-links": "10.6.2",
+    "@storybook/addon-docs": "10.6.4",
+    "@storybook/addon-links": "10.6.4",
     "@storybook/addon-webpack5-compiler-swc": "4.0.3",
-    "@storybook/react-webpack5": "10.6.2",
+    "@storybook/react-webpack5": "10.6.4",
     "@testing-library/dom": "10.4.2",
     "@testing-library/jest-dom": "7.0.1",
     "@testing-library/react": "16.3.3",
@@ -89,16 +108,16 @@
     "@types/node": "26.6.5",
     "@types/react": "19.3.0",
     "@types/react-dom": "19.3.0",
-    "chromatic": "18.13.0",
+    "chromatic": "18.13.3",
     "classnames": "2.5.1",
     "cpx2": "9.0.3",
     "daisyui": "5.7.50",
-    "eslint": "9.39.5",
+    "eslint": "10.13.0",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-prettier": "5.5.7",
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "7.1.1",
-    "eslint-plugin-storybook": "10.6.2",
+    "eslint-plugin-storybook": "10.6.4",
     "eslint-plugin-unused-imports": "4.4.1",
     "globals": "17.13.0",
     "husky": "9.1.7",
@@ -111,21 +130,27 @@
     "prop-types": "15.8.1",
     "react-dom": "19.3.1",
     "react-icons": "5.7.0",
-    "storybook": "10.6.2",
+    "storybook": "10.6.4",
     "string-width": "8.3.0",
     "ts-jest": "29.4.15",
     "ts-node": "10.9.2",
-    "tsc-alias": "1.9.8",
+    "tsc-alias": "1.9.9",
     "tsconfig-paths-webpack-plugin": "4.2.0",
     "typescript": "6.0.3",
-    "typescript-eslint": "8.72.0"
+    "typescript-eslint": "8.72.1"
   },
   "files": [
     "lib"
   ],
   "overrides": {
     "braces": "npm:brace-expansion@^2.1.7",
+    "eslint-plugin-react": {
+      "eslint": "$eslint"
+    },
+    "flat-cache": "^4.0.1",
+    "glob": "^13.0.6",
     "js-yaml": "^4.1.1",
+    "jsdom": "^29.1.1",
     "tsc-alias": {
       "chokidar": "^4.0.3"
     },
diff --git a/src/helpers/react-hook-form/controller.component.tsx b/src/helpers/react-hook-form/controller.component.tsx
index 35ecc29..4cc4014 100644
--- a/src/helpers/react-hook-form/controller.component.tsx
+++ b/src/helpers/react-hook-form/controller.component.tsx
@@ -4,9 +4,9 @@ import {
   Controller as RHFController
 } from 'react-hook-form';
 
-import type { ControllerType } from '@/types/helpers/controller.types';
+import type { ControllerType } from '@/types';
 
-export default function Controller<
+const Controller = <
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
 >({
@@ -17,7 +17,9 @@ export default function Controller<
   shouldUnregister,
   rules,
   ...rest
-}: ControllerType<TFieldValues, TName>) {
+}: ControllerType<TFieldValues, TName>) => {
+  const Component = Input as React.ComponentType<Record<string, unknown>>;
+
   return (
     <RHFController
       control={control}
@@ -26,8 +28,15 @@ export default function Controller<
       shouldUnregister={shouldUnregister}
       rules={rules}
       render={({ field, fieldState: { error } }) => (
-        <Input {...field} isError={!!error} error={error?.message} {...rest} />
+        <Component
+          {...field}
+          isError={Boolean(error)}
+          error={error?.message}
+          {...rest}
+        />
       )}
     />
   );
-}
+};
+
+export default Controller;
diff --git a/src/theme/button.css b/src/theme/button.css
index 21b9fbe..837f7b7 100644
--- a/src/theme/button.css
+++ b/src/theme/button.css
@@ -1,3 +1,29 @@
+.btn {
+  transition:
+    transform 160ms var(--ease-out, cubic-bezier(0.23, 1, 0.32, 1)),
+    background-color 160ms ease,
+    border-color 160ms ease,
+    color 160ms ease,
+    box-shadow 160ms ease;
+
+  &:active:not(:disabled) {
+    transform: scale(0.97);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .btn {
+    transition:
+      background-color 160ms ease,
+      border-color 160ms ease,
+      color 160ms ease;
+
+    &:active:not(:disabled) {
+      transform: none;
+    }
+  }
+}
+
 .button {
   &:focus,
   &:hover,
diff --git a/src/theme/main.css b/src/theme/main.css
index e6c0226..cbcaba1 100644
--- a/src/theme/main.css
+++ b/src/theme/main.css
@@ -9,3 +9,11 @@
 @import './textbox.css';
 
 @plugin "daisyui";
+
+@source inline("{btn,badge,alert,toggle,range,select,textarea,file-input,progress,status,chat-bubble,step,tooltip,checkbox,radio,input,otp,divider,link,text,bg,border}-{primary,secondary,accent,info,success,warning,error,neutral,ghost}");
+
+:root {
+  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
+  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
+  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
+}
diff --git a/src/types/helpers/controller.types.ts b/src/types/helpers/controller.types.ts
index 20bc79e..c910ca7 100644
--- a/src/types/helpers/controller.types.ts
+++ b/src/types/helpers/controller.types.ts
@@ -4,17 +4,38 @@ import type {
   ControllerProps as RHFControllerProps
 } from 'react-hook-form';
 
-import { Dropdown, TextBox } from '@/ui/forms';
-
-type TextBoxType = {
-  as: typeof TextBox;
-} & React.ComponentProps<typeof TextBox>;
+import type {
+  Checkbox,
+  Dropdown,
+  FileInput,
+  Otp,
+  Radio,
+  RadioList,
+  Range,
+  Select,
+  TextArea,
+  TextBox,
+  Toggle
+} from '@/ui/forms';
 
-type DropdownType = {
-  as: typeof Dropdown;
-} & React.ComponentProps<typeof Dropdown>;
+type FormControlComponent =
+  | typeof TextBox
+  | typeof Dropdown
+  | typeof Select
+  | typeof TextArea
+  | typeof Checkbox
+  | typeof Radio
+  | typeof RadioList
+  | typeof Toggle
+  | typeof Range
+  | typeof FileInput
+  | typeof Otp;
 
-type Inputs = TextBoxType | DropdownType;
+type Inputs = {
+  [K in FormControlComponent as string]: {
+    as: K;
+  } & React.ComponentProps<K>;
+}[string];
 
 export type ControllerType<
   TFieldValues extends FieldValues = FieldValues,
diff --git a/src/types/index.ts b/src/types/index.ts
index 97152b7..e4f75ae 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -1,3 +1,4 @@
+export type * from './helpers/controller.types';
 export type * from './ui/base';
 export type * from './ui/components';
 export type * from './ui/forms';
diff --git a/src/ui/components/display/accordion/accordion.component.tsx b/src/ui/components/display/accordion/accordion.component.tsx
index 9fe449f..f5b686d 100644
--- a/src/ui/components/display/accordion/accordion.component.tsx
+++ b/src/ui/components/display/accordion/accordion.component.tsx
@@ -11,11 +11,12 @@ const Accordion = ({
   join,
   options,
   iconType = 'arrow',
-  multiple
+  multiple,
+  className
 }: AccordionType) => {
   return (
     <div
-      className={cls('flex flex-wrap', {
+      className={cls('flex flex-wrap', className, {
         'join join-vertical w-full': join,
         'gap-2': !join
       })}
diff --git a/src/ui/components/display/accordion/accordion.stories.tsx b/src/ui/components/display/accordion/accordion.stories.tsx
index bab1971..a1913a2 100644
--- a/src/ui/components/display/accordion/accordion.stories.tsx
+++ b/src/ui/components/display/accordion/accordion.stories.tsx
@@ -9,6 +9,7 @@ import Accordion from './accordion.component';
 const meta: Meta<typeof Accordion> = {
   title: '@creativecodeco-ui/Display/Accordion',
   component: Accordion,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Name',
diff --git a/src/ui/components/display/accordion/accordion.types.ts b/src/ui/components/display/accordion/accordion.types.ts
index 465f07f..0a13c1c 100644
--- a/src/ui/components/display/accordion/accordion.types.ts
+++ b/src/ui/components/display/accordion/accordion.types.ts
@@ -3,12 +3,12 @@ export interface AccordionType {
   iconType?: 'arrow' | 'plus';
   join?: boolean;
   multiple?: boolean;
-
   options: AccordionOption[];
+  className?: string;
 }
 
 export interface AccordionOption {
   key?: string;
-  header: React.ReactElement;
-  body: React.ReactElement;
+  header: React.ReactNode;
+  body: React.ReactNode;
 }
diff --git a/src/ui/components/display/avatar-group/avatar-group.component.tsx b/src/ui/components/display/avatar-group/avatar-group.component.tsx
index 5e2e032..80aff4e 100644
--- a/src/ui/components/display/avatar-group/avatar-group.component.tsx
+++ b/src/ui/components/display/avatar-group/avatar-group.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { AvatarGroupType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const sizeClasses: Record<string, string> = {
   xs: 'w-6 h-6',
@@ -23,19 +24,22 @@ const AvatarGroup = ({
     <div
       className={cls('avatar-group -space-x-6 rtl:space-x-reverse', className)}
     >
-      {visibleAvatars.map((avatar, index) => (
-        <div key={avatar.id ?? index} className='avatar'>
-          <div className={cls('rounded-full', sizeClass)}>
-            {avatar.src ? (
-              <img src={avatar.src} alt={avatar.alt || `Avatar ${index + 1}`} />
-            ) : (
-              <div className='bg-neutral text-neutral-content flex items-center justify-center h-full w-full font-bold text-xs uppercase'>
-                {avatar.initials || 'CC'}
-              </div>
-            )}
+      {visibleAvatars.map((avatar, index) => {
+        const safeSrc = avatar.src ? sanitizeUrl(avatar.src, '') : '';
+        return (
+          <div key={avatar.id ?? index} className='avatar'>
+            <div className={cls('rounded-full', sizeClass)}>
+              {safeSrc ? (
+                <img src={safeSrc} alt={avatar.alt || `Avatar ${index + 1}`} />
+              ) : (
+                <div className='bg-neutral text-neutral-content flex items-center justify-center h-full w-full font-bold text-xs uppercase'>
+                  {avatar.initials || 'CC'}
+                </div>
+              )}
+            </div>
           </div>
-        </div>
-      ))}
+        );
+      })}
 
       {remainingCount > 0 && (
         <div className='avatar avatar-placeholder'>
diff --git a/src/ui/components/display/avatar/avatar.component.tsx b/src/ui/components/display/avatar/avatar.component.tsx
index 828d2ac..5d430fa 100644
--- a/src/ui/components/display/avatar/avatar.component.tsx
+++ b/src/ui/components/display/avatar/avatar.component.tsx
@@ -10,7 +10,8 @@ const Avatar = ({
   rounded = false,
   size = 'md',
   src,
-  withStatus = false
+  withStatus = false,
+  className
 }: AvatarType) => {
   const isUri = useMemo(() => isValidUrl(src), [src]);
 
@@ -19,7 +20,7 @@ const Avatar = ({
   return (
     <div
       data-testid='avatar'
-      className={cls('avatar', {
+      className={cls('avatar', className, {
         'avatar-online': withStatus && isOnline,
         'avatar-offline': withStatus && !isOnline,
         'avatar-placeholder': !isUri
diff --git a/src/ui/components/display/avatar/avatar.stories.tsx b/src/ui/components/display/avatar/avatar.stories.tsx
index 01c34c2..ec920dc 100644
--- a/src/ui/components/display/avatar/avatar.stories.tsx
+++ b/src/ui/components/display/avatar/avatar.stories.tsx
@@ -8,6 +8,7 @@ const imageAvatar =
 const meta: Meta<typeof Avatar> = {
   title: '@creativecodeco-ui/Display/Avatar',
   component: Avatar,
+  tags: ['autodocs'],
   argTypes: {
     src: {
       description: 'Source',
diff --git a/src/ui/components/display/avatar/avatar.types.ts b/src/ui/components/display/avatar/avatar.types.ts
index 9bdd66a..51cff7a 100644
--- a/src/ui/components/display/avatar/avatar.types.ts
+++ b/src/ui/components/display/avatar/avatar.types.ts
@@ -7,4 +7,5 @@ export interface AvatarType {
   isOnline?: boolean;
   rounded?: boolean;
   ring?: boolean;
+  className?: string;
 }
diff --git a/src/ui/components/display/badge/badge.component.tsx b/src/ui/components/display/badge/badge.component.tsx
index edd4e4a..76eec4d 100644
--- a/src/ui/components/display/badge/badge.component.tsx
+++ b/src/ui/components/display/badge/badge.component.tsx
@@ -9,7 +9,8 @@ const Badge = ({
   icon: Icon,
   iconPosition = 'left',
   outline,
-  size = 'md'
+  size = 'md',
+  className
 }: BadgeType) => {
   const newIcon = useMemo(() => {
     if (!Icon) {
@@ -21,7 +22,7 @@ const Badge = ({
 
   return (
     <div
-      className={cls('badge', {
+      className={cls('badge', className, {
         [`badge-color-${color}`]: !outline && color,
         [`badge-${color}`]: outline && color,
         'badge-outline': outline,
diff --git a/src/ui/components/display/badge/badge.stories.tsx b/src/ui/components/display/badge/badge.stories.tsx
index 862baec..745a9af 100644
--- a/src/ui/components/display/badge/badge.stories.tsx
+++ b/src/ui/components/display/badge/badge.stories.tsx
@@ -7,6 +7,7 @@ import Badge from './badge.component';
 const meta: Meta<typeof Badge> = {
   title: '@creativecodeco-ui/Display/Badge',
   component: Badge,
+  tags: ['autodocs'],
   argTypes: {
     color: {
       description: 'Color',
diff --git a/src/ui/components/display/badge/badge.types.ts b/src/ui/components/display/badge/badge.types.ts
index a782d24..1379516 100644
--- a/src/ui/components/display/badge/badge.types.ts
+++ b/src/ui/components/display/badge/badge.types.ts
@@ -9,4 +9,5 @@ export interface BadgeType {
   size?: SizeType;
   icon?: IconType;
   iconPosition?: PositionType;
+  className?: string;
 }
diff --git a/src/ui/components/display/button/button.component.tsx b/src/ui/components/display/button/button.component.tsx
index 3f4d07d..0f61500 100644
--- a/src/ui/components/display/button/button.component.tsx
+++ b/src/ui/components/display/button/button.component.tsx
@@ -18,6 +18,7 @@ const Button = forwardRef<ButtonRef, ButtonType>(
       loading,
       loadingLabel,
       type = 'button',
+      className,
       ...otherProps
     },
     ref
@@ -55,7 +56,7 @@ const Button = forwardRef<ButtonRef, ButtonType>(
       <button
         ref={ref}
         type={type}
-        className={cls('btn', {
+        className={cls('btn', className, {
           'button-link': isLink,
           'btn-outline': !isLink && outline,
           [`btn-${color}`]: outline && color,
diff --git a/src/ui/components/display/button/button.stories.tsx b/src/ui/components/display/button/button.stories.tsx
index f49b6fb..5bdf069 100644
--- a/src/ui/components/display/button/button.stories.tsx
+++ b/src/ui/components/display/button/button.stories.tsx
@@ -10,6 +10,7 @@ import Button from './button.component';
 const meta: Meta<typeof Button> = {
   title: '@creativecodeco-ui/Display/Button',
   component: Button,
+  tags: ['autodocs'],
   argTypes: {
     isLink: {
       description: 'Is Link',
diff --git a/src/ui/components/display/card/card.component.tsx b/src/ui/components/display/card/card.component.tsx
index dac576f..ce49156 100644
--- a/src/ui/components/display/card/card.component.tsx
+++ b/src/ui/components/display/card/card.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { CardType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Card = ({
   children,
@@ -14,6 +15,8 @@ const Card = ({
   glass,
   className
 }: CardType) => {
+  const safeImage = image ? sanitizeUrl(image, '') : '';
+
   return (
     <div
       className={cls('card bg-base-100 shadow-xl', className, {
@@ -22,9 +25,9 @@ const Card = ({
         glass: glass
       })}
     >
-      {image && (
+      {safeImage && (
         <figure>
-          <img src={image} alt={imageAlt} />
+          <img src={safeImage} alt={imageAlt} />
         </figure>
       )}
       <div className='card-body'>
diff --git a/src/ui/components/display/carousel/carousel.component.tsx b/src/ui/components/display/carousel/carousel.component.tsx
index b526430..988cb78 100644
--- a/src/ui/components/display/carousel/carousel.component.tsx
+++ b/src/ui/components/display/carousel/carousel.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { CarouselType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Carousel = ({
   items,
@@ -30,7 +31,7 @@ const Carousel = ({
             >
               {item.src ? (
                 <img
-                  src={item.src}
+                  src={sanitizeUrl(item.src, '')}
                   alt={item.alt || `Slide ${index + 1}`}
                   className={cls({ 'w-full object-cover': fullWidth })}
                 />
diff --git a/src/ui/components/display/chat-bubble/chat-bubble.component.tsx b/src/ui/components/display/chat-bubble/chat-bubble.component.tsx
index 94083a5..cde1533 100644
--- a/src/ui/components/display/chat-bubble/chat-bubble.component.tsx
+++ b/src/ui/components/display/chat-bubble/chat-bubble.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { ChatBubbleType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const ChatBubble = ({
   message,
@@ -27,7 +28,7 @@ const ChatBubble = ({
         <div className='chat-image avatar'>
           <div className='w-10 rounded-full'>
             {typeof avatar === 'string' ? (
-              <img src={avatar} alt='Avatar' />
+              <img src={sanitizeUrl(avatar, '')} alt='Avatar' />
             ) : (
               avatar
             )}
diff --git a/src/ui/components/display/hover-gallery/hover-gallery.component.tsx b/src/ui/components/display/hover-gallery/hover-gallery.component.tsx
index 32f3aa8..76c04df 100644
--- a/src/ui/components/display/hover-gallery/hover-gallery.component.tsx
+++ b/src/ui/components/display/hover-gallery/hover-gallery.component.tsx
@@ -1,12 +1,17 @@
 import cls from 'classnames';
 
 import type { HoverGalleryType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const HoverGallery = ({ images = [], className }: HoverGalleryType) => {
   return (
     <figure className={cls('hover-gallery', className)}>
       {images.map((image, index) => (
-        <img key={image.id ?? index} src={image.src} alt={image.alt} />
+        <img
+          key={image.id ?? index}
+          src={sanitizeUrl(image.src, '')}
+          alt={image.alt}
+        />
       ))}
     </figure>
   );
diff --git a/src/ui/components/display/mask/mask.component.tsx b/src/ui/components/display/mask/mask.component.tsx
index c7405ce..26c5674 100644
--- a/src/ui/components/display/mask/mask.component.tsx
+++ b/src/ui/components/display/mask/mask.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { MaskType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Mask = ({
   shape = 'squircle',
@@ -10,9 +11,10 @@ const Mask = ({
   className
 }: MaskType) => {
   const maskClass = cls('mask', `mask-${shape}`, className);
+  const safeSrc = src ? sanitizeUrl(src, '') : '';
 
-  if (src) {
-    return <img src={src} alt={alt} className={maskClass} />;
+  if (safeSrc) {
+    return <img src={safeSrc} alt={alt} className={maskClass} />;
   }
 
   return <div className={maskClass}>{children}</div>;
diff --git a/src/ui/components/display/rating/rating.component.tsx b/src/ui/components/display/rating/rating.component.tsx
index 3f11489..fe53269 100644
--- a/src/ui/components/display/rating/rating.component.tsx
+++ b/src/ui/components/display/rating/rating.component.tsx
@@ -6,7 +6,7 @@ const Rating = ({
   value = 0,
   max = 5,
   onChange,
-  color = 'warning',
+  color = 'primary',
   size = 'md',
   half = false,
   shape = 'star-2',
@@ -19,6 +19,8 @@ const Rating = ({
 
   return (
     <div
+      role='radiogroup'
+      aria-label='Rating'
       className={cls(
         'rating',
         {
@@ -32,6 +34,7 @@ const Rating = ({
       <input
         type='radio'
         name={name}
+        aria-label='Reset rating'
         className='rating-hidden'
         checked={value === 0}
         disabled={disabled || readonly}
@@ -49,6 +52,7 @@ const Rating = ({
             type='radio'
             name={name}
             value={itemValue}
+            aria-label={`Rate ${itemValue} out of ${max}`}
             checked={value === itemValue}
             disabled={disabled || readonly}
             onChange={() => !readonly && onChange?.(itemValue)}
diff --git a/src/ui/components/display/swap/swap.component.tsx b/src/ui/components/display/swap/swap.component.tsx
index 7f944a3..3205fef 100644
--- a/src/ui/components/display/swap/swap.component.tsx
+++ b/src/ui/components/display/swap/swap.component.tsx
@@ -24,8 +24,10 @@ const Swap = ({
     >
       <input
         type='checkbox'
+        aria-label='Toggle swap state'
         checked={active}
         onChange={onChange}
+        readOnly={active !== undefined && !onChange}
         disabled={disabled}
       />
       <div className='swap-on'>{onContent}</div>
diff --git a/src/ui/components/display/timeline/timeline.component.tsx b/src/ui/components/display/timeline/timeline.component.tsx
index 1c8d523..6b7492b 100644
--- a/src/ui/components/display/timeline/timeline.component.tsx
+++ b/src/ui/components/display/timeline/timeline.component.tsx
@@ -43,7 +43,7 @@ const Timeline = ({
           <li key={key}>
             {index > 0 && <hr className={cls({ [colorClass]: item.active })} />}
             {item.date && (
-              <div className='timeline-start timeline-text-secondary font-mono text-xs'>
+              <div className='timeline-start text-secondary font-mono text-xs'>
                 {item.date}
               </div>
             )}
diff --git a/src/ui/components/feedback/alert/alert.component.tsx b/src/ui/components/feedback/alert/alert.component.tsx
index 5a218bc..044933d 100644
--- a/src/ui/components/feedback/alert/alert.component.tsx
+++ b/src/ui/components/feedback/alert/alert.component.tsx
@@ -8,7 +8,8 @@ const Alert = ({
   status = 'info',
   title,
   icon: Icon,
-  onClose
+  onClose,
+  className
 }: AlertType) => {
   const renderedIcon = useMemo(() => {
     if (!Icon) return null;
@@ -18,7 +19,7 @@ const Alert = ({
   return (
     <div
       role='alert'
-      className={cls('alert', {
+      className={cls('alert', className, {
         'alert-info': status === 'info',
         'alert-success': status === 'success',
         'alert-warning': status === 'warning',
diff --git a/src/ui/components/feedback/alert/alert.types.ts b/src/ui/components/feedback/alert/alert.types.ts
index dc5da57..5f89d81 100644
--- a/src/ui/components/feedback/alert/alert.types.ts
+++ b/src/ui/components/feedback/alert/alert.types.ts
@@ -7,4 +7,5 @@ export interface AlertType {
   title?: React.ReactNode;
   icon?: IconType;
   onClose?: () => void;
+  className?: string;
 }
diff --git a/src/ui/components/feedback/modal/modal.component.tsx b/src/ui/components/feedback/modal/modal.component.tsx
index ab22db6..0af951d 100644
--- a/src/ui/components/feedback/modal/modal.component.tsx
+++ b/src/ui/components/feedback/modal/modal.component.tsx
@@ -1,3 +1,4 @@
+import { useEffect } from 'react';
 import cls from 'classnames';
 
 import type { ModalType } from '@/types';
@@ -9,14 +10,33 @@ const Modal = ({
   children,
   actions,
   size = 'md',
-  closeOnBackdropClick = true
+  closeOnBackdropClick = true,
+  className
 }: ModalType) => {
+  useEffect(() => {
+    if (!isOpen || !onClose) return;
+
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        onClose();
+      }
+    };
+
+    document.addEventListener('keydown', handleKeyDown);
+    return () => document.removeEventListener('keydown', handleKeyDown);
+  }, [isOpen, onClose]);
+
   if (!isOpen) return null;
 
   return (
-    <dialog className='modal modal-open' open aria-modal='true'>
+    <dialog
+      className='modal modal-open'
+      open
+      aria-modal='true'
+      aria-label={typeof title === 'string' ? title : 'Modal dialog'}
+    >
       <div
-        className={cls('modal-box', {
+        className={cls('modal-box w-11/12', className, {
           'max-w-xs': size === 'xs',
           'max-w-sm': size === 'sm',
           'max-w-lg': size === 'md',
diff --git a/src/ui/components/feedback/modal/modal.test.tsx b/src/ui/components/feedback/modal/modal.test.tsx
index cbfccac..4e251b6 100644
--- a/src/ui/components/feedback/modal/modal.test.tsx
+++ b/src/ui/components/feedback/modal/modal.test.tsx
@@ -49,4 +49,15 @@ describe('<Modal />', () => {
     );
     expect(screen.getByText('Confirm')).toBeInTheDocument();
   });
+
+  it('calls onClose when Escape key is pressed', () => {
+    const handleClose = jest.fn();
+    render(
+      <Modal isOpen={true} onClose={handleClose}>
+        Modal Content
+      </Modal>
+    );
+    fireEvent.keyDown(document, { key: 'Escape' });
+    expect(handleClose).toHaveBeenCalledTimes(1);
+  });
 });
diff --git a/src/ui/components/feedback/modal/modal.types.ts b/src/ui/components/feedback/modal/modal.types.ts
index 9cdad60..c3e63b0 100644
--- a/src/ui/components/feedback/modal/modal.types.ts
+++ b/src/ui/components/feedback/modal/modal.types.ts
@@ -8,4 +8,5 @@ export interface ModalType {
   actions?: React.ReactNode;
   size?: SizeType;
   closeOnBackdropClick?: boolean;
+  className?: string;
 }
diff --git a/src/ui/components/feedback/progress/progress.component.tsx b/src/ui/components/feedback/progress/progress.component.tsx
index f28441a..a9d5249 100644
--- a/src/ui/components/feedback/progress/progress.component.tsx
+++ b/src/ui/components/feedback/progress/progress.component.tsx
@@ -13,8 +13,9 @@ const Progress = ({
     <progress
       value={value}
       max={max}
+      aria-label='Progress'
       className={cls(
-        'progress',
+        'progress w-full',
         {
           [`progress-${color}`]: Boolean(color),
           [`progress-${size}`]: Boolean(size)
diff --git a/src/ui/components/feedback/toast/toast.component.tsx b/src/ui/components/feedback/toast/toast.component.tsx
index 0b57aeb..9a2970b 100644
--- a/src/ui/components/feedback/toast/toast.component.tsx
+++ b/src/ui/components/feedback/toast/toast.component.tsx
@@ -2,10 +2,17 @@ import cls from 'classnames';
 
 import type { ToastType } from '@/types';
 
-const Toast = ({ children, position = 'bottom-end', color }: ToastType) => {
+const Toast = ({
+  children,
+  position = 'bottom-end',
+  color,
+  className
+}: ToastType) => {
   return (
     <div
-      className={cls('toast', {
+      role='status'
+      aria-live='polite'
+      className={cls('toast', className, {
         'toast-start': position.endsWith('-start'),
         'toast-center': position.endsWith('-center'),
         'toast-end': position.endsWith('-end'),
diff --git a/src/ui/components/feedback/toast/toast.types.ts b/src/ui/components/feedback/toast/toast.types.ts
index 864606b..54ef143 100644
--- a/src/ui/components/feedback/toast/toast.types.ts
+++ b/src/ui/components/feedback/toast/toast.types.ts
@@ -12,4 +12,5 @@ export interface ToastType {
   children: React.ReactNode;
   position?: ToastPositionType;
   color?: ColorType;
+  className?: string;
 }
diff --git a/src/ui/components/feedback/tooltip/tooltip.component.tsx b/src/ui/components/feedback/tooltip/tooltip.component.tsx
index 531ec2c..da3da99 100644
--- a/src/ui/components/feedback/tooltip/tooltip.component.tsx
+++ b/src/ui/components/feedback/tooltip/tooltip.component.tsx
@@ -7,12 +7,13 @@ const Tooltip = ({
   content,
   position = 'top',
   color,
-  open
+  open,
+  className
 }: TooltipType) => {
   return (
     <div
       data-tip={typeof content === 'string' ? content : undefined}
-      className={cls('tooltip', {
+      className={cls('tooltip', className, {
         'tooltip-top': position === 'top',
         'tooltip-bottom': position === 'bottom',
         'tooltip-left': position === 'left',
diff --git a/src/ui/components/feedback/tooltip/tooltip.types.ts b/src/ui/components/feedback/tooltip/tooltip.types.ts
index 99b9117..1b0e71f 100644
--- a/src/ui/components/feedback/tooltip/tooltip.types.ts
+++ b/src/ui/components/feedback/tooltip/tooltip.types.ts
@@ -6,4 +6,5 @@ export interface TooltipType {
   position?: 'top' | 'bottom' | 'left' | 'right';
   color?: ColorType;
   open?: boolean;
+  className?: string;
 }
diff --git a/src/ui/components/layout/collapse/collapse.component.tsx b/src/ui/components/layout/collapse/collapse.component.tsx
index 058ff3f..4c7966b 100644
--- a/src/ui/components/layout/collapse/collapse.component.tsx
+++ b/src/ui/components/layout/collapse/collapse.component.tsx
@@ -21,7 +21,13 @@ const Collapse = ({
         className
       )}
     >
-      <input type='checkbox' checked={open} onChange={onChange} />
+      <input
+        type='checkbox'
+        aria-label={typeof title === 'string' ? title : 'Toggle collapse'}
+        checked={open}
+        onChange={onChange}
+        readOnly={open !== undefined && !onChange}
+      />
       <div className='collapse-title text-base font-medium'>{title}</div>
       <div className='collapse-content text-sm'>{children}</div>
     </div>
diff --git a/src/ui/components/layout/footer/footer.component.tsx b/src/ui/components/layout/footer/footer.component.tsx
index b329d49..7520e9b 100644
--- a/src/ui/components/layout/footer/footer.component.tsx
+++ b/src/ui/components/layout/footer/footer.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { FooterType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Footer = ({
   sections = [],
@@ -29,7 +30,7 @@ const Footer = ({
           {section.links?.map((link, linkIdx) => (
             <a
               key={link.id ?? linkIdx}
-              href={link.href}
+              href={link.href ? sanitizeUrl(link.href) : undefined}
               onClick={link.onClick}
               className='link link-hover'
             >
diff --git a/src/ui/components/layout/hero/hero.component.tsx b/src/ui/components/layout/hero/hero.component.tsx
index 84ea147..7f722f0 100644
--- a/src/ui/components/layout/hero/hero.component.tsx
+++ b/src/ui/components/layout/hero/hero.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { HeroType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Hero = ({
   title,
@@ -11,17 +12,20 @@ const Hero = ({
   children,
   className
 }: HeroType) => {
-  const bgStyle =
+  const safeImage =
     typeof image === 'string'
-      ? { backgroundImage: `url(${image})` }
-      : undefined;
+      ? sanitizeUrl(image, '').replace(/["'()\\]/g, '')
+      : '';
+  const bgStyle = safeImage
+    ? { backgroundImage: `url("${safeImage}")` }
+    : undefined;
 
   return (
     <div
       className={cls('hero min-h-64 rounded-xl overflow-hidden', className)}
       style={bgStyle}
     >
-      {overlay && <div className='hero-overlay bg-opacity-60 bg-black' />}
+      {overlay && <div className='hero-overlay bg-neutral/60' />}
       <div
         className={cls('hero-content text-center', {
           'text-neutral-content': overlay
diff --git a/src/ui/components/navigation/action-dropdown/action-dropdown.component.tsx b/src/ui/components/navigation/action-dropdown/action-dropdown.component.tsx
index b205f3b..032e544 100644
--- a/src/ui/components/navigation/action-dropdown/action-dropdown.component.tsx
+++ b/src/ui/components/navigation/action-dropdown/action-dropdown.component.tsx
@@ -30,6 +30,8 @@ const ActionDropdown = ({
       <div
         tabIndex={0}
         role='button'
+        aria-haspopup='true'
+        aria-expanded={open}
         className={cls('btn', {
           [`btn-${color}`]: Boolean(color),
           [`btn-${size}`]: Boolean(size)
diff --git a/src/ui/components/navigation/breadcrumb/breadcrumb.component.tsx b/src/ui/components/navigation/breadcrumb/breadcrumb.component.tsx
index 145b4d7..3a70cb2 100644
--- a/src/ui/components/navigation/breadcrumb/breadcrumb.component.tsx
+++ b/src/ui/components/navigation/breadcrumb/breadcrumb.component.tsx
@@ -1,8 +1,14 @@
+import cls from 'classnames';
+
 import type { BreadcrumbType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
-const Breadcrumb = ({ items }: BreadcrumbType) => {
+const Breadcrumb = ({ items, className }: BreadcrumbType) => {
   return (
-    <nav aria-label='Breadcrumb' className='text-sm breadcrumbs'>
+    <nav
+      aria-label='Breadcrumb'
+      className={cls('text-sm breadcrumbs', className)}
+    >
       <ul>
         {items.map((item, index) => {
           const Icon = item.icon;
@@ -12,9 +18,13 @@ const Breadcrumb = ({ items }: BreadcrumbType) => {
                 item.href ||
                 (typeof item.label === 'string' ? item.label : index)
               }
+              aria-current={index === items.length - 1 ? 'page' : undefined}
             >
               {item.href ? (
-                <a href={item.href} className='inline-flex items-center gap-2'>
+                <a
+                  href={sanitizeUrl(item.href)}
+                  className='inline-flex items-center gap-2'
+                >
                   {Icon && <Icon className='stroke-current w-4 h-4' />}
                   {item.label}
                 </a>
diff --git a/src/ui/components/navigation/breadcrumb/breadcrumb.types.ts b/src/ui/components/navigation/breadcrumb/breadcrumb.types.ts
index c032c16..0a4a0d0 100644
--- a/src/ui/components/navigation/breadcrumb/breadcrumb.types.ts
+++ b/src/ui/components/navigation/breadcrumb/breadcrumb.types.ts
@@ -8,4 +8,5 @@ export interface BreadcrumbItem {
 
 export interface BreadcrumbType {
   items: BreadcrumbItem[];
+  className?: string;
 }
diff --git a/src/ui/components/navigation/drawer/drawer.component.tsx b/src/ui/components/navigation/drawer/drawer.component.tsx
index 223ca9f..bb0fd51 100644
--- a/src/ui/components/navigation/drawer/drawer.component.tsx
+++ b/src/ui/components/navigation/drawer/drawer.component.tsx
@@ -1,3 +1,4 @@
+import { useEffect } from 'react';
 import cls from 'classnames';
 
 import type { DrawerType } from '@/types';
@@ -10,6 +11,19 @@ const Drawer = ({
   side = 'left',
   className
 }: DrawerType) => {
+  useEffect(() => {
+    if (!isOpen || !onClose) return;
+
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        onClose();
+      }
+    };
+
+    document.addEventListener('keydown', handleKeyDown);
+    return () => document.removeEventListener('keydown', handleKeyDown);
+  }, [isOpen, onClose]);
+
   return (
     <div
       className={cls('drawer', className, {
@@ -32,7 +46,7 @@ const Drawer = ({
           data-testid='drawer-overlay'
           aria-label='Close drawer overlay'
         />
-        <div className='menu p-4 w-80 min-h-full bg-base-200 text-base-content'>
+        <div className='menu p-4 w-80 max-w-[85vw] min-h-full bg-base-200 text-base-content'>
           <div className='flex justify-between items-center mb-4'>
             {title && <h3 className='font-bold text-lg'>{title}</h3>}
             <button
diff --git a/src/ui/components/navigation/drawer/drawer.test.tsx b/src/ui/components/navigation/drawer/drawer.test.tsx
index 6c8838b..7a13e5c 100644
--- a/src/ui/components/navigation/drawer/drawer.test.tsx
+++ b/src/ui/components/navigation/drawer/drawer.test.tsx
@@ -36,4 +36,15 @@ describe('<Drawer />', () => {
     fireEvent.click(screen.getByTestId('drawer-overlay'));
     expect(handleClose).toHaveBeenCalledTimes(1);
   });
+
+  it('calls onClose when Escape key is pressed', () => {
+    const handleClose = jest.fn();
+    render(
+      <Drawer isOpen={true} onClose={handleClose}>
+        Content
+      </Drawer>
+    );
+    fireEvent.keyDown(document, { key: 'Escape' });
+    expect(handleClose).toHaveBeenCalledTimes(1);
+  });
 });
diff --git a/src/ui/components/navigation/link/link.component.tsx b/src/ui/components/navigation/link/link.component.tsx
index 88461e8..ad45367 100644
--- a/src/ui/components/navigation/link/link.component.tsx
+++ b/src/ui/components/navigation/link/link.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { LinkType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const Link = ({
   children,
@@ -12,11 +13,18 @@ const Link = ({
   onClick,
   className
 }: LinkType) => {
+  const safeRel =
+    target === '_blank'
+      ? Array.from(
+          new Set([...(rel ? rel.split(/\s+/) : []), 'noopener', 'noreferrer'])
+        ).join(' ')
+      : rel;
+
   return (
     <a
-      href={href}
+      href={sanitizeUrl(href)}
       target={target}
-      rel={target === '_blank' ? (rel ?? 'noopener noreferrer') : rel}
+      rel={safeRel}
       onClick={onClick}
       className={cls(
         'link',
diff --git a/src/ui/components/navigation/mega-menu/mega-menu.component.tsx b/src/ui/components/navigation/mega-menu/mega-menu.component.tsx
index dd36697..70649b3 100644
--- a/src/ui/components/navigation/mega-menu/mega-menu.component.tsx
+++ b/src/ui/components/navigation/mega-menu/mega-menu.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { MegaMenuType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const MegaMenu = ({
   items = [],
@@ -28,6 +29,7 @@ const MegaMenu = ({
           <div
             tabIndex={0}
             role='button'
+            aria-haspopup='true'
             className={cls('btn btn-ghost', {
               'megamenu-active': item.active
             })}
@@ -36,7 +38,7 @@ const MegaMenu = ({
           </div>
           <div
             tabIndex={0}
-            className='dropdown-content bg-base-100 rounded-box z-10 p-6 shadow-lg border border-base-200 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6 min-w-max'
+            className='dropdown-content bg-base-100 rounded-box z-10 p-6 shadow-lg border border-base-200 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6 w-screen max-w-md sm:max-w-2xl md:min-w-max'
           >
             {item.columns.map((col, colIdx) => (
               <div key={col.id ?? colIdx}>
@@ -49,7 +51,7 @@ const MegaMenu = ({
                   {col.links.map((link, linkIdx) => (
                     <li key={link.id ?? linkIdx}>
                       <a
-                        href={link.href ?? '#'}
+                        href={sanitizeUrl(link.href ?? '#')}
                         onClick={link.onClick}
                         className='flex flex-col items-start'
                       >
diff --git a/src/ui/components/navigation/menu/menu.component.tsx b/src/ui/components/navigation/menu/menu.component.tsx
index 848d14d..c542675 100644
--- a/src/ui/components/navigation/menu/menu.component.tsx
+++ b/src/ui/components/navigation/menu/menu.component.tsx
@@ -1,6 +1,7 @@
 import cls from 'classnames';
 
 import type { MenuItemType, MenuType } from '@/types';
+import { sanitizeUrl } from '@/utils';
 
 const renderMenuItem = (item: MenuItemType, index: number) => {
   const key = item.id ?? index;
@@ -39,7 +40,7 @@ const renderMenuItem = (item: MenuItemType, index: number) => {
   } else if (item.href) {
     content = (
       <a
-        href={item.href}
+        href={sanitizeUrl(item.href)}
         onClick={item.onClick}
         className={cls({
           active: item.active,
diff --git a/src/ui/components/navigation/pagination/pagination.component.tsx b/src/ui/components/navigation/pagination/pagination.component.tsx
index 327e4a4..c36c99e 100644
--- a/src/ui/components/navigation/pagination/pagination.component.tsx
+++ b/src/ui/components/navigation/pagination/pagination.component.tsx
@@ -6,12 +6,13 @@ const Pagination = ({
   currentPage,
   totalPages,
   onPageChange,
-  size = 'md'
+  size = 'md',
+  className
 }: PaginationType) => {
   const pages = Array.from({ length: totalPages }, (_, i) => i + 1);
 
   return (
-    <nav aria-label='Pagination' className='join'>
+    <nav aria-label='Pagination' className={cls('join flex-wrap', className)}>
       <button
         type='button'
         className={cls('join-item btn', {
@@ -31,6 +32,7 @@ const Pagination = ({
         <button
           type='button'
           key={page}
+          aria-label={`Page ${page}`}
           aria-current={page === currentPage ? 'page' : undefined}
           className={cls('join-item btn', {
             'btn-active': page === currentPage,
diff --git a/src/ui/components/navigation/pagination/pagination.types.ts b/src/ui/components/navigation/pagination/pagination.types.ts
index d4aaebc..6383225 100644
--- a/src/ui/components/navigation/pagination/pagination.types.ts
+++ b/src/ui/components/navigation/pagination/pagination.types.ts
@@ -5,4 +5,5 @@ export interface PaginationType {
   totalPages: number;
   onPageChange: (page: number) => void;
   size?: SizeType;
+  className?: string;
 }
diff --git a/src/ui/components/navigation/steps/steps.component.tsx b/src/ui/components/navigation/steps/steps.component.tsx
index 5e878b3..52fcbd0 100644
--- a/src/ui/components/navigation/steps/steps.component.tsx
+++ b/src/ui/components/navigation/steps/steps.component.tsx
@@ -2,10 +2,15 @@ import cls from 'classnames';
 
 import type { StepsType } from '@/types';
 
-const Steps = ({ items, activeStep = 0, vertical = false }: StepsType) => {
+const Steps = ({
+  items,
+  activeStep = 0,
+  vertical = false,
+  className
+}: StepsType) => {
   return (
     <ul
-      className={cls('steps', {
+      className={cls('steps overflow-x-auto', className, {
         'steps-vertical': vertical,
         'steps-horizontal': !vertical
       })}
@@ -20,6 +25,7 @@ const Steps = ({ items, activeStep = 0, vertical = false }: StepsType) => {
                 ? item.title
                 : index)
             }
+            aria-current={index === activeStep ? 'step' : undefined}
             data-content={item.icon ? undefined : index + 1}
             className={cls('step', {
               'step-primary': isPrimary,
diff --git a/src/ui/components/navigation/steps/steps.types.ts b/src/ui/components/navigation/steps/steps.types.ts
index acd34b5..d81fa79 100644
--- a/src/ui/components/navigation/steps/steps.types.ts
+++ b/src/ui/components/navigation/steps/steps.types.ts
@@ -11,4 +11,5 @@ export interface StepsType {
   items: StepItem[];
   activeStep?: number;
   vertical?: boolean;
+  className?: string;
 }
diff --git a/src/ui/components/navigation/tabs/tabs.component.tsx b/src/ui/components/navigation/tabs/tabs.component.tsx
index c8deafe..344d309 100644
--- a/src/ui/components/navigation/tabs/tabs.component.tsx
+++ b/src/ui/components/navigation/tabs/tabs.component.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import cls from 'classnames';
 
 import type { TabsType } from '@/types';
@@ -8,9 +8,11 @@ const Tabs = ({
   activeId: controlledActiveId,
   onChange,
   variant = 'bordered',
-  size = 'md'
+  size = 'md',
+  className
 }: TabsType) => {
   const [internalActiveId, setInternalActiveId] = useState(items[0]?.id || '');
+  const tabRefs = useRef<Array<HTMLButtonElement | null>>([]);
 
   const activeId = controlledActiveId ?? internalActiveId;
 
@@ -22,13 +24,46 @@ const Tabs = ({
     onChange?.(id);
   };
 
+  const handleKeyDown = (
+    event: React.KeyboardEvent<HTMLButtonElement>,
+    currentIndex: number
+  ) => {
+    const enabledIndices = items
+      .map((item, idx) => (item.disabled ? -1 : idx))
+      .filter((idx) => idx !== -1);
+
+    if (enabledIndices.length === 0) return;
+
+    const currentPos = enabledIndices.indexOf(currentIndex);
+    let nextPos = -1;
+
+    if (event.key === 'ArrowRight') {
+      nextPos = (currentPos + 1) % enabledIndices.length;
+    } else if (event.key === 'ArrowLeft') {
+      nextPos =
+        (currentPos - 1 + enabledIndices.length) % enabledIndices.length;
+    } else if (event.key === 'Home') {
+      nextPos = 0;
+    } else if (event.key === 'End') {
+      nextPos = enabledIndices.length - 1;
+    }
+
+    if (nextPos !== -1) {
+      event.preventDefault();
+      const targetIndex = enabledIndices[nextPos];
+      const targetItem = items[targetIndex];
+      handleTabClick(targetItem.id, targetItem.disabled);
+      tabRefs.current[targetIndex]?.focus();
+    }
+  };
+
   const activeItem = items.find((item) => item.id === activeId);
 
   return (
     <div>
       <div
         role='tablist'
-        className={cls('tabs', {
+        className={cls('tabs flex-wrap', className, {
           'tabs-bordered': variant === 'bordered',
           'tabs-lifted': variant === 'lifted',
           'tabs-boxed': variant === 'boxed',
@@ -38,10 +73,13 @@ const Tabs = ({
           'tabs-lg': size === 'lg'
         })}
       >
-        {items.map((item) => {
+        {items.map((item, index) => {
           const Icon = item.icon;
           return (
             <button
+              ref={(el) => {
+                tabRefs.current[index] = el;
+              }}
               type='button'
               key={item.id}
               role='tab'
@@ -51,6 +89,7 @@ const Tabs = ({
                 'tab-disabled': item.disabled
               })}
               onClick={() => handleTabClick(item.id, item.disabled)}
+              onKeyDown={(e) => handleKeyDown(e, index)}
               disabled={item.disabled}
             >
               {Icon && <Icon className='mr-2 inline-block h-4 w-4' />}
@@ -60,7 +99,7 @@ const Tabs = ({
         })}
       </div>
       {activeItem?.content && (
-        <div className='py-4' data-testid='tab-content'>
+        <div className='py-4' role='tabpanel' data-testid='tab-content'>
           {activeItem.content}
         </div>
       )}
diff --git a/src/ui/components/navigation/tabs/tabs.test.tsx b/src/ui/components/navigation/tabs/tabs.test.tsx
index 4c7a072..f6ada27 100644
--- a/src/ui/components/navigation/tabs/tabs.test.tsx
+++ b/src/ui/components/navigation/tabs/tabs.test.tsx
@@ -37,4 +37,23 @@ describe('<Tabs />', () => {
     expect(handleChange).not.toHaveBeenCalled();
     expect(screen.getByText('Content 1')).toBeInTheDocument();
   });
+
+  it('supports keyboard navigation (ArrowRight, ArrowLeft, Home, End)', () => {
+    const handleChange = jest.fn();
+    render(<Tabs items={items} onChange={handleChange} />);
+    const firstTab = screen.getByText('Tab One');
+    const secondTab = screen.getByText('Tab Two');
+
+    fireEvent.keyDown(firstTab, { key: 'ArrowRight' });
+    expect(handleChange).toHaveBeenLastCalledWith('tab2');
+
+    fireEvent.keyDown(secondTab, { key: 'ArrowLeft' });
+    expect(handleChange).toHaveBeenLastCalledWith('tab1');
+
+    fireEvent.keyDown(firstTab, { key: 'End' });
+    expect(handleChange).toHaveBeenLastCalledWith('tab2');
+
+    fireEvent.keyDown(secondTab, { key: 'Home' });
+    expect(handleChange).toHaveBeenLastCalledWith('tab1');
+  });
 });
diff --git a/src/ui/components/navigation/tabs/tabs.types.ts b/src/ui/components/navigation/tabs/tabs.types.ts
index bef969a..4ddedba 100644
--- a/src/ui/components/navigation/tabs/tabs.types.ts
+++ b/src/ui/components/navigation/tabs/tabs.types.ts
@@ -15,4 +15,5 @@ export interface TabsType {
   onChange?: (id: string) => void;
   variant?: 'bordered' | 'lifted' | 'boxed';
   size?: SizeType;
+  className?: string;
 }
diff --git a/src/ui/forms/calendar/calendar.component.tsx b/src/ui/forms/calendar/calendar.component.tsx
index b944696..e627636 100644
--- a/src/ui/forms/calendar/calendar.component.tsx
+++ b/src/ui/forms/calendar/calendar.component.tsx
@@ -83,7 +83,7 @@ const Calendar = ({
   return (
     <div
       className={cls(
-        'cally bg-base-100 border border-base-300 shadow-lg rounded-box p-4 w-72',
+        'cally bg-base-100 border border-base-300 shadow-lg rounded-box p-4 w-72 max-w-full',
         className
       )}
       role='group'
diff --git a/src/ui/forms/calendar/calendar.test.tsx b/src/ui/forms/calendar/calendar.test.tsx
index 16bd547..0e16a98 100644
--- a/src/ui/forms/calendar/calendar.test.tsx
+++ b/src/ui/forms/calendar/calendar.test.tsx
@@ -30,5 +30,16 @@ describe('<Calendar />', () => {
 
     fireEvent.click(screen.getByRole('button', { name: 'Next month' }));
     expect(screen.getByText('January 2026')).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole('button', { name: 'Next month' }));
+    expect(screen.getByText('February 2026')).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole('button', { name: 'Previous month' }));
+    expect(screen.getByText('January 2026')).toBeInTheDocument();
+  });
+
+  it('defaults to current date when value is omitted', () => {
+    render(<Calendar />);
+    expect(screen.getByRole('group', { name: 'Calendar' })).toBeInTheDocument();
   });
 });
diff --git a/src/ui/forms/checkbox/__snapshots__/checkbox.test.tsx.snap b/src/ui/forms/checkbox/__snapshots__/checkbox.test.tsx.snap
index 18bef3b..22c1430 100644
--- a/src/ui/forms/checkbox/__snapshots__/checkbox.test.tsx.snap
+++ b/src/ui/forms/checkbox/__snapshots__/checkbox.test.tsx.snap
@@ -45,7 +45,7 @@ exports[`<Checkbox /> snapshot full props 1`] = `
         type="checkbox"
       />
       <p
-        class="text-red-500"
+        class="text-error"
       >
         Error test
       </p>
diff --git a/src/ui/forms/checkbox/checkbox.component.tsx b/src/ui/forms/checkbox/checkbox.component.tsx
index 8e059a2..9c2e450 100644
--- a/src/ui/forms/checkbox/checkbox.component.tsx
+++ b/src/ui/forms/checkbox/checkbox.component.tsx
@@ -17,6 +17,7 @@ const Checkbox = forwardRef<CheckboxRef, CheckboxType>(
       checked,
       value,
       onChange,
+      className,
       ...otherProps
     },
     ref
@@ -36,7 +37,7 @@ const Checkbox = forwardRef<CheckboxRef, CheckboxType>(
         data-testid={name}
         ref={ref}
         type='checkbox'
-        className={cls('checkbox', {
+        className={cls('checkbox', className, {
           [`checkbox-color-${color}`]: color,
           [`checkbox-size-${size}`]: size
         })}
@@ -59,7 +60,7 @@ const Checkbox = forwardRef<CheckboxRef, CheckboxType>(
           {position === 'left' && checkbox()}
           {label && <span className='label-text'>{label}</span>}
           {position === 'right' && checkbox()}
-          {isError && <p className='text-red-500'>{error}</p>}
+          {isError && <p className='text-error'>{error}</p>}
         </label>
       </div>
     );
diff --git a/src/ui/forms/checkbox/checkbox.stories.tsx b/src/ui/forms/checkbox/checkbox.stories.tsx
index 8d29eb8..d8bd253 100644
--- a/src/ui/forms/checkbox/checkbox.stories.tsx
+++ b/src/ui/forms/checkbox/checkbox.stories.tsx
@@ -5,6 +5,7 @@ import Checkbox from './checkbox.component';
 const meta: Meta<typeof Checkbox> = {
   title: '@creativecodeco-ui/Form/Checkbox',
   component: Checkbox,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Unique Name',
diff --git a/src/ui/forms/checkbox/checkbox.types.ts b/src/ui/forms/checkbox/checkbox.types.ts
index 5f4664a..c86baaf 100644
--- a/src/ui/forms/checkbox/checkbox.types.ts
+++ b/src/ui/forms/checkbox/checkbox.types.ts
@@ -20,6 +20,7 @@ export interface CheckboxType extends CheckboxItemType, ErrorType {
   disabled?: boolean;
 
   onChange?: (value: CheckboxItemType) => void;
+  className?: string;
 }
 
 export type CheckboxRef = HTMLInputElement;
diff --git a/src/ui/forms/dropdown/__snapshots__/dropdown.test.tsx.snap b/src/ui/forms/dropdown/__snapshots__/dropdown.test.tsx.snap
index 5c31308..23a7f75 100644
--- a/src/ui/forms/dropdown/__snapshots__/dropdown.test.tsx.snap
+++ b/src/ui/forms/dropdown/__snapshots__/dropdown.test.tsx.snap
@@ -86,7 +86,7 @@ exports[`<Dropdown /> snapshot full 1`] = `
         </svg>
       </div>
       <p
-        class="text-red-500 flex items-center"
+        class="text-error flex items-center"
       >
         Error
       </p>
diff --git a/src/ui/forms/dropdown/dropdown.component.tsx b/src/ui/forms/dropdown/dropdown.component.tsx
index 12bcb4d..c404707 100644
--- a/src/ui/forms/dropdown/dropdown.component.tsx
+++ b/src/ui/forms/dropdown/dropdown.component.tsx
@@ -6,6 +6,7 @@ import React, {
   useRef,
   useState
 } from 'react';
+import cls from 'classnames';
 import { FaSortDown } from 'react-icons/fa';
 import { useOnClickOutside } from 'usehooks-ts';
 
@@ -21,6 +22,7 @@ const Dropdown = forwardRef<TextBoxRef, DropdownType>(
       onChange,
       onTextChange,
       value,
+      className,
       ...otherProps
     },
     ref
@@ -98,7 +100,7 @@ const Dropdown = forwardRef<TextBoxRef, DropdownType>(
     );
 
     return (
-      <div className='block dropdown'>
+      <div className={cls('block dropdown', className)}>
         <TextBox
           name={name}
           tabIndex={0}
diff --git a/src/ui/forms/dropdown/dropdown.stories.tsx b/src/ui/forms/dropdown/dropdown.stories.tsx
index c5e9f51..967c6c5 100644
--- a/src/ui/forms/dropdown/dropdown.stories.tsx
+++ b/src/ui/forms/dropdown/dropdown.stories.tsx
@@ -6,6 +6,7 @@ import Dropdown from './dropdown.component';
 const meta: Meta<typeof Dropdown> = {
   title: '@creativecodeco-ui/Form/Dropdown',
   component: Dropdown,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Unique Name',
diff --git a/src/ui/forms/dropdown/dropdown.types.ts b/src/ui/forms/dropdown/dropdown.types.ts
index e685575..3dbf999 100644
--- a/src/ui/forms/dropdown/dropdown.types.ts
+++ b/src/ui/forms/dropdown/dropdown.types.ts
@@ -1,4 +1,4 @@
-import type { TextBoxType } from '../textbox/textbox.types';
+import type { TextBoxType } from '@/types';
 
 export interface DropdownOption {
   value: string | number;
diff --git a/src/ui/forms/file-input/file-input.component.tsx b/src/ui/forms/file-input/file-input.component.tsx
index 3d7b213..8710c43 100644
--- a/src/ui/forms/file-input/file-input.component.tsx
+++ b/src/ui/forms/file-input/file-input.component.tsx
@@ -1,39 +1,56 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { FileInputType } from '@/types';
 
-const FileInput = ({
-  label,
-  error,
-  color,
-  size = 'md',
-  bordered = true,
-  className,
-  ...restProps
-}: FileInputType) => {
-  return (
-    <div className='form-control w-full'>
-      {label && (
-        <label className='label'>
-          <span className='label-text'>{label}</span>
-        </label>
-      )}
-      <input
-        type='file'
-        className={cls('file-input w-full', className, {
-          'file-input-bordered': bordered,
-          [`file-input-${color}`]: color,
-          'file-input-xs': size === 'xs',
-          'file-input-sm': size === 'sm',
-          'file-input-md': size === 'md',
-          'file-input-lg': size === 'lg',
-          'file-input-error': Boolean(error)
-        })}
-        {...restProps}
-      />
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+const FileInput = forwardRef<HTMLInputElement, FileInputType>(
+  (
+    {
+      label,
+      isError,
+      error,
+      color,
+      size = 'md',
+      bordered = true,
+      className,
+      id,
+      ...restProps
+    },
+    ref
+  ) => {
+    return (
+      <div className='form-control w-full'>
+        {label && (
+          <label className='label' htmlFor={id}>
+            <span className='label-text'>{label}</span>
+          </label>
+        )}
+        <input
+          ref={ref}
+          id={id}
+          type='file'
+          aria-invalid={Boolean(isError || error) || undefined}
+          className={cls('file-input w-full', className, {
+            'file-input-bordered': bordered,
+            [`file-input-${color}`]: color,
+            'file-input-xs': size === 'xs',
+            'file-input-sm': size === 'sm',
+            'file-input-md': size === 'md',
+            'file-input-lg': size === 'lg',
+            'file-input-error': Boolean(isError || error)
+          })}
+          {...restProps}
+        />
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
+        )}
+      </div>
+    );
+  }
+);
+
+FileInput.displayName = 'FileInput';
 
 export default FileInput;
diff --git a/src/ui/forms/file-input/file-input.types.ts b/src/ui/forms/file-input/file-input.types.ts
index ab4f425..5abe7e5 100644
--- a/src/ui/forms/file-input/file-input.types.ts
+++ b/src/ui/forms/file-input/file-input.types.ts
@@ -1,11 +1,8 @@
-import type { ColorType, SizeType } from '@/types';
+import type { ColorType, ErrorType, SizeType } from '@/types';
 
-export interface FileInputType extends Omit<
-  React.InputHTMLAttributes<HTMLInputElement>,
-  'size'
-> {
+export interface FileInputType
+  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>, ErrorType {
   label?: string;
-  error?: string;
   color?: ColorType;
   size?: SizeType;
   bordered?: boolean;
diff --git a/src/ui/forms/otp/otp.component.tsx b/src/ui/forms/otp/otp.component.tsx
index 6e5bd85..bc09766 100644
--- a/src/ui/forms/otp/otp.component.tsx
+++ b/src/ui/forms/otp/otp.component.tsx
@@ -1,56 +1,72 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { OtpType } from '@/types';
 
-const Otp = ({
-  length = 6,
-  value,
-  onChange,
-  color,
-  size = 'md',
-  joined = false,
-  disabled = false,
-  label,
-  error,
-  name,
-  id,
-  className
-}: OtpType) => {
-  const slots = Array.from({ length }, (_, idx) => idx);
+const Otp = forwardRef<HTMLInputElement, OtpType>(
+  (
+    {
+      length = 6,
+      value,
+      onChange,
+      color,
+      size = 'md',
+      joined = false,
+      disabled = false,
+      label,
+      isError,
+      error,
+      name,
+      id,
+      className
+    },
+    ref
+  ) => {
+    const slots = Array.from({ length }, (_, idx) => idx);
 
-  return (
-    <div className={cls('form-control', className)}>
-      {label && (
-        <label className='label' htmlFor={id}>
-          <span className='label-text'>{label}</span>
+    return (
+      <div className={cls('form-control', className)}>
+        {label && (
+          <label className='label' htmlFor={id}>
+            <span className='label-text'>{label}</span>
+          </label>
+        )}
+        <label
+          className={cls('otp', {
+            [`otp-${color}`]: Boolean(color),
+            [`otp-${size}`]: Boolean(size),
+            'otp-joined': joined,
+            'otp-error': Boolean(isError || error)
+          })}
+        >
+          <input
+            ref={ref}
+            id={id}
+            name={name}
+            type='text'
+            inputMode='numeric'
+            autoComplete='one-time-code'
+            maxLength={length}
+            value={value}
+            disabled={disabled}
+            aria-label={label ?? 'One-time password'}
+            aria-invalid={Boolean(isError || error) || undefined}
+            onChange={(e) => onChange?.(e.target.value)}
+          />
+          {slots.map((slot) => (
+            <span key={slot} aria-hidden='true' />
+          ))}
         </label>
-      )}
-      <label
-        className={cls('otp', {
-          [`otp-${color}`]: Boolean(color),
-          [`otp-${size}`]: Boolean(size),
-          'otp-joined': joined,
-          'otp-error': Boolean(error)
-        })}
-      >
-        <input
-          id={id}
-          name={name}
-          type='text'
-          inputMode='numeric'
-          maxLength={length}
-          value={value}
-          disabled={disabled}
-          aria-label={label ?? 'One-time password'}
-          onChange={(e) => onChange?.(e.target.value)}
-        />
-        {slots.map((slot) => (
-          <span key={slot} aria-hidden='true' />
-        ))}
-      </label>
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
+        )}
+      </div>
+    );
+  }
+);
+
+Otp.displayName = 'Otp';
 
 export default Otp;
diff --git a/src/ui/forms/otp/otp.types.ts b/src/ui/forms/otp/otp.types.ts
index 3d734a3..887e585 100644
--- a/src/ui/forms/otp/otp.types.ts
+++ b/src/ui/forms/otp/otp.types.ts
@@ -1,6 +1,6 @@
-import type { ColorType, SizeType } from '@/types';
+import type { ColorType, ErrorType, SizeType } from '@/types';
 
-export interface OtpType {
+export interface OtpType extends ErrorType {
   /** Number of OTP character slots */
   length?: number;
   /** Controlled OTP string value */
@@ -17,8 +17,6 @@ export interface OtpType {
   disabled?: boolean;
   /** Optional field label */
   label?: string;
-  /** Error message */
-  error?: string;
   /** Input name attribute */
   name?: string;
   /** Input id attribute */
diff --git a/src/ui/forms/radio-list/index.ts b/src/ui/forms/radio-list/index.ts
index c7993ff..a39ee8a 100644
--- a/src/ui/forms/radio-list/index.ts
+++ b/src/ui/forms/radio-list/index.ts
@@ -1,3 +1,5 @@
 import RadioList from './radio-list.component';
 
 export { RadioList };
+export type * from './radio-list.types';
+export default RadioList;
diff --git a/src/ui/forms/radio-list/radio-list.component.tsx b/src/ui/forms/radio-list/radio-list.component.tsx
index f61d945..7a22ad3 100644
--- a/src/ui/forms/radio-list/radio-list.component.tsx
+++ b/src/ui/forms/radio-list/radio-list.component.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import cls from 'classnames';
 
 import { Radio } from '../radio';
 
@@ -10,24 +10,25 @@ const RadioList = ({
   isError,
   error,
   value,
+  className,
   ...otherOptions
 }: RadioListType) => {
   if (!options || options.length === 0) {
-    return;
+    return null;
   }
 
   return (
-    <div className='form-control'>
-      {options.map((option) => (
+    <div className={cls('form-control', className)}>
+      {options.map((option, index) => (
         <Radio
-          key={option.value}
+          key={option.value ?? index}
           name={name}
           {...option}
           {...otherOptions}
           checked={String(option.value) === String(value)}
         />
       ))}
-      {isError && <p className='text-red-500'>{error}</p>}
+      {isError && <p className='text-error'>{error}</p>}
     </div>
   );
 };
diff --git a/src/ui/forms/radio-list/radio-list.stories.tsx b/src/ui/forms/radio-list/radio-list.stories.tsx
index e75a5a4..de91b02 100644
--- a/src/ui/forms/radio-list/radio-list.stories.tsx
+++ b/src/ui/forms/radio-list/radio-list.stories.tsx
@@ -14,6 +14,7 @@ const options = Array.from({ length: 4 }).map<Omit<RadioType, 'name'>>(
 const meta: Meta<typeof RadioList> = {
   title: '@creativecodeco-ui/Form/RadioList',
   component: RadioList,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Unique Name',
diff --git a/src/ui/forms/radio-list/radio-list.types.ts b/src/ui/forms/radio-list/radio-list.types.ts
new file mode 100644
index 0000000..5eb1e0a
--- /dev/null
+++ b/src/ui/forms/radio-list/radio-list.types.ts
@@ -0,0 +1,6 @@
+import type { RadioType } from '@/types';
+
+export interface RadioListType extends RadioType {
+  options: Omit<RadioType, 'name'>[];
+  className?: string;
+}
diff --git a/src/ui/forms/radio/__snapshots__/radio.test.tsx.snap b/src/ui/forms/radio/__snapshots__/radio.test.tsx.snap
index 6809f19..c6fa6d9 100644
--- a/src/ui/forms/radio/__snapshots__/radio.test.tsx.snap
+++ b/src/ui/forms/radio/__snapshots__/radio.test.tsx.snap
@@ -45,7 +45,7 @@ exports[`<Radio /> snapshot full props 1`] = `
         type="radio"
       />
       <p
-        class="text-red-500"
+        class="text-error"
       >
         Error test
       </p>
diff --git a/src/ui/forms/radio/radio.component.tsx b/src/ui/forms/radio/radio.component.tsx
index 3781ad5..649ae62 100644
--- a/src/ui/forms/radio/radio.component.tsx
+++ b/src/ui/forms/radio/radio.component.tsx
@@ -17,6 +17,7 @@ const Radio = forwardRef<RadioRef, RadioType>(
       checked,
       value,
       onChange,
+      className,
       ...otherProps
     },
     ref
@@ -36,7 +37,7 @@ const Radio = forwardRef<RadioRef, RadioType>(
         name={name}
         data-testid={name}
         type='radio'
-        className={cls('radio', {
+        className={cls('radio', className, {
           [`radio-color-${color}`]: color,
           [`radio-size-${size}`]: size
         })}
@@ -59,7 +60,7 @@ const Radio = forwardRef<RadioRef, RadioType>(
           {position === 'left' && radio()}
           {label && <span className='label-text'>{label}</span>}
           {position === 'right' && radio()}
-          {isError && <p className='text-red-500'>{error}</p>}
+          {isError && <p className='text-error'>{error}</p>}
         </label>
       </div>
     );
diff --git a/src/ui/forms/radio/radio.stories.tsx b/src/ui/forms/radio/radio.stories.tsx
index eca442a..7186e19 100644
--- a/src/ui/forms/radio/radio.stories.tsx
+++ b/src/ui/forms/radio/radio.stories.tsx
@@ -5,6 +5,7 @@ import Radio from './radio.component';
 const meta: Meta<typeof Radio> = {
   title: '@creativecodeco-ui/Form/Radio',
   component: Radio,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Unique Name',
diff --git a/src/ui/forms/radio/radio.types.ts b/src/ui/forms/radio/radio.types.ts
index 45f61da..3dc6f1b 100644
--- a/src/ui/forms/radio/radio.types.ts
+++ b/src/ui/forms/radio/radio.types.ts
@@ -19,10 +19,7 @@ export interface RadioType extends RadioItemType, ErrorType {
   disabled?: boolean;
 
   onChange?: (value: RadioItemType) => void;
+  className?: string;
 }
 
 export type RadioRef = HTMLInputElement;
-
-export interface RadioListType extends RadioType {
-  options: Omit<RadioType, 'name'>[];
-}
diff --git a/src/ui/forms/range/range.component.tsx b/src/ui/forms/range/range.component.tsx
index 18c6824..af53b7f 100644
--- a/src/ui/forms/range/range.component.tsx
+++ b/src/ui/forms/range/range.component.tsx
@@ -1,48 +1,64 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { RangeType } from '@/types';
 
-const Range = ({
-  value,
-  min = 0,
-  max = 100,
-  step = 1,
-  onChange,
-  label,
-  color,
-  size = 'md',
-  disabled,
-  error,
-  name,
-  id,
-  className
-}: RangeType) => {
-  return (
-    <div className={cls('form-control w-full', className)}>
-      {label && (
-        <label className='label' htmlFor={id}>
-          <span className='label-text'>{label}</span>
-        </label>
-      )}
-      <input
-        type='range'
-        id={id}
-        name={name}
-        min={min}
-        max={max}
-        step={step}
-        value={value}
-        onChange={onChange}
-        disabled={disabled}
-        className={cls('range', {
-          [`range-${color}`]: Boolean(color),
-          [`range-${size}`]: Boolean(size),
-          'range-error': Boolean(error)
-        })}
-      />
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+const Range = forwardRef<HTMLInputElement, RangeType>(
+  (
+    {
+      value,
+      min = 0,
+      max = 100,
+      step = 1,
+      onChange,
+      label,
+      color,
+      size = 'md',
+      disabled,
+      isError,
+      error,
+      name,
+      id,
+      className
+    },
+    ref
+  ) => {
+    return (
+      <div className={cls('form-control w-full', className)}>
+        {label && (
+          <label className='label' htmlFor={id}>
+            <span className='label-text'>{label}</span>
+          </label>
+        )}
+        <input
+          ref={ref}
+          type='range'
+          id={id}
+          name={name}
+          min={min}
+          max={max}
+          step={step}
+          value={value}
+          onChange={onChange}
+          readOnly={value !== undefined && !onChange}
+          disabled={disabled}
+          aria-invalid={Boolean(isError || error) || undefined}
+          className={cls('range', {
+            [`range-${color}`]: Boolean(color),
+            [`range-${size}`]: Boolean(size),
+            'range-error': Boolean(isError || error)
+          })}
+        />
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
+        )}
+      </div>
+    );
+  }
+);
+
+Range.displayName = 'Range';
 
 export default Range;
diff --git a/src/ui/forms/range/range.types.ts b/src/ui/forms/range/range.types.ts
index 1c56a40..7af5d47 100644
--- a/src/ui/forms/range/range.types.ts
+++ b/src/ui/forms/range/range.types.ts
@@ -1,6 +1,6 @@
-import type { ColorType, SizeType } from '@/types';
+import type { ColorType, ErrorType, SizeType } from '@/types';
 
-export interface RangeType {
+export interface RangeType extends ErrorType {
   /** Current range value */
   value?: number;
   /** Minimum range value */
@@ -19,8 +19,6 @@ export interface RangeType {
   size?: SizeType;
   /** Disabled state */
   disabled?: boolean;
-  /** Error message */
-  error?: string;
   /** Input name attribute */
   name?: string;
   /** Input id attribute */
diff --git a/src/ui/forms/select/select.component.tsx b/src/ui/forms/select/select.component.tsx
index 451e1e1..879d70b 100644
--- a/src/ui/forms/select/select.component.tsx
+++ b/src/ui/forms/select/select.component.tsx
@@ -1,58 +1,73 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { SelectType } from '@/types';
 
-const Select = ({
-  options = [],
-  value,
-  defaultValue,
-  placeholder,
-  label,
-  onChange,
-  color,
-  size = 'md',
-  ghost = false,
-  disabled = false,
-  error,
-  name,
-  id,
-  className
-}: SelectType) => {
-  return (
-    <div className={cls('form-control w-full', className)}>
-      {label && (
-        <label className='label' htmlFor={id}>
-          <span className='label-text'>{label}</span>
-        </label>
-      )}
-      <select
-        id={id}
-        name={name}
-        value={value}
-        defaultValue={defaultValue}
-        onChange={onChange}
-        disabled={disabled}
-        className={cls('select w-full', {
-          [`select-${color}`]: Boolean(color),
-          [`select-${size}`]: Boolean(size),
-          'select-ghost': ghost,
-          'select-error': Boolean(error)
-        })}
-      >
-        {placeholder && (
-          <option value='' disabled>
-            {placeholder}
-          </option>
+const Select = forwardRef<HTMLSelectElement, SelectType>(
+  (
+    {
+      options = [],
+      value,
+      defaultValue,
+      placeholder,
+      label,
+      onChange,
+      color,
+      size = 'md',
+      ghost = false,
+      disabled = false,
+      isError,
+      error,
+      name,
+      id,
+      className
+    },
+    ref
+  ) => {
+    return (
+      <div className={cls('form-control w-full', className)}>
+        {label && (
+          <label className='label' htmlFor={id}>
+            <span className='label-text'>{label}</span>
+          </label>
         )}
-        {options.map((opt) => (
-          <option key={opt.value} value={opt.value} disabled={opt.disabled}>
-            {opt.label}
-          </option>
-        ))}
-      </select>
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+        <select
+          ref={ref}
+          id={id}
+          name={name}
+          value={value}
+          defaultValue={defaultValue}
+          onChange={onChange}
+          disabled={disabled}
+          aria-invalid={Boolean(isError || error) || undefined}
+          className={cls('select w-full', {
+            [`select-${color}`]: Boolean(color),
+            [`select-${size}`]: Boolean(size),
+            'select-ghost': ghost,
+            'select-error': Boolean(isError || error)
+          })}
+        >
+          {placeholder && (
+            <option value='' disabled>
+              {placeholder}
+            </option>
+          )}
+          {options.map((opt) => (
+            <option key={opt.value} value={opt.value} disabled={opt.disabled}>
+              {opt.label}
+            </option>
+          ))}
+        </select>
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
+        )}
+      </div>
+    );
+  }
+);
+
+Select.displayName = 'Select';
 
 export default Select;
diff --git a/src/ui/forms/select/select.types.ts b/src/ui/forms/select/select.types.ts
index 3cdd551..4f33a10 100644
--- a/src/ui/forms/select/select.types.ts
+++ b/src/ui/forms/select/select.types.ts
@@ -1,4 +1,4 @@
-import type { ColorType, SizeType } from '@/types';
+import type { ColorType, ErrorType, SizeType } from '@/types';
 
 export interface SelectOptionType {
   /** Option value */
@@ -9,7 +9,7 @@ export interface SelectOptionType {
   disabled?: boolean;
 }
 
-export interface SelectType {
+export interface SelectType extends ErrorType {
   /** Select options */
   options?: SelectOptionType[];
   /** Currently selected value */
@@ -30,8 +30,6 @@ export interface SelectType {
   ghost?: boolean;
   /** Disabled state */
   disabled?: boolean;
-  /** Error message */
-  error?: string;
   /** Select name attribute */
   name?: string;
   /** Select id attribute */
diff --git a/src/ui/forms/textarea/textarea.component.tsx b/src/ui/forms/textarea/textarea.component.tsx
index 5f4059d..9482abf 100644
--- a/src/ui/forms/textarea/textarea.component.tsx
+++ b/src/ui/forms/textarea/textarea.component.tsx
@@ -1,40 +1,57 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { TextAreaType } from '@/types';
 
-const TextArea = ({
-  label,
-  error,
-  color,
-  size = 'md',
-  bordered = true,
-  className,
-  rows = 4,
-  ...restProps
-}: TextAreaType) => {
-  return (
-    <div className='form-control w-full'>
-      {label && (
-        <label className='label'>
-          <span className='label-text'>{label}</span>
-        </label>
-      )}
-      <textarea
-        rows={rows}
-        className={cls('textarea w-full', className, {
-          'textarea-bordered': bordered,
-          [`textarea-${color}`]: color,
-          'textarea-xs': size === 'xs',
-          'textarea-sm': size === 'sm',
-          'textarea-md': size === 'md',
-          'textarea-lg': size === 'lg',
-          'textarea-error': Boolean(error)
-        })}
-        {...restProps}
-      />
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+const TextArea = forwardRef<HTMLTextAreaElement, TextAreaType>(
+  (
+    {
+      label,
+      isError,
+      error,
+      color,
+      size = 'md',
+      bordered = true,
+      className,
+      rows = 4,
+      id,
+      ...restProps
+    },
+    ref
+  ) => {
+    return (
+      <div className='form-control w-full'>
+        {label && (
+          <label className='label' htmlFor={id}>
+            <span className='label-text'>{label}</span>
+          </label>
+        )}
+        <textarea
+          ref={ref}
+          id={id}
+          rows={rows}
+          aria-invalid={Boolean(isError || error) || undefined}
+          className={cls('textarea w-full', className, {
+            'textarea-bordered': bordered,
+            [`textarea-${color}`]: color,
+            'textarea-xs': size === 'xs',
+            'textarea-sm': size === 'sm',
+            'textarea-md': size === 'md',
+            'textarea-lg': size === 'lg',
+            'textarea-error': Boolean(isError || error)
+          })}
+          {...restProps}
+        />
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
+        )}
+      </div>
+    );
+  }
+);
+
+TextArea.displayName = 'TextArea';
 
 export default TextArea;
diff --git a/src/ui/forms/textarea/textarea.types.ts b/src/ui/forms/textarea/textarea.types.ts
index 2eaa5d3..df31bfe 100644
--- a/src/ui/forms/textarea/textarea.types.ts
+++ b/src/ui/forms/textarea/textarea.types.ts
@@ -1,8 +1,8 @@
-import type { ColorType, SizeType } from '@/types';
+import type { ColorType, ErrorType, SizeType } from '@/types';
 
-export interface TextAreaType extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+export interface TextAreaType
+  extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, ErrorType {
   label?: string;
-  error?: string;
   color?: ColorType;
   size?: SizeType;
   bordered?: boolean;
diff --git a/src/ui/forms/textbox/__snapshots__/textbox.test.tsx.snap b/src/ui/forms/textbox/__snapshots__/textbox.test.tsx.snap
index 5143ffa..aff1c1e 100644
--- a/src/ui/forms/textbox/__snapshots__/textbox.test.tsx.snap
+++ b/src/ui/forms/textbox/__snapshots__/textbox.test.tsx.snap
@@ -75,7 +75,7 @@ exports[`<TextBox /> snapshot full 1`] = `
       </svg>
     </div>
     <p
-      class="text-red-500 flex items-center"
+      class="text-error flex items-center"
     >
       Error
     </p>
diff --git a/src/ui/forms/textbox/textbox.component.tsx b/src/ui/forms/textbox/textbox.component.tsx
index 3064ad2..33a84b8 100644
--- a/src/ui/forms/textbox/textbox.component.tsx
+++ b/src/ui/forms/textbox/textbox.component.tsx
@@ -1,7 +1,7 @@
 import React, { forwardRef, useImperativeHandle, useRef } from 'react';
 import cls from 'classnames';
 
-import type { TextBoxRef, TextBoxType } from '@/types/ui/forms';
+import type { TextBoxRef, TextBoxType } from '@/types';
 
 const TextBox = forwardRef<TextBoxRef, TextBoxType>(
   (
@@ -17,6 +17,7 @@ const TextBox = forwardRef<TextBoxRef, TextBoxType>(
       rightIcon: RightIcon,
       rightButton,
       onClick,
+      className,
       ...otherProps
     },
     ref
@@ -51,6 +52,7 @@ const TextBox = forwardRef<TextBoxRef, TextBoxType>(
             className={cls(
               'input input-bordered w-full',
               `textbox-size-${size}`,
+              className,
               {
                 'input-error': isError,
                 'textbox-with-left-icon': LeftIcon,
@@ -73,7 +75,7 @@ const TextBox = forwardRef<TextBoxRef, TextBoxType>(
             />
           )}
         </div>
-        {isError && <p className='text-red-500 flex items-center'>{error}</p>}
+        {isError && <p className='text-error flex items-center'>{error}</p>}
       </label>
     );
   }
diff --git a/src/ui/forms/textbox/textbox.stories.tsx b/src/ui/forms/textbox/textbox.stories.tsx
index 24982ef..cf5395b 100644
--- a/src/ui/forms/textbox/textbox.stories.tsx
+++ b/src/ui/forms/textbox/textbox.stories.tsx
@@ -6,6 +6,7 @@ import TextBox from './textbox.component';
 const meta: Meta<typeof TextBox> = {
   title: '@creativecodeco-ui/Form/TextBox',
   component: TextBox,
+  tags: ['autodocs'],
   argTypes: {
     name: {
       description: 'Unique Name',
diff --git a/src/ui/forms/toggle/toggle.component.tsx b/src/ui/forms/toggle/toggle.component.tsx
index ca5861f..9317aed 100644
--- a/src/ui/forms/toggle/toggle.component.tsx
+++ b/src/ui/forms/toggle/toggle.component.tsx
@@ -1,48 +1,68 @@
+import { forwardRef } from 'react';
 import cls from 'classnames';
 
 import type { ToggleType } from '@/types';
 
-const Toggle = ({
-  checked,
-  onChange,
-  label,
-  position = 'left',
-  color,
-  size = 'md',
-  disabled,
-  error,
-  name,
-  id
-}: ToggleType) => {
-  return (
-    <div className='form-control'>
-      <label className='label cursor-pointer justify-start gap-3'>
-        {label && position === 'left' && (
-          <span className='label-text'>{label}</span>
+const Toggle = forwardRef<HTMLInputElement, ToggleType>(
+  (
+    {
+      checked,
+      onChange,
+      label,
+      position = 'left',
+      color,
+      size = 'md',
+      disabled,
+      isError,
+      error,
+      name,
+      id,
+      className
+    },
+    ref
+  ) => {
+    return (
+      <div className='form-control'>
+        <label
+          className='label cursor-pointer justify-start gap-3'
+          htmlFor={id}
+        >
+          {label && position === 'left' && (
+            <span className='label-text'>{label}</span>
+          )}
+          <input
+            ref={ref}
+            type='checkbox'
+            id={id}
+            name={name}
+            checked={checked}
+            onChange={onChange}
+            readOnly={checked !== undefined && !onChange}
+            disabled={disabled}
+            aria-invalid={Boolean(isError || error) || undefined}
+            className={cls('toggle', className, {
+              [`toggle-${color}`]: color,
+              'toggle-xs': size === 'xs',
+              'toggle-sm': size === 'sm',
+              'toggle-md': size === 'md',
+              'toggle-lg': size === 'lg',
+              'toggle-error': Boolean(isError || error)
+            })}
+          />
+          {label && position === 'right' && (
+            <span className='label-text'>{label}</span>
+          )}
+        </label>
+        {error && (
+          <span role='alert' className='text-xs text-error mt-1'>
+            {error}
+          </span>
         )}
-        <input
-          type='checkbox'
-          id={id}
-          name={name}
-          checked={checked}
-          onChange={onChange}
-          disabled={disabled}
-          className={cls('toggle', {
-            [`toggle-${color}`]: color,
-            'toggle-xs': size === 'xs',
-            'toggle-sm': size === 'sm',
-            'toggle-md': size === 'md',
-            'toggle-lg': size === 'lg',
-            'toggle-error': Boolean(error)
-          })}
-        />
-        {label && position === 'right' && (
-          <span className='label-text'>{label}</span>
-        )}
-      </label>
-      {error && <span className='text-xs text-error mt-1'>{error}</span>}
-    </div>
-  );
-};
+      </div>
+    );
+  }
+);
+
+Toggle.displayName = 'Toggle';
 
 export default Toggle;
diff --git a/src/ui/forms/toggle/toggle.types.ts b/src/ui/forms/toggle/toggle.types.ts
index 5f8bb7e..bedca06 100644
--- a/src/ui/forms/toggle/toggle.types.ts
+++ b/src/ui/forms/toggle/toggle.types.ts
@@ -1,6 +1,6 @@
-import type { ColorType, PositionType, SizeType } from '@/types';
+import type { ColorType, ErrorType, PositionType, SizeType } from '@/types';
 
-export interface ToggleType {
+export interface ToggleType extends ErrorType {
   checked?: boolean;
   onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
 
@@ -11,7 +11,7 @@ export interface ToggleType {
   size?: SizeType;
 
   disabled?: boolean;
-  error?: string;
   name?: string;
   id?: string;
+  className?: string;
 }
diff --git a/src/ui/forms/validator/validator.test.tsx b/src/ui/forms/validator/validator.test.tsx
index 62cba95..846010c 100644
--- a/src/ui/forms/validator/validator.test.tsx
+++ b/src/ui/forms/validator/validator.test.tsx
@@ -16,4 +16,14 @@ describe('<Validator />', () => {
       'validator-hint'
     );
   });
+
+  it('renders without aria-invalid when invalid is false', () => {
+    const { container } = render(
+      <Validator>
+        <input type='text' />
+      </Validator>
+    );
+    const validator = container.querySelector('.validator');
+    expect(validator).not.toHaveAttribute('aria-invalid');
+  });
 });
diff --git a/src/ui/provider/creativecode/creativecode-ui.provider.tsx b/src/ui/provider/creativecode/creativecode-ui.provider.tsx
index 51fa0b9..0d38012 100644
--- a/src/ui/provider/creativecode/creativecode-ui.provider.tsx
+++ b/src/ui/provider/creativecode/creativecode-ui.provider.tsx
@@ -1,12 +1,19 @@
-import { Fragment, PropsWithChildren, useEffect } from 'react';
+import { Fragment, type PropsWithChildren, useEffect } from 'react';
 
-export default function CreativeCodeUIProvider({
-  children
-}: PropsWithChildren<unknown>) {
+export interface CreativeCodeUIProviderType extends PropsWithChildren {
+  theme?: string;
+}
+
+const CreativeCodeUIProvider = ({
+  children,
+  theme = 'creativecode'
+}: CreativeCodeUIProviderType) => {
   useEffect(() => {
     const html = document.querySelector('html');
-    html?.setAttribute('data-theme', 'creativecode');
-  }, []);
+    html?.setAttribute('data-theme', theme);
+  }, [theme]);
 
   return <Fragment>{children}</Fragment>;
-}
+};
+
+export default CreativeCodeUIProvider;
diff --git a/src/ui/provider/index.ts b/src/ui/provider/index.ts
index a7e24b5..ccb6264 100644
--- a/src/ui/provider/index.ts
+++ b/src/ui/provider/index.ts
@@ -1,3 +1,5 @@
 import CreativeCodeUIProvider from './creativecode/creativecode-ui.provider';
 
 export { CreativeCodeUIProvider };
+export type { CreativeCodeUIProviderType } from './creativecode/creativecode-ui.provider';
+export default CreativeCodeUIProvider;
diff --git a/src/utils/string.utils.test.ts b/src/utils/string.utils.test.ts
index 35d1ec4..0acad50 100644
--- a/src/utils/string.utils.test.ts
+++ b/src/utils/string.utils.test.ts
@@ -1,4 +1,4 @@
-import { getInitials, isValidUrl } from './string.utils';
+import { getInitials, isValidUrl, sanitizeUrl } from './string.utils';
 
 describe('string utils', () => {
   describe('getInitials', () => {
@@ -16,9 +16,51 @@ describe('string utils', () => {
     it.each([
       ['undefined', undefined, false],
       ['url invalid', 'text', false],
+      ['javascript scheme rejected', 'javascript:alert(1)', false],
+      [
+        'data scheme rejected',
+        'data:text/html,<script>alert(1)</script>',
+        false
+      ],
       ['url valid', 'https://www.google.com', true]
     ])('%s', (_, url, expected) => {
       expect(isValidUrl(url)).toEqual(expected);
     });
   });
+
+  describe('sanitizeUrl', () => {
+    it.each([
+      ['undefined returns fallback', undefined, '#'],
+      ['empty string returns fallback', '   ', '#'],
+      ['javascript URI blocked', 'javascript:alert(1)', '#'],
+      ['mixed-case javascript URI blocked', 'JaVaScRiPt:alert(1)', '#'],
+      [
+        'control-char obfuscated javascript URI blocked',
+        'java\x00script:alert(1)',
+        '#'
+      ],
+      ['data URI blocked', 'data:text/html,<script>alert(1)</script>', '#'],
+      ['vbscript URI blocked', 'vbscript:msgbox(1)', '#'],
+      ['unknown scheme blocked', 'custom-evil:payload', '#'],
+      [
+        'https URL allowed',
+        'https://creativecode.com.co',
+        'https://creativecode.com.co'
+      ],
+      [
+        'mailto URL allowed',
+        'mailto:info@creativecode.com.co',
+        'mailto:info@creativecode.com.co'
+      ],
+      [
+        'relative path allowed',
+        '/docs/getting-started',
+        '/docs/getting-started'
+      ],
+      ['hash anchor allowed', '#section-1', '#section-1'],
+      ['plain relative segment allowed', 'docs/page', 'docs/page']
+    ])('%s', (_, url, expected) => {
+      expect(sanitizeUrl(url)).toEqual(expected);
+    });
+  });
 });
diff --git a/src/utils/string.utils.ts b/src/utils/string.utils.ts
index 48b701d..4b9d020 100644
--- a/src/utils/string.utils.ts
+++ b/src/utils/string.utils.ts
@@ -72,9 +72,55 @@ export function isValidUrl(uri?: string) {
   }
 
   try {
-    new URL(uri);
-    return true;
+    const parsed = new URL(uri);
+    return parsed.protocol === 'http:' || parsed.protocol === 'https:';
   } catch {
     return false;
   }
 }
+
+const SAFE_URL_PROTOCOLS = new Set(['http:', 'https:', 'mailto:', 'tel:']);
+const UNSAFE_SCHEME_REGEX = /^\s*(?:javascript|vbscript|data)\s*:/i;
+
+/**
+ * Sanitizes a URL string to prevent XSS via `javascript:`, `vbscript:`, or `data:` URI schemes.
+ * Allows relative URLs (`/`, `#`, `?`, `./`, `../`) and safe protocols (`http:`, `https:`, `mailto:`, `tel:`).
+ *
+ * @param uri - The URL string to sanitize.
+ * @param fallback - Fallback URL when the input is unsafe or empty (defaults to `'#'`).
+ * @returns A safe URL string.
+ */
+export function sanitizeUrl(uri?: string, fallback = '#'): string {
+  if (!uri) {
+    return fallback;
+  }
+
+  // Strip Unicode control characters and whitespace
+  const cleaned = uri.replace(/\p{Cc}+/gu, '').trim();
+  if (!cleaned) {
+    return fallback;
+  }
+
+  if (UNSAFE_SCHEME_REGEX.test(cleaned)) {
+    return fallback;
+  }
+
+  // Allow relative paths, query strings, and fragment identifiers
+  if (
+    cleaned.startsWith('/') ||
+    cleaned.startsWith('#') ||
+    cleaned.startsWith('?') ||
+    cleaned.startsWith('./') ||
+    cleaned.startsWith('../')
+  ) {
+    return cleaned;
+  }
+
+  try {
+    const parsed = new URL(cleaned);
+    return SAFE_URL_PROTOCOLS.has(parsed.protocol) ? cleaned : fallback;
+  } catch {
+    // Relative path without leading slash (e.g. "docs/getting-started")
+    return /^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(cleaned) ? fallback : cleaned;
+  }
+}

From f0e2b59e492e91915a72d165e8bb4148ea1b362c Mon Sep 17 00:00:00 2001
From: John Toro <joaltoroc@gmail.com>
Date: Mon, 26 Oct 2026 20:21:05 -0500
Subject: [PATCH 2/3] fix(ci): resolve SonarCloud githubactions S6505 and S8543
 issues

---
 .github/workflows/chromatic.yml | 3 ---
 .github/workflows/npm-build.yml | 5 +----
 .github/workflows/publish.yml   | 5 +----
 Changelog.md                    | 2 +-
 package.json                    | 3 ++-
 5 files changed, 5 insertions(+), 13 deletions(-)

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
index 170a38b..63b473c 100644
--- a/.github/workflows/chromatic.yml
+++ b/.github/workflows/chromatic.yml
@@ -27,9 +27,6 @@ jobs:
           node-version-file: '.nvmrc'
           cache: 'npm'
 
-      - name: Update npm to latest
-        run: npm install -g npm@latest
-
       - name: Install dependencies
         # 👇 Install dependencies with the same package manager used in the project (replace it as needed), e.g. yarn, npm, pnpm
         run: npm ci --ignore-scripts
diff --git a/.github/workflows/npm-build.yml b/.github/workflows/npm-build.yml
index b70f57e..e6b6ae8 100644
--- a/.github/workflows/npm-build.yml
+++ b/.github/workflows/npm-build.yml
@@ -20,9 +20,6 @@ jobs:
           node-version-file: '.nvmrc'
           cache: 'npm'
 
-      - name: Update npm to latest
-        run: npm install -g npm@latest
-
       - name: Clean and Install
         run: npm ci --ignore-scripts
 
@@ -33,7 +30,7 @@ jobs:
         run: npm run lint && npm run format:check
 
       - name: TypeScript Check
-        run: npx tsc --noEmit
+        run: npm run typecheck
 
       - name: Build
         run: npm run build
diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
index 1e67116..6281e8c 100644
--- a/.github/workflows/publish.yml
+++ b/.github/workflows/publish.yml
@@ -22,14 +22,11 @@ jobs:
           cache: 'npm'
           registry-url: 'https://registry.npmjs.org'
 
-      - name: Update npm to latest
-        run: npm install -g npm@latest
-
       - name: Clean and Install
         run: npm ci --ignore-scripts
 
       - name: Validate and Test
-        run: npm run lint && npm run format:check && npx tsc --noEmit && npm run test
+        run: npm run lint && npm run format:check && npm run typecheck && npm run test
 
       - name: Configure git
         run: |
diff --git a/Changelog.md b/Changelog.md
index d70b05c..70a112f 100644
--- a/Changelog.md
+++ b/Changelog.md
@@ -15,7 +15,7 @@
 - Standardize theme color tokens across all components by replacing hardcoded colors (`text-red-500` -> `text-error` in `Checkbox`, `Radio`, `RadioList`, and `TextBox`; `bg-black` -> `bg-neutral/60` in `Hero`; default `color = 'primary'` in `Rating`; `text-secondary` in `Timeline`) and adding `@source inline(...)` in `src/theme/main.css` so all DaisyUI semantic color classes are generated in the compiled stylesheet.
 - Harden components against OWASP frontend security risks: restrict `isValidUrl` to `http:`/`https:`, add `sanitizeUrl` in `src/utils/string.utils.ts` to block `javascript:`/`vbscript:`/`data:` XSS schemes across `Link`, `Breadcrumb`, `Footer`, `Menu`, `MegaMenu`, `Hero`, `Card`, `Carousel`, `ChatBubble`, `HoverGallery`, `Mask`, and `AvatarGroup`, enforce `noopener noreferrer` on `target="_blank"` links, prevent CSS `url(...)` breakout in `Hero`, and set `autoComplete="one-time-code"` in `Otp`.
 - Add `forwardRef` support across `Select`, `TextArea`, `Toggle`, `FileInput`, `Range`, and `Otp`, plus keyboard navigation (`Escape` to close `Modal` and `Drawer`, `ArrowRight`/`ArrowLeft`/`Home`/`End` in `Tabs`).
-- Add `exports` map, `types`, `sideEffects`, `engines` (`node >=24.22.1`, `npm >=12.2.1`), and `packageManager` (`npm@12.2.1`) in `package.json`, update `.nvmrc` to `v24.22.1` (Node 24 LTS Krypton), and harden GitHub Actions workflows (`npm-build.yml`, `publish.yml`, `chromatic.yml`) with least-privilege `permissions`, `npm audit`, lint/type checks, NPM `--provenance`, `npm@latest` upgrade, and latest SHA-pinned stable actions (`actions/checkout@v7.0.1`, `actions/setup-node@v7.1.0`, `chromaui/action@v18.13.3`, and `MishaKav/jest-coverage-comment@v1.0.38`).
+- Add `exports` map, `types`, `sideEffects`, `typecheck` script, `engines` (`node >=24.22.1`, `npm >=12.2.1`), and `packageManager` (`npm@12.2.1`) in `package.json`, update `.nvmrc` to `v24.22.1` (Node 24 LTS Krypton), and harden GitHub Actions workflows (`npm-build.yml`, `publish.yml`, `chromatic.yml`) with least-privilege `permissions`, `npm audit`, `npm run typecheck`, NPM `--provenance`, and latest SHA-pinned stable actions (`actions/checkout@v7.0.1`, `actions/setup-node@v7.1.0`, `chromaui/action@v18.13.3`, and `MishaKav/jest-coverage-comment@v1.0.38`).
 - Add custom easing tokens (`--ease-out`, `--ease-in-out`, `--ease-drawer`) and tactile button active feedback (`scale(0.97)` with `prefers-reduced-motion` support) in `src/theme/`.
 
 ### ☝🏻 Upgrade
diff --git a/package.json b/package.json
index ec2ebd4..d5eb3a6 100644
--- a/package.json
+++ b/package.json
@@ -70,7 +70,8 @@
     "test": "jest .",
     "test:action": "jest --coverage | tee ./coverage.txt && jest --ci --reporters=default --reporters=jest-junit",
     "test:update": "jest --updateSnapshot",
-    "test:watch": "jest --watch"
+    "test:watch": "jest --watch",
+    "typecheck": "tsc --noEmit"
   },
   "peerDependencies": {
     "@tailwindcss/postcss": "4.3.3",

From 214f8683ccff384bac04ef5f1c90ba8adccf4e02 Mon Sep 17 00:00:00 2001
From: John Toro <joaltoroc@gmail.com>
Date: Mon, 26 Oct 2026 20:27:47 -0500
Subject: [PATCH 3/3] refactor(forms): eliminate SonarCloud code duplication
 between FileInput and TextArea

---
 src/theme/main.css                            |  1 +
 .../forms/file-input/file-input.component.tsx | 30 +++++++++----------
 src/ui/forms/file-input/file-input.test.tsx   |  5 ++++
 src/ui/forms/textarea/textarea.component.tsx  |  7 ++---
 4 files changed, 23 insertions(+), 20 deletions(-)

diff --git a/src/theme/main.css b/src/theme/main.css
index cbcaba1..a5def8b 100644
--- a/src/theme/main.css
+++ b/src/theme/main.css
@@ -11,6 +11,7 @@
 @plugin "daisyui";
 
 @source inline("{btn,badge,alert,toggle,range,select,textarea,file-input,progress,status,chat-bubble,step,tooltip,checkbox,radio,input,otp,divider,link,text,bg,border}-{primary,secondary,accent,info,success,warning,error,neutral,ghost}");
+@source inline("{btn,badge,toggle,range,select,textarea,file-input,checkbox,radio,input,otp,tab,table,menu,dock,kbd,loading,status}-{xs,sm,md,lg,xl}");
 
 :root {
   --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
diff --git a/src/ui/forms/file-input/file-input.component.tsx b/src/ui/forms/file-input/file-input.component.tsx
index 8710c43..39ca71d 100644
--- a/src/ui/forms/file-input/file-input.component.tsx
+++ b/src/ui/forms/file-input/file-input.component.tsx
@@ -18,34 +18,34 @@ const FileInput = forwardRef<HTMLInputElement, FileInputType>(
     },
     ref
   ) => {
+    const hasError = Boolean(isError || error);
+    const inputClasses = cls('file-input w-full', className, {
+      'file-input-bordered': bordered,
+      [`file-input-${color}`]: Boolean(color),
+      [`file-input-${size}`]: Boolean(size),
+      'file-input-error': hasError
+    });
+
     return (
       <div className='form-control w-full'>
-        {label && (
+        {label ? (
           <label className='label' htmlFor={id}>
             <span className='label-text'>{label}</span>
           </label>
-        )}
+        ) : null}
         <input
+          {...restProps}
           ref={ref}
           id={id}
           type='file'
-          aria-invalid={Boolean(isError || error) || undefined}
-          className={cls('file-input w-full', className, {
-            'file-input-bordered': bordered,
-            [`file-input-${color}`]: color,
-            'file-input-xs': size === 'xs',
-            'file-input-sm': size === 'sm',
-            'file-input-md': size === 'md',
-            'file-input-lg': size === 'lg',
-            'file-input-error': Boolean(isError || error)
-          })}
-          {...restProps}
+          aria-invalid={hasError || undefined}
+          className={inputClasses}
         />
-        {error && (
+        {error ? (
           <span role='alert' className='text-xs text-error mt-1'>
             {error}
           </span>
-        )}
+        ) : null}
       </div>
     );
   }
diff --git a/src/ui/forms/file-input/file-input.test.tsx b/src/ui/forms/file-input/file-input.test.tsx
index 99e8c98..f3ddffa 100644
--- a/src/ui/forms/file-input/file-input.test.tsx
+++ b/src/ui/forms/file-input/file-input.test.tsx
@@ -21,4 +21,9 @@ describe('<FileInput />', () => {
     fireEvent.change(input, { target: { files: [file] } });
     expect(handleChange).toHaveBeenCalledTimes(1);
   });
+
+  it('renders error alert when error prop is provided', () => {
+    render(<FileInput label='Resume' error='File is too large' />);
+    expect(screen.getByRole('alert')).toHaveTextContent('File is too large');
+  });
 });
diff --git a/src/ui/forms/textarea/textarea.component.tsx b/src/ui/forms/textarea/textarea.component.tsx
index 9482abf..ff99210 100644
--- a/src/ui/forms/textarea/textarea.component.tsx
+++ b/src/ui/forms/textarea/textarea.component.tsx
@@ -33,11 +33,8 @@ const TextArea = forwardRef<HTMLTextAreaElement, TextAreaType>(
           aria-invalid={Boolean(isError || error) || undefined}
           className={cls('textarea w-full', className, {
             'textarea-bordered': bordered,
-            [`textarea-${color}`]: color,
-            'textarea-xs': size === 'xs',
-            'textarea-sm': size === 'sm',
-            'textarea-md': size === 'md',
-            'textarea-lg': size === 'lg',
+            [`textarea-${color}`]: Boolean(color),
+            [`textarea-${size}`]: Boolean(size),
             'textarea-error': Boolean(isError || error)
           })}
           {...restProps}