@ark-ui/react 3.0.2 → 3.2.0

package/dist/components/menu/menu-root-provider.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { useCallback } from 'react';
+import { useEffectOnce } from '../../utils/use-effect-once.js';
+import { splitPresenceProps } from '../presence/split-presence-props.js';
+import { usePresence } from '../presence/use-presence.js';
+import { PresenceProvider } from '../presence/use-presence-context.js';
+import { useMenuContext, MenuProvider } from './use-menu-context.js';
+import { useMenuMachineContext, MenuMachineProvider } from './use-menu-machine-context.js';
+import { MenuTriggerItemProvider } from './use-menu-trigger-item-context.js';
+
+const MenuRootProvider = (props) => {
+  const parentApi = useMenuContext();
+  const parentMachine = useMenuMachineContext();
+  const [presenceProps, { value: menu, children }] = splitPresenceProps(props);
+  const { api, machine } = menu;
+  const presence = usePresence(mergeProps({ present: api.open }, presenceProps));
+  useEffectOnce(() => {
+    if (!parentMachine)
+      return;
+    if (!parentApi)
+      return;
+    parentApi.setChild(machine);
+    api.setParent(parentMachine);
+  });
+  const triggerItemContext = useCallback(
+    () => parentApi?.getTriggerItemProps(api),
+    [api, parentApi]
+  );
+  return /* @__PURE__ */ jsx(MenuTriggerItemProvider, { value: triggerItemContext, children: /* @__PURE__ */ jsx(MenuMachineProvider, { value: machine, children: /* @__PURE__ */ jsx(MenuProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presence, children }) }) }) });
+};
+
+export { MenuRootProvider };

package/dist/components/menu/menu-separator.cjs

@@ -11,7 +11,7 @@ const useMenuContext = require('./use-menu-context.cjs');
 
 const MenuSeparator = react.forwardRef((props, ref) => {
   const menu = useMenuContext.useMenuContext();
-  const mergedProps = react$1.mergeProps(menu.separatorProps, props);
+  const mergedProps = react$1.mergeProps(menu.getSeparatorProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.hr, { ...mergedProps, ref });
 });
 MenuSeparator.displayName = "MenuSeparator";

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

@@ -7,7 +7,7 @@ import { useMenuContext } from './use-menu-context.js';
 
 const MenuSeparator = forwardRef((props, ref) => {
   const menu = useMenuContext();
-  const mergedProps = mergeProps(menu.separatorProps, props);
+  const mergedProps = mergeProps(menu.getSeparatorProps(), props);
   return /* @__PURE__ */ jsx(ark.hr, { ...mergedProps, ref });
 });
 MenuSeparator.displayName = "MenuSeparator";

package/dist/components/menu/menu-trigger.cjs

