@ark-ui/react 3.0.2 → 3.2.0

package/dist/components/carousel/carousel.d.ts

@@ -8,4 +8,5 @@ export { CarouselItemGroup as ItemGroup, type CarouselItemGroupProps as ItemGrou
 export { CarouselNextTrigger as NextTrigger, type CarouselNextTriggerProps as NextTriggerProps, } from './carousel-next-trigger';
 export { CarouselPrevTrigger as PrevTrigger, type CarouselPrevTriggerProps as PrevTriggerProps, } from './carousel-prev-trigger';
 export { CarouselRoot as Root, type CarouselRootProps as RootProps } from './carousel-root';
+export { CarouselRootProvider as RootProvider, type CarouselRootProviderProps as RootProviderProps, } from './carousel-root-provider';
 export { CarouselViewport as Viewport, type CarouselViewportProps as ViewportProps, } from './carousel-viewport';

package/dist/components/carousel/carousel.js

@@ -7,4 +7,5 @@ export { CarouselItemGroup as ItemGroup } from './carousel-item-group.js';
 export { CarouselNextTrigger as NextTrigger } from './carousel-next-trigger.js';
 export { CarouselPrevTrigger as PrevTrigger } from './carousel-prev-trigger.js';
 export { CarouselRoot as Root } from './carousel-root.js';
+export { CarouselRootProvider as RootProvider } from './carousel-root-provider.js';
 export { CarouselViewport as Viewport } from './carousel-viewport.js';

package/dist/components/carousel/index.cjs

@@ -11,7 +11,9 @@ const carouselItemGroup = require('./carousel-item-group.cjs');
 const carouselNextTrigger = require('./carousel-next-trigger.cjs');
 const carouselPrevTrigger = require('./carousel-prev-trigger.cjs');
 const carouselRoot = require('./carousel-root.cjs');
+const carouselRootProvider = require('./carousel-root-provider.cjs');
 const carouselViewport = require('./carousel-viewport.cjs');
+const useCarousel = require('./use-carousel.cjs');
 const useCarouselContext = require('./use-carousel-context.cjs');
 const carousel = require('./carousel.cjs');
 
@@ -26,6 +28,8 @@ exports.CarouselItemGroup = carouselItemGroup.CarouselItemGroup;
 exports.CarouselNextTrigger = carouselNextTrigger.CarouselNextTrigger;
 exports.CarouselPrevTrigger = carouselPrevTrigger.CarouselPrevTrigger;
 exports.CarouselRoot = carouselRoot.CarouselRoot;
+exports.CarouselRootProvider = carouselRootProvider.CarouselRootProvider;
 exports.CarouselViewport = carouselViewport.CarouselViewport;
+exports.useCarousel = useCarousel.useCarousel;
 exports.useCarouselContext = useCarouselContext.useCarouselContext;
 exports.Carousel = carousel;

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

@@ -8,6 +8,8 @@ export { CarouselItemGroup, type CarouselItemGroupProps } from './carousel-item-
 export { CarouselNextTrigger, type CarouselNextTriggerProps } from './carousel-next-trigger';
 export { CarouselPrevTrigger, type CarouselPrevTriggerProps } from './carousel-prev-trigger';
 export { CarouselRoot, type CarouselRootProps } from './carousel-root';
+export { CarouselRootProvider, type CarouselRootProviderProps } from './carousel-root-provider';
 export { CarouselViewport, type CarouselViewportProps } from './carousel-viewport';
-export { type UseCarouselContext, useCarouselContext } from './use-carousel-context';
+export { useCarousel, type UseCarouselProps, type UseCarouselReturn } from './use-carousel';
+export { useCarouselContext, type UseCarouselContext } from './use-carousel-context';
 export * as Carousel from './carousel';

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

@@ -8,6 +8,8 @@ export { CarouselItemGroup, type CarouselItemGroupProps } from './carousel-item-
 export { CarouselNextTrigger, type CarouselNextTriggerProps } from './carousel-next-trigger';
 export { CarouselPrevTrigger, type CarouselPrevTriggerProps } from './carousel-prev-trigger';
 export { CarouselRoot, type CarouselRootProps } from './carousel-root';
+export { CarouselRootProvider, type CarouselRootProviderProps } from './carousel-root-provider';
 export { CarouselViewport, type CarouselViewportProps } from './carousel-viewport';
-export { type UseCarouselContext, useCarouselContext } from './use-carousel-context';
+export { useCarousel, type UseCarouselProps, type UseCarouselReturn } from './use-carousel';
+export { useCarouselContext, type UseCarouselContext } from './use-carousel-context';
 export * as Carousel from './carousel';

package/dist/components/carousel/index.js

@@ -7,7 +7,9 @@ export { CarouselItemGroup } from './carousel-item-group.js';
 export { CarouselNextTrigger } from './carousel-next-trigger.js';
 export { CarouselPrevTrigger } from './carousel-prev-trigger.js';
 export { CarouselRoot } from './carousel-root.js';
+export { CarouselRootProvider } from './carousel-root-provider.js';
 export { CarouselViewport } from './carousel-viewport.js';
+export { useCarousel } from './use-carousel.js';
 export { useCarouselContext } from './use-carousel-context.js';
 import * as carousel from './carousel.js';
 export { carousel as Carousel };

package/dist/components/checkbox/checkbox-control.cjs

@@ -11,7 +11,7 @@ const useCheckboxContext = require('./use-checkbox-context.cjs');
 
 const CheckboxControl = react.forwardRef((props, ref) => {
   const checkbox = useCheckboxContext.useCheckboxContext();
-  const mergedProps = react$1.mergeProps(checkbox.controlProps, props);
+  const mergedProps = react$1.mergeProps(checkbox.getControlProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
 CheckboxControl.displayName = "CheckboxControl";

package/dist/components/checkbox/checkbox-control.js

@@ -7,7 +7,7 @@ import { useCheckboxContext } from './use-checkbox-context.js';
 
 const CheckboxControl = forwardRef((props, ref) => {
   const checkbox = useCheckboxContext();
-  const mergedProps = mergeProps(checkbox.controlProps, props);
+  const mergedProps = mergeProps(checkbox.getControlProps(), props);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
 });
 CheckboxControl.displayName = "CheckboxControl";

package/dist/components/checkbox/checkbox-hidden-input.cjs

@@ -12,7 +12,7 @@ const useCheckboxContext = require('./use-checkbox-context.cjs');
 const CheckboxHiddenInput = react.forwardRef(
   (props, ref) => {
     const checkbox = useCheckboxContext.useCheckboxContext();
-    const mergedProps = react$1.mergeProps(checkbox.hiddenInputProps, props);
+    const mergedProps = react$1.mergeProps(checkbox.getHiddenInputProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
   }
 );

package/dist/components/checkbox/checkbox-hidden-input.js

@@ -8,7 +8,7 @@ import { useCheckboxContext } from './use-checkbox-context.js';
 const CheckboxHiddenInput = forwardRef(
   (props, ref) => {
     const checkbox = useCheckboxContext();
-    const mergedProps = mergeProps(checkbox.hiddenInputProps, props);
+    const mergedProps = mergeProps(checkbox.getHiddenInputProps(), props);
     return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
   }
 );

package/dist/components/checkbox/checkbox-indicator.cjs

@@ -13,7 +13,7 @@ const CheckboxIndicator = react.forwardRef(
   (props, ref) => {
     const { indeterminate, ...rest } = props;
     const checkbox = useCheckboxContext.useCheckboxContext();
-    const mergedProps = react$1.mergeProps(checkbox.indicatorProps, rest);
+    const mergedProps = react$1.mergeProps(checkbox.getIndicatorProps(), rest);
     const isVisible = indeterminate ? checkbox.indeterminate : checkbox.checked;
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, hidden: !isVisible, ref });
   }

package/dist/components/checkbox/checkbox-indicator.js

@@ -9,7 +9,7 @@ const CheckboxIndicator = forwardRef(
   (props, ref) => {
     const { indeterminate, ...rest } = props;
     const checkbox = useCheckboxContext();
-    const mergedProps = mergeProps(checkbox.indicatorProps, rest);
+    const mergedProps = mergeProps(checkbox.getIndicatorProps(), rest);
     const isVisible = indeterminate ? checkbox.indeterminate : checkbox.checked;
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, hidden: !isVisible, ref });
   }

package/dist/components/checkbox/checkbox-label.cjs

@@ -11,7 +11,7 @@ const useCheckboxContext = require('./use-checkbox-context.cjs');
 
 const CheckboxLabel = react.forwardRef((props, ref) => {
   const checkbox = useCheckboxContext.useCheckboxContext();
-  const mergedProps = react$1.mergeProps(checkbox.labelProps, props);
+  const mergedProps = react$1.mergeProps(checkbox.getLabelProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref });
 });
 CheckboxLabel.displayName = "CheckboxLabel";

package/dist/components/checkbox/checkbox-label.js

@@ -7,7 +7,7 @@ import { useCheckboxContext } from './use-checkbox-context.js';
 
 const CheckboxLabel = forwardRef((props, ref) => {
   const checkbox = useCheckboxContext();
-  const mergedProps = mergeProps(checkbox.labelProps, props);
+  const mergedProps = mergeProps(checkbox.getLabelProps(), props);
   return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref });
 });
 CheckboxLabel.displayName = "CheckboxLabel";

