@ark-ui/react 3.2.1 → 3.4.0-0

package/dist/components/checkbox/index.js

@@ -1,5 +1,6 @@
 export { CheckboxContext } from './checkbox-context.js';
 export { CheckboxControl } from './checkbox-control.js';
+export { CheckboxGroup } from './checkbox-group.js';
 export { CheckboxHiddenInput } from './checkbox-hidden-input.js';
 export { CheckboxIndicator } from './checkbox-indicator.js';
 export { CheckboxLabel } from './checkbox-label.js';
@@ -7,5 +8,7 @@ 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';
+export { useCheckboxGroup } from './use-checkbox-group.js';
+export { useCheckboxGroupContext } from './use-checkbox-group-context.js';
 import * as checkbox from './checkbox.js';
 export { checkbox as Checkbox };

package/dist/components/checkbox/use-checkbox-group-context.cjs

@@ -0,0 +1,16 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../../utils/create-context.cjs');
+
+const [CheckboxGroupContextProvider, useCheckboxGroupContext] = createContext.createContext({
+  name: "CheckboxGroupContext",
+  hookName: "useCheckboxGroupContext",
+  providerName: "<CheckboxGroupProvider />",
+  strict: false
+});
+
+exports.CheckboxGroupContextProvider = CheckboxGroupContextProvider;
+exports.useCheckboxGroupContext = useCheckboxGroupContext;

package/dist/components/checkbox/use-checkbox-group-context.d.cts

@@ -0,0 +1,6 @@
+import { UseCheckboxGroupReturn } from './use-checkbox-group';
+import { Provider } from 'react';
+
+export interface UseCheckboxGroupContext extends UseCheckboxGroupReturn {
+}
+export declare const CheckboxGroupContextProvider: Provider<UseCheckboxGroupContext | undefined>, useCheckboxGroupContext: () => UseCheckboxGroupContext | undefined;

package/dist/components/checkbox/use-checkbox-group-context.d.ts

@@ -0,0 +1,6 @@
+import { UseCheckboxGroupReturn } from './use-checkbox-group';
+import { Provider } from 'react';
+
+export interface UseCheckboxGroupContext extends UseCheckboxGroupReturn {
+}
+export declare const CheckboxGroupContextProvider: Provider<UseCheckboxGroupContext | undefined>, useCheckboxGroupContext: () => UseCheckboxGroupContext | undefined;

package/dist/components/checkbox/use-checkbox-group-context.js

@@ -0,0 +1,11 @@
+'use client';
+import { createContext } from '../../utils/create-context.js';
+
+const [CheckboxGroupContextProvider, useCheckboxGroupContext] = createContext({
+  name: "CheckboxGroupContext",
+  hookName: "useCheckboxGroupContext",
+  providerName: "<CheckboxGroupProvider />",
+  strict: false
+});
+
+export { CheckboxGroupContextProvider, useCheckboxGroupContext };

package/dist/components/checkbox/use-checkbox-group.cjs

@@ -0,0 +1,60 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const useControllableState = require('../../utils/use-controllable-state.cjs');
+const useEvent = require('../../utils/use-event.cjs');
+
+function useCheckboxGroup(props = {}) {
+  const { defaultValue, value: controlledValue, onValueChange, disabled, readOnly } = props;
+  const interative = !(disabled || readOnly);
+  const onChangeProp = useEvent.useEvent(onValueChange, { sync: true });
+  const [value, setValue] = useControllableState.useControllableState({
+    value: controlledValue,
+    defaultValue: defaultValue || [],
+    onChange: onChangeProp
+  });
+  const isChecked = (val) => {
+    return value.some((v) => String(v) === String(val));
+  };
+  const toggleValue = (val) => {
+    isChecked(val) ? removeValue(val) : addValue(val);
+  };
+  const addValue = (val) => {
+    if (!interative)
+      return;
+    if (isChecked(val))
+      return;
+    setValue(value.concat(val));
+  };
+  const removeValue = (val) => {
+    if (!interative)
+      return;
+    setValue(value.filter((v) => String(v) !== String(val)));
+  };
+  const getItemProps = (props2) => {
+    return {
+      checked: props2.value != null ? isChecked(props2.value) : void 0,
+      onCheckedChange() {
+        if (props2.value != null) {
+          toggleValue(props2.value);
+        }
+      },
+      disabled,
+      readOnly
+    };
+  };
+  return {
+    isChecked,
+    value,
+    disabled,
+    readOnly,
+    setValue,
+    addValue,
+    toggleValue,
+    getItemProps
+  };
+}
+
+exports.useCheckboxGroup = useCheckboxGroup;