@@ -15,8 +15,8 @@ const MenuTrigger = react.forwardRef((props, ref) => {
   const presence = usePresenceContext.usePresenceContext();
   const mergedProps = react$1.mergeProps(
     {
-      ...menu.triggerProps,
-      "aria-controls": presence.unmounted ? void 0 : menu.triggerProps["aria-controls"]
+      ...menu.getTriggerProps(),
+      "aria-controls": presence.unmounted ? void 0 : menu.getTriggerProps()["aria-controls"]
     },
     props
   );

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

@@ -11,8 +11,8 @@ const MenuTrigger = forwardRef((props, ref) => {
   const presence = usePresenceContext();
   const mergedProps = mergeProps(
     {
-      ...menu.triggerProps,
-      "aria-controls": presence.unmounted ? void 0 : menu.triggerProps["aria-controls"]
+      ...menu.getTriggerProps(),
+      "aria-controls": presence.unmounted ? void 0 : menu.getTriggerProps()["aria-controls"]
     },
     props
   );

package/dist/components/menu/menu.cjs

@@ -19,6 +19,7 @@ const menuPositioner = require('./menu-positioner.cjs');
 const menuRadioItem = require('./menu-radio-item.cjs');
 const menuRadioItemGroup = require('./menu-radio-item-group.cjs');
 const menuRoot = require('./menu-root.cjs');
+const menuRootProvider = require('./menu-root-provider.cjs');
 const menuSeparator = require('./menu-separator.cjs');
 const menuTrigger = require('./menu-trigger.cjs');
 const menuTriggerItem = require('./menu-trigger-item.cjs');
@@ -42,6 +43,7 @@ exports.Positioner = menuPositioner.MenuPositioner;
 exports.RadioItem = menuRadioItem.MenuRadioItem;
 exports.RadioItemGroup = menuRadioItemGroup.MenuRadioItemGroup;
 exports.Root = menuRoot.MenuRoot;
+exports.RootProvider = menuRootProvider.MenuRootProvider;
 exports.Separator = menuSeparator.MenuSeparator;
 exports.Trigger = menuTrigger.MenuTrigger;
 exports.TriggerItem = menuTriggerItem.MenuTriggerItem;

package/dist/components/menu/menu.d.cts

@@ -16,6 +16,7 @@ export { MenuPositioner as Positioner, type MenuPositionerProps as PositionerPro
 export { MenuRadioItem as RadioItem, type MenuRadioItemProps as RadioItemProps, } from './menu-radio-item';
 export { MenuRadioItemGroup as RadioItemGroup, type MenuRadioItemGroupProps as RadioItemGroupProps, } from './menu-radio-item-group';
 export { MenuRoot as Root, type MenuRootProps as RootProps } from './menu-root';
+export { MenuRootProvider as RootProvider, type MenuRootProviderProps as RootProviderProps, } from './menu-root-provider';
 export { MenuSeparator as Separator, type MenuSeparatorProps as SeparatorProps, } from './menu-separator';
 export { MenuTrigger as Trigger, type MenuTriggerProps as TriggerProps } from './menu-trigger';
 export { MenuTriggerItem as TriggerItem, type MenuTriggerItemProps as TriggerItemProps, } from './menu-trigger-item';

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

@@ -16,6 +16,7 @@ export { MenuPositioner as Positioner, type MenuPositionerProps as PositionerPro
 export { MenuRadioItem as RadioItem, type MenuRadioItemProps as RadioItemProps, } from './menu-radio-item';
 export { MenuRadioItemGroup as RadioItemGroup, type MenuRadioItemGroupProps as RadioItemGroupProps, } from './menu-radio-item-group';
 export { MenuRoot as Root, type MenuRootProps as RootProps } from './menu-root';
+export { MenuRootProvider as RootProvider, type MenuRootProviderProps as RootProviderProps, } from './menu-root-provider';
 export { MenuSeparator as Separator, type MenuSeparatorProps as SeparatorProps, } from './menu-separator';
 export { MenuTrigger as Trigger, type MenuTriggerProps as TriggerProps } from './menu-trigger';
 export { MenuTriggerItem as TriggerItem, type MenuTriggerItemProps as TriggerItemProps, } from './menu-trigger-item';

package/dist/components/menu/menu.js

@@ -15,6 +15,7 @@ export { MenuPositioner as Positioner } from './menu-positioner.js';
 export { MenuRadioItem as RadioItem } from './menu-radio-item.js';
 export { MenuRadioItemGroup as RadioItemGroup } from './menu-radio-item-group.js';
 export { MenuRoot as Root } from './menu-root.js';
+export { MenuRootProvider as RootProvider } from './menu-root-provider.js';
 export { MenuSeparator as Separator } from './menu-separator.js';
 export { MenuTrigger as Trigger } from './menu-trigger.js';
 export { MenuTriggerItem as TriggerItem } from './menu-trigger-item.js';

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

@@ -9,7 +9,9 @@ const numberInputIncrementTrigger = require('./number-input-increment-trigger.cj
 const numberInputInput = require('./number-input-input.cjs');
 const numberInputLabel = require('./number-input-label.cjs');
 const numberInputRoot = require('./number-input-root.cjs');
+const numberInputRootProvider = require('./number-input-root-provider.cjs');
 const numberInputScrubber = require('./number-input-scrubber.cjs');
+const useNumberInput = require('./use-number-input.cjs');
 const useNumberInputContext = require('./use-number-input-context.cjs');
 const numberInput = require('./number-input.cjs');
 
@@ -22,6 +24,8 @@ exports.NumberInputIncrementTrigger = numberInputIncrementTrigger.NumberInputInc
 exports.NumberInputInput = numberInputInput.NumberInputInput;
 exports.NumberInputLabel = numberInputLabel.NumberInputLabel;
 exports.NumberInputRoot = numberInputRoot.NumberInputRoot;
+exports.NumberInputRootProvider = numberInputRootProvider.NumberInputRootProvider;
 exports.NumberInputScrubber = numberInputScrubber.NumberInputScrubber;
+exports.useNumberInput = useNumberInput.useNumberInput;
 exports.useNumberInputContext = useNumberInputContext.useNumberInputContext;
 exports.NumberInput = numberInput;

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

@@ -6,6 +6,8 @@ export { NumberInputIncrementTrigger, type NumberInputIncrementTriggerProps, } f
 export { NumberInputInput, type NumberInputInputProps } from './number-input-input';
 export { NumberInputLabel, type NumberInputLabelProps } from './number-input-label';
 export { NumberInputRoot, type NumberInputRootProps } from './number-input-root';
+export { NumberInputRootProvider, type NumberInputRootProviderProps, } from './number-input-root-provider';
 export { NumberInputScrubber, type NumberInputScrubberProps } from './number-input-scrubber';
-export { type UseNumberInputContext, useNumberInputContext } from './use-number-input-context';
+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

@@ -6,6 +6,8 @@ export { NumberInputIncrementTrigger, type NumberInputIncrementTriggerProps, } f
 export { NumberInputInput, type NumberInputInputProps } from './number-input-input';
 export { NumberInputLabel, type NumberInputLabelProps } from './number-input-label';
 export { NumberInputRoot, type NumberInputRootProps } from './number-input-root';
+export { NumberInputRootProvider, type NumberInputRootProviderProps, } from './number-input-root-provider';
 export { NumberInputScrubber, type NumberInputScrubberProps } from './number-input-scrubber';
-export { type UseNumberInputContext, useNumberInputContext } from './use-number-input-context';
+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.js

@@ -5,7 +5,9 @@ export { NumberInputIncrementTrigger } from './number-input-increment-trigger.js
 export { NumberInputInput } from './number-input-input.js';
 export { NumberInputLabel } from './number-input-label.js';
 export { NumberInputRoot } from './number-input-root.js';
+export { NumberInputRootProvider } from './number-input-root-provider.js';
 export { NumberInputScrubber } from './number-input-scrubber.js';
+export { useNumberInput } from './use-number-input.js';
 export { useNumberInputContext } from './use-number-input-context.js';
 import * as numberInput from './number-input.js';
 export { numberInput as NumberInput };

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

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

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

@@ -8,7 +8,7 @@ import { useNumberInputContext } from './use-number-input-context.js';
 const NumberInputControl = forwardRef(
   (props, ref) => {
     const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.controlProps, props);
+    const mergedProps = mergeProps(numberInput.getControlProps(), props);
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
   }
 );

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

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

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

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

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

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

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

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

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

@@ -12,7 +12,7 @@ const useNumberInputContext = require('./use-number-input-context.cjs');
 const NumberInputInput = react.forwardRef(
   (props, ref) => {
     const numberInput = useNumberInputContext.useNumberInputContext();
-    const mergedProps = react$1.mergeProps(numberInput.inputProps, props);
+    const mergedProps = react$1.mergeProps(numberInput.getInputProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
   }
 );

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

@@ -8,7 +8,7 @@ import { useNumberInputContext } from './use-number-input-context.js';
 const NumberInputInput = forwardRef(
   (props, ref) => {
     const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.inputProps, props);
+    const mergedProps = mergeProps(numberInput.getInputProps(), props);
     return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
   }
 );

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

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

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

@@ -8,7 +8,7 @@ import { useNumberInputContext } from './use-number-input-context.js';
 const NumberInputLabel = forwardRef(
   (props, ref) => {
     const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.labelProps, props);
+    const mergedProps = mergeProps(numberInput.getLabelProps(), props);
     return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
   }
 );

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

@@ -0,0 +1,24 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+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 }) });
+  }
+);
+NumberInputRootProvider.displayName = "NumberInputRootProvider";
+
+exports.NumberInputRootProvider = NumberInputRootProvider;

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseNumberInputReturn } from './use-number-input';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseNumberInputReturn;
+}
+export interface NumberInputRootProviderProps extends HTMLArkProps<'div'>, RootProviderProps {
+}
+export declare const NumberInputRootProvider: ForwardRefExoticComponent<NumberInputRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseNumberInputReturn } from './use-number-input';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseNumberInputReturn;
+}
+export interface NumberInputRootProviderProps extends HTMLArkProps<'div'>, RootProviderProps {
+}
+export declare const NumberInputRootProvider: ForwardRefExoticComponent<NumberInputRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+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 }) });
+  }
+);
+NumberInputRootProvider.displayName = "NumberInputRootProvider";
+
+export { NumberInputRootProvider };

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