package/dist/components/checkbox/checkbox-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 useCheckboxContext = require('./use-checkbox-context.cjs');
+
+const CheckboxRootProvider = react.forwardRef(
+  (props, ref) => {
+    const [{ value: checkbox }, localProps] = createSplitProps.createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = react$1.mergeProps(checkbox.getRootProps(), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(useCheckboxContext.CheckboxProvider, { value: checkbox, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref }) });
+  }
+);
+CheckboxRootProvider.displayName = "CheckboxRootProvider";
+
+exports.CheckboxRootProvider = CheckboxRootProvider;

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseCheckboxReturn } from './use-checkbox';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseCheckboxReturn;
+}
+export interface CheckboxRootProviderProps extends HTMLArkProps<'label'>, RootProviderProps {
+}
+export declare const CheckboxRootProvider: ForwardRefExoticComponent<CheckboxRootProviderProps & RefAttributes<HTMLLabelElement>>;
+export {};

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseCheckboxReturn } from './use-checkbox';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseCheckboxReturn;
+}
+export interface CheckboxRootProviderProps extends HTMLArkProps<'label'>, RootProviderProps {
+}
+export declare const CheckboxRootProvider: ForwardRefExoticComponent<CheckboxRootProviderProps & RefAttributes<HTMLLabelElement>>;
+export {};

