v0.1.14

.drone.yml

@@ -39,12 +39,10 @@ type: docker
 name: web-ui-publish
 
 trigger:
-    branch:
-        - main
     event:
-        - promote
+        - tag
-    target:
+    ref:
-        - production
+        - refs/tags/v*
 
 steps:
     - name: publish-npm
@@ -56,5 +54,6 @@ steps:
           - corepack enable
           - corepack prepare yarn@1.22.22 --activate
           - yarn install --frozen-lockfile
+          - node -e "const pkg=require('./package.json').version; const tag=process.env.DRONE_TAG; if('v'+pkg!==tag){console.error('Tag/version mismatch: v'+pkg+' != '+tag); process.exit(1);}"
           - npm config set //nexus.beatrice.wtf/repository/npm-hosted/:_authToken "$NEXUS_NPM_TOKEN"
           - yarn publish:nexus

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panic/web-ui",
-    "version": "0.1.8",
+    "version": "0.1.14",
     "license": "AGPL-3.0-only",
     "description": "Core components for panic.haus web applications",
     "type": "module",
@@ -54,7 +54,7 @@
     },
     "devDependencies": {
         "@codemirror/language": "^6.11.3",
-        "@eslint/js": "^9",
+        "@eslint/js": "^10",
         "@heroicons/react": "^2.2.0",
         "@lezer/highlight": "^1.2.1",
         "@mdxeditor/editor": "^3.52.4",
@@ -67,7 +67,7 @@
         "@types/react": "^19.0.0",
         "@types/react-dom": "^19.0.0",
         "@vitejs/plugin-react": "^5.0.0",
-        "eslint": "^9",
+        "eslint": "^10",
         "eslint-plugin-react-hooks": "^7.0.1",
         "eslint-plugin-react-refresh": "^0.5.1",
         "globals": "^17.3.0",

src/components/Button.stories.tsx

@@ -39,6 +39,12 @@ const meta = {
             control: 'inline-radio',
             table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
         },
+        width: {
+            description: 'Button width behavior.',
+            options: ['sm', 'md', 'lg', 'full'],
+            control: 'inline-radio',
+            table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
+        },
         to: {
             description: 'Navigation path. When set, the component renders a `<Link>`.',
             control: 'text',
@@ -80,6 +86,7 @@ const meta = {
         type: 'solid',
         variant: 'primary',
         size: 'md',
+        width: 'md',
         label: 'Save',
     },
 } satisfies Meta<typeof Button>;
@@ -132,7 +139,7 @@ export const SizeMatrix: Story = {
             <Button {...args} size="sm" label="Small" />
             <Button {...args} size="md" label="Medium" />
             <Button {...args} size="lg" label="Large" />
-            <Button {...args} size="full" label="Full width" />
+            <Button {...args} size="md" width="full" label="Full width" />
         </div>
     ),
 };

src/components/Button.tsx