package/dist/components/checkbox/use-checkbox-group.d.cts

@@ -0,0 +1,41 @@
+export interface UseCheckboxGroupProps {
+    /**
+     * The initial value of `value` when uncontrolled
+     */
+    defaultValue?: string[];
+    /**
+     * The controlled value of the checkbox group
+     */
+    value?: string[];
+    /**
+     * The callback to call when the value changes
+     */
+    onValueChange?: (value: string[]) => void;
+    /**
+     * If `true`, the checkbox group is disabled
+     */
+    disabled?: boolean;
+    /**
+     * If `true`, the checkbox group is read-only
+     */
+    readOnly?: boolean;
+}
+export interface CheckboxGroupItemProps {
+    value: string | undefined;
+}
+export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
+    isChecked: (val: string | undefined) => boolean;
+    value: string[];
+    disabled: boolean | undefined;
+    readOnly: boolean | undefined;
+    setValue: (value: string[]) => void | undefined;
+    addValue: (val: string) => void;
+    toggleValue: (val: string) => void;
+    getItemProps: (props: CheckboxGroupItemProps) => {
+        checked: boolean | undefined;
+        onCheckedChange(): void;
+        disabled: boolean | undefined;
+        readOnly: boolean | undefined;
+    };
+};
+export type UseCheckboxGroupReturn = ReturnType<typeof useCheckboxGroup>;

package/dist/components/checkbox/use-checkbox-group.d.ts

@@ -0,0 +1,41 @@
+export interface UseCheckboxGroupProps {
+    /**
+     * The initial value of `value` when uncontrolled
+     */
+    defaultValue?: string[];
+    /**
+     * The controlled value of the checkbox group
+     */
+    value?: string[];
+    /**
+     * The callback to call when the value changes
+     */
+    onValueChange?: (value: string[]) => void;
+    /**
+     * If `true`, the checkbox group is disabled
+     */
+    disabled?: boolean;
+    /**
+     * If `true`, the checkbox group is read-only
+     */
+    readOnly?: boolean;
+}
+export interface CheckboxGroupItemProps {
+    value: string | undefined;
+}
+export declare function useCheckboxGroup(props?: UseCheckboxGroupProps): {
+    isChecked: (val: string | undefined) => boolean;
+    value: string[];
+    disabled: boolean | undefined;
+    readOnly: boolean | undefined;
+    setValue: (value: string[]) => void | undefined;
+    addValue: (val: string) => void;
+    toggleValue: (val: string) => void;
+    getItemProps: (props: CheckboxGroupItemProps) => {
+        checked: boolean | undefined;
+        onCheckedChange(): void;
+        disabled: boolean | undefined;
+        readOnly: boolean | undefined;
+    };
+};
+export type UseCheckboxGroupReturn = ReturnType<typeof useCheckboxGroup>;

package/dist/components/checkbox/use-checkbox-group.js