package/dist/components/checkbox/checkbox-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 { CheckboxProvider } from './use-checkbox-context.js';
+
+const CheckboxRootProvider = forwardRef(
+  (props, ref) => {
+    const [{ value: checkbox }, localProps] = createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = mergeProps(checkbox.getRootProps(), localProps);
+    return /* @__PURE__ */ jsx(CheckboxProvider, { value: checkbox, children: /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref }) });
+  }
+);
+CheckboxRootProvider.displayName = "CheckboxRootProvider";
+
+export { CheckboxRootProvider };

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

@@ -27,7 +27,7 @@ const CheckboxRoot = react.forwardRef((props, ref) => {
     "value"
   ]);
   const checkbox = useCheckbox.useCheckbox(useCheckboxProps);
-  const mergedProps = react$1.mergeProps(checkbox.rootProps, localProps);
+  const mergedProps = react$1.mergeProps(checkbox.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useCheckboxContext.CheckboxProvider, { value: checkbox, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref }) });
 });
 CheckboxRoot.displayName = "CheckboxRoot";

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

@@ -23,7 +23,7 @@ const CheckboxRoot = forwardRef((props, ref) => {
     "value"
   ]);
   const checkbox = useCheckbox(useCheckboxProps);
-  const mergedProps = mergeProps(checkbox.rootProps, localProps);
+  const mergedProps = mergeProps(checkbox.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(CheckboxProvider, { value: checkbox, children: /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref }) });
 });
 CheckboxRoot.displayName = "CheckboxRoot";

