@ark-ui/solid 4.10.1 → 5.0.0

package/dist/chunk/{2HTNQLGP.jsx → 676ULDTZ.jsx}

@@ -6,13 +6,13 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./BPYAMTER.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -47,10 +47,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 +101,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
   }));
-  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

package/dist/chunk/{U7SPBSDD.jsx → 6AKFQH4M.jsx}

@@ -6,13 +6,13 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./BPYAMTER.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -43,20 +43,17 @@ import { normalizeProps, useMachine } from "@zag-js/solid";
 import * as toggleGroup from "@zag-js/toggle-group";
 import { createMemo, createUniqueId } from "solid-js";
 var useToggleGroup = (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
   }));
-  const [state, send] = useMachine(toggleGroup.machine(context()), {
-    context
-  });
-  return createMemo(() => toggleGroup.connect(state, send, normalizeProps));
+  const service = useMachine(toggleGroup.machine, machineProps);
+  return createMemo(() => toggleGroup.connect(service, normalizeProps));
 };
 
 // src/components/toggle-group/toggle-group-root.tsx
@@ -83,9 +80,7 @@ var ToggleGroupRoot = (props) => {
 // src/components/toggle-group/toggle-group-root-provider.tsx
 import { mergeProps as mergeProps3 } from "@zag-js/solid";
 var ToggleGroupRootProvider = (props) => {
-  const [{ value: toggleGroup2 }, localProps] = createSplitProps()(props, [
-    "value"
-  ]);
+  const [{ value: toggleGroup2 }, localProps] = createSplitProps()(props, ["value"]);
   const mergedProps = mergeProps3(() => toggleGroup2().getRootProps(), localProps);
   return <ToggleGroupProvider value={toggleGroup2}>
       <ark.div {...mergedProps} />

package/dist/chunk/{QODB3C3M.js → 6MQ6S5JP.js}

@@ -1,9 +1,12 @@
-import { runIfFn } from './DT73WLR4.js';
-import { createContext } from './I5UG2QUO.js';
-import { createComponent, memo, use, template } from 'solid-js/web';
-import { getDocument, getWindow } from '@zag-js/dom-query';
+import { createContext } from './TROPIN4C.js';
+import { createComponent, memo, template, use } from 'solid-js/web';
+import { getWindow, getDocument } from '@zag-js/dom-query';
 import { createSignal, createMemo, Show } from 'solid-js';
 
+// src/utils/run-if-fn.ts
+var isFunction = (value) => typeof value === "function";
+var runIfFn = (valueOrFn, ...args) => isFunction(valueOrFn) ? valueOrFn(...args) : valueOrFn;
+
 // src/providers/environment/use-environment-context.ts
 var [EnvironmentContextProvider, useEnvironmentContext] = createContext({
   hookName: "useEnvironmentContext",
@@ -43,4 +46,4 @@ var EnvironmentProvider = (props) => {
   });
 };
 
-export { EnvironmentProvider, useEnvironmentContext };
+export { EnvironmentProvider, runIfFn, useEnvironmentContext };

package/dist/chunk/{CIPYIXIW.js → 6NMPU3T3.js}

@@ -1,10 +1,10 @@
-import { usePresence, usePresenceContext, splitPresenceProps, PresenceProvider } from './LCESUDZB.js';
-import { useRenderStrategyContext, splitRenderStrategyProps, RenderStrategyProvider } from './L7OSYHVR.js';
+import { usePresence, splitPresenceProps, PresenceProvider, usePresenceContext } from './WRLQ7Y6E.js';
+import { useRenderStrategyContext, splitRenderStrategyProps, RenderStrategyProvider } 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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -192,16 +192,14 @@ var useTour = (props = {}) => {
   const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
     ...props
   }));
-  const [state, send] = useMachine(tour.machine(context()), {
-    context
-  });
-  return createMemo(() => tour.connect(state, send, normalizeProps));
+  const service = useMachine(tour.machine, machineProps);
+  return createMemo(() => tour.connect(service, normalizeProps));
 };
 
 // src/components/tour/tour.ts

package/dist/chunk/{FNEB2RAF.js → 6VITT55B.js}