@@ -0,0 +1,56 @@
+'use client';
+import { useControllableState } from '../../utils/use-controllable-state.js';
+import { useEvent } from '../../utils/use-event.js';
+
+function useCheckboxGroup(props = {}) {
+  const { defaultValue, value: controlledValue, onValueChange, disabled, readOnly } = props;
+  const interative = !(disabled || readOnly);
+  const onChangeProp = useEvent(onValueChange, { sync: true });
+  const [value, setValue] = useControllableState({
+    value: controlledValue,
+    defaultValue: defaultValue || [],
+    onChange: onChangeProp
+  });
+  const isChecked = (val) => {
+    return value.some((v) => String(v) === String(val));
+  };
+  const toggleValue = (val) => {
+    isChecked(val) ? removeValue(val) : addValue(val);
+  };
+  const addValue = (val) => {
+    if (!interative)
+      return;
+    if (isChecked(val))
+      return;
+    setValue(value.concat(val));
+  };
+  const removeValue = (val) => {
+    if (!interative)
+      return;
+    setValue(value.filter((v) => String(v) !== String(val)));
+  };
+  const getItemProps = (props2) => {
+    return {
+      checked: props2.value != null ? isChecked(props2.value) : void 0,
+      onCheckedChange() {
+        if (props2.value != null) {
+          toggleValue(props2.value);
+        }
+      },
+      disabled,
+      readOnly
+    };
+  };
+  return {
+    isChecked,
+    value,
+    disabled,
+    readOnly,
+    setValue,
+    addValue,
+    toggleValue,
+    getItemProps
+  };
+}
+
+export { useCheckboxGroup };

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