@@ -40,7 +40,7 @@ const NumberInputRoot = react.forwardRef((props, ref) => {
     "value"
   ]);
   const numberInput = useNumberInput.useNumberInput(useNumberInputProps);
-  const mergedProps = react$1.mergeProps(numberInput.rootProps, localProps);
+  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 }) });
 });
 NumberInputRoot.displayName = "NumberInputRoot";

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

@@ -36,7 +36,7 @@ const NumberInputRoot = forwardRef((props, ref) => {
     "value"
   ]);
   const numberInput = useNumberInput(useNumberInputProps);
-  const mergedProps = mergeProps(numberInput.rootProps, localProps);
+  const mergedProps = mergeProps(numberInput.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(NumberInputProvider, { value: numberInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });
 NumberInputRoot.displayName = "NumberInputRoot";

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

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

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

@@ -8,7 +8,7 @@ import { useNumberInputContext } from './use-number-input-context.js';
 const NumberInputScrubber = forwardRef(
   (props, ref) => {
     const numberInput = useNumberInputContext();
-    const mergedProps = mergeProps(numberInput.scrubberProps, props);
+    const mergedProps = mergeProps(numberInput.getScrubberProps(), props);
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
   }
 );

package/dist/components/pagination/index.cjs

@@ -8,6 +8,8 @@ const paginationItem = require('./pagination-item.cjs');
 const paginationNextTrigger = require('./pagination-next-trigger.cjs');
 const paginationPrevTrigger = require('./pagination-prev-trigger.cjs');
 const paginationRoot = require('./pagination-root.cjs');
+const paginationRootProvider = require('./pagination-root-provider.cjs');
+const usePagination = require('./use-pagination.cjs');
 const usePaginationContext = require('./use-pagination-context.cjs');
 const pagination = require('./pagination.cjs');
 
@@ -19,5 +21,7 @@ exports.PaginationItem = paginationItem.PaginationItem;
 exports.PaginationNextTrigger = paginationNextTrigger.PaginationNextTrigger;
 exports.PaginationPrevTrigger = paginationPrevTrigger.PaginationPrevTrigger;
 exports.PaginationRoot = paginationRoot.PaginationRoot;
+exports.PaginationRootProvider = paginationRootProvider.PaginationRootProvider;
+exports.usePagination = usePagination.usePagination;
 exports.usePaginationContext = usePaginationContext.usePaginationContext;
 exports.Pagination = pagination;

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

@@ -5,5 +5,7 @@ export { PaginationItem, type PaginationItemProps } from './pagination-item';
 export { PaginationNextTrigger, type PaginationNextTriggerProps } from './pagination-next-trigger';
 export { PaginationPrevTrigger, type PaginationPrevTriggerProps } from './pagination-prev-trigger';
 export { PaginationRoot, type PaginationRootProps } from './pagination-root';
-export { type UsePaginationContext, usePaginationContext } from './use-pagination-context';
+export { PaginationRootProvider, type PaginationRootProviderProps, } from './pagination-root-provider';
+export { usePagination, type UsePaginationProps, type UsePaginationReturn } from './use-pagination';
+export { usePaginationContext, type UsePaginationContext } from './use-pagination-context';
 export * as Pagination from './pagination';

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

@@ -5,5 +5,7 @@ export { PaginationItem, type PaginationItemProps } from './pagination-item';
 export { PaginationNextTrigger, type PaginationNextTriggerProps } from './pagination-next-trigger';
 export { PaginationPrevTrigger, type PaginationPrevTriggerProps } from './pagination-prev-trigger';
 export { PaginationRoot, type PaginationRootProps } from './pagination-root';
-export { type UsePaginationContext, usePaginationContext } from './use-pagination-context';
+export { PaginationRootProvider, type PaginationRootProviderProps, } from './pagination-root-provider';
+export { usePagination, type UsePaginationProps, type UsePaginationReturn } from './use-pagination';
+export { usePaginationContext, type UsePaginationContext } from './use-pagination-context';
 export * as Pagination from './pagination';

package/dist/components/pagination/index.js

@@ -4,6 +4,8 @@ export { PaginationItem } from './pagination-item.js';
 export { PaginationNextTrigger } from './pagination-next-trigger.js';
 export { PaginationPrevTrigger } from './pagination-prev-trigger.js';
 export { PaginationRoot } from './pagination-root.js';
+export { PaginationRootProvider } from './pagination-root-provider.js';
+export { usePagination } from './use-pagination.js';
 export { usePaginationContext } from './use-pagination-context.js';
 import * as pagination from './pagination.js';
 export { pagination as Pagination };

package/dist/components/pagination/pagination-next-trigger.cjs

@@ -12,7 +12,7 @@ const usePaginationContext = require('./use-pagination-context.cjs');
 const PaginationNextTrigger = react.forwardRef(
   (props, ref) => {
     const pagination = usePaginationContext.usePaginationContext();
-    const mergedProps = react$1.mergeProps(pagination.nextTriggerProps, props);
+    const mergedProps = react$1.mergeProps(pagination.getNextTriggerProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
   }
 );

package/dist/components/pagination/pagination-next-trigger.js

@@ -8,7 +8,7 @@ import { usePaginationContext } from './use-pagination-context.js';
 const PaginationNextTrigger = forwardRef(
   (props, ref) => {
     const pagination = usePaginationContext();
-    const mergedProps = mergeProps(pagination.nextTriggerProps, props);
+    const mergedProps = mergeProps(pagination.getNextTriggerProps(), props);
     return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
   }
 );

package/dist/components/pagination/pagination-prev-trigger.cjs

@@ -12,7 +12,7 @@ const usePaginationContext = require('./use-pagination-context.cjs');
 const PaginationPrevTrigger = react.forwardRef(
   (props, ref) => {
     const pagination = usePaginationContext.usePaginationContext();
-    const mergedProps = react$1.mergeProps(pagination.prevTriggerProps, props);
+    const mergedProps = react$1.mergeProps(pagination.getPrevTriggerProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
   }
 );

package/dist/components/pagination/pagination-prev-trigger.js

@@ -8,7 +8,7 @@ import { usePaginationContext } from './use-pagination-context.js';
 const PaginationPrevTrigger = forwardRef(
   (props, ref) => {
     const pagination = usePaginationContext();
-    const mergedProps = mergeProps(pagination.prevTriggerProps, props);
+    const mergedProps = mergeProps(pagination.getPrevTriggerProps(), props);
     return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
   }
 );

package/dist/components/pagination/pagination-root-provider.cjs

@@ -0,0 +1,24 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const usePaginationContext = require('./use-pagination-context.cjs');
+
+const PaginationRootProvider = react.forwardRef(
+  (props, ref) => {
+    const [{ value: pagination }, localProps] = createSplitProps.createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = react$1.mergeProps(pagination.getRootProps(), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(usePaginationContext.PaginationProvider, { value: pagination, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.nav, { ...mergedProps, ref }) });
+  }
+);
+PaginationRootProvider.displayName = "PaginationRootProvider";
+
+exports.PaginationRootProvider = PaginationRootProvider;

package/dist/components/pagination/pagination-root-provider.d.cts

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UsePaginationReturn } from './use-pagination';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UsePaginationReturn;
+}
+export interface PaginationRootProviderProps extends HTMLArkProps<'nav'>, RootProviderProps {
+}
+export declare const PaginationRootProvider: ForwardRefExoticComponent<PaginationRootProviderProps & RefAttributes<HTMLElement>>;
+export {};

package/dist/components/pagination/pagination-root-provider.d.ts

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UsePaginationReturn } from './use-pagination';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UsePaginationReturn;
+}
+export interface PaginationRootProviderProps extends HTMLArkProps<'nav'>, RootProviderProps {
+}
+export declare const PaginationRootProvider: ForwardRefExoticComponent<PaginationRootProviderProps & RefAttributes<HTMLElement>>;
+export {};

