@ark-ui/solid 4.10.2 → 5.1.0

package/dist/chunk/{BY62F4IV.jsx → AD2EIGNX.jsx}

@@ -6,13 +6,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -48,9 +51,7 @@ var SliderDraggingIndicator = (props) => {
   const slider2 = useSliderContext();
   const thumbProps = useSliderThumbPropsContext();
   const mergedProps = mergeProps2(() => slider2().getDraggingIndicatorProps(thumbProps), props);
-  return <ark.span {...mergedProps}>
-      {props.children || slider2().getThumbValue(thumbProps.index)}
-    </ark.span>;
+  return <ark.span {...mergedProps}>{props.children || slider2().getThumbValue(thumbProps.index)}</ark.span>;
 };
 
 // src/components/slider/slider-hidden-input.tsx
@@ -102,19 +103,18 @@ import { mergeProps as mergeProps8 } from "@zag-js/solid";
 import * as slider from "@zag-js/slider";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
-var useSlider = (props = {}) => {
+var useSlider = (props) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    value: props.defaultValue,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(slider.machine(context()), { context });
-  return createMemo(() => slider.connect(state, send, normalizeProps));
+  const service = useMachine(slider.machine, machineProps);
+  return createMemo(() => slider.connect(service, normalizeProps));
 };
 
 // src/components/slider/slider-root.tsx

package/dist/chunk/{3HMZSTYX.js → B246J3FR.js}

@@ -1,9 +1,10 @@
-import { splitRenderStrategyProps } from './L7OSYHVR.js';
+import { splitRenderStrategyProps } from './QFAL6GWC.js';
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useEnvironmentContext } from './QODB3C3M.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
-import { createContext } from './I5UG2QUO.js';
+import { useEnvironmentContext } from './YMMMHJJS.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
+import { runIfFn } from './DT73WLR4.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -34,25 +35,23 @@ var CollapsibleContent = (props) => {
 // src/components/collapsible/collapsible-context.tsx
 var CollapsibleContext = (props) => props.children(useCollapsibleContext());
 var useCollapsible = (props = {}) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const [renderStrategyProps, collapsibleProps] = splitRenderStrategyProps(props);
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const [renderStrategyProps, collapsibleProps] = splitRenderStrategyProps(runIfFn(props));
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    open: props.defaultOpen,
-    "open.controlled": props.open !== void 0,
     ...collapsibleProps
   }));
-  const [state, send] = useMachine(collapsible.machine(context()), { context });
+  const service = useMachine(collapsible.machine, machineProps);
   const [wasVisible, setWasVisible] = createSignal(false);
   createEffect(() => {
     const isPresent = api().visible;
     if (isPresent) setWasVisible(true);
   });