package/dist/components/checkbox/checkbox.cjs

@@ -8,6 +8,7 @@ const checkboxHiddenInput = require('./checkbox-hidden-input.cjs');
 const checkboxIndicator = require('./checkbox-indicator.cjs');
 const checkboxLabel = require('./checkbox-label.cjs');
 const checkboxRoot = require('./checkbox-root.cjs');
+const checkboxRootProvider = require('./checkbox-root-provider.cjs');
 
 
 
@@ -17,3 +18,4 @@ exports.HiddenInput = checkboxHiddenInput.CheckboxHiddenInput;
 exports.Indicator = checkboxIndicator.CheckboxIndicator;
 exports.Label = checkboxLabel.CheckboxLabel;
 exports.Root = checkboxRoot.CheckboxRoot;
+exports.RootProvider = checkboxRootProvider.CheckboxRootProvider;

package/dist/components/checkbox/checkbox.d.cts

@@ -5,3 +5,4 @@ export { CheckboxHiddenInput as HiddenInput, type CheckboxHiddenInputProps as Hi
 export { CheckboxIndicator as Indicator, type CheckboxIndicatorProps as IndicatorProps, } from './checkbox-indicator';
 export { CheckboxLabel as Label, type CheckboxLabelProps as LabelProps } from './checkbox-label';
 export { CheckboxRoot as Root, type CheckboxRootProps as RootProps } from './checkbox-root';
+export { CheckboxRootProvider as RootProvider, type CheckboxRootProviderProps as RootProviderProps, } from './checkbox-root-provider';

package/dist/components/checkbox/checkbox.d.ts

@@ -5,3 +5,4 @@ export { CheckboxHiddenInput as HiddenInput, type CheckboxHiddenInputProps as Hi
 export { CheckboxIndicator as Indicator, type CheckboxIndicatorProps as IndicatorProps, } from './checkbox-indicator';
 export { CheckboxLabel as Label, type CheckboxLabelProps as LabelProps } from './checkbox-label';
 export { CheckboxRoot as Root, type CheckboxRootProps as RootProps } from './checkbox-root';
+export { CheckboxRootProvider as RootProvider, type CheckboxRootProviderProps as RootProviderProps, } from './checkbox-root-provider';

package/dist/components/checkbox/checkbox.js

@@ -4,3 +4,4 @@ export { CheckboxHiddenInput as HiddenInput } from './checkbox-hidden-input.js';
 export { CheckboxIndicator as Indicator } from './checkbox-indicator.js';
 export { CheckboxLabel as Label } from './checkbox-label.js';
 export { CheckboxRoot as Root } from './checkbox-root.js';
+export { CheckboxRootProvider as RootProvider } from './checkbox-root-provider.js';

package/dist/components/checkbox/index.cjs

@@ -8,6 +8,8 @@ const checkboxHiddenInput = require('./checkbox-hidden-input.cjs');
 const checkboxIndicator = require('./checkbox-indicator.cjs');
 const checkboxLabel = require('./checkbox-label.cjs');
 const checkboxRoot = require('./checkbox-root.cjs');
+const checkboxRootProvider = require('./checkbox-root-provider.cjs');
+const useCheckbox = require('./use-checkbox.cjs');
 const useCheckboxContext = require('./use-checkbox-context.cjs');
 const checkbox = require('./checkbox.cjs');
 
@@ -19,5 +21,7 @@ exports.CheckboxHiddenInput = checkboxHiddenInput.CheckboxHiddenInput;
 exports.CheckboxIndicator = checkboxIndicator.CheckboxIndicator;
 exports.CheckboxLabel = checkboxLabel.CheckboxLabel;
 exports.CheckboxRoot = checkboxRoot.CheckboxRoot;
+exports.CheckboxRootProvider = checkboxRootProvider.CheckboxRootProvider;
+exports.useCheckbox = useCheckbox.useCheckbox;
 exports.useCheckboxContext = useCheckboxContext.useCheckboxContext;
 exports.Checkbox = checkbox;

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

@@ -5,5 +5,7 @@ export { CheckboxHiddenInput, type CheckboxHiddenInputProps } from './checkbox-h
 export { CheckboxIndicator, type CheckboxIndicatorProps } from './checkbox-indicator';
 export { CheckboxLabel, type CheckboxLabelProps } from './checkbox-label';
 export { CheckboxRoot, type CheckboxRootProps } from './checkbox-root';
+export { CheckboxRootProvider, type CheckboxRootProviderProps } from './checkbox-root-provider';
+export { useCheckbox, type UseCheckboxProps, type UseCheckboxReturn } from './use-checkbox';
 export { useCheckboxContext, type UseCheckboxContext } from './use-checkbox-context';
 export * as Checkbox from './checkbox';

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

@@ -5,5 +5,7 @@ export { CheckboxHiddenInput, type CheckboxHiddenInputProps } from './checkbox-h
 export { CheckboxIndicator, type CheckboxIndicatorProps } from './checkbox-indicator';
 export { CheckboxLabel, type CheckboxLabelProps } from './checkbox-label';
 export { CheckboxRoot, type CheckboxRootProps } from './checkbox-root';
+export { CheckboxRootProvider, type CheckboxRootProviderProps } from './checkbox-root-provider';
+export { useCheckbox, type UseCheckboxProps, type UseCheckboxReturn } from './use-checkbox';
 export { useCheckboxContext, type UseCheckboxContext } from './use-checkbox-context';
 export * as Checkbox from './checkbox';

package/dist/components/checkbox/index.js

@@ -4,6 +4,8 @@ export { CheckboxHiddenInput } from './checkbox-hidden-input.js';
 export { CheckboxIndicator } from './checkbox-indicator.js';
 export { CheckboxLabel } from './checkbox-label.js';
 export { CheckboxRoot } from './checkbox-root.js';
+export { CheckboxRootProvider } from './checkbox-root-provider.js';
+export { useCheckbox } from './use-checkbox.js';
 export { useCheckboxContext } from './use-checkbox-context.js';
 import * as checkbox from './checkbox.js';
 export { checkbox as Checkbox };

package/dist/components/clipboard/clipboard-control.cjs

@@ -11,7 +11,7 @@ const useClipboardContext = require('./use-clipboard-context.cjs');
 
 const ClipboardControl = react.forwardRef((props, ref) => {
   const clipboard = useClipboardContext.useClipboardContext();
-  const mergedProps = react$1.mergeProps(clipboard.controlProps, props);
+  const mergedProps = react$1.mergeProps(clipboard.getControlProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
 ClipboardControl.displayName = "ClipboardControl";

package/dist/components/clipboard/clipboard-control.js

@@ -7,7 +7,7 @@ import { useClipboardContext } from './use-clipboard-context.js';
 
 const ClipboardControl = forwardRef((props, ref) => {
   const clipboard = useClipboardContext();
-  const mergedProps = mergeProps(clipboard.controlProps, props);
+  const mergedProps = mergeProps(clipboard.getControlProps(), props);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
 });
 ClipboardControl.displayName = "ClipboardControl";

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

@@ -11,7 +11,7 @@ const useClipboardContext = require('./use-clipboard-context.cjs');
 
 const ClipboardInput = react.forwardRef((props, ref) => {
   const clipboard = useClipboardContext.useClipboardContext();
-  const mergedProps = react$1.mergeProps(clipboard.inputProps, props);
+  const mergedProps = react$1.mergeProps(clipboard.getInputProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
 });
 ClipboardInput.displayName = "ClipboardInput";

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

@@ -7,7 +7,7 @@ import { useClipboardContext } from './use-clipboard-context.js';
 
 const ClipboardInput = forwardRef((props, ref) => {
   const clipboard = useClipboardContext();
-  const mergedProps = mergeProps(clipboard.inputProps, props);
+  const mergedProps = mergeProps(clipboard.getInputProps(), props);
   return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
 });
 ClipboardInput.displayName = "ClipboardInput";

package/dist/components/clipboard/clipboard-label.cjs

@@ -11,7 +11,7 @@ const useClipboardContext = require('./use-clipboard-context.cjs');
 
 const ClipboardLabel = react.forwardRef((props, ref) => {
   const clipboard = useClipboardContext.useClipboardContext();
-  const mergedProps = react$1.mergeProps(clipboard.labelProps, props);
+  const mergedProps = react$1.mergeProps(clipboard.getLabelProps(), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
 });
 ClipboardLabel.displayName = "ClipboardLabel";

package/dist/components/clipboard/clipboard-label.js

@@ -7,7 +7,7 @@ import { useClipboardContext } from './use-clipboard-context.js';
 
 const ClipboardLabel = forwardRef((props, ref) => {
   const clipboard = useClipboardContext();
-  const mergedProps = mergeProps(clipboard.labelProps, props);
+  const mergedProps = mergeProps(clipboard.getLabelProps(), props);
   return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
 });
 ClipboardLabel.displayName = "ClipboardLabel";

package/dist/components/clipboard/clipboard-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 useClipboardContext = require('./use-clipboard-context.cjs');
+
+const ClipboardRootProvider = react.forwardRef(
+  (props, ref) => {
+    const [{ value: clipboard }, localProps] = createSplitProps.createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = react$1.mergeProps(clipboard.getRootProps(), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(useClipboardContext.ClipboardProvider, { value: clipboard, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ref, ...mergedProps }) });
+  }
+);
+ClipboardRootProvider.displayName = "ClipboardRootProvider";
+
+exports.ClipboardRootProvider = ClipboardRootProvider;

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseClipboardReturn } from './use-clipboard';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseClipboardReturn;
+}
+export interface ClipboardRootProviderProps extends HTMLArkProps<'div'>, RootProviderProps {
+}
+export declare const ClipboardRootProvider: ForwardRefExoticComponent<ClipboardRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,11 @@
+import { HTMLArkProps } from '../factory';
+import { UseClipboardReturn } from './use-clipboard';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+
+interface RootProviderProps {
+    value: UseClipboardReturn;
+}
+export interface ClipboardRootProviderProps extends HTMLArkProps<'div'>, RootProviderProps {
+}
+export declare const ClipboardRootProvider: ForwardRefExoticComponent<ClipboardRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/clipboard/clipboard-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 { ClipboardProvider } from './use-clipboard-context.js';
+
+const ClipboardRootProvider = forwardRef(
+  (props, ref) => {
+    const [{ value: clipboard }, localProps] = createSplitProps()(props, [
+      "value"
+    ]);
+    const mergedProps = mergeProps(clipboard.getRootProps(), localProps);
+    return /* @__PURE__ */ jsx(ClipboardProvider, { value: clipboard, children: /* @__PURE__ */ jsx(ark.div, { ref, ...mergedProps }) });
+  }
+);
+ClipboardRootProvider.displayName = "ClipboardRootProvider";
+
+export { ClipboardRootProvider };

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

@@ -20,7 +20,7 @@ const ClipboardRoot = react.forwardRef((props, ref) => {
     "value"
   ]);
   const clipboard = useClipboard.useClipboard(useClipboardProps);
-  const mergedProps = react$1.mergeProps(clipboard.rootProps, localProps);
+  const mergedProps = react$1.mergeProps(clipboard.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useClipboardContext.ClipboardProvider, { value: clipboard, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ref, ...mergedProps }) });
 });
 ClipboardRoot.displayName = "ClipboardRoot";

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