package/dist/components/pagination/pagination-root-provider.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { PaginationProvider } from './use-pagination-context.js';
+
+const PaginationRootProvider = forwardRef(
+  (props, ref) => {
+    const [{ value: pagination }, localProps] = createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = mergeProps(pagination.getRootProps(), localProps);
+    return /* @__PURE__ */ jsx(PaginationProvider, { value: pagination, children: /* @__PURE__ */ jsx(ark.nav, { ...mergedProps, ref }) });
+  }
+);
+PaginationRootProvider.displayName = "PaginationRootProvider";
+
+export { PaginationRootProvider };

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

@@ -26,7 +26,7 @@ const PaginationRoot = react.forwardRef((props, ref) => {
     "type"
   ]);
   const pagination = usePagination.usePagination(paginationProps);
-  const mergedProps = react$1.mergeProps(pagination.rootProps, localProps);
+  const mergedProps = react$1.mergeProps(pagination.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(usePaginationContext.PaginationProvider, { value: pagination, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.nav, { ...mergedProps, ref }) });
 });
 PaginationRoot.displayName = "PaginationRoot";

package/dist/components/pagination/pagination-root.js

@@ -22,7 +22,7 @@ const PaginationRoot = forwardRef((props, ref) => {
     "type"
   ]);
   const pagination = usePagination(paginationProps);