@@ -9,6 +9,7 @@ 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 useCheckboxGroupContext = require('./use-checkbox-group-context.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -29,7 +30,11 @@ function _interopNamespaceDefault(e) {
 
 const checkbox__namespace = /*#__PURE__*/_interopNamespaceDefault(checkbox);
 
-const useCheckbox = (props = {}) => {
+const useCheckbox = (ownProps = {}) => {
+  const checkboxGroup = useCheckboxGroupContext.useCheckboxGroupContext();
+  const props = react.useMemo(() => {
+    return react$1.mergeProps(ownProps, checkboxGroup?.getItemProps({ value: ownProps.value }) ?? {});
+  }, [ownProps, checkboxGroup]);
   const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
   const { dir } = useLocaleContext.useLocaleContext();
   const initialContext = {

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

@@ -10,4 +10,4 @@ export interface UseCheckboxProps extends Optional<Omit<checkbox.Context, 'dir'
 }
 export interface UseCheckboxReturn extends checkbox.Api<PropTypes> {
 }
-export declare const useCheckbox: (props?: UseCheckboxProps) => UseCheckboxReturn;
+export declare const useCheckbox: (ownProps?: UseCheckboxProps) => UseCheckboxReturn;

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

@@ -10,4 +10,4 @@ export interface UseCheckboxProps extends Optional<Omit<checkbox.Context, 'dir'
 }
 export interface UseCheckboxReturn extends checkbox.Api<PropTypes> {
 }
-export declare const useCheckbox: (props?: UseCheckboxProps) => UseCheckboxReturn;
+export declare const useCheckbox: (ownProps?: UseCheckboxProps) => UseCheckboxReturn;

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

@@ -1,12 +1,17 @@
 'use client';
 import * as checkbox from '@zag-js/checkbox';
-import { useMachine, normalizeProps } from '@zag-js/react';
-import { useId } from 'react';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/react';
+import { useMemo, 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 { useCheckboxGroupContext } from './use-checkbox-group-context.js';
 
-const useCheckbox = (props = {}) => {
+const useCheckbox = (ownProps = {}) => {
+  const checkboxGroup = useCheckboxGroupContext();
+  const props = useMemo(() => {
+    return mergeProps(ownProps, checkboxGroup?.getItemProps({ value: ownProps.value }) ?? {});
+  }, [ownProps, checkboxGroup]);
   const { getRootNode } = useEnvironmentContext();
   const { dir } = useLocaleContext();
   const initialContext = {

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardControlProps extends HTMLArkProps<'div'> {
+export type ClipboardControlBaseProps = {};
+export interface ClipboardControlProps extends HTMLArkProps<'div'>, ClipboardControlBaseProps {
 }
 export declare const ClipboardControl: ForwardRefExoticComponent<ClipboardControlProps & RefAttributes<HTMLDivElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardControlProps extends HTMLArkProps<'div'> {
+export type ClipboardControlBaseProps = {};
+export interface ClipboardControlProps extends HTMLArkProps<'div'>, ClipboardControlBaseProps {
 }
 export declare const ClipboardControl: ForwardRefExoticComponent<ClipboardControlProps & RefAttributes<HTMLDivElement>>;

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

@@ -1,7 +1,9 @@
 import { ReactNode, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { HTMLArkProps } from '../factory';
 
-export interface ClipboardIndicatorProps extends HTMLArkProps<'div'> {
+export interface ClipboardIndicatorBaseProps {
     copied?: ReactNode;
 }
+export interface ClipboardIndicatorProps extends HTMLArkProps<'div'>, ClipboardIndicatorBaseProps {
+}
 export declare const ClipboardIndicator: ForwardRefExoticComponent<ClipboardIndicatorProps & RefAttributes<HTMLDivElement>>;

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

@@ -1,7 +1,9 @@
 import { ReactNode, ForwardRefExoticComponent, RefAttributes } from 'react';
 import { HTMLArkProps } from '../factory';
 
-export interface ClipboardIndicatorProps extends HTMLArkProps<'div'> {
+export interface ClipboardIndicatorBaseProps {
     copied?: ReactNode;
 }
+export interface ClipboardIndicatorProps extends HTMLArkProps<'div'>, ClipboardIndicatorBaseProps {
+}
 export declare const ClipboardIndicator: ForwardRefExoticComponent<ClipboardIndicatorProps & RefAttributes<HTMLDivElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardInputProps extends HTMLArkProps<'input'> {
+export type ClipboardInputBaseProps = {};
+export interface ClipboardInputProps extends HTMLArkProps<'input'>, ClipboardInputBaseProps {
 }
 export declare const ClipboardInput: ForwardRefExoticComponent<ClipboardInputProps & RefAttributes<HTMLInputElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardInputProps extends HTMLArkProps<'input'> {
+export type ClipboardInputBaseProps = {};
+export interface ClipboardInputProps extends HTMLArkProps<'input'>, ClipboardInputBaseProps {
 }
 export declare const ClipboardInput: ForwardRefExoticComponent<ClipboardInputProps & RefAttributes<HTMLInputElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardLabelProps extends HTMLArkProps<'label'> {
+export type ClipboardLabelBaseProps = {};
+export interface ClipboardLabelProps extends HTMLArkProps<'label'>, ClipboardLabelBaseProps {
 }
 export declare const ClipboardLabel: ForwardRefExoticComponent<ClipboardLabelProps & RefAttributes<HTMLLabelElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardLabelProps extends HTMLArkProps<'label'> {
+export type ClipboardLabelBaseProps = {};
+export interface ClipboardLabelProps extends HTMLArkProps<'label'>, ClipboardLabelBaseProps {
 }
 export declare const ClipboardLabel: ForwardRefExoticComponent<ClipboardLabelProps & RefAttributes<HTMLLabelElement>>;

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

@@ -12,9 +12,10 @@ const useClipboardContext = require('./use-clipboard-context.cjs');
 
 const ClipboardRootProvider = react.forwardRef(
   (props, ref) => {
-    const [{ value: clipboard }, localProps] = createSplitProps.createSplitProps()(props, [
-      "value"
-    ]);
+    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 }) });
   }

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

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

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

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

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

@@ -8,9 +8,10 @@ import { ClipboardProvider } from './use-clipboard-context.js';
 
 const ClipboardRootProvider = forwardRef(
   (props, ref) => {
-    const [{ value: clipboard }, localProps] = createSplitProps()(props, [
-      "value"
-    ]);
+    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 }) });
   }

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

@@ -3,6 +3,8 @@ import { HTMLArkProps } from '../factory';
 import { UseClipboardProps } from './use-clipboard';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardRootProps extends Assign<HTMLArkProps<'div'>, UseClipboardProps> {
+export interface ClipboardRootBaseProps extends UseClipboardProps {
+}
+export interface ClipboardRootProps extends Assign<HTMLArkProps<'div'>, ClipboardRootBaseProps> {
 }
 export declare const ClipboardRoot: ForwardRefExoticComponent<ClipboardRootProps & RefAttributes<HTMLDivElement>>;

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

@@ -3,6 +3,8 @@ import { HTMLArkProps } from '../factory';
 import { UseClipboardProps } from './use-clipboard';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardRootProps extends Assign<HTMLArkProps<'div'>, UseClipboardProps> {
+export interface ClipboardRootBaseProps extends UseClipboardProps {
+}
+export interface ClipboardRootProps extends Assign<HTMLArkProps<'div'>, ClipboardRootBaseProps> {
 }
 export declare const ClipboardRoot: ForwardRefExoticComponent<ClipboardRootProps & RefAttributes<HTMLDivElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardTriggerProps extends HTMLArkProps<'button'> {
+export type ClipboardTriggerBaseProps = {};
+export interface ClipboardTriggerProps extends HTMLArkProps<'button'>, ClipboardTriggerBaseProps {
 }
 export declare const ClipboardTrigger: ForwardRefExoticComponent<ClipboardTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface ClipboardTriggerProps extends HTMLArkProps<'button'> {
+export type ClipboardTriggerBaseProps = {};
+export interface ClipboardTriggerProps extends HTMLArkProps<'button'>, ClipboardTriggerBaseProps {
 }
 export declare const ClipboardTrigger: ForwardRefExoticComponent<ClipboardTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -1,9 +1,9 @@
 export type { CopyStatusDetails } from '@zag-js/clipboard';
 export { ClipboardContext as Context, type ClipboardContextProps as ContextProps, } from './clipboard-context';
-export { ClipboardControl as Control, type ClipboardControlProps as ControlProps, } from './clipboard-control';
-export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as IndicatorProps, } from './clipboard-indicator';
-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';
+export { ClipboardControl as Control, type ClipboardControlProps as ControlProps, type ClipboardControlBaseProps as ControlBaseProps, } from './clipboard-control';
+export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as IndicatorProps, type ClipboardIndicatorBaseProps as IndicatorBaseProps, } from './clipboard-indicator';
+export { ClipboardInput as Input, type ClipboardInputProps as InputProps, type ClipboardInputBaseProps as InputBaseProps, } from './clipboard-input';
+export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps, type ClipboardLabelBaseProps as LabelBaseProps, } from './clipboard-label';
+export { ClipboardRoot as Root, type ClipboardRootProps as RootProps, type ClipboardRootBaseProps as RootBaseProps, } from './clipboard-root';
+export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, type ClipboardRootProviderBaseProps as RootProviderBaseProps, } from './clipboard-root-provider';
+export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, type ClipboardTriggerBaseProps as TriggerBaseProps, } from './clipboard-trigger';

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

@@ -1,9 +1,9 @@
 export type { CopyStatusDetails } from '@zag-js/clipboard';
 export { ClipboardContext as Context, type ClipboardContextProps as ContextProps, } from './clipboard-context';
-export { ClipboardControl as Control, type ClipboardControlProps as ControlProps, } from './clipboard-control';
-export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as IndicatorProps, } from './clipboard-indicator';
-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';
+export { ClipboardControl as Control, type ClipboardControlProps as ControlProps, type ClipboardControlBaseProps as ControlBaseProps, } from './clipboard-control';
+export { ClipboardIndicator as Indicator, type ClipboardIndicatorProps as IndicatorProps, type ClipboardIndicatorBaseProps as IndicatorBaseProps, } from './clipboard-indicator';
+export { ClipboardInput as Input, type ClipboardInputProps as InputProps, type ClipboardInputBaseProps as InputBaseProps, } from './clipboard-input';
+export { ClipboardLabel as Label, type ClipboardLabelProps as LabelProps, type ClipboardLabelBaseProps as LabelBaseProps, } from './clipboard-label';
+export { ClipboardRoot as Root, type ClipboardRootProps as RootProps, type ClipboardRootBaseProps as RootBaseProps, } from './clipboard-root';
+export { ClipboardRootProvider as RootProvider, type ClipboardRootProviderProps as RootProviderProps, type ClipboardRootProviderBaseProps as RootProviderBaseProps, } from './clipboard-root-provider';
+export { ClipboardTrigger as Trigger, type ClipboardTriggerProps as TriggerProps, type ClipboardTriggerBaseProps as TriggerBaseProps, } from './clipboard-trigger';

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

@@ -1,12 +1,12 @@
 export type { CopyStatusDetails as ClipboardCopyStatusDetails } from '@zag-js/clipboard';
-export { ClipboardContext, type ClipboardContextProps } from './clipboard-context';
-export { ClipboardControl, type ClipboardControlProps } from './clipboard-control';
-export { ClipboardIndicator, type ClipboardIndicatorProps } from './clipboard-indicator';
-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 { ClipboardContext, type ClipboardContextProps, } from './clipboard-context';
+export { ClipboardControl, type ClipboardControlProps, type ClipboardControlBaseProps, } from './clipboard-control';
+export { ClipboardIndicator, type ClipboardIndicatorProps, type ClipboardIndicatorBaseProps, } from './clipboard-indicator';
+export { ClipboardInput, type ClipboardInputProps, type ClipboardInputBaseProps, } from './clipboard-input';
+export { ClipboardLabel, type ClipboardLabelProps, type ClipboardLabelBaseProps, } from './clipboard-label';
+export { ClipboardRoot, type ClipboardRootProps, type ClipboardRootBaseProps, } from './clipboard-root';
+export { ClipboardRootProvider, type ClipboardRootProviderProps, type ClipboardRootProviderBaseProps, } from './clipboard-root-provider';
+export { ClipboardTrigger, type ClipboardTriggerProps, type ClipboardTriggerBaseProps, } from './clipboard-trigger';
 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

@@ -1,12 +1,12 @@
 export type { CopyStatusDetails as ClipboardCopyStatusDetails } from '@zag-js/clipboard';
-export { ClipboardContext, type ClipboardContextProps } from './clipboard-context';
-export { ClipboardControl, type ClipboardControlProps } from './clipboard-control';
-export { ClipboardIndicator, type ClipboardIndicatorProps } from './clipboard-indicator';
-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 { ClipboardContext, type ClipboardContextProps, } from './clipboard-context';
+export { ClipboardControl, type ClipboardControlProps, type ClipboardControlBaseProps, } from './clipboard-control';
+export { ClipboardIndicator, type ClipboardIndicatorProps, type ClipboardIndicatorBaseProps, } from './clipboard-indicator';
+export { ClipboardInput, type ClipboardInputProps, type ClipboardInputBaseProps, } from './clipboard-input';
+export { ClipboardLabel, type ClipboardLabelProps, type ClipboardLabelBaseProps, } from './clipboard-label';
+export { ClipboardRoot, type ClipboardRootProps, type ClipboardRootBaseProps, } from './clipboard-root';
+export { ClipboardRootProvider, type ClipboardRootProviderProps, type ClipboardRootProviderBaseProps, } from './clipboard-root-provider';
+export { ClipboardTrigger, type ClipboardTriggerProps, type ClipboardTriggerBaseProps, } from './clipboard-trigger';
 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/collapsible/collapsible-content.d.cts

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface CollapsibleContentProps extends HTMLArkProps<'div'> {
+export type CollapsibleContentBaseProps = {};
+export interface CollapsibleContentProps extends HTMLArkProps<'div'>, CollapsibleContentBaseProps {
 }
 export declare const CollapsibleContent: ForwardRefExoticComponent<CollapsibleContentProps & RefAttributes<HTMLDivElement>>;

package/dist/components/collapsible/collapsible-content.d.ts

@@ -1,6 +1,7 @@
 import { HTMLArkProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 
-export interface CollapsibleContentProps extends HTMLArkProps<'div'> {
+export type CollapsibleContentBaseProps = {};
+export interface CollapsibleContentProps extends HTMLArkProps<'div'>, CollapsibleContentBaseProps {
 }
 export declare const CollapsibleContent: ForwardRefExoticComponent<CollapsibleContentProps & RefAttributes<HTMLDivElement>>;

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

@@ -12,9 +12,7 @@ const useCollapsibleContext = require('./use-collapsible-context.cjs');
 
 const CollapsibleRootProvider = react.forwardRef(
   (props, ref) => {
-    const [{ value: collapsible }, localProps] = createSplitProps.createSplitProps()(props, [
-      "value"
-    ]);
+    const [{ value: collapsible }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
     const mergedProps = react$1.mergeProps(collapsible.getRootProps(), localProps);
     return /* @__PURE__ */ jsxRuntime.jsx(useCollapsibleContext.CollapsibleProvider, { value: collapsible, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
   }