@@ -16,7 +16,7 @@ const ClipboardRoot = forwardRef((props, ref) => {
     "value"
   ]);
   const clipboard = useClipboard(useClipboardProps);
-  const mergedProps = mergeProps(clipboard.rootProps, localProps);
+  const mergedProps = mergeProps(clipboard.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(ClipboardProvider, { value: clipboard, children: /* @__PURE__ */ jsx(ark.div, { ref, ...mergedProps }) });
 });
 ClipboardRoot.displayName = "ClipboardRoot";

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

@@ -12,7 +12,7 @@ const useClipboardContext = require('./use-clipboard-context.cjs');
 const ClipboardTrigger = react.forwardRef(
   (props, ref) => {
     const clipboard = useClipboardContext.useClipboardContext();
-    const mergedProps = react$1.mergeProps(clipboard.triggerProps, props);
+    const mergedProps = react$1.mergeProps(clipboard.getTriggerProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
   }
 );

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

@@ -8,7 +8,7 @@ import { useClipboardContext } from './use-clipboard-context.js';
 const ClipboardTrigger = forwardRef(
   (props, ref) => {
     const clipboard = useClipboardContext();
-    const mergedProps = mergeProps(clipboard.triggerProps, props);
+    const mergedProps = mergeProps(clipboard.getTriggerProps(), props);
     return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
   }
 );

package/dist/components/clipboard/clipboard.cjs

@@ -8,6 +8,7 @@ const clipboardIndicator = require('./clipboard-indicator.cjs');
 const clipboardInput = require('./clipboard-input.cjs');
 const clipboardLabel = require('./clipboard-label.cjs');
 const clipboardRoot = require('./clipboard-root.cjs');
+const clipboardRootProvider = require('./clipboard-root-provider.cjs');
 const clipboardTrigger = require('./clipboard-trigger.cjs');
 
 
@@ -18,4 +19,5 @@ exports.Indicator = clipboardIndicator.ClipboardIndicator;
 exports.Input = clipboardInput.ClipboardInput;
 exports.Label = clipboardLabel.ClipboardLabel;
 exports.Root = clipboardRoot.ClipboardRoot;
+exports.RootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.Trigger = clipboardTrigger.ClipboardTrigger;

package/dist/components/clipboard/clipboard.d.cts

@@ -5,4 +5,5 @@ export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as Indica
 export { ClipboardInput as Input, type ClipboardInputProps as InputProps } from './clipboard-input';
 export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps } from './clipboard-label';
 export { ClipboardRoot as Root, type ClipboardRootProps as RootProps } from './clipboard-root';
