@ark-ui/solid 3.6.2 → 3.8.0

package/dist/source/components/field/field-root.jsx

@@ -6,6 +6,7 @@ import { FieldProvider } from './use-field-context';
 export const FieldRoot = (props) => {
     const [useFieldProps, localProps] = createSplitProps()(props, [
         'id',
+        'ids',
         'disabled',
         'invalid',
         'readOnly',

package/dist/source/components/field/use-field.js

@@ -1,17 +1,18 @@
-import { getWindow } from '@zag-js/dom-query';
+import { ariaAttr, dataAttr, getWindow } from '@zag-js/dom-query';
 import { createEffect, createMemo, createSignal, createUniqueId, onCleanup } from 'solid-js';
 import { useFieldsetContext } from '../fieldset';
 import { parts } from './field.anatomy';
 export const useField = (props) => {
     const fieldset = useFieldsetContext();
-    const { disabled = Boolean(fieldset?.().disabled), invalid = false, readOnly = false, required = false, } = props;
+    const { ids, disabled = Boolean(fieldset?.().disabled), invalid = false, readOnly = false, required = false, } = props;
     const [hasErrorText, setHasErrorText] = createSignal(false);
     const [hasHelperText, setHasHelperText] = createSignal(false);
     const id = props.id ?? createUniqueId();
     let rootRef;
-    const errorTextId = `field::${id}::error-text`;
-    const helperTextId = `field::${id}::helper-text`;
-    const labelId = `field::${id}::label`;
+    const rootId = ids?.control ?? `field::${id}`;
+    const errorTextId = ids?.errorText ?? `field::${id}::error-text`;
+    const helperTextId = ids?.helperText ?? `field::${id}::helper-text`;
+    const labelId = ids?.label ?? `field::${id}::label`;
     createEffect(() => {
         const rootNode = rootRef;
         if (!rootNode)
@@ -29,6 +30,7 @@ export const useField = (props) => {
     });
     const getRootProps = () => ({
         ...parts.root.attrs,
+        id: rootId,
         role: 'group',
         'data-disabled': dataAttr(disabled),
         'data-invalid': dataAttr(invalid),
@@ -50,8 +52,9 @@ export const useField = (props) => {
     const getControlProps = () => ({
         'aria-describedby': labelIds.join(' ') || undefined,
         'aria-invalid': ariaAttr(invalid),
-        'aria-required': ariaAttr(required),
-        'aria-readonly': ariaAttr(readOnly),
+        'data-invalid': dataAttr(invalid),
+        'data-required': dataAttr(required),
+        'data-readonly': dataAttr(readOnly),
         id,
         required,
         disabled,
@@ -102,5 +105,3 @@ export const useField = (props) => {
         getErrorTextProps,
     }));
 };
-const dataAttr = (condition) => (condition ? '' : undefined);
-const ariaAttr = (condition) => (condition ? true : undefined);

package/dist/source/components/index.js

@@ -39,3 +39,4 @@ export * from './toast';
 export * from './toggle-group';
 export * from './tooltip';
 export * from './tree-view';
+export * from './timer';

package/dist/source/components/progress/progress-value-text.jsx

@@ -4,5 +4,5 @@ import { useProgressContext } from './use-progress-context';
 export const ProgressValueText = (props) => {
     const api = useProgressContext();
     const mergedProps = mergeProps(() => api().getValueTextProps(), props);
-    return <ark.span {...mergedProps}>{props.children || api().valueAsString}</ark.span>;
+    return <ark.span {...mergedProps}>{props.children || api().percentAsString}</ark.span>;
 };

package/dist/source/components/select/use-select.js

@@ -1,6 +1,6 @@
 import * as select from '@zag-js/select';
 import { normalizeProps, useMachine } from '@zag-js/solid';
-import { createMemo, createUniqueId } from 'solid-js';
+import { createEffect, createMemo, createUniqueId, splitProps } from 'solid-js';
 import { useEnvironmentContext, useLocaleContext } from '../../providers';
 import { createSplitProps } from '../../utils/create-split-props';
 import { useFieldContext } from '../field';
@@ -11,12 +11,12 @@ export const useSelect = (props) => {
         'itemToString',
         'items',
     ]);
-    const collection = () => select.collection({ ...collectionOptions });
+    const collection = createMemo(() => select.collection({ ...collectionOptions }));
     const locale = useLocaleContext();
     const environment = useEnvironmentContext();
     const id = createUniqueId();
     const field = useFieldContext();
-    const context = createMemo(() => ({
+    const initialContext = createMemo(() => ({
         id,
         ids: {
             label: field?.().ids.label,
@@ -34,8 +34,16 @@ export const useSelect = (props) => {
         'open.controlled': props.open !== undefined,
         ...selectProps,
     }));
-    const [state, send] = useMachine(select.machine(context()), {
+    const context = createMemo(() => {
+        const [, restProps] = splitProps(initialContext(), ['collection']);
+        return restProps;
+    });
+    const [state, send] = useMachine(select.machine(initialContext()), {
         context,
     });
-    return createMemo(() => select.connect(state, send, normalizeProps));
+    const api = createMemo(() => select.connect(state, send, normalizeProps));
+    createEffect(() => {
+        api().setCollection(collection());
+    });
+    return api;
 };

package/dist/source/components/timer/index.js

@@ -0,0 +1,9 @@
+export { TimerContext, } from './timer-context';
+export { TimerActionTrigger, } from './timer-action-trigger';
+export { TimerItem, } from './timer-item';
+export { TimerSeparator, } from './timer-separator';
+export { TimerRoot, } from './timer-root';
+export { TimerRootProvider, } from './timer-root-provider';
+export { useTimer } from './use-timer';
+export { useTimerContext } from './use-timer-context';
+export * as Timer from './timer';

package/dist/source/components/timer/timer-action-trigger.jsx

@@ -0,0 +1,8 @@
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory';
+import { useTimerContext } from './use-timer-context';
+export const TimerActionTrigger = (props) => {
+    const timer = useTimerContext();
+    const mergedProps = mergeProps(() => timer().getActionTriggerProps(props), props);
+    return <ark.button {...mergedProps}/>;
+};

package/dist/source/components/timer/timer-context.jsx

@@ -0,0 +1,2 @@
+import { useTimerContext } from './use-timer-context';
+export const TimerContext = (props) => props.children(useTimerContext());

package/dist/source/components/timer/timer-item.jsx

@@ -0,0 +1,10 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../../utils/create-split-props';
+import { ark } from '../factory';
+import { useTimerContext } from './use-timer-context';
+export const TimerItem = (props) => {
+    const [itemProps, localProps] = createSplitProps()(props, ['type']);
+    const timer = useTimerContext();
+    const mergedProps = mergeProps(() => timer().getItemProps(itemProps), localProps);
+    return <ark.div {...mergedProps}>{timer().formattedTime[itemProps.type]}</ark.div>;
+};

package/dist/source/components/timer/timer-root-provider.jsx

@@ -0,0 +1,11 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../../utils/create-split-props';
+import { ark } from '../factory';
+import { TimerProvider } from './use-timer-context';
+export const TimerRootProvider = (props) => {
+    const [{ value: timer }, localProps] = createSplitProps()(props, ['value']);
+    const mergedProps = mergeProps(() => timer().getRootProps(), localProps);
+    return (<TimerProvider value={timer}>
+      <ark.div {...mergedProps}/>
+    </TimerProvider>);
+};

package/dist/source/components/timer/timer-root.jsx

@@ -0,0 +1,22 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../../utils/create-split-props';
+import { ark } from '../factory';
+import { useTimer } from './use-timer';
+import { TimerProvider } from './use-timer-context';
+export const TimerRoot = (props) => {
+    const [useTimerProps, localProps] = createSplitProps()(props, [
+        'id',
+        'autoStart',
+        'interval',
+        'countdown',
+        'startMs',
+        'targetMs',
+        'onComplete',
+        'onTick',
+    ]);
+    const timer = useTimer(useTimerProps);
+    const mergedProps = mergeProps(() => timer().getRootProps(), localProps);
+    return (<TimerProvider value={timer}>
+      <ark.div {...mergedProps}/>
+    </TimerProvider>);
+};

package/dist/source/components/timer/timer-separator.jsx

@@ -0,0 +1,8 @@
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory';
+import { useTimerContext } from './use-timer-context';
+export const TimerSeparator = (props) => {
+    const timer = useTimerContext();
+    const mergedProps = mergeProps(() => timer().getSeparatorProps(), props);
+    return <ark.div {...mergedProps}/>;
+};

package/dist/source/components/timer/timer.js

@@ -0,0 +1,6 @@
+export { TimerContext as Context, } from './timer-context';
+export { TimerActionTrigger as ActionTrigger, } from './timer-action-trigger';
+export { TimerItem as Item, } from './timer-item';
+export { TimerSeparator as Separator, } from './timer-separator';
+export { TimerRoot as Root, } from './timer-root';
+export { TimerRootProvider as RootProvider, } from './timer-root-provider';

package/dist/source/components/timer/use-timer-context.js

@@ -0,0 +1,5 @@
+import { createContext } from '../../utils/create-context';
+export const [TimerProvider, useTimerContext] = createContext({
+    hookName: 'useTimerContext',
+    providerName: '<TimerProvider />',
+});

package/dist/source/components/timer/use-timer.js

@@ -0,0 +1,15 @@
+import { normalizeProps, useMachine } from '@zag-js/solid';
+import * as timer from '@zag-js/timer';
+import { createMemo, createUniqueId } from 'solid-js';
+import { useEnvironmentContext } from '../../providers';
+export const useTimer = (props) => {
+    const env = useEnvironmentContext();
+    const id = createUniqueId();
+    const context = createMemo(() => ({
+        id,
+        getRootNode: env().getRootNode,
+        ...props,
+    }));
+    const [state, send] = useMachine(timer.machine(context()), { context });
+    return createMemo(() => timer.connect(state, send, normalizeProps));
+};

package/dist/types/components/field/use-field.d.ts

@@ -1,5 +1,19 @@
+export interface ElementIds {
+    root?: string;
+    control?: string;
+    label?: string;
+    errorText?: string;
+    helperText?: string;
+}
 export interface UseFieldProps {
+    /**
+     * The id of the field.
+     */
     id?: string;
+    /**
+     * The ids of the field parts.
+     */
+    ids?: ElementIds;
     /**
      * Indicates whether the field is required.
      */
@@ -35,18 +49,19 @@ export declare const useField: (props: UseFieldProps) => import("solid-js").Acce
     required: boolean;
     getLabelProps: () => {
         id: string;
-        'data-disabled': Booleanish;
-        'data-invalid': Booleanish;
-        'data-readonly': Booleanish;
+        'data-disabled': boolean | "false" | "true";
+        'data-invalid': boolean | "false" | "true";
+        'data-readonly': boolean | "false" | "true";
         htmlFor: string;
         "data-scope": string;
         "data-part": string;
     };
     getRootProps: () => {
+        id: string;
         role: string;
-        'data-disabled': Booleanish;
-        'data-invalid': Booleanish;
-        'data-readonly': Booleanish;
+        'data-disabled': boolean | "false" | "true";
+        'data-invalid': boolean | "false" | "true";
+        'data-readonly': boolean | "false" | "true";
         "data-scope": string;
         "data-part": string;
     };
@@ -54,9 +69,10 @@ export declare const useField: (props: UseFieldProps) => import("solid-js").Acce
         "data-scope": string;
         "data-part": string;
         'aria-describedby': string;
-        'aria-invalid': boolean;
-        'aria-required': boolean;
-        'aria-readonly': boolean;
+        'aria-invalid': "true";
+        'data-invalid': boolean | "false" | "true";
+        'data-required': boolean | "false" | "true";
+        'data-readonly': boolean | "false" | "true";
         id: string;
         required: boolean;
         disabled: boolean;
@@ -66,9 +82,10 @@ export declare const useField: (props: UseFieldProps) => import("solid-js").Acce
         "data-scope": string;
         "data-part": string;
         'aria-describedby': string;
-        'aria-invalid': boolean;
-        'aria-required': boolean;
-        'aria-readonly': boolean;
+        'aria-invalid': "true";
+        'data-invalid': boolean | "false" | "true";
+        'data-required': boolean | "false" | "true";
+        'data-readonly': boolean | "false" | "true";
         id: string;
         required: boolean;
         disabled: boolean;
@@ -78,9 +95,10 @@ export declare const useField: (props: UseFieldProps) => import("solid-js").Acce
         "data-scope": string;
         "data-part": string;
         'aria-describedby': string;
-        'aria-invalid': boolean;
-        'aria-required': boolean;
-        'aria-readonly': boolean;
+        'aria-invalid': "true";
+        'data-invalid': boolean | "false" | "true";
+        'data-required': boolean | "false" | "true";
+        'data-readonly': boolean | "false" | "true";
         id: string;
         required: boolean;
         disabled: boolean;
@@ -98,5 +116,3 @@ export declare const useField: (props: UseFieldProps) => import("solid-js").Acce
         id: string;
     };
 }>;
-type Booleanish = boolean | 'true' | 'false';
-export {};

package/dist/types/components/index.d.ts

@@ -39,3 +39,4 @@ export * from './toast';
 export * from './toggle-group';
 export * from './tooltip';
 export * from './tree-view';
+export * from './timer';

package/dist/types/components/timer/index.d.ts

@@ -0,0 +1,9 @@
+export { TimerContext, type TimerContextProps, } from './timer-context';
+export { TimerActionTrigger, type TimerActionTriggerBaseProps, type TimerActionTriggerProps, } from './timer-action-trigger';
+export { TimerItem, type TimerItemProps, type TimerItemBaseProps, } from './timer-item';
+export { TimerSeparator, type TimerSeparatorProps, type TimerSeparatorBaseProps, } from './timer-separator';
+export { TimerRoot, type TimerRootProps, type TimerRootBaseProps, } from './timer-root';
+export { TimerRootProvider, type TimerRootProviderProps, type TimerRootProviderBaseProps, } from './timer-root-provider';
+export { useTimer, type UseTimerProps, type UseTimerReturn } from './use-timer';
+export { useTimerContext, type UseTimerContext } from './use-timer-context';
+export * as Timer from './timer';

package/dist/types/components/timer/timer-action-trigger.d.ts

@@ -0,0 +1,7 @@
+import type { ActionTriggerProps } from '@zag-js/timer';
+import { type HTMLProps, type PolymorphicProps } from '../factory';
+export interface TimerActionTriggerBaseProps extends ActionTriggerProps, PolymorphicProps<'button'> {
+}
+export interface TimerActionTriggerProps extends HTMLProps<'button'>, TimerActionTriggerBaseProps {
+}
+export declare const TimerActionTrigger: (props: TimerActionTriggerProps) => import("solid-js").JSX.Element;

package/dist/types/components/timer/timer-context.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+import { type UseTimerContext } from './use-timer-context';
+export interface TimerContextProps {
+    children: (context: UseTimerContext) => ReactNode;
+}
+export declare const TimerContext: (props: TimerContextProps) => ReactNode;

package/dist/types/components/timer/timer-item.d.ts

@@ -0,0 +1,7 @@
+import type { ItemProps } from '@zag-js/timer';
+import { type HTMLProps, type PolymorphicProps } from '../factory';
+export interface TimerItemBaseProps extends ItemProps, PolymorphicProps<'div'> {
+}
+export interface TimerItemProps extends HTMLProps<'div'>, TimerItemBaseProps {
+}
+export declare const TimerItem: (props: TimerItemProps) => import("solid-js").JSX.Element;

package/dist/types/components/timer/timer-root-provider.d.ts

@@ -0,0 +1,11 @@
+import { type HTMLProps, type PolymorphicProps } from '../factory';
+import type { UseTimerReturn } from './use-timer';
+interface RootProviderProps {
+    value: UseTimerReturn;
+}
+export interface TimerRootProviderBaseProps extends RootProviderProps, PolymorphicProps<'div'> {
+}
+export interface TimerRootProviderProps extends HTMLProps<'div'>, TimerRootProviderBaseProps {
+}
+export declare const TimerRootProvider: (props: TimerRootProviderProps) => import("solid-js").JSX.Element;
+export {};

package/dist/types/components/timer/timer-root.d.ts

@@ -0,0 +1,7 @@
+import { type HTMLProps, type PolymorphicProps } from '../factory';
+import { type UseTimerProps } from './use-timer';
+export interface TimerRootBaseProps extends UseTimerProps, PolymorphicProps<'div'> {
+}
+export interface TimerRootProps extends HTMLProps<'div'>, TimerRootBaseProps {
+}
+export declare const TimerRoot: (props: TimerRootProps) => import("solid-js").JSX.Element;

package/dist/types/components/timer/timer-separator.d.ts

@@ -0,0 +1,6 @@
+import { type HTMLProps, type PolymorphicProps } from '../factory';
+export interface TimerSeparatorBaseProps extends PolymorphicProps<'div'> {
+}
+export interface TimerSeparatorProps extends HTMLProps<'div'>, TimerSeparatorBaseProps {
+}
+export declare const TimerSeparator: (props: TimerSeparatorProps) => import("solid-js").JSX.Element;

package/dist/types/components/timer/timer.d.ts

@@ -0,0 +1,6 @@
+export { TimerContext as Context, type TimerContextProps as ContextProps, } from './timer-context';
+export { TimerActionTrigger as ActionTrigger, type TimerActionTriggerBaseProps as ActionTriggerBaseProps, type TimerActionTriggerProps as ActionTriggerProps, } from './timer-action-trigger';
+export { TimerItem as Item, type TimerItemProps as ItemProps, type TimerItemBaseProps as ItemBaseProps, } from './timer-item';
+export { TimerSeparator as Separator, type TimerSeparatorProps as SeparatorProps, type TimerSeparatorBaseProps as SeparatorBaseProps, } from './timer-separator';
+export { TimerRoot as Root, type TimerRootProps as RootProps, type TimerRootBaseProps as RootBaseProps, } from './timer-root';
+export { TimerRootProvider as RootProvider, type TimerRootProviderProps as RootProviderBaseProps, type TimerRootProviderBaseProps as RootProviderProps, } from './timer-root-provider';

package/dist/types/components/timer/use-timer-context.d.ts

@@ -0,0 +1,4 @@
+import type { UseTimerReturn } from './use-timer';
+export interface UseTimerContext extends UseTimerReturn {
+}
+export declare const TimerProvider: import("solid-js").ContextProviderComponent<UseTimerContext>, useTimerContext: () => UseTimerContext;

package/dist/types/components/timer/use-timer.d.ts

@@ -0,0 +1,9 @@
+import { type PropTypes } from '@zag-js/solid';
+import * as timer from '@zag-js/timer';
+import { type Accessor } from 'solid-js';
+import type { Optional } from '../../types';
+export interface UseTimerProps extends Optional<Omit<timer.Context, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseTimerReturn extends Accessor<timer.Api<PropTypes>> {
+}
+export declare const useTimer: (props: UseTimerProps) => UseTimerReturn;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ark-ui/solid",
-  "version": "3.6.2",
+  "version": "3.8.0",
   "description": "A collection of unstyled, accessible UI components for Solid, utilizing state machines for seamless interaction.",
   "keywords": [
     "accordion",
@@ -85,73 +85,76 @@
   "sideEffects": false,
   "dependencies": {
     "@internationalized/date": "3.5.5",
-    "@zag-js/accordion": "0.63.0",
-    "@zag-js/anatomy": "0.63.0",
-    "@zag-js/avatar": "0.63.0",
-    "@zag-js/carousel": "0.63.0",
-    "@zag-js/checkbox": "0.63.0",
-    "@zag-js/clipboard": "0.63.0",
-    "@zag-js/collapsible": "0.63.0",
-    "@zag-js/color-picker": "0.63.0",
-    "@zag-js/combobox": "0.63.0",
-    "@zag-js/date-picker": "0.63.0",
-    "@zag-js/dialog": "0.63.0",
-    "@zag-js/dom-query": "0.63.0",
-    "@zag-js/editable": "0.63.0",
-    "@zag-js/file-upload": "0.63.0",
-    "@zag-js/hover-card": "0.63.0",
-    "@zag-js/file-utils": "0.63.0",
-    "@zag-js/i18n-utils": "0.63.0",
-    "@zag-js/menu": "0.63.0",
-    "@zag-js/number-input": "0.63.0",
-    "@zag-js/pagination": "0.63.0",
-    "@zag-js/pin-input": "0.63.0",
-    "@zag-js/popover": "0.63.0",
-    "@zag-js/presence": "0.63.0",
-    "@zag-js/progress": "0.63.0",
-    "@zag-js/qr-code": "0.63.0",
-    "@zag-js/radio-group": "0.63.0",
-    "@zag-js/rating-group": "0.63.0",
-    "@zag-js/select": "0.63.0",
-    "@zag-js/signature-pad": "0.63.0",
-    "@zag-js/slider": "0.63.0",
-    "@zag-js/solid": "0.63.0",
-    "@zag-js/splitter": "0.63.0",
-    "@zag-js/switch": "0.63.0",
-    "@zag-js/tabs": "0.63.0",
-    "@zag-js/tags-input": "0.63.0",
-    "@zag-js/time-picker": "0.63.0",
-    "@zag-js/toast": "0.63.0",
-    "@zag-js/toggle-group": "0.63.0",
-    "@zag-js/tooltip": "0.63.0",
-    "@zag-js/tree-view": "0.63.0",
-    "@zag-js/types": "0.63.0"
+    "@zag-js/accordion": "0.64.0",
+    "@zag-js/anatomy": "0.64.0",
+    "@zag-js/avatar": "0.64.0",
+    "@zag-js/carousel": "0.64.0",
+    "@zag-js/checkbox": "0.64.0",
+    "@zag-js/clipboard": "0.64.0",
+    "@zag-js/collapsible": "0.64.0",
+    "@zag-js/color-picker": "0.64.0",
+    "@zag-js/combobox": "0.64.0",
+    "@zag-js/date-picker": "0.64.0",
+    "@zag-js/dialog": "0.64.0",
+    "@zag-js/dom-query": "0.64.0",
+    "@zag-js/editable": "0.64.0",
+    "@zag-js/file-upload": "0.64.0",
+    "@zag-js/hover-card": "0.64.0",
+    "@zag-js/file-utils": "0.64.0",
+    "@zag-js/i18n-utils": "0.64.0",
+    "@zag-js/menu": "0.64.0",
+    "@zag-js/number-input": "0.64.0",
+    "@zag-js/pagination": "0.64.0",
+    "@zag-js/pin-input": "0.64.0",
+    "@zag-js/popover": "0.64.0",
+    "@zag-js/presence": "0.64.0",
+    "@zag-js/progress": "0.64.0",
+    "@zag-js/qr-code": "0.64.0",
+    "@zag-js/radio-group": "0.64.0",
+    "@zag-js/rating-group": "0.64.0",
+    "@zag-js/select": "0.64.0",
+    "@zag-js/signature-pad": "0.64.0",
+    "@zag-js/slider": "0.64.0",
+    "@zag-js/solid": "0.64.0",
+    "@zag-js/splitter": "0.64.0",
+    "@zag-js/steps": "0.64.0",
+    "@zag-js/switch": "0.64.0",
+    "@zag-js/tabs": "0.64.0",
+    "@zag-js/tags-input": "0.64.0",
+    "@zag-js/timer": "0.64.0",
+    "@zag-js/time-picker": "0.64.0",
+    "@zag-js/toast": "0.64.0",
+    "@zag-js/toggle-group": "0.64.0",
+    "@zag-js/tooltip": "0.64.0",
+    "@zag-js/tree-view": "0.64.0",
+    "@zag-js/types": "0.64.0"
   },
   "devDependencies": {
     "@biomejs/biome": "1.8.3",
     "@release-it/keep-a-changelog": "5.0.0",
     "@solidjs/testing-library": "0.8.9",
-    "@storybook/addon-a11y": "8.2.6",
-    "@storybook/addon-essentials": "8.2.6",
+    "@storybook/addon-a11y": "8.2.9",
+    "@storybook/docs-tools": "8.2.9",
+    "@storybook/addon-essentials": "8.2.9",
     "@testing-library/dom": "10.4.0",
     "@testing-library/jest-dom": "6.4.8",
     "@testing-library/user-event": "14.5.2",
     "@types/jsdom": "21.1.7",
     "globby": "14.0.2",
     "jsdom": "24.1.1",
-    "lucide-solid": "0.417.0",
+    "lucide-solid": "0.428.0",
     "release-it": "17.6.0",
     "resize-observer-polyfill": "1.5.1",
-    "rollup": "4.19.1",
+    "rollup": "4.21.0",
     "rollup-preset-solid": "2.0.1",
-    "solid-js": "1.8.19",
-    "storybook": "8.2.6",
+    "solid-js": "1.8.21",
+    "storybook": "8.2.9",
     "storybook-solidjs": "1.0.0-beta.2",
     "storybook-solidjs-vite": "1.0.0-beta.2",
     "typescript": "5.5.4",
-    "vite": "5.3.5",
+    "vite": "5.4.0",
     "vite-plugin-solid": "2.10.2",
-    "vitest": "2.0.4"
+    "vitest": "2.0.5"
   },
   "peerDependencies": {
     "solid-js": ">=1.6.0"