-  const mergedProps = mergeProps(pagination.rootProps, localProps);
+  const mergedProps = mergeProps(pagination.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(PaginationProvider, { value: pagination, children: /* @__PURE__ */ jsx(ark.nav, { ...mergedProps, ref }) });
 });
 PaginationRoot.displayName = "PaginationRoot";

package/dist/components/pagination/pagination.cjs

@@ -8,6 +8,7 @@ const paginationItem = require('./pagination-item.cjs');
 const paginationNextTrigger = require('./pagination-next-trigger.cjs');
 const paginationPrevTrigger = require('./pagination-prev-trigger.cjs');
 const paginationRoot = require('./pagination-root.cjs');
+const paginationRootProvider = require('./pagination-root-provider.cjs');
 
 
 
@@ -17,3 +18,4 @@ exports.Item = paginationItem.PaginationItem;
 exports.NextTrigger = paginationNextTrigger.PaginationNextTrigger;
 exports.PrevTrigger = paginationPrevTrigger.PaginationPrevTrigger;
 exports.Root = paginationRoot.PaginationRoot;
+exports.RootProvider = paginationRootProvider.PaginationRootProvider;

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

@@ -5,3 +5,4 @@ export { PaginationItem as Item, type PaginationItemProps as ItemProps } from '.
 export { PaginationNextTrigger as NextTrigger, type PaginationNextTriggerProps as NextTriggerProps, } from './pagination-next-trigger';
 export { PaginationPrevTrigger as PrevTrigger, type PaginationPrevTriggerProps as PrevTriggerProps, } from './pagination-prev-trigger';
 export { PaginationRoot as Root, type PaginationRootProps as RootProps } from './pagination-root';
+export { PaginationRootProvider as RootProvider, type PaginationRootProviderProps as RootProviderProps, } from './pagination-root-provider';

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

@@ -5,3 +5,4 @@ export { PaginationItem as Item, type PaginationItemProps as ItemProps } from '.
 export { PaginationNextTrigger as NextTrigger, type PaginationNextTriggerProps as NextTriggerProps, } from './pagination-next-trigger';
 export { PaginationPrevTrigger as PrevTrigger, type PaginationPrevTriggerProps as PrevTriggerProps, } from './pagination-prev-trigger';
 export { PaginationRoot as Root, type PaginationRootProps as RootProps } from './pagination-root';
+export { PaginationRootProvider as RootProvider, type PaginationRootProviderProps as RootProviderProps, } from './pagination-root-provider';

package/dist/components/pagination/pagination.js

@@ -4,3 +4,4 @@ export { PaginationItem as Item } from './pagination-item.js';
 export { PaginationNextTrigger as NextTrigger } from './pagination-next-trigger.js';
 export { PaginationPrevTrigger as PrevTrigger } from './pagination-prev-trigger.js';
 export { PaginationRoot as Root } from './pagination-root.js';
+export { PaginationRootProvider as RootProvider } from './pagination-root-provider.js';