+export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, } from './clipboard-root-provider';
 export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, } from './clipboard-trigger';

package/dist/components/clipboard/clipboard.d.ts

@@ -5,4 +5,5 @@ export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as Indica
 export { ClipboardInput as Input, type ClipboardInputProps as InputProps } from './clipboard-input';
 export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps } from './clipboard-label';
 export { ClipboardRoot as Root, type ClipboardRootProps as RootProps } from './clipboard-root';
+export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, } from './clipboard-root-provider';
 export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, } from './clipboard-trigger';

package/dist/components/clipboard/clipboard.js

@@ -4,4 +4,5 @@ export { ClipboardIndicator as Indicator } from './clipboard-indicator.js';
 export { ClipboardInput as Input } from './clipboard-input.js';
 export { ClipboardLabel as Label } from './clipboard-label.js';
 export { ClipboardRoot as Root } from './clipboard-root.js';
+export { ClipboardRootProvider as RootProvider } from './clipboard-root-provider.js';
 export { ClipboardTrigger as Trigger } from './clipboard-trigger.js';

package/dist/components/clipboard/index.cjs

@@ -8,7 +8,9 @@ const clipboardIndicator = require('./clipboard-indicator.cjs');
 const clipboardInput = require('./clipboard-input.cjs');
 const clipboardLabel = require('./clipboard-label.cjs');
 const clipboardRoot = require('./clipboard-root.cjs');