@@ -1,8 +1,8 @@
 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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -69,7 +69,7 @@ var StepsItem = (props) => {
       return createComponent(StepsItemProvider, {
         value: itemState,
         get children() {
-          return createComponent(ark.li, mergedProps);
+          return createComponent(ark.div, mergedProps);
         }
       });
     }
@@ -84,7 +84,7 @@ StepsItemContext.displayName = "StepsItemContext";
 var StepsList = (props) => {
   const steps2 = useStepsContext();
   const mergedProps = mergeProps(() => steps2().getListProps(), props);
-  return createComponent(ark.ol, mergedProps);
+  return createComponent(ark.div, mergedProps);
 };
 var StepsNextTrigger = (props) => {
   const steps2 = useStepsContext();
@@ -102,18 +102,17 @@ var StepsProgress = (props) => {
   return createComponent(ark.div, mergedProps);
 };
 function useSteps(props = {}) {
+  const id = createUniqueId();
   const environment = useEnvironmentContext();
   const locale = useLocaleContext();
-  const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    step: props.defaultStep,
     ...props
   }));
-  const [state, send] = useMachine(steps.machine(context()), { context });
-  return createMemo(() => steps.connect(state, send, normalizeProps));
+  const service = useMachine(steps.machine, machineProps);
+  return createMemo(() => steps.connect(service, normalizeProps));
 }
 
 // src/components/steps/steps-root.tsx

package/dist/chunk/{SBPY26HV.jsx → 7AJYNPOZ.jsx}

@@ -1,6 +1,6 @@
 import {
   useFieldContext
-} from "./MSHQY44G.jsx";
+} from "./XHA6B6L2.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -9,13 +9,13 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./BPYAMTER.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -96,11 +96,11 @@ import * as editable from "@zag-js/editable";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo, createUniqueId } from "solid-js";
 var useEditable = (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,
@@ -112,13 +112,10 @@ var useEditable = (props = {}) => {
     readOnly: field?.().readOnly,
     required: field?.().required,
     getRootNode: environment().getRootNode,
-    edit: props.defaultEdit,
-    value: props.defaultValue,
-    "edit.controlled": props.edit !== void 0,
     ...props
   }));
-  const [state, send] = useMachine(editable.machine(context()), { context });
-  return createMemo(() => editable.connect(state, send, normalizeProps));
+  const service = useMachine(editable.machine, machineProps);
+  return createMemo(() => editable.connect(service, normalizeProps));
 };
 
 // src/components/editable/editable-root.tsx

package/dist/chunk/{EHJDQTTW.jsx → 7IAJIOJR.jsx}

@@ -3,17 +3,10 @@ import {
 } from "./DOBZPYAN.jsx";
 import {
   EnvironmentProvider
-} from "./5O4RWSWO.jsx";
+} from "./BPYAMTER.jsx";
 
 // src/components/frame/frame.tsx
-import {
-  Show,
-  createEffect as createEffect2,
-  createMemo,
-  createSignal,
-  onCleanup as onCleanup2,
-  splitProps
-} from "solid-js";
+import { Show, createEffect as createEffect2, createMemo, createSignal, onCleanup as onCleanup2, splitProps } from "solid-js";
 import { Portal } from "solid-js/web";
 
 // src/components/frame/frame-content.tsx
@@ -38,13 +31,7 @@ function getMountNode(frame) {
   return doc.body.querySelector(".frame-root") || doc.body;
 }
 var Frame = (props) => {
-  const [frameProps, localProps] = splitProps(props, [
-    "children",
-    "head",
-    "onMount",
-    "onUnmount",
-    "srcdoc"
-  ]);
+  const [frameProps, localProps] = splitProps(props, ["children", "head", "onMount", "onUnmount", "srcdoc"]);
   const srcdoc = createMemo(() => frameProps.srcdoc ?? initialSrcDoc);
   const [frameRef, setFrameRef] = createSignal(null);
   const [mountNode, setMountNode] = createSignal(null);

package/dist/chunk/{UGKLUHKU.js → A4HLKXDW.js}

@@ -1,8 +1,8 @@
 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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -40,25 +40,22 @@ var QrCodePattern = (props) => {
   return createComponent(ark.path, mergedProps);
 };
 var useQrCode = (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
   }));