-  const api = createMemo(() => collapsible.connect(state, send, normalizeProps));
+  const api = createMemo(() => collapsible.connect(service, normalizeProps));
   return createMemo(() => ({
     ...api(),
     unmounted: !api().visible && !wasVisible() && renderStrategyProps.lazyMount || renderStrategyProps.unmountOnExit && !api().visible && wasVisible()

package/dist/chunk/{K54W24N6.jsx → B2KZ5VSW.jsx}

@@ -3,7 +3,7 @@ import {
   splitPresenceProps,
   usePresence,
   usePresenceContext
-} from "./E72NMPSK.jsx";
+} from "./A4744EEE.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -12,13 +12,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -137,21 +140,19 @@ import { mergeProps as mergeProps9 } from "@zag-js/solid";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import * as timePicker from "@zag-js/time-picker";
 import { createMemo, createUniqueId } from "solid-js";
-var useTimePicker = (props = {}) => {
+var useTimePicker = (props) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    open: props.defaultOpen,
-    "open.controlled": props.open !== void 0,
-    value: props.defaultValue,
-    ...props
+    locale: locale().locale,
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(timePicker.machine(context()), { context });
-  return createMemo(() => timePicker.connect(state, send, normalizeProps));
+  const service = useMachine(timePicker.machine, machineProps);
+  return createMemo(() => timePicker.connect(service, normalizeProps));
 };
 
 // src/components/time-picker/time-picker-root.tsx
@@ -193,10 +194,7 @@ var TimePickerRoot = (props) => {
 import { mergeProps as mergeProps10 } from "@zag-js/solid";
 var TimePickerRootProvider = (props) => {
   const [presenceProps, timePickerProps] = splitPresenceProps(props);
-  const [{ value: timePicker2 }, localProps] = createSplitProps()(
-    timePickerProps,
-    ["value"]
-  );
+  const [{ value: timePicker2 }, localProps] = createSplitProps()(timePickerProps, ["value"]);
   const apiPresence = usePresence(mergeProps10(presenceProps, () => ({ present: timePicker2().open })));
   const mergedProps = mergeProps10(() => timePicker2().getRootProps(), localProps);
   return <TimePickerProvider value={timePicker2}>

package/dist/chunk/{2GATVLPK.js → C4PG7WMU.js}

@@ -1,8 +1,9 @@
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useEnvironmentContext } from './QODB3C3M.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
-import { createContext } from './I5UG2QUO.js';
+import { useEnvironmentContext } from './YMMMHJJS.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
+import { runIfFn } from './DT73WLR4.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -44,20 +45,19 @@ var usePagination = (props) => {
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
   const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    page: props.defaultPage,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(pagination.machine(context()), { context });
-  return createMemo(() => pagination.connect(state, send, normalizeProps));
+  const service = useMachine(pagination.machine, machineProps);
+  return createMemo(() => pagination.connect(service, normalizeProps));
 };
 
 // src/components/pagination/pagination-root.tsx
 var PaginationRoot = (props) => {
-  const [usePaginationProps, localProps] = createSplitProps()(props, ["count", "defaultPage", "id", "ids", "onPageChange", "onPageSizeChange", "page", "pageSize", "siblingCount", "translations", "type"]);
+  const [usePaginationProps, localProps] = createSplitProps()(props, ["count", "defaultPage", "defaultPageSize", "id", "ids", "onPageChange", "onPageSizeChange", "page", "pageSize", "siblingCount", "translations", "type"]);
   const api = usePagination(usePaginationProps);
   const mergedProps = mergeProps(() => api().getRootProps(), localProps);
   return createComponent(PaginationProvider, {

package/dist/chunk/{3LRXHWW2.js → C745EVQO.js}

@@ -1,22 +1,16 @@
 import { ark } from './EPLBB4QN.js';
-import { createContext } from './I5UG2QUO.js';
+import { useEnvironmentContext } from './YMMMHJJS.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
-import { normalizeProps, mergeProps, useMachine, useActor } from '@zag-js/solid';
-import * as toast from '@zag-js/toast';
+import * as toast2 from '@zag-js/toast';
 export { anatomy } from '@zag-js/toast';
-import { createComponent, spread, mergeProps as mergeProps$1, insert, template } from 'solid-js/web';
-import { splitProps, createMemo, For } from 'solid-js';
+import { createComponent, template, spread, mergeProps as mergeProps$1, insert } from 'solid-js/web';
+import { mergeProps, useMachine, normalizeProps, Key } from '@zag-js/solid';
+import { splitProps, createUniqueId, createMemo } from 'solid-js';
 
 var createToaster = (props) => {
-  const machine = toast.group.machine({
-    id: "1",
-    ...props
-  });
-  const api = toast.group.connect(machine, machine.send, normalizeProps);
-  return {
-    ...api,
-    machine
-  };
+  return toast2.createStore(props);
 };
 
 // src/components/toast/use-toast-context.ts
@@ -64,21 +58,28 @@ var ToastTitle = (props) => {
 };
 var Toaster = (props) => {
   const [toasterProps, localProps] = splitProps(props, ["toaster", "children"]);
-  const [state, send] = useMachine(toasterProps.toaster.machine);
-  const placement = state.context.placement;
-  const api = createMemo(() => toast.group.connect(state, send, normalizeProps));
-  const toasts = createMemo(() => api().getToastsByPlacement(placement));
-  const mergedProps = mergeProps(api().getGroupProps({
-    placement
-  }), localProps);
+  const locale = useLocaleContext();
+  const env = useEnvironmentContext();
+  const service = useMachine(toast2.group.machine, () => ({
+    store: toasterProps.toaster,
+    id: createUniqueId(),
+    dir: locale()?.dir,
+    getRootNode: () => env()?.getDocument()
+  }));
+  const api = createMemo(() => toast2.group.connect(service, normalizeProps));
+  const toasts = createMemo(() => api().getToasts());
+  const mergedProps = mergeProps(api().getGroupProps(), localProps);
   return createComponent(ark.div, mergeProps$1(mergedProps, {
     get children() {
-      return createComponent(For, {
+      return createComponent(Key, {
         get each() {
           return toasts();
         },
-        children: (toast3) => createComponent(ToastActor, {
+        by: "id",
+        children: (toast3, index) => createComponent(ToastActor, {
           value: toast3,
+          index,
+          parent: service,
           children: (ctx) => toasterProps.children(ctx)
         })
       });
@@ -86,13 +87,17 @@ var Toaster = (props) => {
   }));
 };
 var ToastActor = (props) => {
-  const [state, send] = useActor(props.value);
-  const api = createMemo(() => toast.connect(state, send, normalizeProps));
-  const ctx = createMemo(() => state.context);
+  const localProps = createMemo(() => ({
+    ...props.value(),
+    parent: props.parent,
+    index: props.index
+  }));
+  const service = useMachine(toast2.machine, localProps);
+  const api = createMemo(() => toast2.connect(service, normalizeProps));
   return createComponent(ToastProvider, {
     value: api,
     get children() {
-      return props.children(ctx);
+      return props.children(props.value);
     }
   });
 };

package/dist/chunk/{TOVWS5LG.jsx → CA4LWAR2.jsx}

@@ -1,6 +1,6 @@
 import {
   useFieldContext
-} from "./P7I44WC4.jsx";
+} from "./UCYPIMZC.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -9,13 +9,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -24,12 +27,10 @@ import {
 import { mergeProps } from "@zag-js/solid";
 
 // src/components/signature-pad/use-signature-pad-context.ts
-var [SignaturePadProvider, useSignaturePadContext] = createContext(
-  {
-    hookName: "useSignaturePadContext",
-    providerName: "<SignaturePadProvider />"
-  }
-);
+var [SignaturePadProvider, useSignaturePadContext] = createContext({
+  hookName: "useSignaturePadContext",
+  providerName: "<SignaturePadProvider />"
+});
 
 // src/components/signature-pad/signature-pad-clear-trigger.tsx
 var SignaturePadClearTrigger = (props) => {
@@ -62,10 +63,7 @@ import { mergeProps as mergeProps4 } from "@zag-js/solid";
 var SignaturePadHiddenInput = (props) => {
   const [hiddenInputProps, localProps] = createSplitProps()(props, ["value"]);
   const signaturePad2 = useSignaturePadContext();
-  const mergedProps = mergeProps4(
-    () => signaturePad2().getHiddenInputProps(hiddenInputProps),
-    localProps
-  );
+  const mergedProps = mergeProps4(() => signaturePad2().getHiddenInputProps(hiddenInputProps), localProps);
   const field = useFieldContext();
   return <ark.input aria-describedby={field?.().ariaDescribedby} {...mergedProps} />;
 };
@@ -85,12 +83,12 @@ import { mergeProps as mergeProps6 } from "@zag-js/solid";
 import * as signaturePad from "@zag-js/signature-pad";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
-var useSignaturePad = (props = {}) => {
+var useSignaturePad = (props) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
   const field = useFieldContext();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     ids: {
       label: field?.().ids.label,
@@ -101,10 +99,10 @@ var useSignaturePad = (props = {}) => {
     required: field?.().required,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(signaturePad.machine(context()), { context });
-  return createMemo(() => signaturePad.connect(state, send, normalizeProps));
+  const service = useMachine(signaturePad.machine, machineProps);
+  return createMemo(() => signaturePad.connect(service, normalizeProps));
 };
 
 // src/components/signature-pad/signature-pad-root.tsx
@@ -132,9 +130,7 @@ var SignaturePadRoot = (props) => {
 // src/components/signature-pad/signature-pad-root-provider.tsx
 import { mergeProps as mergeProps7 } from "@zag-js/solid";
 var SignaturePadRootProvider = (props) => {
-  const [{ value: signaturePad2 }, localProps] = createSplitProps()(props, [
-    "value"
-  ]);
+  const [{ value: signaturePad2 }, localProps] = createSplitProps()(props, ["value"]);
   const mergedProps = mergeProps7(() => signaturePad2().getRootProps(), localProps);
   return <SignaturePadProvider value={signaturePad2}>
       <ark.div {...mergedProps} />
@@ -149,9 +145,7 @@ var SignaturePadSegment = (props) => {
   const mergedProps = mergeProps8(() => signaturePad2().getSegmentProps(), props);
   return <ark.svg {...mergedProps}>
       <title>Signature</title>
-      <For each={signaturePad2().paths}>
-        {(path) => <path {...signaturePad2().getSegmentPathProps({ path })} />}
-      </For>
+      <For each={signaturePad2().paths}>{(path) => <path {...signaturePad2().getSegmentPathProps({ path })} />}</For>
       <Show when={signaturePad2().currentPath}>
         {
     /* @ts-expect-error */

package/dist/chunk/{WKVZFHUH.jsx → CABZW4BQ.jsx}

@@ -3,7 +3,7 @@ import {
   splitPresenceProps,
   usePresence,
   usePresenceContext
-} from "./E72NMPSK.jsx";
+} from "./A4744EEE.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -12,13 +12,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -93,9 +96,7 @@ var DatePickerMonthSelect = (props) => {
   const datePicker2 = useDatePickerContext();
   const mergedProps = mergeProps6(() => datePicker2().getMonthSelectProps(), props);
   return <ark.select {...mergedProps}>
-      <Index each={datePicker2().getMonths()}>
-        {(month) => <option value={month().value}>{month().label}</option>}
-      </Index>
+      <Index each={datePicker2().getMonths()}>{(month) => <option value={month().value}>{month().label}</option>}</Index>
     </ark.select>;
 };
 
@@ -163,22 +164,19 @@ import { mergeProps as mergeProps12 } from "@zag-js/solid";
 import * as datePicker from "@zag-js/date-picker";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
-var useDatePicker = (props = {}) => {
+var useDatePicker = (props) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
+    locale: locale().locale,
     getRootNode: environment().getRootNode,
-    open: props.defaultOpen,
-    "open.controlled": props.open !== void 0,
-    value: props.defaultValue,
-    view: props.defaultView,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(datePicker.machine(context()), { context });
-  return createMemo(() => datePicker.connect(state, send, normalizeProps));
+  const service = useMachine(datePicker.machine, machineProps);
+  return createMemo(() => datePicker.connect(service, normalizeProps));
 };
 
 // src/components/date-picker/date-picker-root.tsx
@@ -186,6 +184,7 @@ var DatePickerRoot = (props) => {
   const [presenceProps, datePickerProps] = splitPresenceProps(props);
   const [useDatePickerProps, localProps] = createSplitProps()(datePickerProps, [
     "closeOnSelect",
+    "defaultFocusedValue",
     "defaultOpen",
     "defaultValue",
     "defaultView",
@@ -234,10 +233,7 @@ var DatePickerRoot = (props) => {
 import { mergeProps as mergeProps13 } from "@zag-js/solid";
 var DatePickerRootProvider = (props) => {
   const [presenceProps, datePickerProps] = splitPresenceProps(props);
-  const [{ value: datePicker2 }, localProps] = createSplitProps()(
-    datePickerProps,
-    ["value"]
-  );
+  const [{ value: datePicker2 }, localProps] = createSplitProps()(datePickerProps, ["value"]);
   const presence = usePresence(mergeProps13(presenceProps, () => ({ present: datePicker2().open })));
   const mergedProps = mergeProps13(() => datePicker2().getRootProps(), localProps);
   return <DatePickerProvider value={datePicker2}>
@@ -259,9 +255,7 @@ var [DatePickerTableProvider, useDatePickerTableContext] = createContext({
 
 // src/components/date-picker/date-picker-table.tsx
 var DatePickerTable = (props) => {
-  const [{ columns }, localProps] = createSplitProps()(props, [
-    "columns"
-  ]);
+  const [{ columns }, localProps] = createSplitProps()(props, ["columns"]);
   const api = useDatePickerContext();
   const viewProps = useDatePickerViewContext();
   const tableProps = { columns, id: createUniqueId2(), ...viewProps };
@@ -412,9 +406,7 @@ var DatePickerYearSelect = (props) => {
   const datePicker2 = useDatePickerContext();
   const mergedProps = mergeProps25(() => datePicker2().getYearSelectProps(), props);
   return <ark.select {...mergedProps}>
-      <Index2 each={datePicker2().getYears()}>
-        {(year) => <option value={year().value}>{year().label}</option>}
-      </Index2>
+      <Index2 each={datePicker2().getYears()}>{(year) => <option value={year().value}>{year().label}</option>}</Index2>
     </ark.select>;
 };
 

package/dist/chunk/{Y4LH2CR6.jsx → CGBS64C2.jsx}

@@ -1,6 +1,6 @@
 import {
   useFieldContext
-} from "./P7I44WC4.jsx";
+} from "./UCYPIMZC.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -9,13 +9,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -77,12 +80,12 @@ import { mergeProps as mergeProps6 } from "@zag-js/solid";
 import * as numberInput from "@zag-js/number-input";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
-var useNumberInput = (props = {}) => {
+var useNumberInput = (props) => {
   const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
   const field = useFieldContext();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     ids: {
       label: field?.().ids.label,
@@ -95,11 +98,10 @@ var useNumberInput = (props = {}) => {
     dir: locale().dir,
     locale: locale().locale,
     getRootNode: environment().getRootNode,
-    value: props.defaultValue,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(numberInput.machine(context()), { context });
-  return createMemo(() => numberInput.connect(state, send, normalizeProps));
+  const service = useMachine(numberInput.machine, machineProps);
+  return createMemo(() => numberInput.connect(service, normalizeProps));
 };
 
 // src/components/number-input/number-input-root.tsx
@@ -142,9 +144,7 @@ var NumberInputRoot = (props) => {
 // src/components/number-input/number-input-root-provider.tsx
 import { mergeProps as mergeProps7 } from "@zag-js/solid";
 var NumberInputRootProvider = (props) => {
-  const [{ value: numberInput2 }, localProps] = createSplitProps()(props, [
-    "value"
-  ]);
+  const [{ value: numberInput2 }, localProps] = createSplitProps()(props, ["value"]);
   const mergedProps = mergeProps7(() => numberInput2().getRootProps(), localProps);
   return <NumberInputProvider value={numberInput2}>
       <ark.div {...mergedProps} />

package/dist/chunk/{2HTNQLGP.jsx → CHLRHJV2.jsx}

@@ -6,13 +6,16 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./D2Z5BEON.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
+import {
+  runIfFn
+} from "./KGOB2IMX.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -47,10 +50,7 @@ var CarouselControl = (props) => {
 // src/components/carousel/carousel-indicator.tsx
 import { mergeProps as mergeProps3 } from "@zag-js/solid";
 var CarouselIndicator = (props) => {
-  const [indicatorProps, localProps] = createSplitProps()(props, [
-    "index",
-    "readOnly"
-  ]);
+  const [indicatorProps, localProps] = createSplitProps()(props, ["index", "readOnly"]);
   const api = useCarouselContext();
   const mergedProps = mergeProps3(() => api().getIndicatorProps(indicatorProps), localProps);
   return <ark.button {...mergedProps} />;
@@ -104,19 +104,18 @@ import { mergeProps as mergeProps9 } from "@zag-js/solid";
 import * as carousel from "@zag-js/carousel";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
-var useCarousel = (props = {}) => {
+var useCarousel = (props) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    index: props.defaultPage,
-    ...props
+    ...runIfFn(props)
   }));
-  const [state, send] = useMachine(carousel.machine(context()), { context });
-  return createMemo(() => carousel.connect(state, send, normalizeProps));
+  const service = useMachine(carousel.machine, machineProps);
+  return createMemo(() => carousel.connect(service, normalizeProps));
 };
 
 // src/components/carousel/carousel-root.tsx