+const clipboardRootProvider = require('./clipboard-root-provider.cjs');
 const clipboardTrigger = require('./clipboard-trigger.cjs');
+const useClipboard = require('./use-clipboard.cjs');
 const useClipboardContext = require('./use-clipboard-context.cjs');
 const clipboard = require('./clipboard.cjs');
 
@@ -20,6 +22,8 @@ exports.ClipboardIndicator = clipboardIndicator.ClipboardIndicator;
 exports.ClipboardInput = clipboardInput.ClipboardInput;
 exports.ClipboardLabel = clipboardLabel.ClipboardLabel;
 exports.ClipboardRoot = clipboardRoot.ClipboardRoot;
+exports.ClipboardRootProvider = clipboardRootProvider.ClipboardRootProvider;
 exports.ClipboardTrigger = clipboardTrigger.ClipboardTrigger;
+exports.useClipboard = useClipboard.useClipboard;
 exports.useClipboardContext = useClipboardContext.useClipboardContext;
 exports.Clipboard = clipboard;

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

@@ -5,6 +5,8 @@ export { ClipboardIndicator, type ClipboardIndicatorProps } from './clipboard-in
 export { ClipboardInput, type ClipboardInputProps } from './clipboard-input';
 export { ClipboardLabel, type ClipboardLabelProps } from './clipboard-label';
 export { ClipboardRoot, type ClipboardRootProps } from './clipboard-root';