-  const [state, send] = useMachine(qrCode.machine(context()), {
-    context
-  });
-  return createMemo(() => qrCode.connect(state, send, normalizeProps));
+  const service = useMachine(qrCode.machine, machineProps);
+  return createMemo(() => qrCode.connect(service, normalizeProps));
 };
 
 // src/components/qr-code/qr-code-root.tsx
 var QrCodeRoot = (props) => {
-  const [useQrCodeProps, restProps] = createSplitProps()(props, ["defaultValue", "encoding", "id", "ids", "onValueChange", "value"]);
+  const [useQrCodeProps, restProps] = createSplitProps()(props, ["defaultValue", "encoding", "id", "ids", "onValueChange", "pixelSize", "value"]);
   const api = useQrCode(useQrCodeProps);
   const mergedProps = mergeProps(() => api().getRootProps(), restProps);
   return createComponent(QrCodeProvider, {

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

@@ -1,22 +1,16 @@
 import { ark } from './EPLBB4QN.js';
-import { createContext } from './I5UG2QUO.js';
+import { useEnvironmentContext } from './6MQ6S5JP.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/{LVPQ6GR4.js → AIQ2GVFX.js}

@@ -1,8 +1,8 @@
 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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -34,15 +34,14 @@ var useSplitter = (props = {}) => {
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
   const id = createUniqueId();
-  const context = createMemo(() => ({
+  const machineProps = createMemo(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    size: props.defaultSize,
     ...props
   }));
-  const [state, send] = useMachine(splitter.machine(context()), { context });
-  return createMemo(() => splitter.connect(state, send, normalizeProps));
+  const service = useMachine(splitter.machine, machineProps);
+  return createMemo(() => splitter.connect(service, normalizeProps));
 };
 
 // src/components/splitter/splitter-root.tsx

package/dist/chunk/{JVXNYKNA.js → ANDTZLCB.js}

@@ -1,9 +1,9 @@
-import { usePresenceContext, splitPresenceProps, usePresence, PresenceProvider } from './LCESUDZB.js';
+import { usePresenceContext, splitPresenceProps, usePresence, PresenceProvider } from './WRLQ7Y6E.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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -78,19 +78,17 @@ var PopoverPositioner = (props) => {
   });
 };
 var usePopover = (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,
     ...props
   }));
-  const [state, send] = useMachine(popover.machine(context()), { context });
-  return createMemo(() => popover.connect(state, send, normalizeProps));
+  const service = useMachine(popover.machine, machineProps);
+  return createMemo(() => popover.connect(service, normalizeProps));
 };
 
 // src/components/popover/popover-root.tsx

package/dist/chunk/{5O4RWSWO.jsx → BPYAMTER.jsx}

@@ -1,14 +1,15 @@
-import {
-  runIfFn
-} from "./KGOB2IMX.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
 
 // src/providers/environment/environment-provider.tsx
 import { getDocument, getWindow } from "@zag-js/dom-query";
 import { Show, createMemo, createSignal } from "solid-js";
 
+// src/utils/run-if-fn.ts
+var isFunction = (value) => typeof value === "function";
+var runIfFn = (valueOrFn, ...args) => isFunction(valueOrFn) ? valueOrFn(...args) : valueOrFn;
+
 // src/providers/environment/use-environment-context.ts
 var [EnvironmentContextProvider, useEnvironmentContext] = createContext({
   hookName: "useEnvironmentContext",
@@ -39,6 +40,7 @@ var EnvironmentProvider = (props) => {
 };
 
 export {
+  runIfFn,
   useEnvironmentContext,
   EnvironmentProvider
 };

package/dist/chunk/{AIQFNVCU.jsx → BTPWLTJU.jsx}

@@ -6,13 +6,13 @@ import {
 } from "./UFYZ7HLU.jsx";
 import {
   useEnvironmentContext
-} from "./5O4RWSWO.jsx";
+} from "./BPYAMTER.jsx";
 import {
   useLocaleContext
-} from "./3QQZKR3F.jsx";
+} from "./RCXMZN3G.jsx";
 import {
   createContext
-} from "./NMGUCD2L.jsx";
+} from "./TVCIHLER.jsx";
 import {
   __export
 } from "./7IUG3E2V.jsx";
