From 6567ece8066cd993e7959f2b2c5f3009a44d7659 Mon Sep 17 00:00:00 2001
From: "codegen-sh[bot]" <131295404+codegen-sh[bot]@users.noreply.github.com>
Date: Thu, 14 Aug 2025 19:12:49 +0000
Subject: [PATCH 1/5] Add phone input component with react-phone-number-input
 integration

- Create UI phone input component
- Create form field wrapper for phone input
- Create remix-hook-form wrapper component
- Add stories with USA and international phone number examples
- Add tests for phone input component
- Add custom CSS for better styling integration

Co-authored-by: Jake Ruesink <jake@lambdacurry.com>
---
 .../remix-hook-form/phone-input.stories.tsx   | 317 ++++++++++++++++++
 .../src/remix-hook-form/phone-input.test.tsx  | 172 ++++++++++
 package.json                                  |   6 +-
 .../components/src/remix-hook-form/index.ts   |   1 +
 .../src/remix-hook-form/phone-input.tsx       |  29 ++
 packages/components/src/ui/index.ts           |   2 +
 .../components/src/ui/phone-input-field.tsx   |  67 ++++
 packages/components/src/ui/phone-input.css    |  71 ++++
 packages/components/src/ui/phone-input.tsx    |  39 +++
 yarn.lock                                     |  93 ++++-
 10 files changed, 795 insertions(+), 2 deletions(-)
 create mode 100644 apps/docs/src/remix-hook-form/phone-input.stories.tsx
 create mode 100644 apps/docs/src/remix-hook-form/phone-input.test.tsx
 create mode 100644 packages/components/src/remix-hook-form/phone-input.tsx
 create mode 100644 packages/components/src/ui/phone-input-field.tsx
 create mode 100644 packages/components/src/ui/phone-input.css
 create mode 100644 packages/components/src/ui/phone-input.tsx

diff --git a/apps/docs/src/remix-hook-form/phone-input.stories.tsx b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
new file mode 100644
index 00000000..0da127d2
--- /dev/null
+++ b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
@@ -0,0 +1,317 @@
+import { zodResolver } from '@hookform/resolvers/zod';
+import { PhoneInput } from '@lambdacurry/forms/remix-hook-form/phone-input';
+import { Button } from '@lambdacurry/forms/ui/button';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { expect, userEvent, within } from '@storybook/test';
+import { type ActionFunctionArgs, useFetcher } from 'react-router';
+import { RemixFormProvider, getValidatedFormData, useRemixForm } from 'remix-hook-form';
+import { z } from 'zod';
+import { withReactRouterStubDecorator } from '../lib/storybook/react-router-stub';
+
+// Define a schema for phone number validation
+const formSchema = z.object({
+  usaPhone: z.string().min(1, 'USA phone number is required'),
+  internationalPhone: z.string().min(1, 'International phone number is required'),
+});
+
+type FormData = z.infer<typeof formSchema>;
+
+const ControlledPhoneInputExample = () => {
+  const fetcher = useFetcher<{ message: string }>();
+  const methods = useRemixForm<FormData>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      usaPhone: '',
+      internationalPhone: '',
+    },
+    fetcher,
+    submitConfig: {
+      action: '/',
+      method: 'post',
+    },
+  });
+
+  return (
+    <RemixFormProvider {...methods}>
+      <fetcher.Form onSubmit={methods.handleSubmit}>
+        <div className="grid gap-8">
+          <PhoneInput
+            name="usaPhone"
+            label="USA Phone Number"
+            description="Enter a US phone number"
+            defaultCountry="US"
+            international={false}
+          />
+          <PhoneInput
+            name="internationalPhone"
+            label="International Phone Number"
+            description="Enter an international phone number"
+            international={true}
+          />
+        </div>
+        <Button type="submit" className="mt-8">
+          Submit
+        </Button>
+        {fetcher.data?.message && <p className="mt-2 text-green-600">{fetcher.data.message}</p>}
+      </fetcher.Form>
+    </RemixFormProvider>
+  );
+};
+
+const handleFormSubmission = async (request: Request) => {
+  const { data, errors } = await getValidatedFormData<FormData>(request, zodResolver(formSchema));
+
+  if (errors) {
+    return { errors };
+  }
+
+  return { 
+    message: `Form submitted successfully! USA: ${data.usaPhone}, International: ${data.internationalPhone}` 
+  };
+};
+
+const meta: Meta<typeof PhoneInput> = {
+  title: 'RemixHookForm/PhoneInput',
+  component: PhoneInput,
+  parameters: { layout: 'centered' },
+  tags: ['autodocs'],
+  decorators: [
+    withReactRouterStubDecorator({
+      routes: [
+        {
+          path: '/',
+          Component: ControlledPhoneInputExample,
+          action: async ({ request }: ActionFunctionArgs) => handleFormSubmission(request),
+        },
+      ],
+    }),
+  ],
+} satisfies Meta<typeof PhoneInput>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  parameters: {
+    docs: {
+      description: {
+        story: 'Phone input component with US and international number support.',
+      },
+      source: {
+        code: `
+const formSchema = z.object({
+  usaPhone: z.string().min(1, 'USA phone number is required'),
+  internationalPhone: z.string().min(1, 'International phone number is required'),
+});
+
+const ControlledPhoneInputExample = () => {
+  const fetcher = useFetcher<{ message: string }>();
+  const methods = useRemixForm<FormData>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      usaPhone: '',
+      internationalPhone: '',
+    },
+    fetcher,
+    submitConfig: {
+      action: '/',
+      method: 'post',
+    },
+  });
+
+  return (
+    <RemixFormProvider {...methods}>
+      <fetcher.Form onSubmit={methods.handleSubmit}>
+        <div className="grid gap-8">
+          <PhoneInput
+            name="usaPhone"
+            label="USA Phone Number"
+            description="Enter a US phone number"
+            defaultCountry="US"
+            international={false}
+          />
+          <PhoneInput
+            name="internationalPhone"
+            label="International Phone Number"
+            description="Enter an international phone number"
+            international={true}
+          />
+        </div>
+        <Button type="submit" className="mt-8">
+          Submit
+        </Button>
+        {fetcher.data?.message && <p className="mt-2 text-green-600">{fetcher.data.message}</p>}
+      </fetcher.Form>
+    </RemixFormProvider>
+  );
+};`,
+      },
+    },
+  },
+  play: async ({ canvasElement, step }) => {
+    const canvas = within(canvasElement);
+
+    await step('Verify initial state', async () => {
+      // Verify phone input fields are present
+      const usaPhoneLabel = canvas.getByLabelText('USA Phone Number');
+      const internationalPhoneLabel = canvas.getByLabelText('International Phone Number');
+      
+      expect(usaPhoneLabel).toBeInTheDocument();
+      expect(internationalPhoneLabel).toBeInTheDocument();
+
+      // Verify submit button is present
+      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      expect(submitButton).toBeInTheDocument();
+    });
+
+    await step('Test validation errors on invalid submission', async () => {
+      // Submit form without entering phone numbers
+      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      await userEvent.click(submitButton);
+
+      // Verify validation error messages appear
+      await expect(canvas.findByText('USA phone number is required')).resolves.toBeInTheDocument();
+      await expect(canvas.findByText('International phone number is required')).resolves.toBeInTheDocument();
+    });
+
+    await step('Test successful form submission with valid phone numbers', async () => {
+      // Enter valid phone numbers
+      const usaPhoneInput = canvas.getByLabelText('USA Phone Number');
+      const internationalPhoneInput = canvas.getByLabelText('International Phone Number');
+
+      // Enter a US phone number
+      await userEvent.type(usaPhoneInput, '2025550123');
+      
+      // Enter an international phone number (UK format)
+      await userEvent.type(internationalPhoneInput, '447911123456');
+
+      // Submit form
+      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      await userEvent.click(submitButton);
+
+      // Verify success message
+      await expect(canvas.findByText(/Form submitted successfully/)).resolves.toBeInTheDocument();
+    });
+  },
+};
+
+export const WithCustomStyling: Story = {
+  render: () => {
+    const fetcher = useFetcher<{ message: string }>();
+    const methods = useRemixForm<FormData>({
+      resolver: zodResolver(formSchema),
+      defaultValues: {
+        usaPhone: '',
+        internationalPhone: '',
+      },
+      fetcher,
+      submitConfig: {
+        action: '/',
+        method: 'post',
+      },
+    });
+
+    return (
+      <RemixFormProvider {...methods}>
+        <fetcher.Form onSubmit={methods.handleSubmit}>
+          <div className="grid gap-8">
+            <PhoneInput
+              name="usaPhone"
+              label="Custom Styled Phone Input"
+              description="With custom styling applied"
+              defaultCountry="US"
+              className="border-2 border-blue-500 p-4 rounded-lg"
+              inputClassName="bg-gray-100"
+            />
+          </div>
+          <Button type="submit" className="mt-8">
+            Submit
+          </Button>
+        </fetcher.Form>
+      </RemixFormProvider>
+    );
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: 'Phone input with custom styling applied.',
+      },
+    },
+  },
+};
+
+export const WithDifferentDefaultCountries: Story = {
+  render: () => {
+    const fetcher = useFetcher<{ message: string }>();
+    const methods = useRemixForm<{
+      usPhone: string;
+      ukPhone: string;
+      canadaPhone: string;
+      australiaPhone: string;
+    }>({
+      resolver: zodResolver(
+        z.object({
+          usPhone: z.string().optional(),
+          ukPhone: z.string().optional(),
+          canadaPhone: z.string().optional(),
+          australiaPhone: z.string().optional(),
+        })
+      ),
+      defaultValues: {
+        usPhone: '',
+        ukPhone: '',
+        canadaPhone: '',
+        australiaPhone: '',
+      },
+      fetcher,
+      submitConfig: {
+        action: '/',
+        method: 'post',
+      },
+    });
+
+    return (
+      <RemixFormProvider {...methods}>
+        <fetcher.Form onSubmit={methods.handleSubmit}>
+          <div className="grid gap-8">
+            <PhoneInput
+              name="usPhone"
+              label="US Phone Number"
+              defaultCountry="US"
+              international={true}
+            />
+            <PhoneInput
+              name="ukPhone"
+              label="UK Phone Number"
+              defaultCountry="GB"
+              international={true}
+            />
+            <PhoneInput
+              name="canadaPhone"
+              label="Canada Phone Number"
+              defaultCountry="CA"
+              international={true}
+            />
+            <PhoneInput
+              name="australiaPhone"
+              label="Australia Phone Number"
+              defaultCountry="AU"
+              international={true}
+            />
+          </div>
+          <Button type="submit" className="mt-8">
+            Submit
+          </Button>
+        </fetcher.Form>
+      </RemixFormProvider>
+    );
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: 'Phone inputs with different default countries.',
+      },
+    },
+  },
+};
+
diff --git a/apps/docs/src/remix-hook-form/phone-input.test.tsx b/apps/docs/src/remix-hook-form/phone-input.test.tsx
new file mode 100644
index 00000000..67d9839c
--- /dev/null
+++ b/apps/docs/src/remix-hook-form/phone-input.test.tsx
@@ -0,0 +1,172 @@
+import { zodResolver } from '@hookform/resolvers/zod';
+import { PhoneInput } from '@lambdacurry/forms';
+import { Button } from '@lambdacurry/forms/ui/button';
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { useFetcher } from 'react-router';
+import { RemixFormProvider, useRemixForm } from 'remix-hook-form';
+import { z } from 'zod';
+
+// Mock useFetcher
+jest.mock('react-router', () => ({
+  useFetcher: jest.fn(),
+}));
+
+const mockUseFetcher = useFetcher as jest.MockedFunction<typeof useFetcher>;
+
+// Test form schema
+const testSchema = z.object({
+  usaPhone: z.string().min(1, 'USA phone number is required'),
+  internationalPhone: z.string().min(1, 'International phone number is required'),
+});
+
+type TestFormData = z.infer<typeof testSchema>;
+
+// Test component wrapper
+const TestPhoneInputForm = ({
+  initialErrors = {},
+  customComponents = {},
+}: {
+  initialErrors?: Record<string, { message: string }>;
+  customComponents?: any;
+}) => {
+  const mockFetcher = {
+    data: { errors: initialErrors },
+    state: 'idle' as const,
+    submit: jest.fn(),
+    Form: 'form' as any,
+  };
+
+  mockUseFetcher.mockReturnValue(mockFetcher);
+
+  const methods = useRemixForm<TestFormData>({
+    resolver: zodResolver(testSchema),
+    defaultValues: { usaPhone: '', internationalPhone: '' },
+    fetcher: mockFetcher,
+    submitConfig: { action: '/test', method: 'post' },
+  });
+
+  return (
+    <RemixFormProvider {...methods}>
+      <form onSubmit={methods.handleSubmit}>
+        <PhoneInput
+          name="usaPhone"
+          label="USA Phone Number"
+          description="Enter a US phone number"
+          defaultCountry="US"
+          international={false}
+          components={customComponents}
+        />
+        <PhoneInput
+          name="internationalPhone"
+          label="International Phone Number"
+          description="Enter an international phone number"
+          international={true}
+          components={customComponents}
+        />
+        <Button type="submit">Submit</Button>
+      </form>
+    </RemixFormProvider>
+  );
+};
+
+describe('PhoneInput Component', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('Basic Functionality', () => {
+    it('renders phone input fields with labels and descriptions', () => {
+      render(<TestPhoneInputForm />);
+
+      // Check for labels
+      expect(screen.getByLabelText('USA Phone Number')).toBeInTheDocument();
+      expect(screen.getByLabelText('International Phone Number')).toBeInTheDocument();
+
+      // Check for descriptions
+      expect(screen.getByText('Enter a US phone number')).toBeInTheDocument();
+      expect(screen.getByText('Enter an international phone number')).toBeInTheDocument();
+    });
+
+    it('displays validation errors when provided', async () => {
+      const errors = {
+        usaPhone: { message: 'USA phone number is required' },
+        internationalPhone: { message: 'International phone number is required' },
+      };
+
+      render(<TestPhoneInputForm initialErrors={errors} />);
+
+      // Check for error messages
+      expect(screen.getByText('USA phone number is required')).toBeInTheDocument();
+      expect(screen.getByText('International phone number is required')).toBeInTheDocument();
+    });
+  });
+
+  describe('Input Behavior', () => {
+    it('allows entering a US phone number', async () => {
+      const user = userEvent.setup();
+      render(<TestPhoneInputForm />);
+
+      const usaPhoneInput = screen.getByLabelText('USA Phone Number');
+      
+      // Type a US phone number
+      await user.type(usaPhoneInput, '2025550123');
+      
+      // Check that the input contains the formatted number
+      await waitFor(() => {
+        expect(usaPhoneInput).toHaveValue('(202) 555-0123');
+      });
+    });
+
+    it('allows entering an international phone number', async () => {
+      const user = userEvent.setup();
+      render(<TestPhoneInputForm />);
+
+      const internationalPhoneInput = screen.getByLabelText('International Phone Number');
+      
+      // Type a UK phone number
+      await user.type(internationalPhoneInput, '447911123456');
+      
+      // Check that the input contains the formatted number
+      await waitFor(() => {
+        expect(internationalPhoneInput).toHaveValue('+44 7911 123456');
+      });
+    });
+  });
+
+  describe('Component Customization', () => {
+    it('uses custom FormMessage component when provided', () => {
+      const CustomFormMessage = ({ children, ...props }: any) => (
+        <div data-testid="custom-form-message" className="custom-message" {...props}>
+          Custom: {children}
+        </div>
+      );
+
+      const errors = {
+        usaPhone: { message: 'Test error' },
+      };
+
+      render(<TestPhoneInputForm initialErrors={errors} customComponents={{ FormMessage: CustomFormMessage }} />);
+
+      expect(screen.getByTestId('custom-form-message')).toBeInTheDocument();
+      expect(screen.getByText('Custom: Test error')).toBeInTheDocument();
+    });
+  });
+
+  describe('Accessibility', () => {
+    it('has proper label associations for screen readers', () => {
+      render(<TestPhoneInputForm />);
+
+      const usaPhoneLabel = screen.getByText('USA Phone Number');
+      const internationalPhoneLabel = screen.getByText('International Phone Number');
+      
+      expect(usaPhoneLabel).toBeInTheDocument();
+      expect(internationalPhoneLabel).toBeInTheDocument();
+      
+      // Verify labels are properly associated with inputs
+      expect(screen.getByLabelText('USA Phone Number')).toBeInTheDocument();
+      expect(screen.getByLabelText('International Phone Number')).toBeInTheDocument();
+    });
+  });
+});
+
diff --git a/package.json b/package.json
index 16f2631c..69d36fbb 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,10 @@
   "name": "forms",
   "version": "0.2.0",
   "private": true,
-  "workspaces": ["apps/*", "packages/*"],
+  "workspaces": [
+    "apps/*",
+    "packages/*"
+  ],
   "scripts": {
     "start": "yarn dev",
     "dev": "turbo run dev",
@@ -22,6 +25,7 @@
   },
   "dependencies": {
     "@changesets/cli": "^2.27.11",
+    "react-phone-number-input": "^3.4.12",
     "react-router-dom": "^7.6.2"
   },
   "packageManager": "yarn@4.9.1"
diff --git a/packages/components/src/remix-hook-form/index.ts b/packages/components/src/remix-hook-form/index.ts
index adf298c5..dfa14017 100644
--- a/packages/components/src/remix-hook-form/index.ts
+++ b/packages/components/src/remix-hook-form/index.ts
@@ -3,6 +3,7 @@ export * from './form';
 export * from './form-error';
 export * from './date-picker';
 export * from './dropdown-menu-select';
+export * from './phone-input';
 export * from './text-field';
 export * from './password-field';
 export * from './radio-group';
diff --git a/packages/components/src/remix-hook-form/phone-input.tsx b/packages/components/src/remix-hook-form/phone-input.tsx
new file mode 100644
index 00000000..6b54e410
--- /dev/null
+++ b/packages/components/src/remix-hook-form/phone-input.tsx
@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { PhoneInputField as BasePhoneInputField, type PhoneInputFieldProps as BasePhoneInputFieldProps } from '../ui/phone-input-field';
+import { FormControl, FormDescription, FormLabel, FormMessage } from './form';
+
+import { useRemixFormContext } from 'remix-hook-form';
+
+export type PhoneInputProps = Omit<BasePhoneInputFieldProps, 'control'>;
+
+export const PhoneInput = function RemixPhoneInput(props: PhoneInputProps & { ref?: React.Ref<HTMLInputElement> }) {
+  const { control } = useRemixFormContext();
+
+  // Merge the provided components with the default form components
+  const defaultComponents = {
+    FormControl,
+    FormLabel,
+    FormDescription,
+    FormMessage,
+  };
+
+  const components = {
+    ...defaultComponents,
+    ...props.components,
+  };
+
+  return <BasePhoneInputField control={control} components={components} {...props} />;
+};
+
+PhoneInput.displayName = 'PhoneInput';
+
diff --git a/packages/components/src/ui/index.ts b/packages/components/src/ui/index.ts
index bf3462dc..aa00ae24 100644
--- a/packages/components/src/ui/index.ts
+++ b/packages/components/src/ui/index.ts
@@ -10,6 +10,8 @@ export * from './form-error-field';
 export * from './label';
 export * from './otp-input';
 export * from './otp-input-field';
+export * from './phone-input';
+export * from './phone-input-field';
 export * from './popover';
 export * from './radio-group';
 export * from './radio-group-field';