+export { ClipboardRootProvider, type ClipboardRootProviderProps } from './clipboard-root-provider';
 export { ClipboardTrigger, type ClipboardTriggerProps } from './clipboard-trigger';
-export { type UseClipboardContext, useClipboardContext } from './use-clipboard-context';
+export { useClipboard, type UseClipboardProps, type UseClipboardReturn } from './use-clipboard';
+export { useClipboardContext, type UseClipboardContext } from './use-clipboard-context';
 export * as Clipboard from './clipboard';

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

@@ -5,6 +5,8 @@ export { ClipboardIndicator, type ClipboardIndicatorProps } from './clipboard-in
 export { ClipboardInput, type ClipboardInputProps } from './clipboard-input';
 export { ClipboardLabel, type ClipboardLabelProps } from './clipboard-label';
 export { ClipboardRoot, type ClipboardRootProps } from './clipboard-root';
+export { ClipboardRootProvider, type ClipboardRootProviderProps } from './clipboard-root-provider';
 export { ClipboardTrigger, type ClipboardTriggerProps } from './clipboard-trigger';
-export { type UseClipboardContext, useClipboardContext } from './use-clipboard-context';
+export { useClipboard, type UseClipboardProps, type UseClipboardReturn } from './use-clipboard';
+export { useClipboardContext, type UseClipboardContext } from './use-clipboard-context';
 export * as Clipboard from './clipboard';

package/dist/components/clipboard/index.js

@@ -4,7 +4,9 @@ export { ClipboardIndicator } from './clipboard-indicator.js';
 export { ClipboardInput } from './clipboard-input.js';
 export { ClipboardLabel } from './clipboard-label.js';
 export { ClipboardRoot } from './clipboard-root.js';
+export { ClipboardRootProvider } from './clipboard-root-provider.js';
 export { ClipboardTrigger } from './clipboard-trigger.js';
+export { useClipboard } from './use-clipboard.js';
 export { useClipboardContext } from './use-clipboard-context.js';
 import * as clipboard from './clipboard.js';
 export { clipboard as Clipboard };

package/dist/components/collapsible/collapsible-content.cjs

@@ -15,7 +15,7 @@ const CollapsibleContent = react.forwardRef(
     if (collapsible.isUnmounted) {
       return null;
     }
-    const mergedProps = react$1.mergeProps(collapsible.contentProps, props);
+    const mergedProps = react$1.mergeProps(collapsible.getContentProps(), props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
   }
 );

package/dist/components/collapsible/collapsible-content.js

@@ -11,7 +11,7 @@ const CollapsibleContent = forwardRef(
     if (collapsible.isUnmounted) {
       return null;
     }
-    const mergedProps = mergeProps(collapsible.contentProps, props);
+    const mergedProps = mergeProps(collapsible.getContentProps(), props);
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
   }
 );