@@ -52,11 +52,7 @@ var [RadioGroupItemPropsProvider, useRadioGroupItemPropsContext] = createContext
 
 // src/components/radio-group/radio-group-item.tsx
 var RadioGroupItem = (props) => {
-  const [itemProps, localProps] = createSplitProps()(props, [
-    "value",
-    "disabled",
-    "invalid"
-  ]);
+  const [itemProps, localProps] = createSplitProps()(props, ["value", "disabled", "invalid"]);
   const radioGroup = useRadioGroupContext();
   const mergedProps = mergeProps2(() => radioGroup().getItemProps(itemProps), localProps);
   const itemState = createMemo(() => radioGroup().getItemState(itemProps));
@@ -113,20 +109,17 @@ import * as radio from "@zag-js/radio-group";
 import { normalizeProps, useMachine } from "@zag-js/solid";
 import { createMemo as createMemo2, createUniqueId } from "solid-js";
 var useRadioGroup = (props = {}) => {
+  const id = createUniqueId();
   const locale = useLocaleContext();
   const environment = useEnvironmentContext();
-  const id = createUniqueId();
-  const context = createMemo2(() => ({
+  const machineProps = createMemo2(() => ({
     id,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    value: props.defaultValue,
     ...props
   }));
-  const [state, send] = useMachine(radio.machine(context()), {
-    context
-  });
-  return createMemo2(() => radio.connect(state, send, normalizeProps));
+  const service = useMachine(radio.machine, machineProps);
+  return createMemo2(() => radio.connect(service, normalizeProps));
 };
 
 // src/components/radio-group/radio-group-root.tsx
@@ -153,9 +146,7 @@ var RadioGroupRoot = (props) => {
 // src/components/radio-group/radio-group-root-provider.tsx
 import { mergeProps as mergeProps8 } from "@zag-js/solid";
 var RadioGroupRootProvider = (props) => {
-  const [{ value: radioGroup }, localProps] = createSplitProps()(props, [
-    "value"
-  ]);
+  const [{ value: radioGroup }, localProps] = createSplitProps()(props, ["value"]);
   const mergedProps = mergeProps8(() => radioGroup().getRootProps(), localProps);
   return <RadioGroupProvider value={radioGroup}>
       <ark.div {...mergedProps} />

package/dist/chunk/{22UQ4DZC.js → C4WAO4VB.js}

@@ -1,9 +1,9 @@
-import { useFieldContext } from './632HFNZF.js';
+import { useFieldContext } from './KMFRZGLF.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 './6MQ6S5JP.js';
+import { useLocaleContext } from './QEMQBM6W.js';
+import { createContext } from './TROPIN4C.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
@@ -46,11 +46,11 @@ var PinInputLabel = (props) => {
   return createComponent(ark.label, mergedProps);
 };
 var usePinInput = (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,
@@ -62,16 +62,15 @@ var usePinInput = (props = {}) => {
     invalid: field?.().invalid,
     dir: locale().dir,
     getRootNode: environment().getRootNode,
-    value: props.defaultValue,
     ...props
   }));
-  const [state, send] = useMachine(pinInput.machine(context()), { context });
-  return createMemo(() => pinInput.connect(state, send, normalizeProps));
+  const service = useMachine(pinInput.machine, machineProps);
+  return createMemo(() => pinInput.connect(service, normalizeProps));
 };
 
 // src/components/pin-input/pin-input-root.tsx
 var PinInputRoot = (props) => {
-  const [usePinInputProps, localProps] = createSplitProps()(props, ["autoFocus", "blurOnComplete", "defaultValue", "disabled", "form", "id", "ids", "invalid", "mask", "name", "onValueChange", "onValueComplete", "onValueInvalid", "otp", "pattern", "placeholder", "readOnly", "required", "selectOnFocus", "translations", "type", "value"]);
+  const [usePinInputProps, localProps] = createSplitProps()(props, ["autoFocus", "blurOnComplete", "count", "defaultValue", "disabled", "form", "id", "ids", "invalid", "mask", "name", "onValueChange", "onValueComplete", "onValueInvalid", "otp", "pattern", "placeholder", "readOnly", "required", "selectOnFocus", "translations", "type", "value"]);
   const pinInput2 = usePinInput(usePinInputProps);
   const mergedProps = mergeProps(() => pinInput2().getRootProps(), localProps);
   return createComponent(PinInputProvider, {