diff --git a/packages/components/src/ui/phone-input-field.tsx b/packages/components/src/ui/phone-input-field.tsx
new file mode 100644
index 00000000..65719700
--- /dev/null
+++ b/packages/components/src/ui/phone-input-field.tsx
@@ -0,0 +1,67 @@
+import * as React from 'react';
+import type { Control, FieldPath, FieldValues } from 'react-hook-form';
+import {
+  type FieldComponents,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from './form';
+import { type PhoneInputProps, PhoneNumberInput } from './phone-input';
+import { cn } from './utils';
+
+export interface PhoneInputFieldProps extends Omit<PhoneInputProps, 'value' | 'onChange'> {
+  control?: Control<FieldValues>;
+  name: FieldPath<FieldValues>;
+  label?: string | React.ReactNode;
+  description?: string;
+  components?: Partial<FieldComponents> & {
+    Input?: React.ComponentType<PhoneInputProps & React.RefAttributes<HTMLInputElement>>;
+  };
+  className?: string;
+}
+
+export const PhoneInputField = function PhoneInputField({
+  control,
+  name,
+  label,
+  description,
+  className,
+  components,
+  ref,
+  ...props
+}: PhoneInputFieldProps & { ref?: React.Ref<HTMLInputElement> }) {
+  // Use the custom Input component if provided, otherwise use the default PhoneNumberInput
+  const InputComponent = components?.Input || PhoneNumberInput;
+
+  return (
+    <FormField
+      control={control}
+      name={name}
+      render={({ field, fieldState }) => {
+        return (
+          <FormItem className={className}>
+            {label && <FormLabel Component={components?.FormLabel}>{label}</FormLabel>}
+            <FormControl Component={components?.FormControl}>
+              <InputComponent
+                {...field}
+                {...props}
+                ref={ref}
+                className={cn('focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2')}
+              />
+            </FormControl>
+            {description && <FormDescription Component={components?.FormDescription}>{description}</FormDescription>}
+            {fieldState.error && (
+              <FormMessage Component={components?.FormMessage}>{fieldState.error.message}</FormMessage>
+            )}
+          </FormItem>
+        );
+      }}
+    />
+  );
+};
+
+PhoneInputField.displayName = 'PhoneInputField';
+
diff --git a/packages/components/src/ui/phone-input.css b/packages/components/src/ui/phone-input.css
new file mode 100644
index 00000000..9cff6174
--- /dev/null
+++ b/packages/components/src/ui/phone-input.css
@@ -0,0 +1,71 @@
+/* Custom styles for phone input to match the form library's design */
+.phone-input-container {
+  position: relative;
+  width: 100%;
+}
+
+.phone-input {
+  display: flex;
+  width: 100%;
+}
+
+.phone-input .PhoneInputInput {
+  flex: 1;
+  padding: 0.5rem;
+  border-radius: 0.375rem;
+  border: 1px solid hsl(var(--input));
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.phone-input .PhoneInputInput:focus {
+  outline: none;
+  border-color: hsl(var(--ring));
+}
+
+.phone-input .PhoneInputCountry {
+  margin-right: 0.5rem;
+  display: flex;
+  align-items: center;
+}
+
+.phone-input .PhoneInputCountryIcon {
+  width: 1.5rem;
+  height: 1rem;
+}
+
+.phone-input .PhoneInputCountrySelectArrow {
+  margin-left: 0.25rem;
+  width: 0.5rem;
+  height: 0.5rem;
+  border-style: solid;
+  border-color: currentColor transparent transparent;
+  border-width: 0.25rem 0.25rem 0;
+  opacity: 0.6;
+}
+
+.phone-input .PhoneInputCountrySelect {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  z-index: 1;
+  border: 0;
+  opacity: 0;
+  cursor: pointer;
+}
+
+/* Adjust for dark mode */
+[data-theme="dark"] .phone-input .PhoneInputInput {
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+}
+
+[data-theme="dark"] .phone-input .PhoneInputCountrySelectArrow {
+  opacity: 0.8;
+}
+
diff --git a/packages/components/src/ui/phone-input.tsx b/packages/components/src/ui/phone-input.tsx
new file mode 100644
index 00000000..902f3f42
--- /dev/null
+++ b/packages/components/src/ui/phone-input.tsx
@@ -0,0 +1,39 @@
+import * as React from 'react';
+import PhoneInput from 'react-phone-number-input';
+import 'react-phone-number-input/style.css';
+import './phone-input.css';
+import { cn } from './utils';
+
+export interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
+  value?: string;
+  onChange?: (value?: string) => void;
+  defaultCountry?: string;
+  international?: boolean;
+  className?: string;
+  inputClassName?: string;
+}
+
+export const PhoneNumberInput = ({
+  value,
+  onChange,
+  defaultCountry = 'US',
+  international = true,
+  className,
+  inputClassName,
+  ...props
+}: PhoneInputProps & { ref?: React.Ref<HTMLInputElement> }) => {
+  return (
+    <div className={cn('phone-input-container', className)}>
+      <PhoneInput
+        value={value}
+        onChange={onChange}
+        defaultCountry={defaultCountry}
+        international={international}
+        className={cn('phone-input', inputClassName)}
+        {...props}
+      />
+    </div>
+  );
+};
+
+PhoneNumberInput.displayName = 'PhoneNumberInput';
diff --git a/yarn.lock b/yarn.lock
index 4cd7216c..567a766f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5027,6 +5027,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"classnames@npm:^2.5.1":
+  version: 2.5.1
+  resolution: "classnames@npm:2.5.1"
+  checksum: 10c0/afff4f77e62cea2d79c39962980bf316bacb0d7c49e13a21adaadb9221e1c6b9d3cdb829d8bb1b23c406f4e740507f37e1dcf506f7e3b7113d17c5bab787aa69
+  languageName: node
+  linkType: hard
+
 "clean-stack@npm:^2.0.0":
   version: 2.2.0
   resolution: "clean-stack@npm:2.2.0"
@@ -5210,6 +5217,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"country-flag-icons@npm:^1.5.17":
+  version: 1.5.19
+  resolution: "country-flag-icons@npm:1.5.19"
+  checksum: 10c0/f6adeadd7a406c593c8cfe4b3f0630d937188f79854755677448bd89024d404307b7a38b03612d5310c77c45ea535e0c409f24dc80d787673f1e3b35ddae43de
+  languageName: node
+  linkType: hard
+
 "create-jest@npm:^29.7.0":
   version: 29.7.0
   resolution: "create-jest@npm:29.7.0"
@@ -6187,6 +6201,7 @@ __metadata:
   dependencies:
     "@biomejs/biome": "npm:^1.9.4"
     "@changesets/cli": "npm:^2.27.11"
+    react-phone-number-input: "npm:^3.4.12"
     react-router-dom: "npm:^7.6.2"
     turbo: "npm:^2.3.3"
   languageName: unknown
@@ -6784,6 +6799,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"input-format@npm:^0.3.10":
+  version: 0.3.14
+  resolution: "input-format@npm:0.3.14"
+  dependencies:
+    prop-types: "npm:^15.8.1"
+  peerDependencies:
+    react: ">=18.1.0"
+    react-dom: ">=18.1.0"
+  peerDependenciesMeta:
+    react:
+      optional: true
+    react-dom:
+      optional: true
+  checksum: 10c0/37bb23e0dd15223b2ac8a25b09bc26e4d613cbd93c040dcdb490a1661dd0782c2742ad819b9dbd4b154a9e09ce1a69046a78e4ee943171b7ec86b07b50324ad6
+  languageName: node
+  linkType: hard
+
 "input-otp@npm:^1.4.1":
   version: 1.4.2
   resolution: "input-otp@npm:1.4.2"
@@ -7763,7 +7795,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"js-tokens@npm:^4.0.0":
+"js-tokens@npm:^3.0.0 || ^4.0.0, js-tokens@npm:^4.0.0":
   version: 4.0.0
   resolution: "js-tokens@npm:4.0.0"
   checksum: 10c0/e248708d377aa058eacf2037b07ded847790e6de892bbad3dac0abba2e759cb9f121b00099a65195616badcb6eca8d14d975cb3e89eb1cfda644756402c8aeed
@@ -7897,6 +7929,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"libphonenumber-js@npm:^1.11.20":
+  version: 1.12.12
+  resolution: "libphonenumber-js@npm:1.12.12"
+  checksum: 10c0/67b1e3f2e13d516860727a6837cdbe9cf94497a390ee7304f2666747798f534368f0772c5b5afe904188c86f243c713f55e9338f2c164a1a75d39bca110cb2b2
+  languageName: node
+  linkType: hard
+
 "lightningcss-darwin-arm64@npm:1.30.1":
   version: 1.30.1
   resolution: "lightningcss-darwin-arm64@npm:1.30.1"
@@ -8071,6 +8110,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"loose-envify@npm:^1.4.0":
+  version: 1.4.0
+  resolution: "loose-envify@npm:1.4.0"
+  dependencies:
+    js-tokens: "npm:^3.0.0 || ^4.0.0"
+  bin:
+    loose-envify: cli.js
+  checksum: 10c0/655d110220983c1a4b9c0c679a2e8016d4b67f6e9c7b5435ff5979ecdb20d0813f4dec0a08674fcbdd4846a3f07edbb50a36811fd37930b94aaa0d9daceb017e
+  languageName: node
+  linkType: hard
+
 "loupe@npm:^3.1.0, loupe@npm:^3.1.1, loupe@npm:^3.1.2, loupe@npm:^3.1.4":
   version: 3.2.0
   resolution: "loupe@npm:3.2.0"
@@ -8636,6 +8686,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"object-assign@npm:^4.1.1":
+  version: 4.1.1
+  resolution: "object-assign@npm:4.1.1"
+  checksum: 10c0/1f4df9945120325d041ccf7b86f31e8bcc14e73d29171e37a7903050e96b81323784ec59f93f102ec635bcf6fa8034ba3ea0a8c7e69fa202b87ae3b6cec5a414
+  languageName: node
+  linkType: hard
+
 "object-inspect@npm:^1.13.3":
   version: 1.13.4
   resolution: "object-inspect@npm:1.13.4"
@@ -9178,6 +9235,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"prop-types@npm:^15.8.1":
+  version: 15.8.1
+  resolution: "prop-types@npm:15.8.1"
+  dependencies:
+    loose-envify: "npm:^1.4.0"
+    object-assign: "npm:^4.1.1"
+    react-is: "npm:^16.13.1"
+  checksum: 10c0/59ece7ca2fb9838031d73a48d4becb9a7cc1ed10e610517c7d8f19a1e02fa47f7c27d557d8a5702bec3cfeccddc853579832b43f449e54635803f277b1c78077
+  languageName: node
+  linkType: hard
+
 "proxy-from-env@npm:^1.1.0":
   version: 1.1.0
   resolution: "proxy-from-env@npm:1.1.0"
@@ -9293,6 +9361,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-is@npm:^16.13.1":
+  version: 16.13.1
+  resolution: "react-is@npm:16.13.1"
+  checksum: 10c0/33977da7a5f1a287936a0c85639fec6ca74f4f15ef1e59a6bc20338fc73dc69555381e211f7a3529b8150a1f71e4225525b41b60b52965bda53ce7d47377ada1
+  languageName: node
+  linkType: hard
+
 "react-is@npm:^17.0.1":
   version: 17.0.2
   resolution: "react-is@npm:17.0.2"
@@ -9307,6 +9382,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-phone-number-input@npm:^3.4.12":
+  version: 3.4.12
+  resolution: "react-phone-number-input@npm:3.4.12"
+  dependencies:
+    classnames: "npm:^2.5.1"
+    country-flag-icons: "npm:^1.5.17"
+    input-format: "npm:^0.3.10"
+    libphonenumber-js: "npm:^1.11.20"
+    prop-types: "npm:^15.8.1"
+  peerDependencies:
+    react: ">=16.8"
+    react-dom: ">=16.8"
+  checksum: 10c0/96724e10c18c410602a1d03a93dfa9688b72a1f242891a1d565c4f77718f37463603b390360b8499320d5c5853feddb489bc17129c804a548f0c050f1bdef7e2
+  languageName: node
+  linkType: hard
+
 "react-refresh@npm:^0.14.0":
   version: 0.14.2
   resolution: "react-refresh@npm:0.14.2"

From 6ed8fea8daaddd0ed64fbfa67cc9c30940e761d7 Mon Sep 17 00:00:00 2001
From: "codegen-sh[bot]" <131295404+codegen-sh[bot]@users.noreply.github.com>
Date: Thu, 14 Aug 2025 19:21:17 +0000
Subject: [PATCH 2/5] Redesign phone input component with separate country
 select

- Replace built-in country dropdown with separate select input
- Match styling with existing text field component
- Update stories and tests to reflect new design
- Remove custom CSS in favor of existing text field styles

Co-authored-by: Jake Ruesink <jake@lambdacurry.com>
---
 .../remix-hook-form/phone-input.stories.tsx   |   3 +-
 .../src/remix-hook-form/phone-input.test.tsx  |  29 +++--
 .../components/src/ui/phone-input-field.tsx   |   7 +-
 packages/components/src/ui/phone-input.css    |  71 ------------
 packages/components/src/ui/phone-input.tsx    | 104 ++++++++++++++++--
 5 files changed, 120 insertions(+), 94 deletions(-)
 delete mode 100644 packages/components/src/ui/phone-input.css

diff --git a/apps/docs/src/remix-hook-form/phone-input.stories.tsx b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
index 0da127d2..0d3fc6ca 100644
--- a/apps/docs/src/remix-hook-form/phone-input.stories.tsx
+++ b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
@@ -183,7 +183,7 @@ const ControlledPhoneInputExample = () => {
       await userEvent.type(usaPhoneInput, '2025550123');
       
       // Enter an international phone number (UK format)
-      await userEvent.type(internationalPhoneInput, '447911123456');
+      await userEvent.type(internationalPhoneInput, '7911123456');
 
       // Submit form
       const submitButton = canvas.getByRole('button', { name: 'Submit' });
@@ -222,6 +222,7 @@ export const WithCustomStyling: Story = {
               defaultCountry="US"
               className="border-2 border-blue-500 p-4 rounded-lg"
               inputClassName="bg-gray-100"
+              selectClassName="bg-gray-100 border-blue-300"
             />
           </div>
           <Button type="submit" className="mt-8">
diff --git a/apps/docs/src/remix-hook-form/phone-input.test.tsx b/apps/docs/src/remix-hook-form/phone-input.test.tsx
index 67d9839c..9a41411d 100644
--- a/apps/docs/src/remix-hook-form/phone-input.test.tsx
+++ b/apps/docs/src/remix-hook-form/phone-input.test.tsx
@@ -86,6 +86,9 @@ describe('PhoneInput Component', () => {
       // Check for descriptions
       expect(screen.getByText('Enter a US phone number')).toBeInTheDocument();
       expect(screen.getByText('Enter an international phone number')).toBeInTheDocument();
+      
+      // Check for country select
+      expect(screen.getAllByLabelText('Country code')).toHaveLength(2);
     });
 
     it('displays validation errors when provided', async () => {
@@ -103,7 +106,7 @@ describe('PhoneInput Component', () => {
   });
 
   describe('Input Behavior', () => {
-    it('allows entering a US phone number', async () => {
+    it('allows entering a phone number', async () => {
       const user = userEvent.setup();
       render(<TestPhoneInputForm />);
 
@@ -112,25 +115,25 @@ describe('PhoneInput Component', () => {
       // Type a US phone number
       await user.type(usaPhoneInput, '2025550123');
       
-      // Check that the input contains the formatted number
+      // Check that the input contains the number
       await waitFor(() => {
-        expect(usaPhoneInput).toHaveValue('(202) 555-0123');
+        expect(usaPhoneInput).toHaveValue('2025550123');
       });
     });
 
-    it('allows entering an international phone number', async () => {
+    it('allows selecting a different country', async () => {
       const user = userEvent.setup();
       render(<TestPhoneInputForm />);
 
-      const internationalPhoneInput = screen.getByLabelText('International Phone Number');
+      // Get the country select for international phone
+      const countrySelects = screen.getAllByLabelText('Country code');
+      const internationalCountrySelect = countrySelects[1];
       
-      // Type a UK phone number
-      await user.type(internationalPhoneInput, '447911123456');
+      // Change country to UK (GB)
+      await user.selectOptions(internationalCountrySelect, 'GB');
       
-      // Check that the input contains the formatted number
-      await waitFor(() => {
-        expect(internationalPhoneInput).toHaveValue('+44 7911 123456');
-      });
+      // Check that the select has the new value
+      expect(internationalCountrySelect).toHaveValue('GB');
     });
   });
 
@@ -166,6 +169,10 @@ describe('PhoneInput Component', () => {
       // Verify labels are properly associated with inputs
       expect(screen.getByLabelText('USA Phone Number')).toBeInTheDocument();
       expect(screen.getByLabelText('International Phone Number')).toBeInTheDocument();
+      
+      // Verify country selects have proper aria-labels
+      const countrySelects = screen.getAllByLabelText('Country code');
+      expect(countrySelects).toHaveLength(2);
     });
   });
 });
diff --git a/packages/components/src/ui/phone-input-field.tsx b/packages/components/src/ui/phone-input-field.tsx
index 65719700..eb03ee1b 100644
--- a/packages/components/src/ui/phone-input-field.tsx
+++ b/packages/components/src/ui/phone-input-field.tsx
@@ -21,6 +21,8 @@ export interface PhoneInputFieldProps extends Omit<PhoneInputProps, 'value' | 'o
     Input?: React.ComponentType<PhoneInputProps & React.RefAttributes<HTMLInputElement>>;
   };
   className?: string;
+  inputClassName?: string;
+  selectClassName?: string;
 }
 
 export const PhoneInputField = function PhoneInputField({
@@ -29,6 +31,8 @@ export const PhoneInputField = function PhoneInputField({
   label,
   description,
   className,
+  inputClassName,
+  selectClassName,
   components,
   ref,
   ...props
@@ -49,7 +53,8 @@ export const PhoneInputField = function PhoneInputField({
                 {...field}
                 {...props}
                 ref={ref}
-                className={cn('focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2')}
+                inputClassName={inputClassName}
+                selectClassName={selectClassName}
               />
             </FormControl>
             {description && <FormDescription Component={components?.FormDescription}>{description}</FormDescription>}
diff --git a/packages/components/src/ui/phone-input.css b/packages/components/src/ui/phone-input.css
deleted file mode 100644
index 9cff6174..00000000
--- a/packages/components/src/ui/phone-input.css
+++ /dev/null
@@ -1,71 +0,0 @@
-/* Custom styles for phone input to match the form library's design */
-.phone-input-container {
-  position: relative;
-  width: 100%;
-}
-
-.phone-input {
-  display: flex;
-  width: 100%;
-}
-
-.phone-input .PhoneInputInput {
-  flex: 1;
-  padding: 0.5rem;
-  border-radius: 0.375rem;
-  border: 1px solid hsl(var(--input));
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
-
-.phone-input .PhoneInputInput:focus {
-  outline: none;
-  border-color: hsl(var(--ring));
-}
-
-.phone-input .PhoneInputCountry {
-  margin-right: 0.5rem;
-  display: flex;
-  align-items: center;
-}
-
-.phone-input .PhoneInputCountryIcon {
-  width: 1.5rem;
-  height: 1rem;
-}
-
-.phone-input .PhoneInputCountrySelectArrow {
-  margin-left: 0.25rem;
-  width: 0.5rem;
-  height: 0.5rem;
-  border-style: solid;
-  border-color: currentColor transparent transparent;
-  border-width: 0.25rem 0.25rem 0;
-  opacity: 0.6;
-}
-
-.phone-input .PhoneInputCountrySelect {
-  position: absolute;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  z-index: 1;
-  border: 0;
-  opacity: 0;
-  cursor: pointer;
-}
-
-/* Adjust for dark mode */
-[data-theme="dark"] .phone-input .PhoneInputInput {
-  background-color: hsl(var(--background));
-  color: hsl(var(--foreground));
-}
-
-[data-theme="dark"] .phone-input .PhoneInputCountrySelectArrow {
-  opacity: 0.8;
-}
-
diff --git a/packages/components/src/ui/phone-input.tsx b/packages/components/src/ui/phone-input.tsx
index 902f3f42..30d2b279 100644
--- a/packages/components/src/ui/phone-input.tsx
+++ b/packages/components/src/ui/phone-input.tsx
@@ -1,9 +1,11 @@
 import * as React from 'react';
-import PhoneInput from 'react-phone-number-input';
-import 'react-phone-number-input/style.css';
-import './phone-input.css';
+import { getCountries, getCountryCallingCode } from 'react-phone-number-input/input';
+import { parsePhoneNumber, AsYouType, isValidPhoneNumber } from 'libphonenumber-js';
 import { cn } from './utils';
 
+// Import country flags
+import 'country-flag-icons/css/flag-icons.min.css';
+
 export interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
   value?: string;
   onChange?: (value?: string) => void;
@@ -11,6 +13,7 @@ export interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInpu
   international?: boolean;
   className?: string;
   inputClassName?: string;
+  selectClassName?: string;
 }
 
 export const PhoneNumberInput = ({
@@ -20,16 +23,96 @@ export const PhoneNumberInput = ({
   international = true,
   className,
   inputClassName,
+  selectClassName,
   ...props
 }: PhoneInputProps & { ref?: React.Ref<HTMLInputElement> }) => {
+  const [selectedCountry, setSelectedCountry] = React.useState(defaultCountry);
+  const [inputValue, setInputValue] = React.useState('');
+  const inputRef = React.useRef<HTMLInputElement>(null);
+
+  // Get list of countries
+  const countries = React.useMemo(() => getCountries(), []);
+
+  // Format the full phone number (with country code)
+  const formatFullNumber = React.useCallback((country: string, nationalNumber: string) => {
+    if (!nationalNumber) return '';
+    
+    const formatter = new AsYouType(country);
+    const formatted = formatter.input(nationalNumber);
+    
+    if (international) {
+      return `+${getCountryCallingCode(country)}${formatted.startsWith('+') ? formatted.substring(1) : formatted}`;
+    }
+    
+    return formatted;
+  }, [international]);
+
+  // Initialize input value from props
+  React.useEffect(() => {
+    if (value) {
+      try {
+        const phoneNumber = parsePhoneNumber(value);
+        if (phoneNumber) {
+          setSelectedCountry(phoneNumber.country || defaultCountry);
+          setInputValue(phoneNumber.nationalNumber || '');
+        }
+      } catch (error) {
+        // If parsing fails, just use the value as is
+        setInputValue(value);
+      }
+    } else {
+      setInputValue('');
+    }
+  }, [value, defaultCountry]);
+
+  // Handle country change
+  const handleCountryChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    const newCountry = e.target.value;
+    setSelectedCountry(newCountry);
+    
+    // Update the full number with the new country code
+    const fullNumber = formatFullNumber(newCountry, inputValue);
+    onChange?.(fullNumber);
+  };
+
+  // Handle input change
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const newInput = e.target.value;
+    setInputValue(newInput);
+    
+    // Update the full number
+    const fullNumber = formatFullNumber(selectedCountry, newInput);
+    onChange?.(fullNumber);
+  };
+
   return (
-    <div className={cn('phone-input-container', className)}>
-      <PhoneInput
-        value={value}
-        onChange={onChange}
-        defaultCountry={defaultCountry}
-        international={international}
-        className={cn('phone-input', inputClassName)}
+    <div className={cn('flex gap-2', className)}>
+      <select
+        value={selectedCountry}
+        onChange={handleCountryChange}
+        className={cn(
+          'flex h-10 w-auto text-base sm:text-sm rounded-md border border-input bg-background px-3 py-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          selectClassName
+        )}
+        aria-label="Country code"
+      >
+        {countries.map((country) => (
+          <option key={country} value={country}>
+            {country} +{getCountryCallingCode(country)}
+          </option>
+        ))}
+      </select>
+      
+      <input
+        ref={inputRef}
+        type="tel"
+        value={inputValue}
+        onChange={handleInputChange}
+        className={cn(
+          'flex h-10 w-full text-base sm:text-sm rounded-md border border-input bg-background px-3 py-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          inputClassName
+        )}
+        data-slot="input"
         {...props}
       />
     </div>
@@ -37,3 +120,4 @@ export const PhoneNumberInput = ({
 };
 
 PhoneNumberInput.displayName = 'PhoneNumberInput';
+

From b5cd28f63be1e684d076db1c4eca3e9bd9c3c9f8 Mon Sep 17 00:00:00 2001
From: "codegen-sh[bot]" <131295404+codegen-sh[bot]@users.noreply.github.com>
Date: Thu, 14 Aug 2025 19:25:08 +0000
Subject: [PATCH 3/5] Remove flag icons CSS import to fix build error

- Remove import for 'country-flag-icons/css/flag-icons.min.css' that was causing the CommonJS resolver error
- Simplify implementation to not rely on flag icons

Co-authored-by: Jake Ruesink <jake@lambdacurry.com>
---
 packages/components/src/ui/phone-input.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/ui/phone-input.tsx b/packages/components/src/ui/phone-input.tsx
index 30d2b279..ce83d12d 100644
--- a/packages/components/src/ui/phone-input.tsx
+++ b/packages/components/src/ui/phone-input.tsx
@@ -3,8 +3,8 @@ import { getCountries, getCountryCallingCode } from 'react-phone-number-input/in
 import { parsePhoneNumber, AsYouType, isValidPhoneNumber } from 'libphonenumber-js';
 import { cn } from './utils';
 
-// Import country flags
-import 'country-flag-icons/css/flag-icons.min.css';
+// Remove flag icons import that was causing the error
+// import 'country-flag-icons/css/flag-icons.min.css';
 
 export interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
   value?: string;

From 37bf9a89ffdd91ddd4b6c82f345805c9de04321f Mon Sep 17 00:00:00 2001
From: Jake Ruesink <jake@lambdacurry.dev>
Date: Thu, 14 Aug 2025 23:17:46 -0500
Subject: [PATCH 4/5] Refactor phone input component for improved usability and
 styling

- Update phone input stories to use consistent labels and props
- Change 'international' prop to 'isInternational' for clarity
- Enhance form submission handling and success message verification
- Adjust tests to reflect new input behavior and validation
- Improve styling and structure of phone input field for better user experience

Co-authored-by: Jake Ruesink <jake@lambdacurry.com>
---
 .../remix-hook-form/phone-input.stories.tsx   | 155 +++++---------
 .../src/remix-hook-form/phone-input.test.tsx  |  54 +++--
 .../src/remix-hook-form/phone-input.tsx       |   1 -
 packages/components/src/ui/form.tsx           |  16 +-
 .../components/src/ui/phone-input-field.tsx   |  35 ++--
 packages/components/src/ui/phone-input.tsx    | 189 +++++++++---------
 6 files changed, 195 insertions(+), 255 deletions(-)

diff --git a/apps/docs/src/remix-hook-form/phone-input.stories.tsx b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
index 0d3fc6ca..08e77343 100644
--- a/apps/docs/src/remix-hook-form/phone-input.stories.tsx
+++ b/apps/docs/src/remix-hook-form/phone-input.stories.tsx
@@ -8,6 +8,8 @@ import { RemixFormProvider, getValidatedFormData, useRemixForm } from 'remix-hoo
 import { z } from 'zod';
 import { withReactRouterStubDecorator } from '../lib/storybook/react-router-stub';
 
+const successMessageRegex = /Form submitted successfully/;
+
 // Define a schema for phone number validation
 const formSchema = z.object({
   usaPhone: z.string().min(1, 'USA phone number is required'),
@@ -37,16 +39,14 @@ const ControlledPhoneInputExample = () => {
         <div className="grid gap-8">
           <PhoneInput
             name="usaPhone"
-            label="USA Phone Number"
+            label="Phone Number"
             description="Enter a US phone number"
-            defaultCountry="US"
-            international={false}
           />
           <PhoneInput
             name="internationalPhone"
             label="International Phone Number"
             description="Enter an international phone number"
-            international={true}
+            isInternational={true}
           />
         </div>
         <Button type="submit" className="mt-8">
@@ -65,8 +65,8 @@ const handleFormSubmission = async (request: Request) => {
     return { errors };
   }
 
-  return { 
-    message: `Form submitted successfully! USA: ${data.usaPhone}, International: ${data.internationalPhone}` 
+  return {
+    message: `Form submitted successfully! USA: ${data.usaPhone}, International: ${data.internationalPhone}`,
   };
 };
 
@@ -75,6 +75,12 @@ const meta: Meta<typeof PhoneInput> = {
   component: PhoneInput,
   parameters: { layout: 'centered' },
   tags: ['autodocs'],
+} satisfies Meta<typeof PhoneInput>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
   decorators: [
     withReactRouterStubDecorator({
       routes: [
@@ -86,12 +92,6 @@ const meta: Meta<typeof PhoneInput> = {
       ],
     }),
   ],
-} satisfies Meta<typeof PhoneInput>;
-
-export default meta;
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {
   parameters: {
     docs: {
       description: {
@@ -125,16 +125,14 @@ const ControlledPhoneInputExample = () => {
         <div className="grid gap-8">
           <PhoneInput
             name="usaPhone"
-            label="USA Phone Number"
+            label="Phone Number"
             description="Enter a US phone number"
-            defaultCountry="US"
-            international={false}
           />
           <PhoneInput
             name="internationalPhone"
             label="International Phone Number"
             description="Enter an international phone number"
-            international={true}
+            isInternational
           />
         </div>
         <Button type="submit" className="mt-8">
@@ -152,21 +150,21 @@ const ControlledPhoneInputExample = () => {
     const canvas = within(canvasElement);
 
     await step('Verify initial state', async () => {
-      // Verify phone input fields are present
-      const usaPhoneLabel = canvas.getByLabelText('USA Phone Number');
-      const internationalPhoneLabel = canvas.getByLabelText('International Phone Number');
-      
+      // Wait for inputs to be mounted and associated with their labels
+      const usaPhoneLabel = await canvas.findByLabelText('Phone Number');
+      const internationalPhoneLabel = await canvas.findByLabelText('International Phone Number');
+
       expect(usaPhoneLabel).toBeInTheDocument();
       expect(internationalPhoneLabel).toBeInTheDocument();
 
-      // Verify submit button is present
-      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      // Wait for submit button to be present
+      const submitButton = await canvas.findByRole('button', { name: 'Submit' });
       expect(submitButton).toBeInTheDocument();
     });
 
     await step('Test validation errors on invalid submission', async () => {
       // Submit form without entering phone numbers
-      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      const submitButton = await canvas.findByRole('button', { name: 'Submit' });
       await userEvent.click(submitButton);
 
       // Verify validation error messages appear
@@ -175,27 +173,36 @@ const ControlledPhoneInputExample = () => {
     });
 
     await step('Test successful form submission with valid phone numbers', async () => {
-      // Enter valid phone numbers
-      const usaPhoneInput = canvas.getByLabelText('USA Phone Number');
-      const internationalPhoneInput = canvas.getByLabelText('International Phone Number');
+      // Enter valid phone numbers (await the inputs before typing)
+      const usaPhoneInput = await canvas.findByLabelText('Phone Number');
+      const internationalPhoneInput = await canvas.findByLabelText('International Phone Number');
 
-      // Enter a US phone number
+      // Enter a US phone number (should format to (202) 555-0123)
       await userEvent.type(usaPhoneInput, '2025550123');
-      
-      // Enter an international phone number (UK format)
+
+      // Enter an international phone number (UK example digits; component will normalize & format with + and spaces)
       await userEvent.type(internationalPhoneInput, '7911123456');
 
       // Submit form
-      const submitButton = canvas.getByRole('button', { name: 'Submit' });
+      const submitButton = await canvas.findByRole('button', { name: 'Submit' });
       await userEvent.click(submitButton);
 
-      // Verify success message
-      await expect(canvas.findByText(/Form submitted successfully/)).resolves.toBeInTheDocument();
+      // Verify success message (regex matches the prefix of the success text)
+      await expect(canvas.findByText(successMessageRegex)).resolves.toBeInTheDocument();
     });
   },
 };
 
 export const WithCustomStyling: Story = {
+  decorators: [
+    withReactRouterStubDecorator({
+      routes: [
+        {
+          path: '/',
+        },
+      ],
+    }),
+  ],
   render: () => {
     const fetcher = useFetcher<{ message: string }>();
     const methods = useRemixForm<FormData>({
@@ -219,85 +226,16 @@ export const WithCustomStyling: Story = {
               name="usaPhone"
               label="Custom Styled Phone Input"
               description="With custom styling applied"
-              defaultCountry="US"
               className="border-2 border-blue-500 p-4 rounded-lg"
               inputClassName="bg-gray-100"
-              selectClassName="bg-gray-100 border-blue-300"
-            />
-          </div>
-          <Button type="submit" className="mt-8">
-            Submit
-          </Button>
-        </fetcher.Form>
-      </RemixFormProvider>
-    );
-  },
-  parameters: {
-    docs: {
-      description: {
-        story: 'Phone input with custom styling applied.',
-      },
-    },
-  },
-};
-
-export const WithDifferentDefaultCountries: Story = {
-  render: () => {
-    const fetcher = useFetcher<{ message: string }>();
-    const methods = useRemixForm<{
-      usPhone: string;
-      ukPhone: string;
-      canadaPhone: string;
-      australiaPhone: string;
-    }>({
-      resolver: zodResolver(
-        z.object({
-          usPhone: z.string().optional(),
-          ukPhone: z.string().optional(),
-          canadaPhone: z.string().optional(),
-          australiaPhone: z.string().optional(),
-        })
-      ),
-      defaultValues: {
-        usPhone: '',
-        ukPhone: '',
-        canadaPhone: '',
-        australiaPhone: '',
-      },
-      fetcher,
-      submitConfig: {
-        action: '/',
-        method: 'post',
-      },
-    });
-
-    return (
-      <RemixFormProvider {...methods}>
-        <fetcher.Form onSubmit={methods.handleSubmit}>
-          <div className="grid gap-8">
-            <PhoneInput
-              name="usPhone"
-              label="US Phone Number"
-              defaultCountry="US"
-              international={true}
             />
             <PhoneInput
-              name="ukPhone"
-              label="UK Phone Number"
-              defaultCountry="GB"
-              international={true}
-            />
-            <PhoneInput
-              name="canadaPhone"
-              label="Canada Phone Number"
-              defaultCountry="CA"
-              international={true}
-            />
-            <PhoneInput
-              name="australiaPhone"
-              label="Australia Phone Number"
-              defaultCountry="AU"
-              international={true}
+              name="internationalPhone"
+              label="Custom Styled Intl Phone Input"
+              description="With custom styling applied"
+              isInternational
+              className="border-2 border-blue-500 p-4 rounded-lg"
+              inputClassName="bg-gray-100"
             />
           </div>
           <Button type="submit" className="mt-8">
@@ -310,9 +248,8 @@ export const WithDifferentDefaultCountries: Story = {
   parameters: {
     docs: {
       description: {
-        story: 'Phone inputs with different default countries.',
+        story: 'Phone input with custom styling applied for US and International modes.',
       },
     },
   },
 };
-
diff --git a/apps/docs/src/remix-hook-form/phone-input.test.tsx b/apps/docs/src/remix-hook-form/phone-input.test.tsx
index 9a41411d..b5888e1b 100644
--- a/apps/docs/src/remix-hook-form/phone-input.test.tsx
+++ b/apps/docs/src/remix-hook-form/phone-input.test.tsx
@@ -53,15 +53,13 @@ const TestPhoneInputForm = ({
           name="usaPhone"
           label="USA Phone Number"
           description="Enter a US phone number"
-          defaultCountry="US"
-          international={false}
           components={customComponents}
         />
         <PhoneInput
           name="internationalPhone"
           label="International Phone Number"
           description="Enter an international phone number"
-          international={true}
+          isInternational
           components={customComponents}
         />
         <Button type="submit">Submit</Button>
@@ -86,9 +84,6 @@ describe('PhoneInput Component', () => {
       // Check for descriptions
       expect(screen.getByText('Enter a US phone number')).toBeInTheDocument();
       expect(screen.getByText('Enter an international phone number')).toBeInTheDocument();
-      
-      // Check for country select
-      expect(screen.getAllByLabelText('Country code')).toHaveLength(2);
     });
 
     it('displays validation errors when provided', async () => {
@@ -106,34 +101,36 @@ describe('PhoneInput Component', () => {
   });
 
   describe('Input Behavior', () => {
-    it('allows entering a phone number', async () => {
+    it('formats and caps US number at 10 digits', async () => {
       const user = userEvent.setup();
       render(<TestPhoneInputForm />);
 
-      const usaPhoneInput = screen.getByLabelText('USA Phone Number');
-      
-      // Type a US phone number
-      await user.type(usaPhoneInput, '2025550123');
-      
-      // Check that the input contains the number
+      const usaPhoneInput = screen.getByLabelText('USA Phone Number') as HTMLInputElement;
+
+      // Type more than 10 digits
+      await user.type(usaPhoneInput, '2025550123456');
+
+      // Display should be formatted and capped: (202) 555-0123
       await waitFor(() => {
-        expect(usaPhoneInput).toHaveValue('2025550123');
+        expect(usaPhoneInput.value).toBe('(202) 555-0123');
       });
     });
 
-    it('allows selecting a different country', async () => {
+    it('accepts international number with + and inserts spaces', async () => {
       const user = userEvent.setup();
       render(<TestPhoneInputForm />);
 
-      // Get the country select for international phone
-      const countrySelects = screen.getAllByLabelText('Country code');
-      const internationalCountrySelect = countrySelects[1];
-      
-      // Change country to UK (GB)
-      await user.selectOptions(internationalCountrySelect, 'GB');
-      
-      // Check that the select has the new value
-      expect(internationalCountrySelect).toHaveValue('GB');
+      const intlInput = screen.getByLabelText('International Phone Number') as HTMLInputElement;
+
+      // Type digits without +; component should normalize to + and format
+      await user.type(intlInput, '7911123456');
+
+      await waitFor(() => {
+        expect(intlInput.value.startsWith('+')).toBe(true);
+        // Digits (without non-digits) should match what was typed with leading country code
+        const digitsOnly = intlInput.value.replace(/\D/g, '');
+        expect(digitsOnly.endsWith('7911123456')).toBe(true);
+      });
     });
   });
 
@@ -162,18 +159,13 @@ describe('PhoneInput Component', () => {
 
       const usaPhoneLabel = screen.getByText('USA Phone Number');
       const internationalPhoneLabel = screen.getByText('International Phone Number');
-      
+
       expect(usaPhoneLabel).toBeInTheDocument();
       expect(internationalPhoneLabel).toBeInTheDocument();
-      
+
       // Verify labels are properly associated with inputs
       expect(screen.getByLabelText('USA Phone Number')).toBeInTheDocument();
       expect(screen.getByLabelText('International Phone Number')).toBeInTheDocument();
-      
-      // Verify country selects have proper aria-labels
-      const countrySelects = screen.getAllByLabelText('Country code');
-      expect(countrySelects).toHaveLength(2);
     });
   });
 });
-
diff --git a/packages/components/src/remix-hook-form/phone-input.tsx b/packages/components/src/remix-hook-form/phone-input.tsx
index 6b54e410..22173ef7 100644
--- a/packages/components/src/remix-hook-form/phone-input.tsx
+++ b/packages/components/src/remix-hook-form/phone-input.tsx
@@ -26,4 +26,3 @@ export const PhoneInput = function RemixPhoneInput(props: PhoneInputProps & { re
 };
 
 PhoneInput.displayName = 'PhoneInput';
-
diff --git a/packages/components/src/ui/form.tsx b/packages/components/src/ui/form.tsx
index 6d1f4ae9..867b5ce7 100644
--- a/packages/components/src/ui/form.tsx
+++ b/packages/components/src/ui/form.tsx
@@ -135,11 +135,17 @@ export interface FormMessageProps extends React.HTMLAttributes<HTMLParagraphElem
   Component?: React.ComponentType<FormMessageProps>;
 }
 
-export function FormMessage({ Component, className, ...props }: FormMessageProps) {
-  const { formMessageId, error, children } = props;
-
+export function FormMessage({
+  Component,
+  className,
+  formMessageId,
+  error,
+  children,
+  ...rest
+}: FormMessageProps) {
   if (Component) {
-    return <Component id={formMessageId} className={className} {...props} />;
+    // Ensure custom props do not leak to DOM by not spreading them
+    return <Component id={formMessageId} className={className} error={error} {...rest}>{children}</Component>;
   }
 
   const body = error ? error : children;
@@ -153,7 +159,7 @@ export function FormMessage({ Component, className, ...props }: FormMessageProps
       id={formMessageId}
       className={cn('form-message text-sm font-medium text-destructive', className)}
       data-slot="form-message"
-      {...props}
+      {...rest}
     >
       {body}
     </p>
diff --git a/packages/components/src/ui/phone-input-field.tsx b/packages/components/src/ui/phone-input-field.tsx
index eb03ee1b..175f547b 100644
--- a/packages/components/src/ui/phone-input-field.tsx
+++ b/packages/components/src/ui/phone-input-field.tsx
@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { Control, FieldPath, FieldValues } from 'react-hook-form';
 import {
   type FieldComponents,
@@ -18,11 +18,10 @@ export interface PhoneInputFieldProps extends Omit<PhoneInputProps, 'value' | 'o
   label?: string | React.ReactNode;
   description?: string;
   components?: Partial<FieldComponents> & {
-    Input?: React.ComponentType<PhoneInputProps & React.RefAttributes<HTMLInputElement>>;
+    Input?: (props: PhoneInputProps & { ref?: React.Ref<HTMLInputElement> }) => React.ReactElement;
   };
   className?: string;
   inputClassName?: string;
-  selectClassName?: string;
 }
 
 export const PhoneInputField = function PhoneInputField({
@@ -32,7 +31,6 @@ export const PhoneInputField = function PhoneInputField({
   description,
   className,
   inputClassName,
-  selectClassName,
   components,
   ref,
   ...props
@@ -48,16 +46,24 @@ export const PhoneInputField = function PhoneInputField({
         return (
           <FormItem className={className}>
             {label && <FormLabel Component={components?.FormLabel}>{label}</FormLabel>}
-            <FormControl Component={components?.FormControl}>
-              <InputComponent
-                {...field}
-                {...props}
-                ref={ref}
-                inputClassName={inputClassName}
-                selectClassName={selectClassName}
-              />
-            </FormControl>
-            {description && <FormDescription Component={components?.FormDescription}>{description}</FormDescription>}
+            <div
+              className={cn(
+                'flex group transition-all duration-200 rounded-md focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 focus-within:ring-offset-background',
+              )}
+            >
+              <FormControl Component={components?.FormControl}>
+                <InputComponent
+                  {...field}
+                  {...props}
+                  ref={ref}
+                  className={cn('w-full', props.className)}
+                  inputClassName={cn('focus-visible:ring-0 focus-visible:ring-offset-0 border-input', inputClassName)}
+                />
+              </FormControl>
+            </div>
+            {description && (
+              <FormDescription Component={components?.FormDescription}>{description}</FormDescription>
+            )}
             {fieldState.error && (
               <FormMessage Component={components?.FormMessage}>{fieldState.error.message}</FormMessage>
             )}
@@ -69,4 +75,3 @@ export const PhoneInputField = function PhoneInputField({
 };
 
 PhoneInputField.displayName = 'PhoneInputField';
-
diff --git a/packages/components/src/ui/phone-input.tsx b/packages/components/src/ui/phone-input.tsx
index ce83d12d..9c86dab9 100644
--- a/packages/components/src/ui/phone-input.tsx
+++ b/packages/components/src/ui/phone-input.tsx
@@ -1,123 +1,124 @@
-import * as React from 'react';
-import { getCountries, getCountryCallingCode } from 'react-phone-number-input/input';
-import { parsePhoneNumber, AsYouType, isValidPhoneNumber } from 'libphonenumber-js';
-import { cn } from './utils';
+import { AsYouType } from 'libphonenumber-js';
+import type { ChangeEvent, InputHTMLAttributes, KeyboardEvent, Ref } from 'react';
+import { useEffect, useRef, useState } from 'react';
 
-// Remove flag icons import that was causing the error
-// import 'country-flag-icons/css/flag-icons.min.css';
+import { cn } from './utils';
 
-export interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
+export interface PhoneInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {
+  /** Controlled value. For US numbers this should be the digits-only 10-char string. For international, E.164 string (e.g. "+12025550123") is recommended. */
   value?: string;
+  /** onChange fires with a normalized value. US: digits-only (max 10). International: E.164 with leading + when possible, otherwise a '+'-prefixed digits string. */
   onChange?: (value?: string) => void;
-  defaultCountry?: string;
-  international?: boolean;
+  /** When true, enables international entry (+country code, spaced groups, no strict length cap). Defaults to false (US). */
+  isInternational?: boolean;
   className?: string;
   inputClassName?: string;
-  selectClassName?: string;
+}
+
+const DIGITS_REGEX = /\d/g;
+const NUMBER_KEY_REGEX = /^[0-9]$/;
+
+function extractDigits(input: string): string {
+  return (input.match(DIGITS_REGEX) || []).join('');
+}
+
+function formatUS(digits: string): string {
+  const d = digits.slice(0, 10);
+  if (d.length === 0) return '';
+  if (d.length <= 3) return `(${d}`;
+  if (d.length <= 6) return `(${d.slice(0, 3)}) ${d.slice(3)}`;
+  return `(${d.slice(0, 3)}) ${d.slice(3, 6)}-${d.slice(6)}`;
+}
+
+function normalizeInternationalInput(raw: string): string {
+  // Keep a single leading +, strip other non-digits
+  const trimmed = raw.trim();
+  const hasPlus = trimmed.startsWith('+');
+  const digits = extractDigits(trimmed);
+  return hasPlus ? `+${digits}` : digits.length > 0 ? `+${digits}` : '+';
 }
 
 export const PhoneNumberInput = ({
   value,
   onChange,
-  defaultCountry = 'US',
-  international = true,
+  isInternational = false,
   className,
   inputClassName,
-  selectClassName,
   ...props
-}: PhoneInputProps & { ref?: React.Ref<HTMLInputElement> }) => {
-  const [selectedCountry, setSelectedCountry] = React.useState(defaultCountry);
-  const [inputValue, setInputValue] = React.useState('');
-  const inputRef = React.useRef<HTMLInputElement>(null);
+}: PhoneInputProps & { ref?: Ref<HTMLInputElement> }) => {
+  const [display, setDisplay] = useState('');
+  const inputRef = useRef<HTMLInputElement>(null);
 
-  // Get list of countries
-  const countries = React.useMemo(() => getCountries(), []);
-
-  // Format the full phone number (with country code)
-  const formatFullNumber = React.useCallback((country: string, nationalNumber: string) => {
-    if (!nationalNumber) return '';
-    
-    const formatter = new AsYouType(country);
-    const formatted = formatter.input(nationalNumber);
-    
-    if (international) {
-      return `+${getCountryCallingCode(country)}${formatted.startsWith('+') ? formatted.substring(1) : formatted}`;
+  // Sync controlled value - handle autofill and external changes
+  useEffect(() => {
+    if (value == null || value === '') {
+      setDisplay('');
+      return;
     }
-    
-    return formatted;
-  }, [international]);
 
-  // Initialize input value from props
-  React.useEffect(() => {
-    if (value) {
-      try {
-        const phoneNumber = parsePhoneNumber(value);
-        if (phoneNumber) {
-          setSelectedCountry(phoneNumber.country || defaultCountry);
-          setInputValue(phoneNumber.nationalNumber || '');
-        }
-      } catch (error) {
-        // If parsing fails, just use the value as is
-        setInputValue(value);
-      }
+    if (isInternational) {
+      const normalized = normalizeInternationalInput(String(value));
+      const typer = new AsYouType();
+      const formatted = typer.input(normalized);
+      setDisplay(formatted);
     } else {
-      setInputValue('');
+      const digits = extractDigits(String(value)).slice(0, 10);
+      setDisplay(formatUS(digits));
+    }
+  }, [value, isInternational]);
+
+  const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+    const raw = e.target.value ?? '';
+
+    if (isInternational) {
+      const normalized = normalizeInternationalInput(raw);
+      const typer = new AsYouType();
+      const formatted = typer.input(normalized);
+      setDisplay(formatted);
+      const numberValue = typer.getNumberValue(); // E.164 including leading + when recognized
+      onChange?.(numberValue || normalized);
+      return;
     }
-  }, [value, defaultCountry]);
 
-  // Handle country change
-  const handleCountryChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    const newCountry = e.target.value;
-    setSelectedCountry(newCountry);
-    
-    // Update the full number with the new country code
-    const fullNumber = formatFullNumber(newCountry, inputValue);
-    onChange?.(fullNumber);
+    const digits = extractDigits(raw).slice(0, 10);
+    const formatted = formatUS(digits);
+    setDisplay(formatted);
+    onChange?.(digits || undefined);
   };
 
-  // Handle input change
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const newInput = e.target.value;
-    setInputValue(newInput);
-    
-    // Update the full number
-    const fullNumber = formatFullNumber(selectedCountry, newInput);
-    onChange?.(fullNumber);
+  const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
+    if (!isInternational) {
+      const currentDigits = extractDigits(display);
+      const isNumberKey = NUMBER_KEY_REGEX.test(e.key);
+      const isModifier = e.ctrlKey || e.metaKey || e.altKey;
+      const allowed = ['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab', 'Home', 'End', 'Enter'];
+      if (!isModifier && isNumberKey && currentDigits.length >= 10) {
+        // Prevent adding more digits once 10-digit US number is complete
+        e.preventDefault();
+        return;
+      }
+      if (allowed.includes(e.key)) return;
+      // Allow other typical keys; restriction handled by formatting and slice(0,10)
+    }
   };
 
   return (
-    <div className={cn('flex gap-2', className)}>
-      <select
-        value={selectedCountry}
-        onChange={handleCountryChange}
-        className={cn(
-          'flex h-10 w-auto text-base sm:text-sm rounded-md border border-input bg-background px-3 py-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
-          selectClassName
-        )}
-        aria-label="Country code"
-      >
-        {countries.map((country) => (
-          <option key={country} value={country}>
-            {country} +{getCountryCallingCode(country)}
-          </option>
-        ))}
-      </select>
-      
-      <input
-        ref={inputRef}
-        type="tel"
-        value={inputValue}
-        onChange={handleInputChange}
-        className={cn(
-          'flex h-10 w-full text-base sm:text-sm rounded-md border border-input bg-background px-3 py-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
-          inputClassName
-        )}
-        data-slot="input"
-        {...props}
-      />
-    </div>
+    <input
+      ref={inputRef}
+      type="tel"
+      inputMode={isInternational ? 'tel' : 'numeric'}
+      className={cn(
+        'flex h-10 w-full text-base sm:text-sm rounded-md border border-input bg-background px-3 py-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+        inputClassName,
+      )}
+      data-slot="input"
+      aria-label={props['aria-label']}
+      {...props}
+      value={display}
+      onChange={handleInputChange}
+      onKeyDown={handleKeyDown}
+    />
   );
 };
 
 PhoneNumberInput.displayName = 'PhoneNumberInput';
-

From 8cf03678132ef439ca3231a1d586c6491f66c406 Mon Sep 17 00:00:00 2001
From: Jake Ruesink <jake@lambdacurry.dev>
Date: Thu, 14 Aug 2025 23:19:54 -0500
Subject: [PATCH 5/5] Update dependencies and bump package version to 0.19.3

- Upgrade various dependencies in yarn.lock for improved stability and performance
- Bump version of @lambdacurry/forms to 0.19.3 to reflect changes in dependencies

Co-authored-by: Jake Ruesink <jake@lambdacurry.com>
---
 packages/components/package.json |    2 +-
 yarn.lock                        | 1101 ++++++++++++++++--------------
 2 files changed, 580 insertions(+), 523 deletions(-)

diff --git a/packages/components/package.json b/packages/components/package.json
index c8eb783b..3638749c 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@lambdacurry/forms",
-  "version": "0.19.2",
+  "version": "0.19.3",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
diff --git a/yarn.lock b/yarn.lock
index 567a766f..c264a3c2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6,9 +6,9 @@ __metadata:
   cacheKey: 10c0
 
 "@adobe/css-tools@npm:^4.4.0":
-  version: 4.4.3
-  resolution: "@adobe/css-tools@npm:4.4.3"
-  checksum: 10c0/6d16c4d4b6752d73becf6e58611f893c7ed96e04017ff7084310901ccdbe0295171b722b158f6a2b0aa77182ef3446ffd62b39488fa5a7adab1f0dfe5ffafbae
+  version: 4.4.4
+  resolution: "@adobe/css-tools@npm:4.4.4"
+  checksum: 10c0/8f3e6cfaa5e6286e6f05de01d91d060425be2ebaef490881f5fe6da8bbdb336835c5d373ea337b0c3b0a1af4be048ba18780f0f6021d30809b4545922a7e13d9
   languageName: node
   linkType: hard
 
@@ -19,7 +19,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@ampproject/remapping@npm:^2.2.0, @ampproject/remapping@npm:^2.3.0":
+"@ampproject/remapping@npm:^2.2.0":
   version: 2.3.0
   resolution: "@ampproject/remapping@npm:2.3.0"
   dependencies:
@@ -48,42 +48,42 @@ __metadata:
   linkType: hard
 
 "@babel/core@npm:^7.11.6, @babel/core@npm:^7.12.3, @babel/core@npm:^7.18.9, @babel/core@npm:^7.22.5, @babel/core@npm:^7.23.7, @babel/core@npm:^7.23.9, @babel/core@npm:^7.27.7, @babel/core@npm:^7.28.0, @babel/core@npm:^7.7.5":
-  version: 7.28.0
-  resolution: "@babel/core@npm:7.28.0"
+  version: 7.28.3
+  resolution: "@babel/core@npm:7.28.3"
   dependencies:
     "@ampproject/remapping": "npm:^2.2.0"
     "@babel/code-frame": "npm:^7.27.1"
-    "@babel/generator": "npm:^7.28.0"
+    "@babel/generator": "npm:^7.28.3"
     "@babel/helper-compilation-targets": "npm:^7.27.2"
-    "@babel/helper-module-transforms": "npm:^7.27.3"
-    "@babel/helpers": "npm:^7.27.6"
-    "@babel/parser": "npm:^7.28.0"
+    "@babel/helper-module-transforms": "npm:^7.28.3"
+    "@babel/helpers": "npm:^7.28.3"
+    "@babel/parser": "npm:^7.28.3"
     "@babel/template": "npm:^7.27.2"
-    "@babel/traverse": "npm:^7.28.0"
-    "@babel/types": "npm:^7.28.0"
+    "@babel/traverse": "npm:^7.28.3"
+    "@babel/types": "npm:^7.28.2"
     convert-source-map: "npm:^2.0.0"
     debug: "npm:^4.1.0"
     gensync: "npm:^1.0.0-beta.2"
     json5: "npm:^2.2.3"
     semver: "npm:^6.3.1"
-  checksum: 10c0/423302e7c721e73b1c096217880272e02020dfb697a55ccca60ad01bba90037015f84d0c20c6ce297cf33a19bb704bc5c2b3d3095f5284dfa592bd1de0b9e8c3
+  checksum: 10c0/e6b3eb830c4b93f5a442b305776df1cd2bb4fafa4612355366f67c764f3e54a69d45b84def77fb2d4fd83439102667b0a92c3ea2838f678733245b748c602a7b
   languageName: node
   linkType: hard
 
-"@babel/generator@npm:^7.22.5, @babel/generator@npm:^7.27.5, @babel/generator@npm:^7.28.0, @babel/generator@npm:^7.7.2":
-  version: 7.28.0
-  resolution: "@babel/generator@npm:7.28.0"
+"@babel/generator@npm:^7.22.5, @babel/generator@npm:^7.27.5, @babel/generator@npm:^7.28.3, @babel/generator@npm:^7.7.2":
+  version: 7.28.3
+  resolution: "@babel/generator@npm:7.28.3"
   dependencies:
-    "@babel/parser": "npm:^7.28.0"
-    "@babel/types": "npm:^7.28.0"
+    "@babel/parser": "npm:^7.28.3"
+    "@babel/types": "npm:^7.28.2"
     "@jridgewell/gen-mapping": "npm:^0.3.12"
     "@jridgewell/trace-mapping": "npm:^0.3.28"
     jsesc: "npm:^3.0.2"
-  checksum: 10c0/1b3d122268ea3df50fde707ad864d9a55c72621357d5cebb972db3dd76859c45810c56e16ad23123f18f80cc2692f5a015d2858361300f0f224a05dc43d36a92
+  checksum: 10c0/0ff58bcf04f8803dcc29479b547b43b9b0b828ec1ee0668e92d79f9e90f388c28589056637c5ff2fd7bcf8d153c990d29c448d449d852bf9d1bc64753ca462bc
   languageName: node
   linkType: hard
 
-"@babel/helper-annotate-as-pure@npm:^7.27.1, @babel/helper-annotate-as-pure@npm:^7.27.3":
+"@babel/helper-annotate-as-pure@npm:^7.27.3":
   version: 7.27.3
   resolution: "@babel/helper-annotate-as-pure@npm:7.27.3"
   dependencies:
@@ -106,19 +106,19 @@ __metadata:
   linkType: hard
 
 "@babel/helper-create-class-features-plugin@npm:^7.27.1":
-  version: 7.27.1
-  resolution: "@babel/helper-create-class-features-plugin@npm:7.27.1"
+  version: 7.28.3
+  resolution: "@babel/helper-create-class-features-plugin@npm:7.28.3"
   dependencies:
-    "@babel/helper-annotate-as-pure": "npm:^7.27.1"
+    "@babel/helper-annotate-as-pure": "npm:^7.27.3"
     "@babel/helper-member-expression-to-functions": "npm:^7.27.1"
     "@babel/helper-optimise-call-expression": "npm:^7.27.1"
     "@babel/helper-replace-supers": "npm:^7.27.1"
     "@babel/helper-skip-transparent-expression-wrappers": "npm:^7.27.1"
-    "@babel/traverse": "npm:^7.27.1"
+    "@babel/traverse": "npm:^7.28.3"
     semver: "npm:^6.3.1"
   peerDependencies:
     "@babel/core": ^7.0.0
-  checksum: 10c0/4ee199671d6b9bdd4988aa2eea4bdced9a73abfc831d81b00c7634f49a8fc271b3ceda01c067af58018eb720c6151322015d463abea7072a368ee13f35adbb4c
+  checksum: 10c0/f1ace9476d581929128fd4afc29783bb674663898577b2e48ed139cfd2e92dfc69654cff76cb8fd26fece6286f66a99a993186c1e0a3e17b703b352d0bcd1ca4
   languageName: node
   linkType: hard
 
@@ -149,16 +149,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helper-module-transforms@npm:^7.27.1, @babel/helper-module-transforms@npm:^7.27.3":
-  version: 7.27.3
-  resolution: "@babel/helper-module-transforms@npm:7.27.3"
+"@babel/helper-module-transforms@npm:^7.27.1, @babel/helper-module-transforms@npm:^7.28.3":
+  version: 7.28.3
+  resolution: "@babel/helper-module-transforms@npm:7.28.3"
   dependencies:
     "@babel/helper-module-imports": "npm:^7.27.1"
     "@babel/helper-validator-identifier": "npm:^7.27.1"
-    "@babel/traverse": "npm:^7.27.3"
+    "@babel/traverse": "npm:^7.28.3"
   peerDependencies:
     "@babel/core": ^7.0.0
-  checksum: 10c0/fccb4f512a13b4c069af51e1b56b20f54024bcf1591e31e978a30f3502567f34f90a80da6a19a6148c249216292a8074a0121f9e52602510ef0f32dbce95ca01
+  checksum: 10c0/549be62515a6d50cd4cfefcab1b005c47f89bd9135a22d602ee6a5e3a01f27571868ada10b75b033569f24dc4a2bb8d04bfa05ee75c16da7ade2d0db1437fcdb
   languageName: node
   linkType: hard
 
@@ -222,24 +222,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helpers@npm:^7.27.6":
-  version: 7.28.2
-  resolution: "@babel/helpers@npm:7.28.2"
+"@babel/helpers@npm:^7.28.3":
+  version: 7.28.3
+  resolution: "@babel/helpers@npm:7.28.3"
   dependencies:
     "@babel/template": "npm:^7.27.2"
     "@babel/types": "npm:^7.28.2"
-  checksum: 10c0/f3e7b21517e2699c4ca193663ecfb1bf1b2ae2762d8ba4a9f1786feaca0d6984537fc60bf2206e92c43640a6dada6b438f523cc1ad78610d0151aeb061b37f63
+  checksum: 10c0/03a8f94135415eec62d37be9c62c63908f2d5386c7b00e04545de4961996465775330e3eb57717ea7451e19b0e24615777ebfec408c2adb1df3b10b4df6bf1ce
   languageName: node
   linkType: hard
 
-"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.23.6, @babel/parser@npm:^7.23.9, @babel/parser@npm:^7.27.2, @babel/parser@npm:^7.27.7, @babel/parser@npm:^7.28.0":
-  version: 7.28.0
-  resolution: "@babel/parser@npm:7.28.0"
+"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.23.6, @babel/parser@npm:^7.23.9, @babel/parser@npm:^7.27.2, @babel/parser@npm:^7.27.7, @babel/parser@npm:^7.28.0, @babel/parser@npm:^7.28.3":
+  version: 7.28.3
+  resolution: "@babel/parser@npm:7.28.3"
   dependencies:
-    "@babel/types": "npm:^7.28.0"
+    "@babel/types": "npm:^7.28.2"
   bin:
     parser: ./bin/babel-parser.js
-  checksum: 10c0/c2ef81d598990fa949d1d388429df327420357cb5200271d0d0a2784f1e6d54afc8301eb8bdf96d8f6c77781e402da93c7dc07980fcc136ac5b9d5f1fce701b5
+  checksum: 10c0/1f41eb82623b0ca0f94521b57f4790c6c457cd922b8e2597985b36bdec24114a9ccf54640286a760ceb60f11fe9102d192bf60477aee77f5d45f1029b9b72729
   languageName: node
   linkType: hard
 
@@ -495,9 +495,9 @@ __metadata:
   linkType: hard
 
 "@babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.5.5":
-  version: 7.28.2
-  resolution: "@babel/runtime@npm:7.28.2"
-  checksum: 10c0/c20afe253629d53a405a610b12a62ac74d341a2c1e0fb202bbef0c118f6b5c84f94bf16039f58fd0483dd256901259930a43976845bdeb180cab1f882c21b6e0
+  version: 7.28.3
+  resolution: "@babel/runtime@npm:7.28.3"
+  checksum: 10c0/b360f82c2c5114f2a062d4d143d7b4ec690094764853937110585a9497977aed66c102166d0e404766c274e02a50ffb8f6d77fef7251ecf3f607f0e03e6397bc
   languageName: node
   linkType: hard
 
@@ -512,22 +512,22 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/traverse@npm:^7.18.9, @babel/traverse@npm:^7.23.7, @babel/traverse@npm:^7.27.1, @babel/traverse@npm:^7.27.3, @babel/traverse@npm:^7.27.7, @babel/traverse@npm:^7.28.0":
-  version: 7.28.0
-  resolution: "@babel/traverse@npm:7.28.0"
+"@babel/traverse@npm:^7.18.9, @babel/traverse@npm:^7.23.7, @babel/traverse@npm:^7.27.1, @babel/traverse@npm:^7.27.7, @babel/traverse@npm:^7.28.3":
+  version: 7.28.3
+  resolution: "@babel/traverse@npm:7.28.3"
   dependencies:
     "@babel/code-frame": "npm:^7.27.1"
-    "@babel/generator": "npm:^7.28.0"
+    "@babel/generator": "npm:^7.28.3"
     "@babel/helper-globals": "npm:^7.28.0"
-    "@babel/parser": "npm:^7.28.0"
+    "@babel/parser": "npm:^7.28.3"
     "@babel/template": "npm:^7.27.2"
-    "@babel/types": "npm:^7.28.0"
+    "@babel/types": "npm:^7.28.2"
     debug: "npm:^4.3.1"
-  checksum: 10c0/32794402457827ac558173bcebdcc0e3a18fa339b7c41ca35621f9f645f044534d91bb923ff385f5f960f2e495f56ce18d6c7b0d064d2f0ccb55b285fa6bc7b9
+  checksum: 10c0/26e95b29a46925b7b41255e03185b7e65b2c4987e14bbee7bbf95867fb19c69181f301bbe1c7b201d4fe0cce6aa0cbea0282dad74b3a0fef3d9058f6c76fdcb3
   languageName: node
   linkType: hard
 
-"@babel/types@npm:^7.0.0, @babel/types@npm:^7.18.9, @babel/types@npm:^7.20.7, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.6, @babel/types@npm:^7.27.1, @babel/types@npm:^7.27.3, @babel/types@npm:^7.27.7, @babel/types@npm:^7.28.0, @babel/types@npm:^7.28.2, @babel/types@npm:^7.3.3":
+"@babel/types@npm:^7.0.0, @babel/types@npm:^7.18.9, @babel/types@npm:^7.20.7, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.6, @babel/types@npm:^7.27.1, @babel/types@npm:^7.27.3, @babel/types@npm:^7.27.7, @babel/types@npm:^7.28.2, @babel/types@npm:^7.3.3":
   version: 7.28.2
   resolution: "@babel/types@npm:7.28.2"
   dependencies:
@@ -870,13 +870,13 @@ __metadata:
   linkType: hard
 
 "@date-fns/tz@npm:^1.2.0":
-  version: 1.3.1
-  resolution: "@date-fns/tz@npm:1.3.1"
-  checksum: 10c0/f0d8822a4aa17b271481d85b2bdae8bdd25b38caaf2a52513310fa1d6e7fbf071e66dbc93766d5eb5473ffd14b0d674e4e8b6d297de507b1bacc78f4387154ad
+  version: 1.4.1
+  resolution: "@date-fns/tz@npm:1.4.1"
+  checksum: 10c0/9033fdc4682fe3d4d147625ce04fa88a8792653594e2de8d5a438c8f3bfc0990ee28fe773f91cac6810b06d818b5b281ae0608752ba8337257d0279ded3f019a
   languageName: node
   linkType: hard
 
-"@emnapi/core@npm:^1.4.3":
+"@emnapi/core@npm:^1.4.3, @emnapi/core@npm:^1.4.5":
   version: 1.4.5
   resolution: "@emnapi/core@npm:1.4.5"
   dependencies:
@@ -886,7 +886,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emnapi/runtime@npm:^1.4.3":
+"@emnapi/runtime@npm:^1.4.3, @emnapi/runtime@npm:^1.4.5":
   version: 1.4.5
   resolution: "@emnapi/runtime@npm:1.4.5"
   dependencies:
@@ -895,7 +895,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emnapi/wasi-threads@npm:1.0.4, @emnapi/wasi-threads@npm:^1.0.2":
+"@emnapi/wasi-threads@npm:1.0.4, @emnapi/wasi-threads@npm:^1.0.4":
   version: 1.0.4
   resolution: "@emnapi/wasi-threads@npm:1.0.4"
   dependencies:
@@ -904,184 +904,184 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@esbuild/aix-ppc64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/aix-ppc64@npm:0.25.8"
+"@esbuild/aix-ppc64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/aix-ppc64@npm:0.25.9"
   conditions: os=aix & cpu=ppc64
   languageName: node
   linkType: hard
 
-"@esbuild/android-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/android-arm64@npm:0.25.8"
+"@esbuild/android-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/android-arm64@npm:0.25.9"
   conditions: os=android & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/android-arm@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/android-arm@npm:0.25.8"
+"@esbuild/android-arm@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/android-arm@npm:0.25.9"
   conditions: os=android & cpu=arm
   languageName: node
   linkType: hard
 
-"@esbuild/android-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/android-x64@npm:0.25.8"
+"@esbuild/android-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/android-x64@npm:0.25.9"
   conditions: os=android & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/darwin-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/darwin-arm64@npm:0.25.8"
+"@esbuild/darwin-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/darwin-arm64@npm:0.25.9"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/darwin-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/darwin-x64@npm:0.25.8"
+"@esbuild/darwin-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/darwin-x64@npm:0.25.9"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/freebsd-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/freebsd-arm64@npm:0.25.8"
+"@esbuild/freebsd-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/freebsd-arm64@npm:0.25.9"
   conditions: os=freebsd & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/freebsd-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/freebsd-x64@npm:0.25.8"
+"@esbuild/freebsd-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/freebsd-x64@npm:0.25.9"
   conditions: os=freebsd & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/linux-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-arm64@npm:0.25.8"
+"@esbuild/linux-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-arm64@npm:0.25.9"
   conditions: os=linux & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/linux-arm@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-arm@npm:0.25.8"
+"@esbuild/linux-arm@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-arm@npm:0.25.9"
   conditions: os=linux & cpu=arm
   languageName: node
   linkType: hard
 
-"@esbuild/linux-ia32@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-ia32@npm:0.25.8"
+"@esbuild/linux-ia32@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-ia32@npm:0.25.9"
   conditions: os=linux & cpu=ia32
   languageName: node
   linkType: hard
 
-"@esbuild/linux-loong64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-loong64@npm:0.25.8"
+"@esbuild/linux-loong64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-loong64@npm:0.25.9"
   conditions: os=linux & cpu=loong64
   languageName: node
   linkType: hard
 
-"@esbuild/linux-mips64el@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-mips64el@npm:0.25.8"
+"@esbuild/linux-mips64el@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-mips64el@npm:0.25.9"
   conditions: os=linux & cpu=mips64el
   languageName: node
   linkType: hard
 
-"@esbuild/linux-ppc64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-ppc64@npm:0.25.8"
+"@esbuild/linux-ppc64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-ppc64@npm:0.25.9"
   conditions: os=linux & cpu=ppc64
   languageName: node
   linkType: hard
 
-"@esbuild/linux-riscv64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-riscv64@npm:0.25.8"
+"@esbuild/linux-riscv64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-riscv64@npm:0.25.9"
   conditions: os=linux & cpu=riscv64
   languageName: node
   linkType: hard
 
-"@esbuild/linux-s390x@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-s390x@npm:0.25.8"
+"@esbuild/linux-s390x@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-s390x@npm:0.25.9"
   conditions: os=linux & cpu=s390x
   languageName: node
   linkType: hard
 
-"@esbuild/linux-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/linux-x64@npm:0.25.8"
+"@esbuild/linux-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/linux-x64@npm:0.25.9"
   conditions: os=linux & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/netbsd-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/netbsd-arm64@npm:0.25.8"
+"@esbuild/netbsd-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/netbsd-arm64@npm:0.25.9"
   conditions: os=netbsd & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/netbsd-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/netbsd-x64@npm:0.25.8"
+"@esbuild/netbsd-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/netbsd-x64@npm:0.25.9"
   conditions: os=netbsd & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/openbsd-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/openbsd-arm64@npm:0.25.8"
+"@esbuild/openbsd-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/openbsd-arm64@npm:0.25.9"
   conditions: os=openbsd & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/openbsd-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/openbsd-x64@npm:0.25.8"
+"@esbuild/openbsd-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/openbsd-x64@npm:0.25.9"
   conditions: os=openbsd & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/openharmony-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/openharmony-arm64@npm:0.25.8"
+"@esbuild/openharmony-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/openharmony-arm64@npm:0.25.9"
   conditions: os=openharmony & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/sunos-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/sunos-x64@npm:0.25.8"
+"@esbuild/sunos-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/sunos-x64@npm:0.25.9"
   conditions: os=sunos & cpu=x64
   languageName: node
   linkType: hard
 
-"@esbuild/win32-arm64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/win32-arm64@npm:0.25.8"
+"@esbuild/win32-arm64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/win32-arm64@npm:0.25.9"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@esbuild/win32-ia32@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/win32-ia32@npm:0.25.8"
+"@esbuild/win32-ia32@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/win32-ia32@npm:0.25.9"
   conditions: os=win32 & cpu=ia32
   languageName: node
   linkType: hard
 
-"@esbuild/win32-x64@npm:0.25.8":
-  version: 0.25.8
-  resolution: "@esbuild/win32-x64@npm:0.25.8"
+"@esbuild/win32-x64@npm:0.25.9":
+  version: 0.25.9
+  resolution: "@esbuild/win32-x64@npm:0.25.9"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
@@ -1528,12 +1528,22 @@ __metadata:
   linkType: hard
 
 "@jridgewell/gen-mapping@npm:^0.3.12, @jridgewell/gen-mapping@npm:^0.3.5":
-  version: 0.3.12
-  resolution: "@jridgewell/gen-mapping@npm:0.3.12"
+  version: 0.3.13
+  resolution: "@jridgewell/gen-mapping@npm:0.3.13"
   dependencies:
     "@jridgewell/sourcemap-codec": "npm:^1.5.0"
     "@jridgewell/trace-mapping": "npm:^0.3.24"
-  checksum: 10c0/32f771ae2467e4d440be609581f7338d786d3d621bac3469e943b9d6d116c23c4becb36f84898a92bbf2f3c0511365c54a945a3b86a83141547a2a360a5ec0c7
+  checksum: 10c0/9a7d65fb13bd9aec1fbab74cda08496839b7e2ceb31f5ab922b323e94d7c481ce0fc4fd7e12e2610915ed8af51178bdc61e168e92a8c8b8303b030b03489b13b
+  languageName: node
+  linkType: hard
+
+"@jridgewell/remapping@npm:^2.3.4":
+  version: 2.3.5
+  resolution: "@jridgewell/remapping@npm:2.3.5"
+  dependencies:
+    "@jridgewell/gen-mapping": "npm:^0.3.5"
+    "@jridgewell/trace-mapping": "npm:^0.3.24"
+  checksum: 10c0/3de494219ffeb2c5c38711d0d7bb128097edf91893090a2dbc8ee0b55d092bb7347b1fd0f478486c5eab010e855c73927b1666f2107516d472d24a73017d1194
   languageName: node
   linkType: hard
 
@@ -1545,19 +1555,19 @@ __metadata:
   linkType: hard
 
 "@jridgewell/sourcemap-codec@npm:^1.4.14, @jridgewell/sourcemap-codec@npm:^1.5.0":
-  version: 1.5.4
-  resolution: "@jridgewell/sourcemap-codec@npm:1.5.4"
-  checksum: 10c0/c5aab3e6362a8dd94ad80ab90845730c825fc4c8d9cf07ebca7a2eb8a832d155d62558800fc41d42785f989ddbb21db6df004d1786e8ecb65e428ab8dff71309
+  version: 1.5.5
+  resolution: "@jridgewell/sourcemap-codec@npm:1.5.5"
+  checksum: 10c0/f9e538f302b63c0ebc06eecb1dd9918dd4289ed36147a0ddce35d6ea4d7ebbda243cda7b2213b6a5e1d8087a298d5cf630fb2bd39329cdecb82017023f6081a0
   languageName: node
   linkType: hard
 
 "@jridgewell/trace-mapping@npm:^0.3.12, @jridgewell/trace-mapping@npm:^0.3.18, @jridgewell/trace-mapping@npm:^0.3.24, @jridgewell/trace-mapping@npm:^0.3.28":
-  version: 0.3.29
-  resolution: "@jridgewell/trace-mapping@npm:0.3.29"
+  version: 0.3.30
+  resolution: "@jridgewell/trace-mapping@npm:0.3.30"
   dependencies:
     "@jridgewell/resolve-uri": "npm:^3.1.0"
     "@jridgewell/sourcemap-codec": "npm:^1.4.14"
-  checksum: 10c0/fb547ba31658c4d74eb17e7389f4908bf7c44cef47acb4c5baa57289daf68e6fe53c639f41f751b3923aca67010501264f70e7b49978ad1f040294b22c37b333
+  checksum: 10c0/3a1516c10f44613b9ba27c37a02ff8f410893776b2b3dad20a391b51b884dd60f97bbb56936d65d2ff8fe978510a0000266654ab8426bdb9ceb5fb4585b19e23
   languageName: node
   linkType: hard
 
@@ -1755,7 +1765,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@napi-rs/wasm-runtime@npm:^0.2.11":
+"@mjackson/node-fetch-server@npm:^0.7.0":
+  version: 0.7.0
+  resolution: "@mjackson/node-fetch-server@npm:0.7.0"
+  checksum: 10c0/d2bb7ab2c1038195c93b2a405ac0357ccb8aab5d214badd918be2e7326a508a6522af21310b7a94e2726561e810fd8d178d306b426e5a4fdf5004aab8e2fa45f
+  languageName: node
+  linkType: hard
+
+"@napi-rs/wasm-runtime@npm:^0.2.12":
   version: 0.2.12
   resolution: "@napi-rs/wasm-runtime@npm:0.2.12"
   dependencies:
@@ -1869,21 +1886,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/primitive@npm:1.1.2":
-  version: 1.1.2
-  resolution: "@radix-ui/primitive@npm:1.1.2"
-  checksum: 10c0/5e2d2528d2fe37c16865e77b0beaac2b415a817ad13d8178db6e8187b2a092672568a64ee0041510abfde3034490a5cadd3057049bb15789020c06892047597c
+"@radix-ui/primitive@npm:1.1.3":
+  version: 1.1.3
+  resolution: "@radix-ui/primitive@npm:1.1.3"
+  checksum: 10c0/88860165ee7066fa2c179f32ffcd3ee6d527d9dcdc0e8be85e9cb0e2c84834be8e3c1a976c74ba44b193f709544e12f54455d892b28e32f0708d89deda6b9f1d
   languageName: node
   linkType: hard
 
 "@radix-ui/react-alert-dialog@npm:^1.1.4":
-  version: 1.1.14
-  resolution: "@radix-ui/react-alert-dialog@npm:1.1.14"
+  version: 1.1.15
+  resolution: "@radix-ui/react-alert-dialog@npm:1.1.15"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
-    "@radix-ui/react-dialog": "npm:1.1.14"
+    "@radix-ui/react-dialog": "npm:1.1.15"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-slot": "npm:1.2.3"
   peerDependencies:
@@ -1896,7 +1913,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/4c94a38f277e51aefdcb3e25c28924147d87b8828375c9a884ab7599d27ce9aa409ebd52fee02e0ef9fda8757ccb8630f0b5edb0331ad8f8f25a5dbea8fe189a
+  checksum: 10c0/038de84ad1b36c162e5f5a3b4034de95558698eb6e3f483d2b1a15f4a502c921c4e6a5a723fe6f29e928ed7001ffe38ac6fd16bb720b1e629892ce7beb1da174
   languageName: node
   linkType: hard
 
@@ -1943,13 +1960,13 @@ __metadata:
   linkType: hard
 
 "@radix-ui/react-checkbox@npm:^1.3.1":
-  version: 1.3.2
-  resolution: "@radix-ui/react-checkbox@npm:1.3.2"
+  version: 1.3.3
+  resolution: "@radix-ui/react-checkbox@npm:1.3.3"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
     "@radix-ui/react-use-previous": "npm:1.1.1"
@@ -1964,7 +1981,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/8be7c06b3a7d3cff099cca1ccaf65258d65d9f10b5bb3a78ff6fc024799ac78befb3dfbb2965900c409a3dcbb99458bd3a9925392299f9f150a4f35eef040c59
+  checksum: 10c0/5eeb78e37a6c9611a638a80b309c931dd6f1f8968357ab2abb453505392fa1397491441447ca2d5f4381faaac7fab2dc84c780e8ce27d931bd203fa014088b74
   languageName: node
   linkType: hard
 
@@ -2016,19 +2033,19 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-dialog@npm:1.1.14, @radix-ui/react-dialog@npm:^1.1.13, @radix-ui/react-dialog@npm:^1.1.6":
-  version: 1.1.14
-  resolution: "@radix-ui/react-dialog@npm:1.1.14"
+"@radix-ui/react-dialog@npm:1.1.15, @radix-ui/react-dialog@npm:^1.1.13, @radix-ui/react-dialog@npm:^1.1.6":
+  version: 1.1.15
+  resolution: "@radix-ui/react-dialog@npm:1.1.15"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
-    "@radix-ui/react-dismissable-layer": "npm:1.1.10"
-    "@radix-ui/react-focus-guards": "npm:1.1.2"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
     "@radix-ui/react-focus-scope": "npm:1.1.7"
     "@radix-ui/react-id": "npm:1.1.1"
     "@radix-ui/react-portal": "npm:1.1.9"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-slot": "npm:1.2.3"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
@@ -2044,7 +2061,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/ab7bc783510ed8fccfe91020b214f4a571d5a1d46d398faa33f4c151bc9f586c47483b307e72b67687b06694c194b3aa80dd1de728460fa765db9f3057690ba3
+  checksum: 10c0/2f2c88e3c281acaea2fd9b96fa82132d59177d3aa5da2e7c045596fd4028e84e44ac52ac28f4f236910605dd7d9338c2858ba44a9ced2af2e3e523abbfd33014
   languageName: node
   linkType: hard
 
@@ -2061,11 +2078,11 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-dismissable-layer@npm:1.1.10":
-  version: 1.1.10
-  resolution: "@radix-ui/react-dismissable-layer@npm:1.1.10"
+"@radix-ui/react-dismissable-layer@npm:1.1.11":
+  version: 1.1.11
+  resolution: "@radix-ui/react-dismissable-layer@npm:1.1.11"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-use-callback-ref": "npm:1.1.1"
@@ -2080,19 +2097,19 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/21a2d03689f5e06586135b6a735937ef14f2571fdf6044a3019bc3f9fa368a9400b5a9b631f43e8ad3682693449e369ffa7cc8642764246ce18ebe7359a45faf
+  checksum: 10c0/c825572a64073c4d3853702029979f6658770ffd6a98eabc4984e1dee1b226b4078a2a4dc7003f96475b438985e9b21a58e75f51db74dd06848dcae1f2d395dc
   languageName: node
   linkType: hard
 
 "@radix-ui/react-dropdown-menu@npm:^2.1.14":
-  version: 2.1.15
-  resolution: "@radix-ui/react-dropdown-menu@npm:2.1.15"
+  version: 2.1.16
+  resolution: "@radix-ui/react-dropdown-menu@npm:2.1.16"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-id": "npm:1.1.1"
-    "@radix-ui/react-menu": "npm:2.1.15"
+    "@radix-ui/react-menu": "npm:2.1.16"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
   peerDependencies:
@@ -2105,20 +2122,20 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/ea5e7c98d38e7a2e66e2a77057471f1309f414dc0013042241d33e09e1d7c3844908f845d47bd34cd5ae78d344973b381b8e5de890e7546d799c1960740b24b6
+  checksum: 10c0/8caaa8dd791ccb284568720adafa59855e13860aa29eb20e10a04ba671cbbfa519a4c5d3a339a4d9fb08009eeb1065f4a8b5c3c8ef45e9753161cc560106b935
   languageName: node
   linkType: hard
 
-"@radix-ui/react-focus-guards@npm:1.1.2":
-  version: 1.1.2
-  resolution: "@radix-ui/react-focus-guards@npm:1.1.2"
+"@radix-ui/react-focus-guards@npm:1.1.3":
+  version: 1.1.3
+  resolution: "@radix-ui/react-focus-guards@npm:1.1.3"
   peerDependencies:
     "@types/react": "*"
     react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
   peerDependenciesMeta:
     "@types/react":
       optional: true
-  checksum: 10c0/8d6fa55752b9b6e55d1eebb643178e38a824e8ba418eb29031b2979077a12c4e3922892de9f984dd326f77071a14960cd81e99a960beea07598b8c80da618dc5
+  checksum: 10c0/0bab65eb8d7e4f72f685d63de7fbba2450e3cb15ad6a20a16b42195e9d335c576356f5a47cb58d1ffc115393e46d7b14b12c5d4b10029b0ec090861255866985
   languageName: node
   linkType: hard
 
@@ -2186,24 +2203,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-menu@npm:2.1.15":
-  version: 2.1.15
-  resolution: "@radix-ui/react-menu@npm:2.1.15"
+"@radix-ui/react-menu@npm:2.1.16":
+  version: 2.1.16
+  resolution: "@radix-ui/react-menu@npm:2.1.16"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-collection": "npm:1.1.7"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-direction": "npm:1.1.1"
-    "@radix-ui/react-dismissable-layer": "npm:1.1.10"
-    "@radix-ui/react-focus-guards": "npm:1.1.2"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
     "@radix-ui/react-focus-scope": "npm:1.1.7"
     "@radix-ui/react-id": "npm:1.1.1"
-    "@radix-ui/react-popper": "npm:1.2.7"
+    "@radix-ui/react-popper": "npm:1.2.8"
     "@radix-ui/react-portal": "npm:1.1.9"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
-    "@radix-ui/react-roving-focus": "npm:1.1.10"
+    "@radix-ui/react-roving-focus": "npm:1.1.11"
     "@radix-ui/react-slot": "npm:1.2.3"
     "@radix-ui/react-use-callback-ref": "npm:1.1.1"
     aria-hidden: "npm:^1.2.4"
@@ -2218,24 +2235,24 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/09306b1856448d0310fdcb732c159c7d1bddd0d2da6706c1567e0218f277597d8203b1138107a40665620bea397c15ec6e353295dfc5752a45c08daf552ad533
+  checksum: 10c0/27516b2b987fa9181c4da8645000af8f60691866a349d7a46b9505fa7d2e9d92b9e364db4f7305d08e9e57d0e1afc8df8354f8ee3c12aa05c0100c16b0e76c27
   languageName: node
   linkType: hard
 
 "@radix-ui/react-popover@npm:^1.1.13":
-  version: 1.1.14
-  resolution: "@radix-ui/react-popover@npm:1.1.14"
+  version: 1.1.15
+  resolution: "@radix-ui/react-popover@npm:1.1.15"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
-    "@radix-ui/react-dismissable-layer": "npm:1.1.10"
-    "@radix-ui/react-focus-guards": "npm:1.1.2"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
     "@radix-ui/react-focus-scope": "npm:1.1.7"
     "@radix-ui/react-id": "npm:1.1.1"
-    "@radix-ui/react-popper": "npm:1.2.7"
+    "@radix-ui/react-popper": "npm:1.2.8"
     "@radix-ui/react-portal": "npm:1.1.9"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-slot": "npm:1.2.3"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
@@ -2251,13 +2268,13 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/04e557bfcaab4887694d119555b101e16b8a4e99595541ff2cbe805c551be853cb02882a2ada04e6507ffc45bc092bc2b89704b7b79f5025251767d0b4f3230a
+  checksum: 10c0/c1c76b5e5985b128d03b621424fb453f769931d497759a1977734d303007da9f970570cf3ea1f6968ab609ab4a97f384168bff056197bd2d3d422abea0e3614b
   languageName: node
   linkType: hard
 
-"@radix-ui/react-popper@npm:1.2.7":
-  version: 1.2.7
-  resolution: "@radix-ui/react-popper@npm:1.2.7"
+"@radix-ui/react-popper@npm:1.2.8":
+  version: 1.2.8
+  resolution: "@radix-ui/react-popper@npm:1.2.8"
   dependencies:
     "@floating-ui/react-dom": "npm:^2.0.0"
     "@radix-ui/react-arrow": "npm:1.1.7"
@@ -2279,7 +2296,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/fb901329df5432225b0be08778a89faaa25c40e8042f0f181218e385cae26811420b6e4b1effc70955393e09d83cd462d1b0eb6ca6d33282d76692972b602ad8
+  checksum: 10c0/48e3f13eac3b8c13aca8ded37d74db17e1bb294da8d69f142ab6b8719a06c3f90051668bed64520bf9f3abdd77b382ce7ce209d056bb56137cecc949b69b421c
   languageName: node
   linkType: hard
 
@@ -2303,9 +2320,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@radix-ui/react-presence@npm:1.1.4":
-  version: 1.1.4
-  resolution: "@radix-ui/react-presence@npm:1.1.4"
+"@radix-ui/react-presence@npm:1.1.5":
+  version: 1.1.5
+  resolution: "@radix-ui/react-presence@npm:1.1.5"
   dependencies:
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-use-layout-effect": "npm:1.1.1"
@@ -2319,7 +2336,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/8202647139d6f5097b0abcc43dfba471c00b69da95ca336afe3ea23a165e05ca21992f40fc801760fe442f3e064e54e2f2cbcb9ad758c4b07ef6c69a5b6777bd
+  checksum: 10c0/d0e61d314250eeaef5369983cb790701d667f51734bafd98cf759072755562018052c594e6cdc5389789f4543cb0a4d98f03ff4e8f37338d6b5bf51a1700c1d1
   languageName: node
   linkType: hard
 
@@ -2343,16 +2360,16 @@ __metadata:
   linkType: hard
 
 "@radix-ui/react-radio-group@npm:^1.2.2":
-  version: 1.3.7
-  resolution: "@radix-ui/react-radio-group@npm:1.3.7"
+  version: 1.3.8
+  resolution: "@radix-ui/react-radio-group@npm:1.3.8"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-direction": "npm:1.1.1"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
-    "@radix-ui/react-roving-focus": "npm:1.1.10"
+    "@radix-ui/react-roving-focus": "npm:1.1.11"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
     "@radix-ui/react-use-previous": "npm:1.1.1"
     "@radix-ui/react-use-size": "npm:1.1.1"
@@ -2366,15 +2383,15 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/3989806adaa0db05495951ecd00d813bad49c97685064c6e1714a37c5c4db7f563848c159e530d2554aadf0bca8d1292d22263f549b0709f8356ad75f42cf8b3
+  checksum: 10c0/23af8e8b833da1fc4aa4e67c3607dedee4fc5b39278d2e2b820bec7f7b3c0891b006a8a35c57ba436ddf18735bbd8dad9a598d14632a328753a875fde447975c
   languageName: node
   linkType: hard
 
-"@radix-ui/react-roving-focus@npm:1.1.10":
-  version: 1.1.10
-  resolution: "@radix-ui/react-roving-focus@npm:1.1.10"
+"@radix-ui/react-roving-focus@npm:1.1.11":
+  version: 1.1.11
+  resolution: "@radix-ui/react-roving-focus@npm:1.1.11"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-collection": "npm:1.1.7"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
@@ -2393,20 +2410,20 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/afc8faed4d43807cb6b9e163995f5224fc11d4480aa8033274c858a2fc01f04d190e9fbf209db21be4f6d6f48689698ab900a8bd39e453ef55d00d58c2b840bb
+  checksum: 10c0/2cd43339c36e89a3bf1db8aab34b939113dfbde56bf3a33df2d74757c78c9489b847b1962f1e2441c67e41817d120cb6177943e0f655f47bc1ff8e44fd55b1a2
   languageName: node
   linkType: hard
 
 "@radix-ui/react-scroll-area@npm:^1.2.2":
-  version: 1.2.9
-  resolution: "@radix-ui/react-scroll-area@npm:1.2.9"
+  version: 1.2.10
+  resolution: "@radix-ui/react-scroll-area@npm:1.2.10"
   dependencies:
     "@radix-ui/number": "npm:1.1.1"
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-direction": "npm:1.1.1"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-use-callback-ref": "npm:1.1.1"
     "@radix-ui/react-use-layout-effect": "npm:1.1.1"
@@ -2420,7 +2437,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/1e1d19be14b1b3ce9410485539d25fc00f82416b0f77d47d3db5a0bb077fb7d5f1e6ff99c757bad2bb313b5d386562f35beb06cbe36fe0a4a5723745e4da69be
+  checksum: 10c0/8acdacd255fdfcefe4f72028a13dc554df73327db94c250f54a85b9608aa0313284dbb6c417f28a48e7b7b7bcaa76ddf3297e91ba07d833604d428f869259622
   languageName: node
   linkType: hard
 
@@ -2444,11 +2461,11 @@ __metadata:
   linkType: hard
 
 "@radix-ui/react-slider@npm:^1.3.4":
-  version: 1.3.5
-  resolution: "@radix-ui/react-slider@npm:1.3.5"
+  version: 1.3.6
+  resolution: "@radix-ui/react-slider@npm:1.3.6"
   dependencies:
     "@radix-ui/number": "npm:1.1.1"
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-collection": "npm:1.1.7"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
@@ -2468,7 +2485,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/2f5f37f953d78ac02ed74120afe76badf3a7d0e19036f4de6cdeda38220718a1d5113ffc2f43e0b3de73e14564cae9a09d1968ee3f9641625849d126a036717f
+  checksum: 10c0/a53d7854e28c5ef3d29b76c8d04cc3c723b982b643152cd5a8fefc7a8359180f8fd21753e5a08302a290bc837e7be04f2efad9d308b7a4a23326df6a6b1ac882
   languageName: node
   linkType: hard
 
@@ -2488,10 +2505,10 @@ __metadata:
   linkType: hard
 
 "@radix-ui/react-switch@npm:^1.1.2":
-  version: 1.2.5
-  resolution: "@radix-ui/react-switch@npm:1.2.5"
+  version: 1.2.6
+  resolution: "@radix-ui/react-switch@npm:1.2.6"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-primitive": "npm:2.1.3"
@@ -2508,21 +2525,21 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/7149649b852adaba5a65d6ac865c0f33ba7ec8282c72eb17286df9e4b67d4bf1eaa7eb3b4ceeb64c5ecea65fe439b7ed6c9d9829d5baa2b757b8db630e7b87ff
+  checksum: 10c0/888303cbeb0e69ebba5676b225f9ea0f00f61453c6b8a6b66384b5c5c4c7fb0ccc53493c1eb14ec6d436e5b867b302aadd6af51a1f2e6c04581c583fd9be65be
   languageName: node
   linkType: hard
 
 "@radix-ui/react-tabs@npm:^1.1.11":
-  version: 1.1.12
-  resolution: "@radix-ui/react-tabs@npm:1.1.12"
+  version: 1.1.13
+  resolution: "@radix-ui/react-tabs@npm:1.1.13"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-context": "npm:1.1.2"
     "@radix-ui/react-direction": "npm:1.1.1"
     "@radix-ui/react-id": "npm:1.1.1"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
-    "@radix-ui/react-roving-focus": "npm:1.1.10"
+    "@radix-ui/react-roving-focus": "npm:1.1.11"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
   peerDependencies:
     "@types/react": "*"
@@ -2534,22 +2551,22 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/ca171a3170d746fe2c72cdbda4332a0267f887545142a98befa21895ff7198f0541405ece55c701ef4c06bdf45c92c01bf07a554eb57c2f7a1d972f47c636495
+  checksum: 10c0/a3c78cd8c30dcb95faf1605a8424a1a71dab121dfa6e9c0019bb30d0f36d882762c925b17596d4977990005a255d8ddc0b7454e4f83337fe557b45570a2d8058
   languageName: node
   linkType: hard
 
 "@radix-ui/react-tooltip@npm:^1.1.6":
-  version: 1.2.7
-  resolution: "@radix-ui/react-tooltip@npm:1.2.7"
+  version: 1.2.8
+  resolution: "@radix-ui/react-tooltip@npm:1.2.8"
   dependencies:
-    "@radix-ui/primitive": "npm:1.1.2"
+    "@radix-ui/primitive": "npm:1.1.3"
     "@radix-ui/react-compose-refs": "npm:1.1.2"
     "@radix-ui/react-context": "npm:1.1.2"
-    "@radix-ui/react-dismissable-layer": "npm:1.1.10"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
     "@radix-ui/react-id": "npm:1.1.1"
-    "@radix-ui/react-popper": "npm:1.2.7"
+    "@radix-ui/react-popper": "npm:1.2.8"
     "@radix-ui/react-portal": "npm:1.1.9"
-    "@radix-ui/react-presence": "npm:1.1.4"
+    "@radix-ui/react-presence": "npm:1.1.5"
     "@radix-ui/react-primitive": "npm:2.1.3"
     "@radix-ui/react-slot": "npm:1.2.3"
     "@radix-ui/react-use-controllable-state": "npm:1.2.2"
@@ -2564,7 +2581,7 @@ __metadata:
       optional: true
     "@types/react-dom":
       optional: true
-  checksum: 10c0/28798d576c6ffec4f11120cd563aa9d5ab9afb9a37dc18778176442756d026c8c46eec1ddc647b2b5914045495fcb89f82530106e91acb55776b7d6b1a10fb57
+  checksum: 10c0/de0cbae9c571a00671f160928d819e59502f59be8749f536ab4b180181d9d70aee3925a5b2555f8f32d0bea622bc35f65b70ca7ff0449e4844f891302310cc48
   languageName: node
   linkType: hard
 
@@ -2725,8 +2742,8 @@ __metadata:
   linkType: hard
 
 "@react-router/dev@npm:^7.0.0":
-  version: 7.7.1
-  resolution: "@react-router/dev@npm:7.7.1"
+  version: 7.8.0
+  resolution: "@react-router/dev@npm:7.8.0"
   dependencies:
     "@babel/core": "npm:^7.27.7"
     "@babel/generator": "npm:^7.27.5"
@@ -2736,7 +2753,9 @@ __metadata:
     "@babel/traverse": "npm:^7.27.7"
     "@babel/types": "npm:^7.27.7"
     "@npmcli/package-json": "npm:^4.0.1"
-    "@react-router/node": "npm:7.7.1"
+    "@react-router/node": "npm:7.8.0"
+    "@vitejs/plugin-react": "npm:^4.5.2"
+    "@vitejs/plugin-rsc": "npm:0.4.11"
     arg: "npm:^5.0.1"
     babel-dead-code-elimination: "npm:^1.0.6"
     chokidar: "npm:^4.0.0"
@@ -2756,8 +2775,8 @@ __metadata:
     valibot: "npm:^0.41.0"
     vite-node: "npm:^3.2.2"
   peerDependencies:
-    "@react-router/serve": ^7.7.1
-    react-router: ^7.7.1
+    "@react-router/serve": ^7.8.0
+    react-router: ^7.8.0
     typescript: ^5.1.0
     vite: ^5.1.0 || ^6.0.0 || ^7.0.0
     wrangler: ^3.28.2 || ^4.0.0
@@ -2770,22 +2789,22 @@ __metadata:
       optional: true
   bin:
     react-router: bin.js
-  checksum: 10c0/4f31c337cc26dcf19a538364f29447459f5a508d038b91e8f308f7c66b2da1b7608e1773f6535119ffa7ede600cf35469071a5a3548bc29cdb87de4361195d86
+  checksum: 10c0/eaa5ded849863ad47d7b36061189dd7c37b2cc1b699134d570307344d09032ebd3e0526f4e10a60b126d95e1beb27e4913e235568271a14203f98ab068cc2437
   languageName: node
   linkType: hard
 
-"@react-router/node@npm:7.7.1, @react-router/node@npm:^7.0.0":
-  version: 7.7.1
-  resolution: "@react-router/node@npm:7.7.1"
+"@react-router/node@npm:7.8.0, @react-router/node@npm:^7.0.0":
+  version: 7.8.0
+  resolution: "@react-router/node@npm:7.8.0"
   dependencies:
     "@mjackson/node-fetch-server": "npm:^0.2.0"
   peerDependencies:
-    react-router: 7.7.1
+    react-router: 7.8.0
     typescript: ^5.1.0
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/3af25f665d43ddab5b375b2a81d64e2a7f139ca5a52ebbb8e6d5d5030ef0e270550c82c79387a0dfd26b8f6fe8160aba58e4c95c2450724f3d2519edcd5818af
+  checksum: 10c0/946fdd110e64bfc3b885d904f6e23fdb62fd07663b1c1fc65e1995cb679190d8af96ed472f7158bdc8ff2c7d11edcf41eff718007711489f89bbb6b09d0a8f66
   languageName: node
   linkType: hard
 
@@ -3041,9 +3060,9 @@ __metadata:
   linkType: hard
 
 "@sinclair/typebox@npm:^0.34.0":
-  version: 0.34.38
-  resolution: "@sinclair/typebox@npm:0.34.38"
-  checksum: 10c0/c1b9a1547c64de01ff5c89351baf289d2d5f19cfef3ae30fe4748a103eb58d0842618318543cd3de964cb0370d5a859e24aba231ade9b43ee2ef4d0bb4db7084
+  version: 0.34.39
+  resolution: "@sinclair/typebox@npm:0.34.39"
+  checksum: 10c0/627fd9da5b6e651329111000d5f665c2f7a5df300dfdf24a32156f483fd30c74ccad92396a33a1c5c23bf4354943cd8ac28d27ae4a2bd00665964f3eb4605f6b
   languageName: node
   linkType: hard
 
@@ -3066,58 +3085,58 @@ __metadata:
   linkType: hard
 
 "@storybook/addon-docs@npm:^9.0.6":
-  version: 9.1.0
-  resolution: "@storybook/addon-docs@npm:9.1.0"
+  version: 9.1.2
+  resolution: "@storybook/addon-docs@npm:9.1.2"
   dependencies:
     "@mdx-js/react": "npm:^3.0.0"
-    "@storybook/csf-plugin": "npm:9.1.0"
+    "@storybook/csf-plugin": "npm:9.1.2"
     "@storybook/icons": "npm:^1.4.0"
-    "@storybook/react-dom-shim": "npm:9.1.0"
+    "@storybook/react-dom-shim": "npm:9.1.2"
     react: "npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
     react-dom: "npm:^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
     ts-dedent: "npm:^2.0.0"
   peerDependencies:
-    storybook: ^9.1.0
-  checksum: 10c0/c9f7024d6993cd8d9a344aa370c39922bcca88cf728bd19a4330493321333fe69fd7aedfcf6e8debb99e245a31cceaae28e0e4b00d45e9119a737467285b5364
+    storybook: ^9.1.2
+  checksum: 10c0/b17a3a8d3b9ad70f7cd8f8295f8cf7a10a6c39ab69e752f3acfb2260809055f85088a6382a2fc729b48860854b94a67faca239ff00bbe0e7e9553113cb2542fb
   languageName: node
   linkType: hard
 
 "@storybook/addon-links@npm:^9.0.6":
-  version: 9.1.0
-  resolution: "@storybook/addon-links@npm:9.1.0"
+  version: 9.1.2
+  resolution: "@storybook/addon-links@npm:9.1.2"
   dependencies:
     "@storybook/global": "npm:^5.0.0"
   peerDependencies:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
-    storybook: ^9.1.0
+    storybook: ^9.1.2
   peerDependenciesMeta:
     react:
       optional: true
-  checksum: 10c0/128b220b5340318de38020060c33a7c443b072fb215f2dc61d36647fd882db470ebc12d267c58920f0cf9a9438df541d62cecca853d10ec25e9415451082c30a
+  checksum: 10c0/8998ce96e3eb43d4883b8cba128975acd08326930654764e362291857bd325a6aa5e541a199e125ed6f32d3a8f82be05ec9b009906998cba7dfcfd6ad375eedf
   languageName: node
   linkType: hard
 
-"@storybook/builder-vite@npm:9.1.0":
-  version: 9.1.0
-  resolution: "@storybook/builder-vite@npm:9.1.0"
+"@storybook/builder-vite@npm:9.1.2":
+  version: 9.1.2
+  resolution: "@storybook/builder-vite@npm:9.1.2"
   dependencies:
-    "@storybook/csf-plugin": "npm:9.1.0"
+    "@storybook/csf-plugin": "npm:9.1.2"
     ts-dedent: "npm:^2.0.0"
   peerDependencies:
-    storybook: ^9.1.0
+    storybook: ^9.1.2
     vite: ^5.0.0 || ^6.0.0 || ^7.0.0
-  checksum: 10c0/5ba8a8378168091669ba20b2f267aa1e1856329f8d5231a3b84f4afee53fcfe160ba93dbe670265ed2c5b07070491e7e57166d64092e725ff01a8e464c2b1e6f
+  checksum: 10c0/2411e593903bc61336f2a2c6f48e7314dcc8c776346eff0f6fec28e9fc8e3a90d3f8d6561f30d1caf490349d34c7690f8addf4c56fa1fd778f0dfda49cf3aa97
   languageName: node
   linkType: hard
 
-"@storybook/csf-plugin@npm:9.1.0":
-  version: 9.1.0
-  resolution: "@storybook/csf-plugin@npm:9.1.0"
+"@storybook/csf-plugin@npm:9.1.2":
+  version: 9.1.2
+  resolution: "@storybook/csf-plugin@npm:9.1.2"
   dependencies:
     unplugin: "npm:^1.3.1"
   peerDependencies:
-    storybook: ^9.1.0
-  checksum: 10c0/e22df7afb1f2a1722ad71f90492a2b040ee22c1e521a1827f4c6bda6c2eb584b34ea05b010256b0ed95e3891e52e55b5b1acbf1d098d348ebb271cc63afd3735
+    storybook: ^9.1.2
+  checksum: 10c0/a145da545844b9b2af345d43d8f2c035dd801bd6414b4a9a2037dfa950250d08133a956226c49c36a79ffda171ad9388a0f1621c04cfed77e5c342817f4a275e
   languageName: node
   linkType: hard
 
@@ -3159,25 +3178,25 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@storybook/react-dom-shim@npm:9.1.0":
-  version: 9.1.0
-  resolution: "@storybook/react-dom-shim@npm:9.1.0"
+"@storybook/react-dom-shim@npm:9.1.2":
+  version: 9.1.2
+  resolution: "@storybook/react-dom-shim@npm:9.1.2"
   peerDependencies:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
-    storybook: ^9.1.0
-  checksum: 10c0/8dd8ee7c3835862ee78619b97fc6f2c458f818238fe58d6ab415cb2be8b267f862c04b89762a611263c0c32066df7636226c045c954b9825a66340d22ce68254
+    storybook: ^9.1.2
+  checksum: 10c0/7547cb0fdcf8098c00017cbfb501f11a34ae73b9e13984520b8143e709b4b8ec1acf7fed9ce51dbb5b5af5dcd657396da17ef1f262f60efdd4956f3e26b3c704
   languageName: node
   linkType: hard
 
 "@storybook/react-vite@npm:^9.0.6":
-  version: 9.1.0
-  resolution: "@storybook/react-vite@npm:9.1.0"
+  version: 9.1.2
+  resolution: "@storybook/react-vite@npm:9.1.2"
   dependencies:
     "@joshwooding/vite-plugin-react-docgen-typescript": "npm:0.6.1"
     "@rollup/pluginutils": "npm:^5.0.2"
-    "@storybook/builder-vite": "npm:9.1.0"
-    "@storybook/react": "npm:9.1.0"
+    "@storybook/builder-vite": "npm:9.1.2"
+    "@storybook/react": "npm:9.1.2"
     find-up: "npm:^7.0.0"
     magic-string: "npm:^0.30.0"
     react-docgen: "npm:^8.0.0"
@@ -3186,27 +3205,27 @@ __metadata:
   peerDependencies:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
-    storybook: ^9.1.0
+    storybook: ^9.1.2
     vite: ^5.0.0 || ^6.0.0 || ^7.0.0
-  checksum: 10c0/a56b006cfe26d5969259a39af63cac2f8a1d811993d21d9cb0a008b2511b65f64a90524527153ec48d2d57409c1538a4f4429b53605962d65509d91ab8074f4f
+  checksum: 10c0/afed36a0219599577b255042a9c9ac1af0106003ac37e2e9b5846a42b4e8729ff0e8b7ae6018d3ac85b69e918c2a20d554cd484de7345e5fb4974df92914e059
   languageName: node
   linkType: hard
 
-"@storybook/react@npm:9.1.0":
-  version: 9.1.0
-  resolution: "@storybook/react@npm:9.1.0"
+"@storybook/react@npm:9.1.2":
+  version: 9.1.2
+  resolution: "@storybook/react@npm:9.1.2"
   dependencies:
     "@storybook/global": "npm:^5.0.0"
-    "@storybook/react-dom-shim": "npm:9.1.0"
+    "@storybook/react-dom-shim": "npm:9.1.2"
   peerDependencies:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
-    storybook: ^9.1.0
+    storybook: ^9.1.2
     typescript: ">= 4.9.x"
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10c0/302f0f6a80bfd867e3c33ae2e7d5be9d58fa79e4dc59b4ca5bd929397d7dd6fc28ace5b1fc7474a77e0a7287d5a946445fa1b25ca81004c4f20d900a48731af3
+  checksum: 10c0/ea3d9fa25825fde5022942579db9a57154e57cb37244b0d54bb189679a37f20c20906041898f5fcfd4867043ea789384c2d968f334f9d0c55958add0b18fb6ea
   languageName: node
   linkType: hard
 
@@ -3406,136 +3425,136 @@ __metadata:
   linkType: hard
 
 "@swc/types@npm:^0.1.23":
-  version: 0.1.23
-  resolution: "@swc/types@npm:0.1.23"
+  version: 0.1.24
+  resolution: "@swc/types@npm:0.1.24"
   dependencies:
     "@swc/counter": "npm:^0.1.3"
-  checksum: 10c0/edbfe4a72257f40137e27b537bc17d47ccab28de7727471b859c00a1e67f5feac5e01e4b4e0a2365907ce024bb8c3de4b26b6260733e1b601094db54ae9b7477
+  checksum: 10c0/4ca95a338f070f48303e705996bacfc1219f606c45274bed4f6e3488b86b7b20397bd52792e58fdea0fa924fc939695b5eb5ff7f3ff4737382148fe6097e235a
   languageName: node
   linkType: hard
 
-"@tailwindcss/node@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/node@npm:4.1.11"
+"@tailwindcss/node@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/node@npm:4.1.12"
   dependencies:
-    "@ampproject/remapping": "npm:^2.3.0"
-    enhanced-resolve: "npm:^5.18.1"
-    jiti: "npm:^2.4.2"
+    "@jridgewell/remapping": "npm:^2.3.4"
+    enhanced-resolve: "npm:^5.18.3"
+    jiti: "npm:^2.5.1"
     lightningcss: "npm:1.30.1"
     magic-string: "npm:^0.30.17"
     source-map-js: "npm:^1.2.1"
-    tailwindcss: "npm:4.1.11"
-  checksum: 10c0/1a433aecd80d0c6d07d468ed69b696e4e02996e6b77cc5ed66e3c91b02f5fa9a26320fb321e4b1aa107003b401d7a4ffeb2986966dc022ec329a44e54493a2aa
+    tailwindcss: "npm:4.1.12"
+  checksum: 10c0/8dcf3658126fd9bbd95391226022c1f480beacd7a1304a6afb416361bfab4e09b2c89733061e28d3b7429d3c3f77934c56da9d824aa34433d973adccd2080253
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-android-arm64@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-android-arm64@npm:4.1.11"
+"@tailwindcss/oxide-android-arm64@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-android-arm64@npm:4.1.12"
   conditions: os=android & cpu=arm64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-darwin-arm64@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-darwin-arm64@npm:4.1.11"
+"@tailwindcss/oxide-darwin-arm64@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-darwin-arm64@npm:4.1.12"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-darwin-x64@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-darwin-x64@npm:4.1.11"
+"@tailwindcss/oxide-darwin-x64@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-darwin-x64@npm:4.1.12"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-freebsd-x64@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-freebsd-x64@npm:4.1.11"
+"@tailwindcss/oxide-freebsd-x64@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-freebsd-x64@npm:4.1.12"
   conditions: os=freebsd & cpu=x64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.1.11"
+"@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.1.12"
   conditions: os=linux & cpu=arm
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-linux-arm64-gnu@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-linux-arm64-gnu@npm:4.1.11"
+"@tailwindcss/oxide-linux-arm64-gnu@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-linux-arm64-gnu@npm:4.1.12"
   conditions: os=linux & cpu=arm64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-linux-arm64-musl@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-linux-arm64-musl@npm:4.1.11"
+"@tailwindcss/oxide-linux-arm64-musl@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-linux-arm64-musl@npm:4.1.12"
   conditions: os=linux & cpu=arm64 & libc=musl
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-linux-x64-gnu@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-linux-x64-gnu@npm:4.1.11"
+"@tailwindcss/oxide-linux-x64-gnu@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-linux-x64-gnu@npm:4.1.12"
   conditions: os=linux & cpu=x64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-linux-x64-musl@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-linux-x64-musl@npm:4.1.11"
+"@tailwindcss/oxide-linux-x64-musl@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-linux-x64-musl@npm:4.1.12"
   conditions: os=linux & cpu=x64 & libc=musl
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-wasm32-wasi@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-wasm32-wasi@npm:4.1.11"
+"@tailwindcss/oxide-wasm32-wasi@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-wasm32-wasi@npm:4.1.12"
   dependencies:
-    "@emnapi/core": "npm:^1.4.3"
-    "@emnapi/runtime": "npm:^1.4.3"
-    "@emnapi/wasi-threads": "npm:^1.0.2"
-    "@napi-rs/wasm-runtime": "npm:^0.2.11"
-    "@tybys/wasm-util": "npm:^0.9.0"
+    "@emnapi/core": "npm:^1.4.5"
+    "@emnapi/runtime": "npm:^1.4.5"
+    "@emnapi/wasi-threads": "npm:^1.0.4"
+    "@napi-rs/wasm-runtime": "npm:^0.2.12"
+    "@tybys/wasm-util": "npm:^0.10.0"
     tslib: "npm:^2.8.0"
   conditions: cpu=wasm32
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-win32-arm64-msvc@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-win32-arm64-msvc@npm:4.1.11"
+"@tailwindcss/oxide-win32-arm64-msvc@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-win32-arm64-msvc@npm:4.1.12"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide-win32-x64-msvc@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide-win32-x64-msvc@npm:4.1.11"
+"@tailwindcss/oxide-win32-x64-msvc@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide-win32-x64-msvc@npm:4.1.12"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
 
-"@tailwindcss/oxide@npm:4.1.11":
-  version: 4.1.11
-  resolution: "@tailwindcss/oxide@npm:4.1.11"
+"@tailwindcss/oxide@npm:4.1.12":
+  version: 4.1.12
+  resolution: "@tailwindcss/oxide@npm:4.1.12"
   dependencies:
-    "@tailwindcss/oxide-android-arm64": "npm:4.1.11"
-    "@tailwindcss/oxide-darwin-arm64": "npm:4.1.11"
-    "@tailwindcss/oxide-darwin-x64": "npm:4.1.11"
-    "@tailwindcss/oxide-freebsd-x64": "npm:4.1.11"
-    "@tailwindcss/oxide-linux-arm-gnueabihf": "npm:4.1.11"
-    "@tailwindcss/oxide-linux-arm64-gnu": "npm:4.1.11"
-    "@tailwindcss/oxide-linux-arm64-musl": "npm:4.1.11"
-    "@tailwindcss/oxide-linux-x64-gnu": "npm:4.1.11"
-    "@tailwindcss/oxide-linux-x64-musl": "npm:4.1.11"
-    "@tailwindcss/oxide-wasm32-wasi": "npm:4.1.11"
-    "@tailwindcss/oxide-win32-arm64-msvc": "npm:4.1.11"
-    "@tailwindcss/oxide-win32-x64-msvc": "npm:4.1.11"
+    "@tailwindcss/oxide-android-arm64": "npm:4.1.12"
+    "@tailwindcss/oxide-darwin-arm64": "npm:4.1.12"
+    "@tailwindcss/oxide-darwin-x64": "npm:4.1.12"
+    "@tailwindcss/oxide-freebsd-x64": "npm:4.1.12"
+    "@tailwindcss/oxide-linux-arm-gnueabihf": "npm:4.1.12"
+    "@tailwindcss/oxide-linux-arm64-gnu": "npm:4.1.12"
+    "@tailwindcss/oxide-linux-arm64-musl": "npm:4.1.12"
+    "@tailwindcss/oxide-linux-x64-gnu": "npm:4.1.12"
+    "@tailwindcss/oxide-linux-x64-musl": "npm:4.1.12"
+    "@tailwindcss/oxide-wasm32-wasi": "npm:4.1.12"
+    "@tailwindcss/oxide-win32-arm64-msvc": "npm:4.1.12"
+    "@tailwindcss/oxide-win32-x64-msvc": "npm:4.1.12"
     detect-libc: "npm:^2.0.4"
     tar: "npm:^7.4.3"
   dependenciesMeta:
@@ -3563,33 +3582,33 @@ __metadata:
       optional: true
     "@tailwindcss/oxide-win32-x64-msvc":
       optional: true
-  checksum: 10c0/0455483b0e52885a3f36ecbec5409c360159bb0ee969f3a64c2d93dbd94d0d769c1351b7031f4d4b9d8bed997d04d685ca9519160714f432d63f4e824ce1406d
+  checksum: 10c0/30ea0c63e2e024636c607c37fadd9a093168d39ffa816f8113183a085595443d533bfb1a62d8f315800b07f5f8e88fd303b4242505cc65d0cfd622ffd50abbe3
   languageName: node
   linkType: hard
 
 "@tailwindcss/postcss@npm:^4.1.8":
-  version: 4.1.11
-  resolution: "@tailwindcss/postcss@npm:4.1.11"
+  version: 4.1.12
+  resolution: "@tailwindcss/postcss@npm:4.1.12"
   dependencies:
     "@alloc/quick-lru": "npm:^5.2.0"
-    "@tailwindcss/node": "npm:4.1.11"
-    "@tailwindcss/oxide": "npm:4.1.11"
+    "@tailwindcss/node": "npm:4.1.12"
+    "@tailwindcss/oxide": "npm:4.1.12"
     postcss: "npm:^8.4.41"
-    tailwindcss: "npm:4.1.11"
-  checksum: 10c0/e449e1992d0723061aa9452979cd01727db4d1e81b2c16762b01899d06a6c9015792d10d3db4cb553e2e59f307593dc4ccf679ef1add5f774da73d3a091f7227
+    tailwindcss: "npm:4.1.12"
+  checksum: 10c0/25f6229bca22bb20513bb75896ff7d195052380a72cb534691860daeca5d5e3a9b80dc66ceb74998f7614293bf0a62c10d85d4ba5d39b6d820faafec9ab1d134
   languageName: node
   linkType: hard
 
 "@tailwindcss/vite@npm:^4.0.0":
-  version: 4.1.11
-  resolution: "@tailwindcss/vite@npm:4.1.11"
+  version: 4.1.12
+  resolution: "@tailwindcss/vite@npm:4.1.12"
   dependencies:
-    "@tailwindcss/node": "npm:4.1.11"
-    "@tailwindcss/oxide": "npm:4.1.11"
-    tailwindcss: "npm:4.1.11"
+    "@tailwindcss/node": "npm:4.1.12"
+    "@tailwindcss/oxide": "npm:4.1.12"
+    tailwindcss: "npm:4.1.12"
   peerDependencies:
     vite: ^5.2.0 || ^6 || ^7
-  checksum: 10c0/32ddf0716d717786bf89c5c079222675d39366ad1c3e431ad139f5d3d89aac5b67e89c3c9421b93b92c466bc0cf4eecc741f0d37771c0f7a100dfcf83cbb4fec
+  checksum: 10c0/f9a7df532f6ca2a9a1e288c0d87702787419e8ec01f7d5f6c8ff826d79b8adda73871a2e2704c0fab485eaa394d8dc59ff8ad73fcd00c18ab48fcf5f32c382e9
   languageName: node
   linkType: hard
 
@@ -3660,17 +3679,16 @@ __metadata:
   linkType: hard
 
 "@testing-library/jest-dom@npm:^6.6.3":
-  version: 6.6.4
-  resolution: "@testing-library/jest-dom@npm:6.6.4"
+  version: 6.7.0
+  resolution: "@testing-library/jest-dom@npm:6.7.0"
   dependencies:
     "@adobe/css-tools": "npm:^4.4.0"
     aria-query: "npm:^5.0.0"
     css.escape: "npm:^1.5.1"
     dom-accessibility-api: "npm:^0.6.3"
-    lodash: "npm:^4.17.21"
     picocolors: "npm:^1.1.1"
     redent: "npm:^3.0.0"
-  checksum: 10c0/cb73adf4910f654f6cc61cfb9a551efdffa04ef423bc7fbfd67a6d8aa31c6c6dc6363fe9db23a35fc7cb32ff1390e6e1c77575c2fa70d8b028a943af32bc214c
+  checksum: 10c0/e6c5be7a49895b152f78727220064397eff4b5232d13a6206296d837c7a783e5add232219d3333962292002b846fc4909482d299ab92db94d5580f84dc5c1a8a
   languageName: node
   linkType: hard
 
@@ -3701,15 +3719,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tybys/wasm-util@npm:^0.9.0":
-  version: 0.9.0
-  resolution: "@tybys/wasm-util@npm:0.9.0"
-  dependencies:
-    tslib: "npm:^2.4.0"
-  checksum: 10c0/f9fde5c554455019f33af6c8215f1a1435028803dc2a2825b077d812bed4209a1a64444a4ca0ce2ea7e1175c8d88e2f9173a36a33c199e8a5c671aa31de8242d
-  languageName: node
-  linkType: hard
-
 "@types/argparse@npm:1.0.38":
   version: 1.0.38
   resolution: "@types/argparse@npm:1.0.38"
@@ -3788,7 +3797,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/estree@npm:1.0.8, @types/estree@npm:^1.0.0":
+"@types/estree@npm:*, @types/estree@npm:1.0.8, @types/estree@npm:^1.0.0, @types/estree@npm:^1.0.6":
   version: 1.0.8
   resolution: "@types/estree@npm:1.0.8"
   checksum: 10c0/39d34d1afaa338ab9763f37ad6066e3f349444f9052b9676a7cc0252ef9485a41c6d81c9c4e0d26e9077993354edf25efc853f3224dd4b447175ef62bdcc86a5
@@ -3861,11 +3870,11 @@ __metadata:
   linkType: hard
 
 "@types/node@npm:*":
-  version: 24.1.0
-  resolution: "@types/node@npm:24.1.0"
+  version: 24.2.1
+  resolution: "@types/node@npm:24.2.1"
   dependencies:
-    undici-types: "npm:~7.8.0"
-  checksum: 10c0/6c4686bc144f6ce7bffd4cadc3e1196e2217c1da4c639c637213719c8a3ee58b6c596b994befcbffeacd9d9eb0c3bff6529d2bc27da5d1cb9d58b1da0056f9f4
+    undici-types: "npm:~7.10.0"
+  checksum: 10c0/439a3c7edf88a298e0c92e46f670234070b892589c3b06e82cc86c47a7e1cf220f4a4b4736ec6ac7e4b9e1c40d7b6d443a1e22f99dd17f13f9dd15de3b32011b
   languageName: node
   linkType: hard
 
@@ -3877,11 +3886,11 @@ __metadata:
   linkType: hard
 
 "@types/react@npm:^19.0.0":
-  version: 19.1.9
-  resolution: "@types/react@npm:19.1.9"
+  version: 19.1.10
+  resolution: "@types/react@npm:19.1.10"
   dependencies:
     csstype: "npm:^3.0.2"
-  checksum: 10c0/b418da4aaf18fbc6df4f1b7096dda7ee152d697cac00d729ffd855b2b44a3a9cfb2ecb017ed20979ea3a7d98a5ce5fcf01ac1a3614d4a3e4d7069a0c45e49b0f
+  checksum: 10c0/fb583deacd0a815e2775dc1b9f764532d8cacb748ddd2c2914805a46c257ce6c237b4078f44009692074db212ab61a390301c6470f07f5aa5bfdeb78a2acfda1
   languageName: node
   linkType: hard
 
@@ -4054,7 +4063,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-react@npm:^4.3.4":
+"@vitejs/plugin-react@npm:^4.3.4, @vitejs/plugin-react@npm:^4.5.2":
   version: 4.7.0
   resolution: "@vitejs/plugin-react@npm:4.7.0"
   dependencies:
@@ -4070,6 +4079,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vitejs/plugin-rsc@npm:0.4.11":
+  version: 0.4.11
+  resolution: "@vitejs/plugin-rsc@npm:0.4.11"
+  dependencies:
+    "@mjackson/node-fetch-server": "npm:^0.7.0"
+    es-module-lexer: "npm:^1.7.0"
+    estree-walker: "npm:^3.0.3"
+    magic-string: "npm:^0.30.17"
+    periscopic: "npm:^4.0.2"
+    turbo-stream: "npm:^3.1.0"
+    vitefu: "npm:^1.1.1"
+  peerDependencies:
+    react: "*"
+    react-dom: "*"
+    vite: "*"
+  checksum: 10c0/904c0c1965fa305b886fc9003b9ce3742a52af2f1dd3a47c636072912151fa87ebc23c91948c25a70b4c12240aa4166498316ffc68e30ea25f243c6891c294e4
+  languageName: node
+  linkType: hard
+
 "@vitest/expect@npm:2.0.5":
   version: 2.0.5
   resolution: "@vitest/expect@npm:2.0.5"
@@ -4193,30 +4221,30 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@volar/language-core@npm:2.4.22, @volar/language-core@npm:~2.4.11":
-  version: 2.4.22
-  resolution: "@volar/language-core@npm:2.4.22"
+"@volar/language-core@npm:2.4.23, @volar/language-core@npm:~2.4.11":
+  version: 2.4.23
+  resolution: "@volar/language-core@npm:2.4.23"
   dependencies:
-    "@volar/source-map": "npm:2.4.22"
-  checksum: 10c0/3b8f713e02c33919a04108796f6a1c177d6a6521d38b4355381e886364615e5601c7642ffd1378a3ebc24cd157990da38702ff47ece43342ce2707037b37e3b2
+    "@volar/source-map": "npm:2.4.23"
+  checksum: 10c0/1b8d60c7c0faa29ef5ec46dd2b673227592d0697753767e4df088f7c2d93843828116fe59472bb9d604ba653400be32a538e985730844b1af4f42a7075e62049
   languageName: node
   linkType: hard
 
-"@volar/source-map@npm:2.4.22":
-  version: 2.4.22
-  resolution: "@volar/source-map@npm:2.4.22"
-  checksum: 10c0/d145fb189adba8883299caeb770e76b4499b2087d74b779c049664591ca946bafa1b9516108331df5e22c106988939d2f0cfb57f6412dd7ea7b8327556efe069
+"@volar/source-map@npm:2.4.23":
+  version: 2.4.23
+  resolution: "@volar/source-map@npm:2.4.23"
+  checksum: 10c0/08af690093b811d0a37bdd8d306755b4e7f1535b67625c26f6fa6eb9ae081e24c55dabc8231ce8856aa1b731a5ac137b3f0449b34c093923c3545afdbe462c7a
   languageName: node
   linkType: hard
 
 "@volar/typescript@npm:^2.4.11":
-  version: 2.4.22
-  resolution: "@volar/typescript@npm:2.4.22"
+  version: 2.4.23
+  resolution: "@volar/typescript@npm:2.4.23"
   dependencies:
-    "@volar/language-core": "npm:2.4.22"
+    "@volar/language-core": "npm:2.4.23"
     path-browserify: "npm:^1.0.1"
     vscode-uri: "npm:^3.0.8"
-  checksum: 10c0/f83ac0db6cfd420a249d9c24bf0761903b526fbfec1087f726bd18c94a8ef133d7a8a62d26b4781c6d3dccd70459c1a608d75b96ff4bcb5f91d9b7cea7a73897
+  checksum: 10c0/dbb449b66e627a75f8f6df98b3210c32edff62747a12d1e6237a6dc2a75f26432833d4d3646d6fbd60ed21fa52d7e342437377973b80cf4bbeacee1980ffd0cb
   languageName: node
   linkType: hard
 
@@ -4774,16 +4802,16 @@ __metadata:
   linkType: hard
 
 "browserslist@npm:^4.24.0, browserslist@npm:^4.24.4":
-  version: 4.25.1
-  resolution: "browserslist@npm:4.25.1"
+  version: 4.25.2
+  resolution: "browserslist@npm:4.25.2"
   dependencies:
-    caniuse-lite: "npm:^1.0.30001726"
-    electron-to-chromium: "npm:^1.5.173"
+    caniuse-lite: "npm:^1.0.30001733"
+    electron-to-chromium: "npm:^1.5.199"
     node-releases: "npm:^2.0.19"
     update-browserslist-db: "npm:^1.1.3"
   bin:
     browserslist: cli.js
-  checksum: 10c0/acba5f0bdbd5e72dafae1e6ec79235b7bad305ed104e082ed07c34c38c7cb8ea1bc0f6be1496958c40482e40166084458fc3aee15111f15faa79212ad9081b2a
+  checksum: 10c0/3fd27c6d569125e08b476d0ded78232c756bffeb79f29cfa548961dfd62fa560f8bf60fdb52d496ba276aea0c843968dd38ed4138a724277715be3b41dac8861
   languageName: node
   linkType: hard
 
@@ -4895,10 +4923,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"caniuse-lite@npm:^1.0.30001702, caniuse-lite@npm:^1.0.30001726":
-  version: 1.0.30001731
-  resolution: "caniuse-lite@npm:1.0.30001731"
-  checksum: 10c0/d8cddf817d5bec8e7c2106affdbf1bfc3923463ca16697c992b2efeb043e6a5d9dcb70cda913bc6acf9112fd66f9e80279316c08e7800359116925066a63fdfa
+"caniuse-lite@npm:^1.0.30001702, caniuse-lite@npm:^1.0.30001733":
+  version: 1.0.30001735
+  resolution: "caniuse-lite@npm:1.0.30001735"
+  checksum: 10c0/1cb74221f16f8835c903770c1cf88fb73a07298b8398396a2b97570136e8f691053ee5840eb589fe34b4ede14ab828c9421d893a67e43c26ef91ab052813cb8c
   languageName: node
   linkType: hard
 
@@ -4947,9 +4975,9 @@ __metadata:
   linkType: hard
 
 "chalk@npm:^5.2.0":
-  version: 5.4.1
-  resolution: "chalk@npm:5.4.1"
-  checksum: 10c0/b23e88132c702f4855ca6d25cb5538b1114343e41472d5263ee8a37cccfccd9c4216d111e1097c6a27830407a1dc81fecdf2a56f2c63033d4dbbd88c10b0dcef
+  version: 5.5.0
+  resolution: "chalk@npm:5.5.0"
+  checksum: 10c0/23063b544f7c2fe57d25ff814807de561f8adfff72e4f0051051eaa606f772586470507ccd38d89166300eeaadb0164acde8bb8a0716a0f2d56ccdf3761d5e4f
   languageName: node
   linkType: hard
 
@@ -5564,10 +5592,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"electron-to-chromium@npm:^1.5.173":
-  version: 1.5.194
-  resolution: "electron-to-chromium@npm:1.5.194"
-  checksum: 10c0/7d72617857055d54552380b34be411933966fa1156dc8653e321d14e82e2af84114bac607e9e2926f885d560b2697a324981e4204d3da4e0f9604d4a468eeba1
+"electron-to-chromium@npm:^1.5.199":
+  version: 1.5.201
+  resolution: "electron-to-chromium@npm:1.5.201"
+  checksum: 10c0/83f415506e4f79ebe3bcf311526823fe73cd9d54938eff6d98504d222d7c1f7db21acbe98b30394349b1dc973ac85123f1afb5f2b495e166885e5ddd7cf086e6
   languageName: node
   linkType: hard
 
@@ -5601,13 +5629,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"enhanced-resolve@npm:^5.18.1":
-  version: 5.18.2
-  resolution: "enhanced-resolve@npm:5.18.2"
+"enhanced-resolve@npm:^5.18.3":
+  version: 5.18.3
+  resolution: "enhanced-resolve@npm:5.18.3"
   dependencies:
     graceful-fs: "npm:^4.2.4"
     tapable: "npm:^2.2.0"
-  checksum: 10c0/2a45105daded694304b0298d1c0351a981842249a9867513d55e41321a4ccf37dfd35b0c1e9ceae290eab73654b09aa7a910d618ea6f9441e97c52bc424a2372
+  checksum: 10c0/d413c23c2d494e4c1c9c9ac7d60b812083dc6d446699ed495e69c920988af0a3c66bf3f8d0e7a45cb1686c2d4c1df9f4e7352d973f5b56fe63d8d711dd0ccc54
   languageName: node
   linkType: hard
 
@@ -5743,35 +5771,35 @@ __metadata:
   linkType: hard
 
 "esbuild@npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0, esbuild@npm:^0.25.0":
-  version: 0.25.8
-  resolution: "esbuild@npm:0.25.8"
-  dependencies:
-    "@esbuild/aix-ppc64": "npm:0.25.8"
-    "@esbuild/android-arm": "npm:0.25.8"
-    "@esbuild/android-arm64": "npm:0.25.8"
-    "@esbuild/android-x64": "npm:0.25.8"
-    "@esbuild/darwin-arm64": "npm:0.25.8"
-    "@esbuild/darwin-x64": "npm:0.25.8"
-    "@esbuild/freebsd-arm64": "npm:0.25.8"
-    "@esbuild/freebsd-x64": "npm:0.25.8"
-    "@esbuild/linux-arm": "npm:0.25.8"
-    "@esbuild/linux-arm64": "npm:0.25.8"
-    "@esbuild/linux-ia32": "npm:0.25.8"
-    "@esbuild/linux-loong64": "npm:0.25.8"
-    "@esbuild/linux-mips64el": "npm:0.25.8"
-    "@esbuild/linux-ppc64": "npm:0.25.8"
-    "@esbuild/linux-riscv64": "npm:0.25.8"
-    "@esbuild/linux-s390x": "npm:0.25.8"
-    "@esbuild/linux-x64": "npm:0.25.8"
-    "@esbuild/netbsd-arm64": "npm:0.25.8"
-    "@esbuild/netbsd-x64": "npm:0.25.8"
-    "@esbuild/openbsd-arm64": "npm:0.25.8"
-    "@esbuild/openbsd-x64": "npm:0.25.8"
-    "@esbuild/openharmony-arm64": "npm:0.25.8"
-    "@esbuild/sunos-x64": "npm:0.25.8"
-    "@esbuild/win32-arm64": "npm:0.25.8"
-    "@esbuild/win32-ia32": "npm:0.25.8"
-    "@esbuild/win32-x64": "npm:0.25.8"
+  version: 0.25.9
+  resolution: "esbuild@npm:0.25.9"
+  dependencies:
+    "@esbuild/aix-ppc64": "npm:0.25.9"
+    "@esbuild/android-arm": "npm:0.25.9"
+    "@esbuild/android-arm64": "npm:0.25.9"
+    "@esbuild/android-x64": "npm:0.25.9"
+    "@esbuild/darwin-arm64": "npm:0.25.9"
+    "@esbuild/darwin-x64": "npm:0.25.9"
+    "@esbuild/freebsd-arm64": "npm:0.25.9"
+    "@esbuild/freebsd-x64": "npm:0.25.9"
+    "@esbuild/linux-arm": "npm:0.25.9"
+    "@esbuild/linux-arm64": "npm:0.25.9"
+    "@esbuild/linux-ia32": "npm:0.25.9"
+    "@esbuild/linux-loong64": "npm:0.25.9"
+    "@esbuild/linux-mips64el": "npm:0.25.9"
+    "@esbuild/linux-ppc64": "npm:0.25.9"
+    "@esbuild/linux-riscv64": "npm:0.25.9"
+    "@esbuild/linux-s390x": "npm:0.25.9"
+    "@esbuild/linux-x64": "npm:0.25.9"
+    "@esbuild/netbsd-arm64": "npm:0.25.9"
+    "@esbuild/netbsd-x64": "npm:0.25.9"
+    "@esbuild/openbsd-arm64": "npm:0.25.9"
+    "@esbuild/openbsd-x64": "npm:0.25.9"
+    "@esbuild/openharmony-arm64": "npm:0.25.9"
+    "@esbuild/sunos-x64": "npm:0.25.9"
+    "@esbuild/win32-arm64": "npm:0.25.9"
+    "@esbuild/win32-ia32": "npm:0.25.9"
+    "@esbuild/win32-x64": "npm:0.25.9"
   dependenciesMeta:
     "@esbuild/aix-ppc64":
       optional: true
@@ -5827,7 +5855,7 @@ __metadata:
       optional: true
   bin:
     esbuild: bin/esbuild
-  checksum: 10c0/43747a25e120d5dd9ce75c82f57306580d715647c8db4f4a0a84e73b04cf16c27572d3937d3cfb95d5ac3266a4d1bbd3913e3d76ae719693516289fc86f8a5fd
+  checksum: 10c0/aaa1284c75fcf45c82f9a1a117fe8dc5c45628e3386bda7d64916ae27730910b51c5aec7dd45a6ba19256be30ba2935e64a8f011a3f0539833071e06bf76d5b3
   languageName: node
   linkType: hard
 
@@ -6059,14 +6087,14 @@ __metadata:
   linkType: hard
 
 "fdir@npm:^6.4.4, fdir@npm:^6.4.6":
-  version: 6.4.6
-  resolution: "fdir@npm:6.4.6"
+  version: 6.5.0
+  resolution: "fdir@npm:6.5.0"
   peerDependencies:
     picomatch: ^3 || ^4
   peerDependenciesMeta:
     picomatch:
       optional: true
-  checksum: 10c0/45b559cff889934ebb8bc498351e5acba40750ada7e7d6bde197768d2fa67c149be8ae7f8ff34d03f4e1eb20f2764116e56440aaa2f6689e9a4aa7ef06acafe9
+  checksum: 10c0/e345083c4306b3aed6cb8ec551e26c36bab5c511e99ea4576a16750ddc8d3240e63826cc624f5ae17ad4dc82e68a253213b60d556c11bfad064b7607847ed07f
   languageName: node
   linkType: hard
 
@@ -6258,13 +6286,13 @@ __metadata:
   linkType: hard
 
 "fs-extra@npm:~11.3.0":
-  version: 11.3.0
-  resolution: "fs-extra@npm:11.3.0"
+  version: 11.3.1
+  resolution: "fs-extra@npm:11.3.1"
   dependencies:
     graceful-fs: "npm:^4.2.0"
     jsonfile: "npm:^6.0.1"
     universalify: "npm:^2.0.0"
-  checksum: 10c0/5f95e996186ff45463059feb115a22fb048bdaf7e487ecee8a8646c78ed8fdca63630e3077d4c16ce677051f5e60d3355a06f3cd61f3ca43f48cc58822a44d0a
+  checksum: 10c0/61e5b7285b1ca72c68dfe1058b2514294a922683afac2a80aa90540f9bd85370763d675e3b408ef500077d355956fece3bd24b546790e261c3d3015967e2b2d9
   languageName: node
   linkType: hard
 
@@ -6837,13 +6865,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ip-address@npm:^9.0.5":
-  version: 9.0.5
-  resolution: "ip-address@npm:9.0.5"
-  dependencies:
-    jsbn: "npm:1.1.0"
-    sprintf-js: "npm:^1.1.3"
-  checksum: 10c0/331cd07fafcb3b24100613e4b53e1a2b4feab11e671e655d46dc09ee233da5011284d09ca40c4ecbdfe1d0004f462958675c224a804259f2f78d2465a87824bc
+"ip-address@npm:^10.0.1":
+  version: 10.0.1
+  resolution: "ip-address@npm:10.0.1"
+  checksum: 10c0/1634d79dae18394004775cb6d699dc46b7c23df6d2083164025a2b15240c1164fccde53d0e08bd5ee4fc53913d033ab6b5e395a809ad4b956a940c446e948843
   languageName: node
   linkType: hard
 
@@ -6983,6 +7008,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-reference@npm:^3.0.2":
+  version: 3.0.3
+  resolution: "is-reference@npm:3.0.3"
+  dependencies:
+    "@types/estree": "npm:^1.0.6"
+  checksum: 10c0/35edd284cfb4cd9e9f08973f20e276ec517eaca31f5f049598e97dbb2d05544973dde212dac30fddee5b420930bff365e2e67dcd1293d0866c6720377382e3e5
+  languageName: node
+  linkType: hard
+
 "is-regex@npm:^1.1.4, is-regex@npm:^1.2.1":
   version: 1.2.1
   resolution: "is-regex@npm:1.2.1"
@@ -7766,7 +7800,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jiti@npm:^2.4.2":
+"jiti@npm:^2.5.1":
   version: 2.5.1
   resolution: "jiti@npm:2.5.1"
   bin:
@@ -7814,13 +7848,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jsbn@npm:1.1.0":
-  version: 1.1.0
-  resolution: "jsbn@npm:1.1.0"
-  checksum: 10c0/4f907fb78d7b712e11dea8c165fe0921f81a657d3443dde75359ed52eb2b5d33ce6773d97985a089f09a65edd80b11cb75c767b57ba47391fee4c969f7215c96
-  languageName: node
-  linkType: hard
-
 "jsesc@npm:3.0.2":
   version: 3.0.2
   resolution: "jsesc@npm:3.0.2"
@@ -7889,15 +7916,15 @@ __metadata:
   linkType: hard
 
 "jsonfile@npm:^6.0.1":
-  version: 6.1.0
-  resolution: "jsonfile@npm:6.1.0"
+  version: 6.2.0
+  resolution: "jsonfile@npm:6.2.0"
   dependencies:
     graceful-fs: "npm:^4.1.6"
     universalify: "npm:^2.0.0"
   dependenciesMeta:
     graceful-fs:
       optional: true
-  checksum: 10c0/4f95b5e8a5622b1e9e8f33c96b7ef3158122f595998114d1e7f03985649ea99cb3cd99ce1ed1831ae94c8c8543ab45ebd044207612f31a56fd08462140e46865
+  checksum: 10c0/7f4f43b08d1869ded8a6822213d13ae3b99d651151d77efd1557ced0889c466296a7d9684e397bd126acf5eb2cfcb605808c3e681d0fdccd2fe5a04b47e76c0d
   languageName: node
   linkType: hard
 
@@ -9020,6 +9047,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"periscopic@npm:^4.0.2":
+  version: 4.0.2
+  resolution: "periscopic@npm:4.0.2"
+  dependencies:
+    "@types/estree": "npm:*"
+    is-reference: "npm:^3.0.2"
+    zimmerframe: "npm:^1.0.0"
+  checksum: 10c0/841869f013513e9d28795dfcf2c7e0cba435d3e6b854c27cb00b0ac4bbd31e519264784354c30001158684a4a7ba98d67beda8e392b82a566f0e1fb7197bbb38
+  languageName: node
+  linkType: hard
+
 "picocolors@npm:^1.1.0, picocolors@npm:^1.1.1":
   version: 1.1.1
   resolution: "picocolors@npm:1.1.1"
@@ -9448,20 +9486,20 @@ __metadata:
   linkType: hard
 
 "react-router-dom@npm:^7.6.2, react-router-dom@npm:^7.6.3":
-  version: 7.7.1
-  resolution: "react-router-dom@npm:7.7.1"
+  version: 7.8.0
+  resolution: "react-router-dom@npm:7.8.0"
   dependencies:
-    react-router: "npm:7.7.1"
+    react-router: "npm:7.8.0"
   peerDependencies:
     react: ">=18"
     react-dom: ">=18"
-  checksum: 10c0/292455db6991d8559a9e94857440393d9fd011471ff231f8c3a40be6749f74347f20c183a2e9b52830ec54d2bf3b2e1310c006e709e66b27206b0c36ab54def6
+  checksum: 10c0/a39a65477249f306935d48c010afd3f34009be66993df02dfa8a13cb79e0f3d61940e4ea0b7dadadb64b9b1f303358a830ed62c08d05cb406196aee6d609bdaf
   languageName: node
   linkType: hard
 
-"react-router@npm:7.7.1, react-router@npm:^7.6.1, react-router@npm:^7.6.3":
-  version: 7.7.1
-  resolution: "react-router@npm:7.7.1"
+"react-router@npm:7.8.0, react-router@npm:^7.6.1, react-router@npm:^7.6.3":
+  version: 7.8.0
+  resolution: "react-router@npm:7.8.0"
   dependencies:
     cookie: "npm:^1.0.1"
     set-cookie-parser: "npm:^2.6.0"
@@ -9471,7 +9509,7 @@ __metadata:
   peerDependenciesMeta:
     react-dom:
       optional: true
-  checksum: 10c0/e55fe74a2947939526c79e496ab1fc501fd8e89a191a20157d94cfe712d4d9d84f68627811cf1d477a36b98250fcad958bf1237fc41ff0a8b2de00ddc8c53e3b
+  checksum: 10c0/e2d81a1d673ed5d0851810defc19b7db9d8350e31169e1938efe8392b0b995f4faf7b4c9416c257935e2f28c65297a412a053b39e68ac76095130808c5b24db1
   languageName: node
   linkType: hard
 
@@ -9698,7 +9736,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"rollup@npm:^4.34.9, rollup@npm:^4.40.0":
+"rollup@npm:^4.34.9, rollup@npm:^4.43.0":
   version: 4.46.2
   resolution: "rollup@npm:4.46.2"
   dependencies:
@@ -10024,12 +10062,12 @@ __metadata:
   linkType: hard
 
 "socks@npm:^2.8.3":
-  version: 2.8.6
-  resolution: "socks@npm:2.8.6"
+  version: 2.8.7
+  resolution: "socks@npm:2.8.7"
   dependencies:
-    ip-address: "npm:^9.0.5"
+    ip-address: "npm:^10.0.1"
     smart-buffer: "npm:^4.2.0"
-  checksum: 10c0/15b95db4caa359c80bfa880ff3e58f3191b9ffa4313570e501a60ee7575f51e4be664a296f4ee5c2c40544da179db6140be53433ce41ec745f9d51f342557514
+  checksum: 10c0/2805a43a1c4bcf9ebf6e018268d87b32b32b06fbbc1f9282573583acc155860dc361500f89c73bfbb157caa1b4ac78059eac0ef15d1811eb0ca75e0bdadbc9d2
   languageName: node
   linkType: hard
 
@@ -10131,9 +10169,9 @@ __metadata:
   linkType: hard
 
 "spdx-license-ids@npm:^3.0.0":
-  version: 3.0.21
-  resolution: "spdx-license-ids@npm:3.0.21"
-  checksum: 10c0/ecb24c698d8496aa9efe23e0b1f751f8a7a89faedcdfcbfabae772b546c2db46ccde8f3bc447a238eb86bbcd4f73fea88720ef3b8394f7896381bec3d7736411
+  version: 3.0.22
+  resolution: "spdx-license-ids@npm:3.0.22"
+  checksum: 10c0/4a85e44c2ccfc06eebe63239193f526508ebec1abc7cf7bca8ee43923755636234395447c2c87f40fb672cf580a9c8e684513a676bfb2da3d38a4983684bbb38
   languageName: node
   linkType: hard
 
@@ -10146,13 +10184,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"sprintf-js@npm:^1.1.3":
-  version: 1.1.3
-  resolution: "sprintf-js@npm:1.1.3"
-  checksum: 10c0/09270dc4f30d479e666aee820eacd9e464215cdff53848b443964202bf4051490538e5dd1b42e1a65cf7296916ca17640aebf63dae9812749c7542ee5f288dec
-  languageName: node
-  linkType: hard
-
 "sprintf-js@npm:~1.0.2":
   version: 1.0.3
   resolution: "sprintf-js@npm:1.0.3"
@@ -10209,8 +10240,8 @@ __metadata:
   linkType: hard
 
 "storybook@npm:^9.0.6":
-  version: 9.1.0
-  resolution: "storybook@npm:9.1.0"
+  version: 9.1.2
+  resolution: "storybook@npm:9.1.2"
   dependencies:
     "@storybook/global": "npm:^5.0.0"
     "@testing-library/jest-dom": "npm:^6.6.3"
@@ -10231,7 +10262,7 @@ __metadata:
       optional: true
   bin:
     storybook: ./bin/index.cjs
-  checksum: 10c0/6360491360303042fd0e3fb1d6420eea78099e52c1ae49515ed1a4acaf8934df533e30d2c048f7db161daf0e7550c459353304f5ac58c6b74168f37524420c74
+  checksum: 10c0/3a575f94913f9000a3591e5c685f4eabf75fa78ce306f8b0d48e9c72e46028df31f6d15955b8a338be2bf48dadca6550b65782783d8b3cb4b737ba9f3887d007
   languageName: node
   linkType: hard
 
@@ -10416,10 +10447,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tailwindcss@npm:4.1.11, tailwindcss@npm:^4.0.0":
-  version: 4.1.11
-  resolution: "tailwindcss@npm:4.1.11"
-  checksum: 10c0/e23eed0a0d6557b3aff8ba320b82758988ca67c351ee9b33dfc646e83a64f6eaeca6183dfc97e931f7b2fab46e925090066edd697d2ede3f396c9fdeb4af24c1
+"tailwindcss@npm:4.1.12, tailwindcss@npm:^4.0.0":
+  version: 4.1.12
+  resolution: "tailwindcss@npm:4.1.12"
+  checksum: 10c0/0e43375d8de91e1c97a60ed7855f1bf02d5cac61a909439afd54462604862ee71706d812c0447a639f2ef98051a8817840b3df6847c7a1ed015f7a910240ffef
   languageName: node
   linkType: hard
 
@@ -10624,6 +10655,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"turbo-stream@npm:^3.1.0":
+  version: 3.1.0
+  resolution: "turbo-stream@npm:3.1.0"
+  checksum: 10c0/08829863fdfe97026407e6a2137ebd8a744afef75f5af113d181cf29673784febd1797366e1b87362a46f3eca73b79b5d495b2310527c147bbf8c080bb7eeb5b
+  languageName: node
+  linkType: hard
+
 "turbo-windows-64@npm:2.5.5":
   version: 2.5.5
   resolution: "turbo-windows-64@npm:2.5.5"
@@ -10751,10 +10789,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"undici-types@npm:~7.8.0":
-  version: 7.8.0
-  resolution: "undici-types@npm:7.8.0"
-  checksum: 10c0/9d9d246d1dc32f318d46116efe3cfca5a72d4f16828febc1918d94e58f6ffcf39c158aa28bf5b4fc52f410446bc7858f35151367bd7a49f21746cab6497b709b
+"undici-types@npm:~7.10.0":
+  version: 7.10.0
+  resolution: "undici-types@npm:7.10.0"
+  checksum: 10c0/8b00ce50e235fe3cc601307f148b5e8fb427092ee3b23e8118ec0a5d7f68eca8cee468c8fc9f15cbb2cf2a3797945ebceb1cbd9732306a1d00e0a9b6afa0f635
   languageName: node
   linkType: hard
 
@@ -10997,15 +11035,15 @@ __metadata:
   linkType: hard
 
 "vite@npm:^5.0.0 || ^6.0.0 || ^7.0.0-0":
-  version: 7.0.6
-  resolution: "vite@npm:7.0.6"
+  version: 7.1.2
+  resolution: "vite@npm:7.1.2"
   dependencies:
     esbuild: "npm:^0.25.0"
     fdir: "npm:^6.4.6"
     fsevents: "npm:~2.3.3"
     picomatch: "npm:^4.0.3"
     postcss: "npm:^8.5.6"
-    rollup: "npm:^4.40.0"
+    rollup: "npm:^4.43.0"
     tinyglobby: "npm:^0.2.14"
   peerDependencies:
     "@types/node": ^20.19.0 || >=22.12.0
@@ -11047,7 +11085,7 @@ __metadata:
       optional: true
   bin:
     vite: bin/vite.js
-  checksum: 10c0/3b14dfa661281b4843789884199ba2a9cca940a7666970036fe3fb1abff52b88e63e8be5ab419dd04d9f96c0415ee0f1e3ec8ebe357041648af7ccd8e348b6ad
+  checksum: 10c0/4ed825b20bc0f49db99cd382de9506b2721ccd47dcebd4a68e0ef65e3cdd2347fded52b306c34178308e0fd7fe78fd5ff517623002cb00710182ad3012c92ced
   languageName: node
   linkType: hard
 
@@ -11106,6 +11144,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vitefu@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "vitefu@npm:1.1.1"
+  peerDependencies:
+    vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0-beta.0
+  peerDependenciesMeta:
+    vite:
+      optional: true
+  checksum: 10c0/7e0d0dd6fb73bd80cb56a3f47ccc44159e0330c3e94b2951648079b35711226f9088dbe616d910b931740b92259230b874fbe351108b49f5c11b629b641292a5
+  languageName: node
+  linkType: hard
+
 "vscode-uri@npm:^3.0.8":
   version: 3.1.0
   resolution: "vscode-uri@npm:3.1.0"
@@ -11456,6 +11506,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"zimmerframe@npm:^1.0.0":
+  version: 1.1.2
+  resolution: "zimmerframe@npm:1.1.2"
+  checksum: 10c0/8f693609c31cbb4449db223acd61661bc93b73e615f9db6fb8c86d4ceea84ca54cbbeebcf53cf74c22a1f923b92abd18e97988a5e175c76b6ab17238e5593a9d
+  languageName: node
+  linkType: hard
+
 "zod@npm:^3.24.1":
   version: 3.25.76
   resolution: "zod@npm:3.25.76"