@@ -11,6 +11,7 @@ type ButtonProps = {
     type: ButtonType;
     variant?: ButtonVariant;
     size?: ComponentSize;
+    width?: ComponentSize;
     to?: string;
     htmlType?: NativeButtonType;
     onClick?: MouseEventHandler<HTMLElement>;
@@ -24,14 +25,14 @@ const SIZE_CLASS: Record<ComponentSize, string> = {
     sm: 'h-8 px-3 text-xs',
     md: 'h-10 px-4 text-sm',
     lg: 'h-12 px-5 text-base',
-    full: 'h-10 w-full px-4 text-sm',
+    full: 'h-10 px-4 text-sm',
 };
 
 const ICON_ONLY_SIZE_CLASS: Record<ComponentSize, string> = {
     sm: 'h-8 w-8 !p-0',
     md: 'h-10 w-10 !p-0',
     lg: 'h-12 w-12 !p-0',
-    full: 'h-10 w-full !p-0',
+    full: 'h-10 w-10 !p-0',
 };
 
 const ICON_CLASS: Record<ComponentSize, string> = {
@@ -48,6 +49,13 @@ const ICON_ONLY_CLASS: Record<ComponentSize, string> = {
     full: 'h-5 w-5',
 };
 
+const WIDTH_CLASS: Record<ComponentSize, string> = {
+    sm: 'max-w-xs',
+    md: '',
+    lg: 'max-w-md',
+    full: 'w-full max-w-none',
+};
+
 const TYPE_CLASS: Record<ButtonType, string> = {
     solid: 'btn-solid',
     outlined: 'btn-outlined',
@@ -73,6 +81,7 @@ export function Button({
     type,
     variant,
     size = 'md',
+    width = 'md',
     to,
     htmlType = 'button',
     onClick,
@@ -87,6 +96,7 @@ export function Button({
         TYPE_CLASS[type],
         VARIANT_CLASS[resolvedVariant],
         isIconOnly ? ICON_ONLY_SIZE_CLASS[size] : SIZE_CLASS[size],
+        WIDTH_CLASS[width],
         Icon && label ? 'gap-1.5' : '',
         disabled ? 'pointer-events-none cursor-not-allowed opacity-45 saturate-50' : '',
         className,

src/components/DatePicker.stories.tsx

@@ -0,0 +1,240 @@
+import { useState } from 'react';
+import type { Meta, StoryObj } from '@storybook/react';
+import { CalendarDaysIcon } from '@heroicons/react/24/solid';
+import { DatePicker } from './DatePicker';
+
+const meta = {
+    title: 'Components/DatePicker',
+    component: DatePicker,
+    tags: ['autodocs'],
+    parameters: {
+        docs: {
+            description: {
+                component:
+                    'Date selection field with InputField-compatible API, supporting date/time/datetime-local values, size/layout variants, and validation state.',
+            },
+        },
+    },
+    argTypes: {
+        label: {
+            description: 'Label text shown above (stacked) or on the left (inline).',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        placeholder: {
+            description: 'Input placeholder text.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        type: {
+            description: 'Native date input type.',
+            options: ['date', 'datetime-local', 'time'],
+            control: 'inline-radio',
+            table: { type: { summary: "'date' | 'datetime-local' | 'time'" } },
+        },
+        size: {
+            description: 'Input size.',
+            options: ['sm', 'md', 'lg', 'full'],
+            control: 'inline-radio',
+            table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
+        },
+        width: {
+            description: 'Input width constraint.',
+            options: ['sm', 'md', 'lg', 'full'],
+            control: 'inline-radio',
+            table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
+        },
+        layout: {
+            description: 'Label/input layout mode.',
+            options: ['stacked', 'inline'],
+            control: 'inline-radio',
+            table: { type: { summary: "'stacked' | 'inline'" } },
+        },
+        value: {
+            description: 'Controlled input value.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        name: {
+            description: 'Native input `name` attribute.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        disabled: {
+            description: 'Disables the input.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' } },
+        },
+        required: {
+            description: 'Sets the native HTML `required` attribute.',
+            control: 'boolean',
+            table: { type: { summary: 'boolean' } },
+        },
+        error: {
+            description: 'Validation message shown below the field.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        rightIcon: {
+            description: 'Optional trailing icon node.',
+            control: false,
+            table: { type: { summary: 'ReactNode' } },
+        },
+        className: {
+            description: 'Extra CSS classes for the outer wrapper.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        inputClassName: {
+            description: 'Extra CSS classes for the `<input>` element.',
+            control: 'text',
+            table: { type: { summary: 'string' } },
+        },
+        onChange: {
+            description: 'Change handler callback.',
+            action: 'changed',
+            table: { type: { summary: 'ChangeEventHandler<HTMLInputElement>' } },
+        },
+        onBlur: {
+            description: 'Blur handler callback.',
+            control: false,
+            table: { type: { summary: 'FocusEventHandler<HTMLInputElement>' } },
+        },
+        inputRef: {
+            description: 'Ref forwarded to the native `<input>` element.',
+            control: false,
+            table: { type: { summary: 'Ref<HTMLInputElement>' } },
+        },
+    },
+    args: {
+        label: 'Schedule at',
+        type: 'datetime-local',
+        value: '',
+        size: 'md',
+        width: 'md',
+        layout: 'stacked',
+    },
+} satisfies Meta<typeof DatePicker>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const DateOnly: Story = {
+    args: {
+        type: 'date',
+        label: 'Publish date',
+    },
+    render: (args) => {
+        const [value, setValue] = useState('2031-05-20');
+        return (
+            <DatePicker
+                {...args}
+                value={value}
+                onChange={(event) => {
+                    setValue(event.target.value);
+                    args.onChange?.(event);
+                }}
+            />
+        );
+    },
+};
+
+export const DateTime: Story = {
+    args: {
+        type: 'datetime-local',
+        label: 'Schedule at',
+    },
+    render: (args) => {
+        const [value, setValue] = useState('2031-05-20T14:30');
+        return (
+            <DatePicker
+                {...args}
+                value={value}
+                onChange={(event) => {
+                    setValue(event.target.value);
+                    args.onChange?.(event);
+                }}
+            />
+        );
+    },
+};
+
+export const TimeOnlyInline: Story = {
+    args: {
+        type: 'time',
+        label: 'Start time',
+        layout: 'inline',
+        size: 'sm',
+        rightIcon: <CalendarDaysIcon className="h-4 w-4 ui-body-secondary" />,
+    },
+    render: (args) => {
+        const [value, setValue] = useState('09:00');
+        return (
+            <DatePicker
+                {...args}
+                value={value}
+                onChange={(event) => {
+                    setValue(event.target.value);
+                    args.onChange?.(event);
+                }}
+            />
+        );
+    },
+};
+
+export const Error: Story = {
+    args: {
+        type: 'datetime-local',
+        label: 'Schedule at',
+        value: '',
+        error: 'Pick a valid future date and time',
+    },
+};
+
+export const Disabled: Story = {
+    args: {
+        type: 'datetime-local',
+        label: 'Published at',
+        value: '2031-05-20T14:30',
+        disabled: true,
+    },
+};
+
+export const SizeMatrix: Story = {
+    args: {
+        type: 'datetime-local',
+        label: 'Schedule at',
+    },
+    render: (args) => {
+        const [value, setValue] = useState('2031-05-20T14:30');
+        return (
+            <div className="grid grid-cols-1 gap-3">
+                <DatePicker
+                    {...args}
+                    value={value}
+                    size="sm"
+                    onChange={(event) => setValue(event.target.value)}
+                />
+                <DatePicker
+                    {...args}
+                    value={value}
+                    size="md"
+                    onChange={(event) => setValue(event.target.value)}
+                />
+                <DatePicker
+                    {...args}
+                    value={value}
+                    size="lg"
+                    onChange={(event) => setValue(event.target.value)}
+                />
+                <DatePicker
+                    {...args}
+                    value={value}
+                    size="full"
+                    width="full"
+                    onChange={(event) => setValue(event.target.value)}
+                />
+            </div>
+        );
+    },
+};

src/components/DatePicker.tsx

@@ -0,0 +1,97 @@
+import type { ChangeEventHandler, FocusEventHandler, ReactNode, Ref } from 'react';
+import type { ComponentSize } from './types';
+
+type DatePickerKind = 'date' | 'datetime-local' | 'time';
+type Layout = 'stacked' | 'inline';
+
+export type DatePickerProps = {
+    label?: string;
+    placeholder?: string;
+    type: DatePickerKind;
+    size?: ComponentSize;
+    width?: ComponentSize;
+    layout?: Layout;
+    value: string;
+    name?: string;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+    onBlur?: FocusEventHandler<HTMLInputElement>;
+    inputRef?: Ref<HTMLInputElement>;
+    disabled?: boolean;
+    required?: boolean;
+    error?: string;
+    rightIcon?: ReactNode;
+    className?: string;
+    inputClassName?: string;
+};
+
+export function DatePicker({
+    label,
+    placeholder = '',
+    type,
+    size = 'md',
+    width = 'md',
+    layout = 'stacked',
+    value,
+    name,
+    onChange,
+    onBlur,
+    inputRef,
+    disabled = false,
+    required = false,
+    error,
+    rightIcon,
+    className = '',
+    inputClassName = '',
+}: Readonly<DatePickerProps>) {
+    const containerWidthClass = {
+        sm: 'max-w-xs',
+        md: 'max-w-sm',
+        lg: 'max-w-md',
+        full: 'max-w-none',
+    }[width];
+
+    const inputSizeClass = {
+        sm: 'h-8 !text-xs',
+        md: 'h-10 text-sm',
+        lg: 'h-12 text-sm',
+        full: 'h-10 text-sm',
+    }[size];
+
+    const wrapperClass =
+        layout === 'inline' ? 'inline-flex w-auto items-center gap-2' : 'block w-full gap-1';
+    const labelClass = layout === 'inline' ? 'text-xs ui-body-secondary' : '';
+    const hasTrailingIcon = Boolean(rightIcon);
+    const inputWrapperClass = layout === 'inline' ? 'relative' : 'relative mt-1';
+
+    return (
+        <label
+            className={`${wrapperClass} text-sm font-medium ${disabled ? 'ui-label-disabled' : 'ui-label'} ${containerWidthClass} ${className}`.trim()}
+        >
+            {label ? <span className={labelClass}>{label}</span> : null}
+            <div className={inputWrapperClass}>
+                <input
+                    type={type}
+                    value={value}
+                    name={name}
+                    onChange={onChange}
+                    onBlur={onBlur}
+                    ref={inputRef}
+                    placeholder={placeholder}
+                    disabled={disabled}
+                    required={required}
+                    className={`field w-full ${hasTrailingIcon ? 'pr-10' : ''} ${inputSizeClass} ${error ? 'border-red-400/70 focus:border-red-400 focus:ring-red-400/30' : ''} ${inputClassName}`.trim()}
+                />
+                {rightIcon ? (
+                    <span className="pointer-events-none absolute inset-y-0 right-2 inline-flex items-center justify-center px-1">
+                        {rightIcon}
+                    </span>
+                ) : null}
+            </div>
+            {error ? (
+                <span className="mt-1 block text-xs" style={{ color: 'var(--error-text)' }}>
+                    {error}
+                </span>
+            ) : null}
+        </label>
+    );
+}

src/components/Dropdown.stories.tsx

@@ -42,6 +42,12 @@ const meta = {
             control: 'inline-radio',
             table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
         },
+        width: {
+            description: 'Control width constraint.',
+            options: ['sm', 'md', 'lg', 'full'],
+            control: 'inline-radio',
+            table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
+        },
         layout: {
             description: 'Label/control layout mode.',
             options: ['stacked', 'inline'],
@@ -84,6 +90,7 @@ const meta = {
         value: 'draft',
         choices,
         size: 'md',
+        width: 'md',
         layout: 'stacked',
     },
 } satisfies Meta<typeof Dropdown>;
@@ -147,7 +154,14 @@ export const SizeMatrix: Story = {
                 <Dropdown {...args} value={value} size="sm" label="Small" onChange={setValue} />
                 <Dropdown {...args} value={value} size="md" label="Medium" onChange={setValue} />
                 <Dropdown {...args} value={value} size="lg" label="Large" onChange={setValue} />
-                <Dropdown {...args} value={value} size="full" label="Full" onChange={setValue} />
+                <Dropdown
+                    {...args}
+                    value={value}
+                    size="full"
+                    width="full"
+                    label="Full"
+                    onChange={setValue}
+                />
             </div>
         );
     },

src/components/Dropdown.tsx

@@ -14,6 +14,7 @@ type DropdownProps = {
     value: string;
     choices: DropdownChoice[];
     size?: ComponentSize;
+    width?: ComponentSize;
     layout?: DropdownLayout;
     disabled?: boolean;
     required?: boolean;
@@ -28,6 +29,7 @@ export function Dropdown({
     value,
     choices,
     size = 'md',
+    width = 'md',
     layout = 'stacked',
     disabled = false,
     required = false,
@@ -36,12 +38,12 @@ export function Dropdown({
     className = '',
     selectClassName = '',
 }: Readonly<DropdownProps>) {
-    const containerSizeClass = {
+    const containerWidthClass = {
         sm: 'max-w-xs',
         md: 'max-w-sm',
         lg: 'max-w-md',
         full: 'max-w-none',
-    }[size];
+    }[width];
 
     const selectSizeClass = {
         sm: 'h-8 !text-xs',
@@ -62,7 +64,7 @@ export function Dropdown({
 
     return (
         <label
-            className={`${wrapperClass} text-sm font-medium ${disabled ? 'ui-label-disabled' : 'ui-label'} ${containerSizeClass} ${className}`.trim()}
+            className={`${wrapperClass} text-sm font-medium ${disabled ? 'ui-label-disabled' : 'ui-label'} ${containerWidthClass} ${className}`.trim()}
         >
             {label ? <span className={labelClass}>{label}</span> : null}
             <div className={selectWrapperClass}>

src/components/Form.stories.tsx

@@ -80,6 +80,7 @@ export const WithActions: Story = {
                         value={title}
                         onChange={(event) => setTitle(event.target.value)}
                         size="full"
+                        width="full"
                     />
                 </div>
                 <Dropdown

src/components/InputField.stories.tsx

@@ -38,6 +38,12 @@ const meta = {
             control: 'inline-radio',
             table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
         },
+        width: {
+            description: 'Input width constraint.',
+            options: ['sm', 'md', 'lg', 'full'],
+            control: 'inline-radio',
+            table: { type: { summary: "'sm' | 'md' | 'lg' | 'full'" } },
+        },
         layout: {
             description: 'Label/input layout mode.',
             options: ['stacked', 'inline'],
@@ -107,6 +113,7 @@ const meta = {
         placeholder: 'name@example.com',
         value: '',
         size: 'md',
+        width: 'md',
         layout: 'stacked',
     },
 } satisfies Meta<typeof InputField>;
@@ -229,6 +236,7 @@ export const SizeMatrix: Story = {
                     {...args}
                     value={value}
                     size="full"
+                    width="full"
                     onChange={(event) => setValue(event.target.value)}
                 />
             </div>

src/components/InputField.tsx

@@ -12,6 +12,7 @@ type InputFieldProps = {
     placeholder?: string;
     type: InputKind;
     size?: ComponentSize;
+    width?: ComponentSize;
     layout?: Layout;
     value: string;
     name?: string;
@@ -31,6 +32,7 @@ export function InputField({
     placeholder = '',
     type,
     size = 'md',
+    width = 'md',
     layout = 'stacked',
     value,
     name,
@@ -45,12 +47,12 @@ export function InputField({
     inputClassName = '',
 }: Readonly<InputFieldProps>) {
     const [showPassword, setShowPassword] = useState(false);
-    const containerSizeClass = {
+    const containerWidthClass = {
         sm: 'max-w-xs',
         md: 'max-w-sm',
         lg: 'max-w-md',
         full: 'max-w-none',
-    }[size];
+    }[width];
 
     const inputSizeClass = {
         sm: 'h-8 !text-xs',
@@ -69,7 +71,7 @@ export function InputField({
 
     return (
         <label
-            className={`${wrapperClass} text-sm font-medium ${disabled ? 'ui-label-disabled' : 'ui-label'} ${containerSizeClass} ${className}`.trim()}
+            className={`${wrapperClass} text-sm font-medium ${disabled ? 'ui-label-disabled' : 'ui-label'} ${containerWidthClass} ${className}`.trim()}
         >
             {label ? <span className={labelClass}>{label}</span> : null}
             <div className={inputWrapperClass}>

src/components/SidebarNavItem.tsx

@@ -28,7 +28,7 @@ export function SidebarNavItem({
             onClick={onClick}
             className={({ isActive }) =>
                 `inline-flex h-8 items-center rounded-lg text-sm font-medium transition ${layoutClass} ${
-                    isActive ? 'bg-accent-500 text-white' : 'ui-body-secondary hover:bg-zinc-500/15'
+                    isActive ? 'ui-accent-active' : 'ui-body-secondary hover:bg-zinc-500/15'
                 }`
             }
         >

src/index.ts

@@ -1,5 +1,6 @@
 export { Button } from './components/Button';
 export { Chip } from './components/Chip';
+export { DatePicker } from './components/DatePicker';
 export { Dropdown } from './components/Dropdown';
 export { Form } from './components/Form';
 export { InputField } from './components/InputField';
@@ -8,5 +9,6 @@ export { SidebarNavItem } from './components/SidebarNavItem';
 export { Table } from './components/Table';
 
 export type { TableHeader } from './components/Table';
+export type { DatePickerProps } from './components/DatePicker';
 export type { ComponentSize } from './components/types';
 export type { SortDirection, SortState } from './types/sort';

src/styles/base.css

@@ -1,6 +1,12 @@
 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
 
 :root {
+    /* Consumer projects can override these accent tokens after importing @panic/web-ui styles. */
+    --accent-300: 168 155 191;
+    --accent-400: 149 135 173;
+    --accent-500: 125 111 152;
+    --accent-600: 106 93 132;
+    --accent-contrast: 255 255 255;
     --bg-page: #16121a;
     --surface-bg: rgba(24, 24, 27, 0.45);
     --surface-bg-strong: rgba(24, 24, 27, 0.62);
@@ -16,6 +22,8 @@
     --field-disabled-border: #3f3f46;
     --field-disabled-text: #bbb6c3;
     --field-disabled-placeholder: #71717a;
+    --field-selection-bg: rgb(var(--accent-500) / 0.42);
+    --field-selection-text: var(--text-primary);
     --ghost-bg: rgba(24, 24, 27, 0.5);
     --ghost-border: #3f3f46;
     --ghost-hover: rgba(39, 39, 42, 0.7);
@@ -33,8 +41,8 @@
     --error-border: rgba(252, 165, 165, 0.3);
     --error-bg: rgba(239, 68, 68, 0.1);
     --error-text: #fecaca;
-    --mdx-link: #7d6f98;
+    --mdx-link: rgb(var(--accent-500));
-    --mdx-link-hover: #9587ad;
+    --mdx-link-hover: rgb(var(--accent-400));
     --mdx-inline-code-bg: #27272a;
     --mdx-inline-code-border: #3f3f46;
     --mdx-codeblock-bg: #18181b;
@@ -42,8 +50,8 @@
     --mdx-codeblock-text: #e4e4e7;
     --mdx-codeblock-gutter: #a1a1aa;
     --mdx-codeblock-active: #27272a;
-    --mdx-codeblock-selection: rgba(125, 111, 152, 0.35);
+    --mdx-codeblock-selection: rgb(var(--accent-500) / 0.35);
-    --mdx-codeblock-bracket: rgba(125, 111, 152, 0.45);
+    --mdx-codeblock-bracket: rgb(var(--accent-500) / 0.45);
     --shadow-glow: 0 0 0 1px rgba(63, 63, 70, 0.65), 0 18px 44px rgba(0, 0, 0, 0.45);
 }
 
@@ -63,6 +71,8 @@
     --field-disabled-border: #d7d7d7;
     --field-disabled-text: #71717a;
     --field-disabled-placeholder: #a1a1aa;
+    --field-selection-bg: rgb(var(--accent-500) / 0.24);
+    --field-selection-text: var(--text-primary);
     --ghost-bg: rgba(255, 255, 255, 0.88);
     --ghost-border: #d4d4d8;
     --ghost-hover: #f4f4f5;
@@ -78,8 +88,8 @@
     --error-border: rgba(248, 113, 113, 0.35);
     --error-bg: rgba(254, 226, 226, 0.8);
     --error-text: #991b1b;
-    --mdx-link: #7d6f98;
+    --mdx-link: rgb(var(--accent-500));
-    --mdx-link-hover: #6a5d84;
+    --mdx-link-hover: rgb(var(--accent-600));
     --mdx-inline-code-bg: #f4f4f5;
     --mdx-inline-code-border: #d4d4d8;
     --mdx-codeblock-bg: #ffffff;
@@ -87,7 +97,7 @@
     --mdx-codeblock-text: #18181b;
     --mdx-codeblock-gutter: #71717a;
     --mdx-codeblock-active: #f4f4f5;
-    --mdx-codeblock-selection: rgba(125, 111, 152, 0.22);
+    --mdx-codeblock-selection: rgb(var(--accent-500) / 0.22);
-    --mdx-codeblock-bracket: rgba(125, 111, 152, 0.32);
+    --mdx-codeblock-bracket: rgb(var(--accent-500) / 0.32);
     --shadow-glow: 0 0 0 1px rgba(212, 212, 216, 0.9), 0 18px 36px rgba(15, 23, 42, 0.08);
 }

src/styles/components.css

@@ -12,13 +12,42 @@
     appearance: none;
     -webkit-appearance: none;
     -webkit-text-fill-color: var(--text-primary);
-    @apply w-full rounded-xl px-3 py-2 text-sm outline-none transition focus:border-accent-400 focus:ring-2 focus:ring-accent-400/30;
+    @apply w-full rounded-xl px-3 py-2 text-sm outline-none transition;
+}
+
+.field:focus {
+    border-color: rgb(var(--accent-400));
+    box-shadow: 0 0 0 2px rgb(var(--accent-400) / 0.3);
 }
 
 .field::placeholder {
     color: var(--text-soft);
 }
 
+.field::selection {
+    background-color: var(--field-selection-bg);
+    color: var(--field-selection-text);
+    -webkit-text-fill-color: var(--field-selection-text);
+}
+
+.field[type='date']:focus::-webkit-datetime-edit-day-field,
+.field[type='date']:focus::-webkit-datetime-edit-month-field,
+.field[type='date']:focus::-webkit-datetime-edit-year-field,
+.field[type='time']:focus::-webkit-datetime-edit-hour-field,
+.field[type='time']:focus::-webkit-datetime-edit-minute-field,
+.field[type='time']:focus::-webkit-datetime-edit-ampm-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-day-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-month-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-year-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-hour-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-minute-field,
+.field[type='datetime-local']:focus::-webkit-datetime-edit-ampm-field {
+    border-radius: 0.375rem;
+    background-color: var(--field-selection-bg) !important;
+    color: var(--field-selection-text) !important;
+    -webkit-text-fill-color: var(--field-selection-text) !important;
+}
+
 .field:disabled {
     border-color: var(--field-disabled-border);
     background-color: var(--field-disabled-bg);
@@ -55,7 +84,13 @@
 }
 
 .btn-solid.btn-primary {
-    @apply bg-accent-500 text-white hover:bg-accent-400 disabled:opacity-100;
+    background-color: rgb(var(--accent-500));
+    color: rgb(var(--accent-contrast));
+    @apply disabled:opacity-100;
+}
+
+.btn-solid.btn-primary:hover {
+    background-color: rgb(var(--accent-400));
 }
 
 .btn-solid.btn-primary:disabled {
@@ -107,16 +142,19 @@
 }
 
 .btn-outlined.btn-primary {
-    @apply border-accent-500 text-accent-300;
+    border-color: rgb(var(--accent-500));
+    color: rgb(var(--accent-300));
     background-color: transparent;
 }
 
 .btn-outlined.btn-primary:hover {
-    @apply bg-accent-500/15 text-accent-300;
+    background-color: rgb(var(--accent-500) / 0.15);
+    color: rgb(var(--accent-300));
 }
 
 .btn-outlined.btn-primary:disabled {
-    @apply border-accent-500/40 text-accent-300/60;
+    border-color: rgb(var(--accent-500) / 0.4);
+    color: rgb(var(--accent-300) / 0.6);
     background-color: transparent;
 }
 
@@ -149,16 +187,17 @@
 }
 
 .btn-noborder.btn-primary {
-    @apply text-accent-300;
+    color: rgb(var(--accent-300));
     background-color: transparent;
 }
 
 .btn-noborder.btn-primary:hover {
-    @apply bg-accent-500/15 text-accent-300;
+    background-color: rgb(var(--accent-500) / 0.15);
+    color: rgb(var(--accent-300));
 }
 
 .btn-noborder.btn-primary:disabled {
-    @apply text-accent-300/60;
+    color: rgb(var(--accent-300) / 0.6);
     background-color: transparent;
 }
 
@@ -228,6 +267,15 @@
     color: var(--error-text);
 }
 
+.ui-accent-active {
+    background-color: rgb(var(--accent-500));
+    color: rgb(var(--accent-contrast));
+}
+
+.ui-accent-active:hover {
+    background-color: rgb(var(--accent-400));
+}
+
 .chip-root {
     @apply inline-flex items-center rounded-full border px-2.5 py-1 text-xs font-semibold leading-none;
 }

yarn.lock

@@ -706,65 +706,50 @@
   dependencies:
     eslint-visitor-keys "^3.4.3"
 
-"@eslint-community/regexpp@^4.12.1", "@eslint-community/regexpp@^4.12.2":
+"@eslint-community/regexpp@^4.12.2":
   version "4.12.2"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint-community/regexpp/-/regexpp-4.12.2.tgz#bccdf615bcf7b6e8db830ec0b8d21c9a25de597b"
   integrity sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==
 
-"@eslint/config-array@^0.21.1":
+"@eslint/config-array@^0.23.2":
-  version "0.21.1"
+  version "0.23.2"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/config-array/-/config-array-0.21.1.tgz#7d1b0060fea407f8301e932492ba8c18aff29713"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/config-array/-/config-array-0.23.2.tgz#db85beeff7facc685a5775caacb1c845669b9470"
-  integrity sha512-aw1gNayWpdI/jSYVgzN5pL0cfzU02GT3NBpeT/DXbx1/1x7ZKxFPd9bwrzygx/qiwIQiJ1sw/zD8qY/kRvlGHA==
+  integrity sha512-YF+fE6LV4v5MGWRGj7G404/OZzGNepVF8fxk7jqmqo3lrza7a0uUcDnROGRBG1WFC1omYUS/Wp1f42i0M+3Q3A==
   dependencies:
-    "@eslint/object-schema" "^2.1.7"
+    "@eslint/object-schema" "^3.0.2"
     debug "^4.3.1"
-    minimatch "^3.1.2"
+    minimatch "^10.2.1"
 
-"@eslint/config-helpers@^0.4.2":
+"@eslint/config-helpers@^0.5.2":
-  version "0.4.2"
+  version "0.5.2"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/config-helpers/-/config-helpers-0.4.2.tgz#1bd006ceeb7e2e55b2b773ab318d300e1a66aeda"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/config-helpers/-/config-helpers-0.5.2.tgz#314c7b03d02a371ad8c0a7f6821d5a8a8437ba9d"
-  integrity sha512-gBrxN88gOIf3R7ja5K9slwNayVcZgK6SOUORm2uBzTeIEfeVaIhOpCtTox3P6R7o2jLFwLFTLnC7kU/RGcYEgw==
+  integrity sha512-a5MxrdDXEvqnIq+LisyCX6tQMPF/dSJpCfBgBauY+pNZ28yCtSsTvyTYrMhaI+LK26bVyCJfJkT0u8KIj2i1dQ==
   dependencies:
-    "@eslint/core" "^0.17.0"
+    "@eslint/core" "^1.1.0"
 
-"@eslint/core@^0.17.0":
+"@eslint/core@^1.1.0":
-  version "0.17.0"
+  version "1.1.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/core/-/core-0.17.0.tgz#77225820413d9617509da9342190a2019e78761c"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/core/-/core-1.1.0.tgz#51f5cd970e216fbdae6721ac84491f57f965836d"
-  integrity sha512-yL/sLrpmtDaFEiUj1osRP4TI2MDz1AddJL+jZ7KSqvBuliN4xqYY54IfdN8qD8Toa6g1iloph1fxQNkjOxrrpQ==
+  integrity sha512-/nr9K9wkr3P1EzFTdFdMoLuo1PmIxjmwvPozwoSodjNBdefGujXQUF93u1DDZpEaTuDvMsIQddsd35BwtrW9Xw==
   dependencies:
     "@types/json-schema" "^7.0.15"
 
-"@eslint/eslintrc@^3.3.1":
+"@eslint/js@^10":
-  version "3.3.3"
+  version "10.0.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/eslintrc/-/eslintrc-3.3.3.tgz#26393a0806501b5e2b6a43aa588a4d8df67880ac"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/js/-/js-10.0.1.tgz#1e8a876f50117af8ab67e47d5ad94d38d6622583"
-  integrity sha512-Kr+LPIUVKz2qkx1HAMH8q1q6azbqBAsXJUxBl/ODDuVPX45Z9DfwB8tPjTi6nNZ8BuM3nbJxC5zCAg5elnBUTQ==
+  integrity sha512-zeR9k5pd4gxjZ0abRoIaxdc7I3nDktoXZk2qOv9gCNWx3mVwEn32VRhyLaRsDiJjTs0xq/T8mfPtyuXu7GWBcA==
+
+"@eslint/object-schema@^3.0.2":
+  version "3.0.2"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/object-schema/-/object-schema-3.0.2.tgz#c59c6a94aa4b428ed7f1615b6a4495c0a21f7a22"
+  integrity sha512-HOy56KJt48Bx8KmJ+XGQNSUMT/6dZee/M54XyUyuvTvPXJmsERRvBchsUVx1UMe1WwIH49XLAczNC7V2INsuUw==
+
+"@eslint/plugin-kit@^0.6.0":
+  version "0.6.0"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/plugin-kit/-/plugin-kit-0.6.0.tgz#e0cb12ec66719cb2211ad36499fb516f2a63899d"
+  integrity sha512-bIZEUzOI1jkhviX2cp5vNyXQc6olzb2ohewQubuYlMXZ2Q/XjBO0x0XhGPvc9fjSIiUN0vw+0hq53BJ4eQSJKQ==
   dependencies:
-    ajv "^6.12.4"
+    "@eslint/core" "^1.1.0"
-    debug "^4.3.2"
-    espree "^10.0.1"
-    globals "^14.0.0"
-    ignore "^5.2.0"
-    import-fresh "^3.2.1"
-    js-yaml "^4.1.1"
-    minimatch "^3.1.2"
-    strip-json-comments "^3.1.1"
-
-"@eslint/js@9.39.3", "@eslint/js@^9":
-  version "9.39.3"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/js/-/js-9.39.3.tgz#c6168736c7e0c43ead49654ed06a4bcb3833363d"
-  integrity sha512-1B1VkCq6FuUNlQvlBYb+1jDu/gV297TIs/OeiaSR9l1H27SVW55ONE1e1Vp16NqP683+xEGzxYtv4XCiDPaQiw==
-
-"@eslint/object-schema@^2.1.7":
-  version "2.1.7"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/object-schema/-/object-schema-2.1.7.tgz#6e2126a1347e86a4dedf8706ec67ff8e107ebbad"
-  integrity sha512-VtAOaymWVfZcmZbp6E2mympDIHvyjXs/12LqWYjVw6qjrfF+VK+fyG33kChz3nnK+SU5/NeHOqrTEHS8sXO3OA==
-
-"@eslint/plugin-kit@^0.4.1":
-  version "0.4.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/@eslint/plugin-kit/-/plugin-kit-0.4.1.tgz#9779e3fd9b7ee33571a57435cf4335a1794a6cb2"
-  integrity sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==
-  dependencies:
-    "@eslint/core" "^0.17.0"
     levn "^0.4.1"
 
 "@floating-ui/core@^1.7.4":
@@ -1993,6 +1978,11 @@
   resolved "https://nexus.beatrice.wtf/repository/npm-group/@types/doctrine/-/doctrine-0.0.9.tgz#d86a5f452a15e3e3113b99e39616a9baa0f9863f"
   integrity sha512-eOIHzCUSH7SMfonMG1LsC2f8vxBFtho6NGBznK41R84YzPuvSBzrhEps33IsQiOW9+VL6NQ9DbjQJznk/S4uRA==
 
+"@types/esrecurse@^4.3.1":
+  version "4.3.1"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/@types/esrecurse/-/esrecurse-4.3.1.tgz#6f636af962fbe6191b830bd676ba5986926bccec"
+  integrity sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw==
+
 "@types/estree-jsx@^1.0.0":
   version "1.0.5"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/@types/estree-jsx/-/estree-jsx-1.0.5.tgz#858a88ea20f34fe65111f005a689fa1ebf70dc18"
@@ -2000,7 +1990,7 @@
   dependencies:
     "@types/estree" "*"
 
-"@types/estree@*", "@types/estree@1.0.8", "@types/estree@^1.0.0", "@types/estree@^1.0.6":
+"@types/estree@*", "@types/estree@1.0.8", "@types/estree@^1.0.0", "@types/estree@^1.0.6", "@types/estree@^1.0.8":
   version "1.0.8"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/@types/estree/-/estree-1.0.8.tgz#958b91c991b1867ced318bedea0e215ee050726e"
   integrity sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==
@@ -2208,7 +2198,7 @@ acorn-jsx@^5.0.0, acorn-jsx@^5.3.2:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn@^8.0.0, acorn@^8.15.0:
+acorn@^8.0.0, acorn@^8.15.0, acorn@^8.16.0:
   version "8.16.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/acorn/-/acorn-8.16.0.tgz#4ce79c89be40afe7afe8f3adb902a1f1ce9ac08a"
   integrity sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==
@@ -2233,13 +2223,6 @@ ansi-regex@^5.0.1:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/ansi-regex/-/ansi-regex-5.0.1.tgz#082cb2c89c9fe8659a311a53bd6a4dc5301db304"
   integrity sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==
 
-ansi-styles@^4.1.0:
-  version "4.3.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/ansi-styles/-/ansi-styles-4.3.0.tgz#edd803628ae71c04c85ae7a0906edad34b648937"
-  integrity sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==
-  dependencies:
-    color-convert "^2.0.1"
-
 ansi-styles@^5.0.0:
   version "5.2.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/ansi-styles/-/ansi-styles-5.2.0.tgz#07449690ad45777d1924ac2abb2fc8895dba836b"
@@ -2304,11 +2287,6 @@ axe-core@^4.2.0:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/axe-core/-/axe-core-4.11.1.tgz#052ff9b2cbf543f5595028b583e4763b40c78ea7"
   integrity sha512-BASOg+YwO2C+346x3LZOeoovTIoTrRqEsqMa6fmfAV0P+U9mFr9NsyOEpiYvFjbc64NMrSswhV50WdXzdb/Z5A==
 
-balanced-match@^1.0.0:
-  version "1.0.2"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
-  integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==
-
 balanced-match@^4.0.2:
   version "4.0.4"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/balanced-match/-/balanced-match-4.0.4.tgz#bfb10662feed8196a2c62e7c68e17720c274179a"
@@ -2329,14 +2307,6 @@ binary-extensions@^2.0.0:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/binary-extensions/-/binary-extensions-2.3.0.tgz#f6e14a97858d327252200242d4ccfe522c445522"
   integrity sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==
 
-brace-expansion@^1.1.7:
-  version "1.1.12"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/brace-expansion/-/brace-expansion-1.1.12.tgz#ab9b454466e5a8cc3a187beaad580412a9c5b843"
-  integrity sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==
-  dependencies:
-    balanced-match "^1.0.0"
-    concat-map "0.0.1"
-
 brace-expansion@^5.0.2:
   version "5.0.3"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/brace-expansion/-/brace-expansion-5.0.3.tgz#6a9c6c268f85b53959ec527aeafe0f7300258eef"
@@ -2377,11 +2347,6 @@ bundle-name@^4.1.0:
   dependencies:
     run-applescript "^7.0.0"
 
-callsites@^3.0.0:
-  version "3.1.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
-  integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
-
 camelcase-css@^2.0.1:
   version "2.0.1"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/camelcase-css/-/camelcase-css-2.0.1.tgz#ee978f6947914cc30c6b44741b6ed1df7f043fd5"
@@ -2408,14 +2373,6 @@ chai@^5.2.0:
     loupe "^3.1.0"
     pathval "^2.0.0"
 
-chalk@^4.0.0:
-  version "4.1.2"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
-  integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
-  dependencies:
-    ansi-styles "^4.1.0"
-    supports-color "^7.1.0"
-
 character-entities-html4@^2.0.0:
   version "2.1.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/character-entities-html4/-/character-entities-html4-2.1.0.tgz#1f1adb940c971a4b22ba39ddca6b618dc6e56b2b"
@@ -2484,18 +2441,6 @@ codemirror@^6.0.1:
     "@codemirror/state" "^6.0.0"
     "@codemirror/view" "^6.0.0"
 
-color-convert@^2.0.1:
-  version "2.0.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3"
-  integrity sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==
-  dependencies:
-    color-name "~1.1.4"
-
-color-name@~1.1.4:
-  version "1.1.4"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
-  integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
-
 commander@^4.0.0:
   version "4.1.1"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/commander/-/commander-4.1.1.tgz#9fd602bd936294e9e9ef46a3f4d6964044b18068"
@@ -2506,11 +2451,6 @@ compute-scroll-into-view@^2.0.4:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/compute-scroll-into-view/-/compute-scroll-into-view-2.0.4.tgz#2b444b2b9e4724819d2531efacb7ac094155fdf6"
   integrity sha512-y/ZA3BGnxoM/QHHQ2Uy49CLtnWPbt4tTPpEEZiEmmiWBFKjej7nEyH8Ryz54jH0MLXflUYA3Er2zUxPSJu5R+g==
 
-concat-map@0.0.1:
-  version "0.0.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
-  integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
-
 convert-source-map@^2.0.0:
   version "2.0.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/convert-source-map/-/convert-source-map-2.0.0.tgz#4b560f649fc4e918dd0ab75cf4961e8bc882d82a"
@@ -2770,11 +2710,13 @@ eslint-plugin-react-refresh@^0.5.1:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.5.1.tgz#d13f1cfea4718a108060a41219d1849287278adc"
   integrity sha512-Y5sJsreCUdGcF4mLD70iJNa47Z6CX4MsqJoJBARDC/fBhmacSby7k73UuValr0F9M7GfWKpEqS4NMsniWkVxQw==
 
-eslint-scope@^8.4.0:
+eslint-scope@^9.1.1:
-  version "8.4.0"
+  version "9.1.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-scope/-/eslint-scope-8.4.0.tgz#88e646a207fad61436ffa39eb505147200655c82"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-scope/-/eslint-scope-9.1.1.tgz#f6a209486e38bd28356b5feb07d445cc99c89967"
-  integrity sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==
+  integrity sha512-GaUN0sWim5qc8KVErfPBWmc31LEsOkrUJbvJZV+xuL3u2phMUK4HIvXlWAakfC8W4nzlK+chPEAkYOYb5ZScIw==
   dependencies:
+    "@types/esrecurse" "^4.3.1"
+    "@types/estree" "^1.0.8"
     esrecurse "^4.3.0"
     estraverse "^5.2.0"
 
@@ -2783,42 +2725,34 @@ eslint-visitor-keys@^3.4.3:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800"
   integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
 
-eslint-visitor-keys@^4.2.1:
+eslint-visitor-keys@^5.0.0, eslint-visitor-keys@^5.0.1:
-  version "4.2.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz#4cfea60fe7dd0ad8e816e1ed026c1d5251b512c1"
-  integrity sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==
-
-eslint-visitor-keys@^5.0.0:
   version "5.0.1"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz#9e3c9489697824d2d4ce3a8ad12628f91e9f59be"
   integrity sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==
 
-eslint@^9:
+eslint@^10:
-  version "9.39.3"
+  version "10.0.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint/-/eslint-9.39.3.tgz#08d63df1533d7743c0907b32a79a7e134e63ee2f"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/eslint/-/eslint-10.0.1.tgz#b5c5f7706782a21590ba6451e7a30d2947273c2d"
-  integrity sha512-VmQ+sifHUbI/IcSopBCF/HO3YiHQx/AVd3UVyYL6weuwW+HvON9VYn5l6Zl1WZzPWXPNZrSQpxwkkZ/VuvJZzg==
+  integrity sha512-20MV9SUdeN6Jd84xESsKhRly+/vxI+hwvpBMA93s+9dAcjdCuCojn4IqUGS3lvVaqjVYGYHSRMCpeFtF2rQYxQ==
   dependencies:
     "@eslint-community/eslint-utils" "^4.8.0"
-    "@eslint-community/regexpp" "^4.12.1"
+    "@eslint-community/regexpp" "^4.12.2"
-    "@eslint/config-array" "^0.21.1"
+    "@eslint/config-array" "^0.23.2"
-    "@eslint/config-helpers" "^0.4.2"
+    "@eslint/config-helpers" "^0.5.2"
-    "@eslint/core" "^0.17.0"
+    "@eslint/core" "^1.1.0"
-    "@eslint/eslintrc" "^3.3.1"
+    "@eslint/plugin-kit" "^0.6.0"
-    "@eslint/js" "9.39.3"
-    "@eslint/plugin-kit" "^0.4.1"
     "@humanfs/node" "^0.16.6"
     "@humanwhocodes/module-importer" "^1.0.1"
     "@humanwhocodes/retry" "^0.4.2"
     "@types/estree" "^1.0.6"
     ajv "^6.12.4"
-    chalk "^4.0.0"
     cross-spawn "^7.0.6"
     debug "^4.3.2"
     escape-string-regexp "^4.0.0"
-    eslint-scope "^8.4.0"
+    eslint-scope "^9.1.1"
-    eslint-visitor-keys "^4.2.1"
+    eslint-visitor-keys "^5.0.1"
-    espree "^10.4.0"
+    espree "^11.1.1"
-    esquery "^1.5.0"
+    esquery "^1.7.0"
     esutils "^2.0.2"
     fast-deep-equal "^3.1.3"
     file-entry-cache "^8.0.0"
@@ -2828,8 +2762,7 @@ eslint@^9:
     imurmurhash "^0.1.4"
     is-glob "^4.0.0"
     json-stable-stringify-without-jsonify "^1.0.1"
-    lodash.merge "^4.6.2"
+    minimatch "^10.2.1"
-    minimatch "^3.1.2"
     natural-compare "^1.4.0"
     optionator "^0.9.3"
 
@@ -2843,21 +2776,21 @@ esniff@^2.0.1:
     event-emitter "^0.3.5"
     type "^2.7.2"
 
-espree@^10.0.1, espree@^10.4.0:
+espree@^11.1.1:
-  version "10.4.0"
+  version "11.1.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/espree/-/espree-10.4.0.tgz#d54f4949d4629005a1fa168d937c3ff1f7e2a837"
+  resolved "https://nexus.beatrice.wtf/repository/npm-group/espree/-/espree-11.1.1.tgz#866f6bc9ccccd6f28876b7a6463abb281b9cb847"
-  integrity sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==
+  integrity sha512-AVHPqQoZYc+RUM4/3Ly5udlZY/U4LS8pIG05jEjWM2lQMU/oaZ7qshzAl2YP1tfNmXfftH3ohurfwNAug+MnsQ==
   dependencies:
-    acorn "^8.15.0"
+    acorn "^8.16.0"
     acorn-jsx "^5.3.2"
-    eslint-visitor-keys "^4.2.1"
+    eslint-visitor-keys "^5.0.1"
 
 esprima@~4.0.0:
   version "4.0.1"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
   integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
 
-esquery@^1.5.0:
+esquery@^1.7.0:
   version "1.7.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/esquery/-/esquery-1.7.0.tgz#08d048f261f0ddedb5bae95f46809463d9c9496d"
   integrity sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==
@@ -3042,21 +2975,11 @@ glob@^13.0.1:
     minipass "^7.1.3"
     path-scurry "^2.0.2"
 
-globals@^14.0.0:
-  version "14.0.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/globals/-/globals-14.0.0.tgz#898d7413c29babcf6bafe56fcadded858ada724e"
-  integrity sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==
-
 globals@^17.3.0:
   version "17.3.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/globals/-/globals-17.3.0.tgz#8b96544c2fa91afada02747cc9731c002a96f3b9"
   integrity sha512-yMqGUQVVCkD4tqjOJf3TnrvaaHDMYp4VlUSObbkIiuCPe/ofdMBFIAcBbCSRFWOnos6qRiTVStDwqPLUclaxIw==
 
-has-flag@^4.0.0:
-  version "4.0.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
-  integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
-
 hasown@^2.0.2:
   version "2.0.2"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/hasown/-/hasown-2.0.2.tgz#003eaf91be7adc372e84ec59dc37252cedb80003"
@@ -3091,14 +3014,6 @@ ignore@^7.0.5:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/ignore/-/ignore-7.0.5.tgz#4cb5f6cd7d4c7ab0365738c7aea888baa6d7efd9"
   integrity sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==
 
-import-fresh@^3.2.1:
-  version "3.3.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/import-fresh/-/import-fresh-3.3.1.tgz#9cecb56503c0ada1f2741dbbd6546e4b13b57ccf"
-  integrity sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==
-  dependencies:
-    parent-module "^1.0.0"
-    resolve-from "^4.0.0"
-
 imurmurhash@^0.1.4:
   version "0.1.4"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
@@ -3207,7 +3122,7 @@ jiti@^1.21.7:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
   integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
 
-js-yaml@4.1.1, js-yaml@^4.1.1:
+js-yaml@4.1.1:
   version "4.1.1"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/js-yaml/-/js-yaml-4.1.1.tgz#854c292467705b699476e1a2decc0c8a3458806b"
   integrity sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==
@@ -3288,11 +3203,6 @@ locate-path@^6.0.0:
   dependencies:
     p-locate "^5.0.0"
 
-lodash.merge@^4.6.2:
-  version "4.6.2"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
-  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
-
 longest-streak@^3.0.0:
   version "3.1.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/longest-streak/-/longest-streak-3.1.0.tgz#62fa67cd958742a1574af9f39866364102d90cd4"
@@ -3884,20 +3794,13 @@ min-indent@^1.0.0:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/min-indent/-/min-indent-1.0.1.tgz#a63f681673b30571fbe8bc25686ae746eefa9869"
   integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
 
-minimatch@^10.2.2:
+minimatch@^10.2.1, minimatch@^10.2.2:
   version "10.2.2"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/minimatch/-/minimatch-10.2.2.tgz#361603ee323cfb83496fea2ae17cc44ea4e1f99f"
   integrity sha512-+G4CpNBxa5MprY+04MbgOw1v7So6n5JY166pFi9KfYwT78fxScCeSNQSNzp6dpPSW2rONOps6Ocam1wFhCgoVw==
   dependencies:
     brace-expansion "^5.0.2"
 
-minimatch@^3.1.2:
-  version "3.1.3"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/minimatch/-/minimatch-3.1.3.tgz#6a5cba9b31f503887018f579c89f81f61162e624"
-  integrity sha512-M2GCs7Vk83NxkUyQV1bkABc4yxgz9kILhHImZiBPAZ9ybuvCb0/H7lEl5XvIg3g+9d4eNotkZA5IWwYl0tibaA==
-  dependencies:
-    brace-expansion "^1.1.7"
-
 minimatch@^9.0.5:
   version "9.0.6"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/minimatch/-/minimatch-9.0.6.tgz#a7e3bccfcb3d78ec1bf8d51c9ba749080237a5c8"
@@ -4015,13 +3918,6 @@ p-locate@^5.0.0:
   dependencies:
     p-limit "^3.0.2"
 
-parent-module@^1.0.0:
-  version "1.0.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
-  integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
-  dependencies:
-    callsites "^3.0.0"
-
 parse-entities@^4.0.0:
   version "4.0.2"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/parse-entities/-/parse-entities-4.0.2.tgz#61d46f5ed28e4ee62e9ddc43d6b010188443f159"
@@ -4325,11 +4221,6 @@ redent@^3.0.0:
     indent-string "^4.0.0"
     strip-indent "^3.0.0"
 
-resolve-from@^4.0.0:
-  version "4.0.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
-  integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
-
 resolve@^1.1.7, resolve@^1.22.1, resolve@^1.22.8:
   version "1.22.11"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/resolve/-/resolve-1.22.11.tgz#aad857ce1ffb8bfa9b0b1ac29f1156383f68c262"
@@ -4497,11 +4388,6 @@ strip-indent@^4.0.0:
   resolved "https://nexus.beatrice.wtf/repository/npm-group/strip-indent/-/strip-indent-4.1.1.tgz#aba13de189d4ad9a17f6050e76554ac27585c7af"
   integrity sha512-SlyRoSkdh1dYP0PzclLE7r0M9sgbFKKMFXpFRUMNuKhQSbC6VQIGzq3E0qsfvGJaUFJPGv6Ws1NZ/haTAjfbMA==
 
-strip-json-comments@^3.1.1:
-  version "3.1.1"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
-  integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
-
 style-mod@^4.0.0, style-mod@^4.1.0:
   version "4.1.3"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/style-mod/-/style-mod-4.1.3.tgz#6e9012255bb799bdac37e288f7671b5d71bf9f73"
@@ -4520,13 +4406,6 @@ sucrase@^3.35.0:
     tinyglobby "^0.2.11"
     ts-interface-checker "^0.1.9"
 
-supports-color@^7.1.0:
-  version "7.2.0"
-  resolved "https://nexus.beatrice.wtf/repository/npm-group/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da"
-  integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
-  dependencies:
-    has-flag "^4.0.0"
-
 supports-preserve-symlinks-flag@^1.0.0:
   version "1.0.0"
   resolved "https://nexus.beatrice.wtf/repository/npm-group/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"