@ark-ui/react 4.9.1 → 5.0.0

package/dist/components/menu/use-menu.d.ts

@@ -1,15 +1,10 @@
 import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as menu from '@zag-js/menu';
-export interface UseMenuProps extends Optional<Omit<menu.Context, 'open.controlled' | 'dir' | 'getRootNode'>, 'id'> {
-    /**
-     * The initial open state of the menu when it is first rendered.
-     * Use when you do not need to control its open state.
-     */
-    defaultOpen?: menu.Context['open'];
+export interface UseMenuProps extends Optional<Omit<menu.Props, 'dir' | 'getRootNode'>, 'id'> {
 }
 export interface UseMenuReturn {
-    machine: menu.Service;
     api: menu.Api<PropTypes>;
+    service: menu.Service;
 }
 export declare const useMenu: (props?: UseMenuProps) => UseMenuReturn;

package/dist/components/menu/use-menu.js

@@ -4,27 +4,20 @@ import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
-import { useEvent } from '../../utils/use-event.js';
 
 const useMenu = (props = {}) => {
+  const id = useId();
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
-  const initialContext = {
-    id: useId(),
+  const machineProps = {
+    id,
     dir,
     getRootNode,
-    open: props.defaultOpen,
-    "open.controlled": props.open !== void 0,
     ...props
   };
-  const context = {
-    ...initialContext,
-    onOpenChange: useEvent(props.onOpenChange),
-    onSelect: useEvent(props.onSelect)
-  };
-  const [state, send, machine] = useMachine(menu.machine(initialContext), { context });
-  const api = menu.connect(state, send, normalizeProps);
-  return { api, machine };
+  const service = useMachine(menu.machine, machineProps);
+  const api = menu.connect(service, normalizeProps);
+  return { api, service };
 };
 
 export { useMenu };

package/dist/components/number-input/index.d.cts

@@ -3,13 +3,13 @@ export { NumberInputContext, type NumberInputContextProps } from './number-input
 export { NumberInputControl, type NumberInputControlBaseProps, type NumberInputControlProps, } from './number-input-control';
 export { NumberInputDecrementTrigger, type NumberInputDecrementTriggerBaseProps, type NumberInputDecrementTriggerProps, } from './number-input-decrement-trigger';
 export { NumberInputIncrementTrigger, type NumberInputIncrementTriggerBaseProps, type NumberInputIncrementTriggerProps, } from './number-input-increment-trigger';
-export { NumberInputInput, type NumberInputInputBaseProps, type NumberInputInputProps, } from './number-input-input';
-export { NumberInputLabel, type NumberInputLabelBaseProps, type NumberInputLabelProps, } from './number-input-label';
-export { NumberInputRoot, type NumberInputRootBaseProps, type NumberInputRootProps, } from './number-input-root';
+export { NumberInputInput, type NumberInputInputBaseProps, type NumberInputInputProps } from './number-input-input';
+export { NumberInputLabel, type NumberInputLabelBaseProps, type NumberInputLabelProps } from './number-input-label';
+export { NumberInputRoot, type NumberInputRootBaseProps, type NumberInputRootProps } from './number-input-root';
 export { NumberInputRootProvider, type NumberInputRootProviderBaseProps, type NumberInputRootProviderProps, } from './number-input-root-provider';
 export { NumberInputScrubber, type NumberInputScrubberBaseProps, type NumberInputScrubberProps, } from './number-input-scrubber';
 export { NumberInputValueText, type NumberInputValueTextBaseProps, type NumberInputValueTextProps, } from './number-input-value-text';
 export { numberInputAnatomy } from './number-input.anatomy';
-export { useNumberInput, type UseNumberInputProps, type UseNumberInputReturn, } from './use-number-input';
+export { useNumberInput, type UseNumberInputProps, type UseNumberInputReturn } from './use-number-input';
 export { useNumberInputContext, type UseNumberInputContext } from './use-number-input-context';
 export * as NumberInput from './number-input';

package/dist/components/number-input/index.d.ts

@@ -3,13 +3,13 @@ export { NumberInputContext, type NumberInputContextProps } from './number-input
 export { NumberInputControl, type NumberInputControlBaseProps, type NumberInputControlProps, } from './number-input-control';
 export { NumberInputDecrementTrigger, type NumberInputDecrementTriggerBaseProps, type NumberInputDecrementTriggerProps, } from './number-input-decrement-trigger';
 export { NumberInputIncrementTrigger, type NumberInputIncrementTriggerBaseProps, type NumberInputIncrementTriggerProps, } from './number-input-increment-trigger';
-export { NumberInputInput, type NumberInputInputBaseProps, type NumberInputInputProps, } from './number-input-input';
-export { NumberInputLabel, type NumberInputLabelBaseProps, type NumberInputLabelProps, } from './number-input-label';
-export { NumberInputRoot, type NumberInputRootBaseProps, type NumberInputRootProps, } from './number-input-root';
+export { NumberInputInput, type NumberInputInputBaseProps, type NumberInputInputProps } from './number-input-input';
+export { NumberInputLabel, type NumberInputLabelBaseProps, type NumberInputLabelProps } from './number-input-label';
+export { NumberInputRoot, type NumberInputRootBaseProps, type NumberInputRootProps } from './number-input-root';
 export { NumberInputRootProvider, type NumberInputRootProviderBaseProps, type NumberInputRootProviderProps, } from './number-input-root-provider';
 export { NumberInputScrubber, type NumberInputScrubberBaseProps, type NumberInputScrubberProps, } from './number-input-scrubber';
 export { NumberInputValueText, type NumberInputValueTextBaseProps, type NumberInputValueTextProps, } from './number-input-value-text';
 export { numberInputAnatomy } from './number-input.anatomy';
-export { useNumberInput, type UseNumberInputProps, type UseNumberInputReturn, } from './use-number-input';
+export { useNumberInput, type UseNumberInputProps, type UseNumberInputReturn } from './use-number-input';
 export { useNumberInputContext, type UseNumberInputContext } from './use-number-input-context';
 export * as NumberInput from './number-input';

package/dist/components/number-input/number-input-control.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputControl = react.forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.getControlProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const NumberInputControl = react.forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext.useNumberInputContext();
+  const mergedProps = react$1.mergeProps(numberInput.getControlProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 NumberInputControl.displayName = "NumberInputControl";
 
 exports.NumberInputControl = NumberInputControl;

package/dist/components/number-input/number-input-control.js

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputControl = forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.getControlProps(), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const NumberInputControl = forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext();
+  const mergedProps = mergeProps(numberInput.getControlProps(), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 NumberInputControl.displayName = "NumberInputControl";
 
 export { NumberInputControl };

package/dist/components/number-input/number-input-decrement-trigger.cjs

@@ -9,11 +9,13 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputDecrementTrigger = react.forwardRef((props, ref) => {
-  const numberInput = useNumberInputContext.useNumberInputContext();
-  const mergedProps = react$1.mergeProps(numberInput.getDecrementTriggerProps(), props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-});
+const NumberInputDecrementTrigger = react.forwardRef(
+  (props, ref) => {
+    const numberInput = useNumberInputContext.useNumberInputContext();
+    const mergedProps = react$1.mergeProps(numberInput.getDecrementTriggerProps(), props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
 NumberInputDecrementTrigger.displayName = "NumberInputDecrementTrigger";
 
 exports.NumberInputDecrementTrigger = NumberInputDecrementTrigger;

package/dist/components/number-input/number-input-decrement-trigger.js

@@ -5,11 +5,13 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputDecrementTrigger = forwardRef((props, ref) => {
-  const numberInput = useNumberInputContext();
-  const mergedProps = mergeProps(numberInput.getDecrementTriggerProps(), props);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const NumberInputDecrementTrigger = forwardRef(
+  (props, ref) => {
+    const numberInput = useNumberInputContext();
+    const mergedProps = mergeProps(numberInput.getDecrementTriggerProps(), props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
 NumberInputDecrementTrigger.displayName = "NumberInputDecrementTrigger";
 
 export { NumberInputDecrementTrigger };

package/dist/components/number-input/number-input-increment-trigger.cjs

@@ -9,11 +9,13 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputIncrementTrigger = react.forwardRef((props, ref) => {
-  const numberInput = useNumberInputContext.useNumberInputContext();
-  const mergedProps = react$1.mergeProps(numberInput.getIncrementTriggerProps(), props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-});
+const NumberInputIncrementTrigger = react.forwardRef(
+  (props, ref) => {
+    const numberInput = useNumberInputContext.useNumberInputContext();
+    const mergedProps = react$1.mergeProps(numberInput.getIncrementTriggerProps(), props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
 NumberInputIncrementTrigger.displayName = "NumberInputIncrementTrigger";
 
 exports.NumberInputIncrementTrigger = NumberInputIncrementTrigger;

package/dist/components/number-input/number-input-increment-trigger.js

@@ -5,11 +5,13 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputIncrementTrigger = forwardRef((props, ref) => {
-  const numberInput = useNumberInputContext();
-  const mergedProps = mergeProps(numberInput.getIncrementTriggerProps(), props);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const NumberInputIncrementTrigger = forwardRef(
+  (props, ref) => {
+    const numberInput = useNumberInputContext();
+    const mergedProps = mergeProps(numberInput.getIncrementTriggerProps(), props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
 NumberInputIncrementTrigger.displayName = "NumberInputIncrementTrigger";
 
 export { NumberInputIncrementTrigger };

package/dist/components/number-input/number-input-input.cjs

@@ -10,14 +10,12 @@ const factory = require('../factory.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputInput = react.forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.getInputProps(), props);
-    const field = useFieldContext.useFieldContext();
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const NumberInputInput = react.forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext.useNumberInputContext();
+  const mergedProps = react$1.mergeProps(numberInput.getInputProps(), props);
+  const field = useFieldContext.useFieldContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 NumberInputInput.displayName = "NumberInputInput";
 
 exports.NumberInputInput = NumberInputInput;

package/dist/components/number-input/number-input-input.js

@@ -6,14 +6,12 @@ import { ark } from '../factory.js';
 import { useFieldContext } from '../field/use-field-context.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputInput = forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.getInputProps(), props);
-    const field = useFieldContext();
-    return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
-  }
-);
+const NumberInputInput = forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext();
+  const mergedProps = mergeProps(numberInput.getInputProps(), props);
+  const field = useFieldContext();
+  return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
+});
 NumberInputInput.displayName = "NumberInputInput";
 
 export { NumberInputInput };

package/dist/components/number-input/number-input-label.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputLabel = react.forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.getLabelProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
-  }
-);
+const NumberInputLabel = react.forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext.useNumberInputContext();
+  const mergedProps = react$1.mergeProps(numberInput.getLabelProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
+});
 NumberInputLabel.displayName = "NumberInputLabel";
 
 exports.NumberInputLabel = NumberInputLabel;

package/dist/components/number-input/number-input-label.js

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputLabel = forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.getLabelProps(), props);
-    return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
-  }
-);
+const NumberInputLabel = forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext();
+  const mergedProps = mergeProps(numberInput.getLabelProps(), props);
+  return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
+});
 NumberInputLabel.displayName = "NumberInputLabel";
 
 export { NumberInputLabel };

package/dist/components/number-input/number-input-root-provider.cjs

@@ -10,15 +10,11 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputRootProvider = react.forwardRef(
-  (props, ref) => {
-    const [{ value: numberInput }, localProps] = createSplitProps.createSplitProps()(props, [
-      "value"
-    ]);
-    const mergedProps = react$1.mergeProps(numberInput.getRootProps(), localProps);
-    return /* @__PURE__ */ jsxRuntime.jsx(useNumberInputContext.NumberInputProvider, { value: numberInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
-  }
-);
+const NumberInputRootProvider = react.forwardRef((props, ref) => {
+  const [{ value: numberInput }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const mergedProps = react$1.mergeProps(numberInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(useNumberInputContext.NumberInputProvider, { value: numberInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
 NumberInputRootProvider.displayName = "NumberInputRootProvider";
 
 exports.NumberInputRootProvider = NumberInputRootProvider;

package/dist/components/number-input/number-input-root-provider.js

@@ -6,15 +6,11 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { NumberInputProvider } from './use-number-input-context.js';
 
-const NumberInputRootProvider = forwardRef(
-  (props, ref) => {
-    const [{ value: numberInput }, localProps] = createSplitProps()(props, [
-      "value"
-    ]);
-    const mergedProps = mergeProps(numberInput.getRootProps(), localProps);
-    return /* @__PURE__ */ jsx(NumberInputProvider, { value: numberInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
-  }
-);
+const NumberInputRootProvider = forwardRef((props, ref) => {
+  const [{ value: numberInput }, localProps] = createSplitProps()(props, ["value"]);
+  const mergedProps = mergeProps(numberInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsx(NumberInputProvider, { value: numberInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
 NumberInputRootProvider.displayName = "NumberInputRootProvider";
 
 export { NumberInputRootProvider };

package/dist/components/number-input/number-input-scrubber.cjs

@@ -9,13 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputScrubber = react.forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.getScrubberProps(), props);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const NumberInputScrubber = react.forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext.useNumberInputContext();
+  const mergedProps = react$1.mergeProps(numberInput.getScrubberProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 NumberInputScrubber.displayName = "NumberInputScrubber";
 
 exports.NumberInputScrubber = NumberInputScrubber;

package/dist/components/number-input/number-input-scrubber.js

@@ -5,13 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputScrubber = forwardRef(
-  (props, ref) => {
-    const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.getScrubberProps(), props);
-    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
-  }
-);
+const NumberInputScrubber = forwardRef((props, ref) => {
+  const numberInput = useNumberInputContext();
+  const mergedProps = mergeProps(numberInput.getScrubberProps(), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
 NumberInputScrubber.displayName = "NumberInputScrubber";
 
 export { NumberInputScrubber };

package/dist/components/number-input/number-input-value-text.cjs

@@ -9,14 +9,12 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 
-const NumberInputValueText = react.forwardRef(
-  (props, ref) => {
-    const { children, ...localProps } = props;
-    const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.getValueTextProps(), localProps);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref, children: children || numberInput.value });
-  }
-);
+const NumberInputValueText = react.forwardRef((props, ref) => {
+  const { children, ...localProps } = props;
+  const numberInput = useNumberInputContext.useNumberInputContext();
+  const mergedProps = react$1.mergeProps(numberInput.getValueTextProps(), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref, children: children || numberInput.value });
+});
 NumberInputValueText.displayName = "NumberInputValueText";
 
 exports.NumberInputValueText = NumberInputValueText;

package/dist/components/number-input/number-input-value-text.js

@@ -5,14 +5,12 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.js';
 import { useNumberInputContext } from './use-number-input-context.js';
 
-const NumberInputValueText = forwardRef(
-  (props, ref) => {
-    const { children, ...localProps } = props;
-    const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.getValueTextProps(), localProps);
-    return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref, children: children || numberInput.value });
-  }
-);
+const NumberInputValueText = forwardRef((props, ref) => {
+  const { children, ...localProps } = props;
+  const numberInput = useNumberInputContext();
+  const mergedProps = mergeProps(numberInput.getValueTextProps(), localProps);
+  return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref, children: children || numberInput.value });
+});
 NumberInputValueText.displayName = "NumberInputValueText";
 
 export { NumberInputValueText };

package/dist/components/number-input/number-input.d.cts

@@ -1,5 +1,5 @@
-export type { FocusChangeDetails, ValueChangeDetails, ValueInvalidDetails, } from '@zag-js/number-input';
-export { NumberInputContext as Context, type NumberInputContextProps as ContextProps, } from './number-input-context';
+export type { FocusChangeDetails, ValueChangeDetails, ValueInvalidDetails } from '@zag-js/number-input';
+export { NumberInputContext as Context, type NumberInputContextProps as ContextProps } from './number-input-context';
 export { NumberInputControl as Control, type NumberInputControlBaseProps as ControlBaseProps, type NumberInputControlProps as ControlProps, } from './number-input-control';
 export { NumberInputDecrementTrigger as DecrementTrigger, type NumberInputDecrementTriggerBaseProps as DecrementTriggerBaseProps, type NumberInputDecrementTriggerProps as DecrementTriggerProps, } from './number-input-decrement-trigger';
 export { NumberInputIncrementTrigger as IncrementTrigger, type NumberInputIncrementTriggerBaseProps as IncrementTriggerBaseProps, type NumberInputIncrementTriggerProps as IncrementTriggerProps, } from './number-input-increment-trigger';

package/dist/components/number-input/number-input.d.ts

@@ -1,5 +1,5 @@
-export type { FocusChangeDetails, ValueChangeDetails, ValueInvalidDetails, } from '@zag-js/number-input';
-export { NumberInputContext as Context, type NumberInputContextProps as ContextProps, } from './number-input-context';
+export type { FocusChangeDetails, ValueChangeDetails, ValueInvalidDetails } from '@zag-js/number-input';
+export { NumberInputContext as Context, type NumberInputContextProps as ContextProps } from './number-input-context';
 export { NumberInputControl as Control, type NumberInputControlBaseProps as ControlBaseProps, type NumberInputControlProps as ControlProps, } from './number-input-control';
 export { NumberInputDecrementTrigger as DecrementTrigger, type NumberInputDecrementTriggerBaseProps as DecrementTriggerBaseProps, type NumberInputDecrementTriggerProps as DecrementTriggerProps, } from './number-input-decrement-trigger';
 export { NumberInputIncrementTrigger as IncrementTrigger, type NumberInputIncrementTriggerBaseProps as IncrementTriggerBaseProps, type NumberInputIncrementTriggerProps as IncrementTriggerProps, } from './number-input-increment-trigger';

package/dist/components/number-input/use-number-input.cjs

@@ -8,7 +8,6 @@ const react$1 = require('@zag-js/react');
 const react = require('react');
 const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
 const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
-const useEvent = require('../../utils/use-event.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 
 function _interopNamespaceDefault(e) {
@@ -31,11 +30,12 @@ function _interopNamespaceDefault(e) {
 const numberInput__namespace = /*#__PURE__*/_interopNamespaceDefault(numberInput);
 
 const useNumberInput = (props = {}) => {
+  const id = react.useId();
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir, locale } = useLocaleContext.useLocaleContext();
   const field = useFieldContext.useFieldContext();
-  const initialContext = {
-    id: react.useId(),
+  const machineProps = {
+    id,
     ids: {
       label: field?.ids.label,
       input: field?.ids.control
@@ -47,18 +47,10 @@ const useNumberInput = (props = {}) => {
     dir,
     locale,
     getRootNode,
-    value: props.defaultValue,
     ...props
   };
-  const context = {
-    ...initialContext,
-    value: props.value,
-    onValueChange: useEvent.useEvent(props.onValueChange, { sync: true }),
-    onValueInvalid: useEvent.useEvent(props.onValueInvalid),
-    onFocusChange: useEvent.useEvent(props.onFocusChange)
-  };
-  const [state, send] = react$1.useMachine(numberInput__namespace.machine(initialContext), { context });
-  return numberInput__namespace.connect(state, send, react$1.normalizeProps);
+  const service = react$1.useMachine(numberInput__namespace.machine, machineProps);
+  return numberInput__namespace.connect(service, react$1.normalizeProps);
 };
 
 exports.useNumberInput = useNumberInput;

package/dist/components/number-input/use-number-input.d.cts

@@ -1,12 +1,7 @@
 import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as numberInput from '@zag-js/number-input';
-export interface UseNumberInputProps extends Optional<Omit<numberInput.Context, 'dir' | 'getRootNode'>, 'id'> {
-    /**
-     * The initial value of the number input when it is first rendered.
-     * Use when you do not need to control the state of the number input.
-     */
-    defaultValue?: numberInput.Context['value'];
+export interface UseNumberInputProps extends Optional<Omit<numberInput.Props, 'dir' | 'getRootNode'>, 'id'> {
 }
 export interface UseNumberInputReturn extends numberInput.Api<PropTypes> {
 }

package/dist/components/number-input/use-number-input.d.ts

@@ -1,12 +1,7 @@
 import { PropTypes } from '@zag-js/react';
 import { Optional } from '../../types';
 import * as numberInput from '@zag-js/number-input';
-export interface UseNumberInputProps extends Optional<Omit<numberInput.Context, 'dir' | 'getRootNode'>, 'id'> {
-    /**
-     * The initial value of the number input when it is first rendered.
-     * Use when you do not need to control the state of the number input.
-     */
-    defaultValue?: numberInput.Context['value'];
+export interface UseNumberInputProps extends Optional<Omit<numberInput.Props, 'dir' | 'getRootNode'>, 'id'> {
 }
 export interface UseNumberInputReturn extends numberInput.Api<PropTypes> {
 }

package/dist/components/number-input/use-number-input.js

@@ -4,15 +4,15 @@ import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
 import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
 import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
-import { useEvent } from '../../utils/use-event.js';
 import { useFieldContext } from '../field/use-field-context.js';
 
 const useNumberInput = (props = {}) => {
+  const id = useId();
   const { getRootNode } = useEnvironmentContext();
   const { dir, locale } = useLocaleContext();
   const field = useFieldContext();
-  const initialContext = {
-    id: useId(),
+  const machineProps = {
+    id,
     ids: {
       label: field?.ids.label,
       input: field?.ids.control
@@ -24,18 +24,10 @@ const useNumberInput = (props = {}) => {
     dir,
     locale,
     getRootNode,
-    value: props.defaultValue,
     ...props
   };
-  const context = {
-    ...initialContext,
-    value: props.value,
-    onValueChange: useEvent(props.onValueChange, { sync: true }),
-    onValueInvalid: useEvent(props.onValueInvalid),
-    onFocusChange: useEvent(props.onFocusChange)
-  };
-  const [state, send] = useMachine(numberInput.machine(initialContext), { context });
-  return numberInput.connect(state, send, normalizeProps);
+  const service = useMachine(numberInput.machine, machineProps);
+  return numberInput.connect(service, normalizeProps);
 };
 
 export { useNumberInput };

package/dist/components/pagination/index.d.cts

@@ -1,10 +1,10 @@
 export type { ItemLabelDetails as PaginationItemLabelDetails, PageChangeDetails as PaginationPageChangeDetails, PageSizeChangeDetails as PaginationPageSizeChangeDetails, } from '@zag-js/pagination';
 export { PaginationContext, type PaginationContextProps } from './pagination-context';
 export { PaginationEllipsis, type PaginationEllipsisBaseProps, type PaginationEllipsisProps, } from './pagination-ellipsis';
-export { PaginationItem, type PaginationItemBaseProps, type PaginationItemProps, } from './pagination-item';
+export { PaginationItem, type PaginationItemBaseProps, type PaginationItemProps } from './pagination-item';
 export { PaginationNextTrigger, type PaginationNextTriggerBaseProps, type PaginationNextTriggerProps, } from './pagination-next-trigger';
 export { PaginationPrevTrigger, type PaginationPrevTriggerBaseProps, type PaginationPrevTriggerProps, } from './pagination-prev-trigger';
-export { PaginationRoot, type PaginationRootBaseProps, type PaginationRootProps, } from './pagination-root';
+export { PaginationRoot, type PaginationRootBaseProps, type PaginationRootProps } from './pagination-root';
 export { PaginationRootProvider, type PaginationRootProviderBaseProps, type PaginationRootProviderProps, } from './pagination-root-provider';
 export { paginationAnatomy } from './pagination.anatomy';
 export { usePagination, type UsePaginationProps, type UsePaginationReturn } from './use-pagination';

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

@@ -1,10 +1,10 @@
 export type { ItemLabelDetails as PaginationItemLabelDetails, PageChangeDetails as PaginationPageChangeDetails, PageSizeChangeDetails as PaginationPageSizeChangeDetails, } from '@zag-js/pagination';
 export { PaginationContext, type PaginationContextProps } from './pagination-context';
 export { PaginationEllipsis, type PaginationEllipsisBaseProps, type PaginationEllipsisProps, } from './pagination-ellipsis';
-export { PaginationItem, type PaginationItemBaseProps, type PaginationItemProps, } from './pagination-item';
+export { PaginationItem, type PaginationItemBaseProps, type PaginationItemProps } from './pagination-item';
 export { PaginationNextTrigger, type PaginationNextTriggerBaseProps, type PaginationNextTriggerProps, } from './pagination-next-trigger';
 export { PaginationPrevTrigger, type PaginationPrevTriggerBaseProps, type PaginationPrevTriggerProps, } from './pagination-prev-trigger';
-export { PaginationRoot, type PaginationRootBaseProps, type PaginationRootProps, } from './pagination-root';
+export { PaginationRoot, type PaginationRootBaseProps, type PaginationRootProps } from './pagination-root';
 export { PaginationRootProvider, type PaginationRootProviderBaseProps, type PaginationRootProviderProps, } from './pagination-root-provider';
 export { paginationAnatomy } from './pagination.anatomy';
 export { usePagination, type UsePaginationProps, type UsePaginationReturn } from './use-pagination';

package/dist/components/pagination/pagination-ellipsis.cjs

@@ -10,14 +10,12 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const usePaginationContext = require('./use-pagination-context.cjs');
 
-const PaginationEllipsis = react.forwardRef(
-  (props, ref) => {
-    const [ellipsisProps, localProps] = createSplitProps.createSplitProps()(props, ["index"]);
-    const pagination = usePaginationContext.usePaginationContext();
-    const mergedProps = react$1.mergeProps(pagination.getEllipsisProps(ellipsisProps), localProps);
-    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
-  }
-);
+const PaginationEllipsis = react.forwardRef((props, ref) => {
+  const [ellipsisProps, localProps] = createSplitProps.createSplitProps()(props, ["index"]);
+  const pagination = usePaginationContext.usePaginationContext();
+  const mergedProps = react$1.mergeProps(pagination.getEllipsisProps(ellipsisProps), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
 PaginationEllipsis.displayName = "PaginationEllipsis";
 
 exports.PaginationEllipsis = PaginationEllipsis;