@ark-ui/react 5.27.1 → 5.29.0

package/dist/components/color-picker/index.d.ts

@@ -1,5 +1,5 @@
 export { parse as parseColor } from '@zag-js/color-picker';
-export type { Color, ColorFormat as ColorPickerColorFormat, FormatChangeDetails as ColorPickerFormatChangeDetails, OpenChangeDetails as ColorPickerOpenChangeDetails, ValueChangeDetails as ColorPickerValueChangeDetails, } from '@zag-js/color-picker';
+export type { Color, ColorFormat as ColorPickerColorFormat, FocusOutsideEvent as ColorPickerFocusOutsideEvent, FormatChangeDetails as ColorPickerFormatChangeDetails, InteractOutsideEvent as ColorPickerInteractOutsideEvent, OpenChangeDetails as ColorPickerOpenChangeDetails, PointerDownOutsideEvent as ColorPickerPointerDownOutsideEvent, ValueChangeDetails as ColorPickerValueChangeDetails, } from '@zag-js/color-picker';
 export { ColorPickerArea, type ColorPickerAreaBaseProps, type ColorPickerAreaProps } from './color-picker-area';
 export { ColorPickerAreaBackground, type ColorPickerAreaBackgroundBaseProps, type ColorPickerAreaBackgroundProps, } from './color-picker-area-background';
 export { ColorPickerAreaThumb, type ColorPickerAreaThumbBaseProps, type ColorPickerAreaThumbProps, } from './color-picker-area-thumb';

package/dist/components/combobox/combobox-item-group.cjs

@@ -11,9 +11,10 @@ const factory = require('../factory.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
 const useComboboxItemGroupPropsContext = require('./use-combobox-item-group-props-context.cjs');
 
+const splitItemGroupProps = createSplitProps.createSplitProps();
 const ComboboxItemGroup = react.forwardRef((props, ref) => {
   const id = react.useId();
-  const [_itemGroupProps, localProps] = createSplitProps.createSplitProps()(props, ["id"]);
+  const [_itemGroupProps, localProps] = splitItemGroupProps(props, ["id"]);
   const itemGroupProps = { id, ..._itemGroupProps };
   const combobox = useComboboxContext.useComboboxContext();
   const mergedProps = react$1.mergeProps(combobox.getItemGroupProps(itemGroupProps), localProps);

package/dist/components/combobox/combobox-item-group.js

@@ -7,9 +7,10 @@ import { ark } from '../factory.js';
 import { useComboboxContext } from './use-combobox-context.js';
 import { ComboboxItemGroupPropsProvider } from './use-combobox-item-group-props-context.js';
 
+const splitItemGroupProps = createSplitProps();
 const ComboboxItemGroup = forwardRef((props, ref) => {
   const id = useId();
-  const [_itemGroupProps, localProps] = createSplitProps()(props, ["id"]);
+  const [_itemGroupProps, localProps] = splitItemGroupProps(props, ["id"]);
   const itemGroupProps = { id, ..._itemGroupProps };
   const combobox = useComboboxContext();
   const mergedProps = mergeProps(combobox.getItemGroupProps(itemGroupProps), localProps);

package/dist/components/combobox/combobox-item.cjs

@@ -12,8 +12,9 @@ const useComboboxContext = require('./use-combobox-context.cjs');
 const useComboboxItemContext = require('./use-combobox-item-context.cjs');
 const useComboboxItemPropsContext = require('./use-combobox-item-props-context.cjs');
 
+const splitItemProps = createSplitProps.createSplitProps();
 const ComboboxItem = react.forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps.createSplitProps()(props, ["item", "persistFocus"]);
+  const [itemProps, localProps] = splitItemProps(props, ["item", "persistFocus"]);
   const combobox = useComboboxContext.useComboboxContext();
   const mergedProps = react$1.mergeProps(combobox.getItemProps(itemProps), localProps);
   const itemState = combobox.getItemState(itemProps);

package/dist/components/combobox/combobox-item.js

@@ -8,8 +8,9 @@ import { useComboboxContext } from './use-combobox-context.js';
 import { ComboboxItemProvider } from './use-combobox-item-context.js';
 import { ComboboxItemPropsProvider } from './use-combobox-item-props-context.js';
 
+const splitItemProps = createSplitProps();
 const ComboboxItem = forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps()(props, ["item", "persistFocus"]);
+  const [itemProps, localProps] = splitItemProps(props, ["item", "persistFocus"]);
   const combobox = useComboboxContext();
   const mergedProps = mergeProps(combobox.getItemProps(itemProps), localProps);
   const itemState = combobox.getItemState(itemProps);

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

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
 
+const splitTriggerProps = createSplitProps.createSplitProps();
 const ComboboxTrigger = react.forwardRef((props, ref) => {
-  const [triggerProps, localProps] = createSplitProps.createSplitProps()(props, ["focusable"]);
+  const [triggerProps, localProps] = splitTriggerProps(props, ["focusable"]);
   const combobox = useComboboxContext.useComboboxContext();
   const mergedProps = react$1.mergeProps(combobox.getTriggerProps(triggerProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });

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

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useComboboxContext } from './use-combobox-context.js';
 
+const splitTriggerProps = createSplitProps();
 const ComboboxTrigger = forwardRef((props, ref) => {
-  const [triggerProps, localProps] = createSplitProps()(props, ["focusable"]);
+  const [triggerProps, localProps] = splitTriggerProps(props, ["focusable"]);
   const combobox = useComboboxContext();
   const mergedProps = mergeProps(combobox.getTriggerProps(triggerProps), localProps);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });

package/dist/components/combobox/combobox.anatomy.d.cts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const comboboxAnatomy: AnatomyInstance<"root" | "label" | "control" | "content" | "trigger" | "positioner" | "list" | "input" | "item" | "clearTrigger" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
+export declare const comboboxAnatomy: AnatomyInstance<"root" | "itemGroup" | "item" | "control" | "label" | "content" | "trigger" | "positioner" | "list" | "input" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/combobox/combobox.anatomy.d.ts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const comboboxAnatomy: AnatomyInstance<"root" | "label" | "control" | "content" | "trigger" | "positioner" | "list" | "input" | "item" | "clearTrigger" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
+export declare const comboboxAnatomy: AnatomyInstance<"root" | "itemGroup" | "item" | "control" | "label" | "content" | "trigger" | "positioner" | "list" | "input" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/combobox/combobox.d.cts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, InputValueChangeDetails, OpenChangeDetails, SelectionDetails, ValueChangeDetails, } from '@zag-js/combobox';
+export type { FocusOutsideEvent, HighlightChangeDetails, InputValueChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, SelectionDetails, ValueChangeDetails, } from '@zag-js/combobox';
 export type { CollectionItem } from '../collection';
 export { ComboboxClearTrigger as ClearTrigger, type ComboboxClearTriggerBaseProps as ClearTriggerBaseProps, type ComboboxClearTriggerProps as ClearTriggerProps, } from './combobox-clear-trigger';
 export { ComboboxContent as Content, type ComboboxContentBaseProps as ContentBaseProps, type ComboboxContentProps as ContentProps, } from './combobox-content';

package/dist/components/combobox/combobox.d.ts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, InputValueChangeDetails, OpenChangeDetails, SelectionDetails, ValueChangeDetails, } from '@zag-js/combobox';
+export type { FocusOutsideEvent, HighlightChangeDetails, InputValueChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, SelectionDetails, ValueChangeDetails, } from '@zag-js/combobox';
 export type { CollectionItem } from '../collection';
 export { ComboboxClearTrigger as ClearTrigger, type ComboboxClearTriggerBaseProps as ClearTriggerBaseProps, type ComboboxClearTriggerProps as ClearTriggerProps, } from './combobox-clear-trigger';
 export { ComboboxContent as Content, type ComboboxContentBaseProps as ContentBaseProps, type ComboboxContentProps as ContentProps, } from './combobox-content';

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

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as ComboboxHighlightChangeDetails, InputValueChangeDetails as ComboboxInputValueChangeDetails, OpenChangeDetails as ComboboxOpenChangeDetails, SelectionDetails as ComboboxSelectionDetails, ValueChangeDetails as ComboboxValueChangeDetails, } from '@zag-js/combobox';
+export type { FocusOutsideEvent as ComboboxFocusOutsideEvent, HighlightChangeDetails as ComboboxHighlightChangeDetails, InputValueChangeDetails as ComboboxInputValueChangeDetails, InteractOutsideEvent as ComboboxInteractOutsideEvent, OpenChangeDetails as ComboboxOpenChangeDetails, PointerDownOutsideEvent as ComboboxPointerDownOutsideEvent, SelectionDetails as ComboboxSelectionDetails, ValueChangeDetails as ComboboxValueChangeDetails, } from '@zag-js/combobox';
 export { createListCollection, useListCollection, type CollectionItem, type ListCollection, type UseListCollectionProps, } from '../collection';
 export { ComboboxClearTrigger, type ComboboxClearTriggerBaseProps, type ComboboxClearTriggerProps, } from './combobox-clear-trigger';
 export { ComboboxContent, type ComboboxContentBaseProps, type ComboboxContentProps } from './combobox-content';

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

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as ComboboxHighlightChangeDetails, InputValueChangeDetails as ComboboxInputValueChangeDetails, OpenChangeDetails as ComboboxOpenChangeDetails, SelectionDetails as ComboboxSelectionDetails, ValueChangeDetails as ComboboxValueChangeDetails, } from '@zag-js/combobox';
+export type { FocusOutsideEvent as ComboboxFocusOutsideEvent, HighlightChangeDetails as ComboboxHighlightChangeDetails, InputValueChangeDetails as ComboboxInputValueChangeDetails, InteractOutsideEvent as ComboboxInteractOutsideEvent, OpenChangeDetails as ComboboxOpenChangeDetails, PointerDownOutsideEvent as ComboboxPointerDownOutsideEvent, SelectionDetails as ComboboxSelectionDetails, ValueChangeDetails as ComboboxValueChangeDetails, } from '@zag-js/combobox';
 export { createListCollection, useListCollection, type CollectionItem, type ListCollection, type UseListCollectionProps, } from '../collection';
 export { ComboboxClearTrigger, type ComboboxClearTriggerBaseProps, type ComboboxClearTriggerProps, } from './combobox-clear-trigger';
 export { ComboboxContent, type ComboboxContentBaseProps, type ComboboxContentProps } from './combobox-content';

package/dist/components/date-picker/date-picker-input.cjs

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
 
+const splitInputProps = createSplitProps.createSplitProps();
 const DatePickerInput = react.forwardRef((props, ref) => {
-  const [inputProps, localProps] = createSplitProps.createSplitProps()(props, ["index", "fixOnBlur"]);
+  const [inputProps, localProps] = splitInputProps(props, ["index", "fixOnBlur"]);
   const datePicker = useDatePickerContext.useDatePickerContext();
   const mergedProps = react$1.mergeProps(datePicker.getInputProps(inputProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });

package/dist/components/date-picker/date-picker-input.js

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 
+const splitInputProps = createSplitProps();
 const DatePickerInput = forwardRef((props, ref) => {
-  const [inputProps, localProps] = createSplitProps()(props, ["index", "fixOnBlur"]);
+  const [inputProps, localProps] = splitInputProps(props, ["index", "fixOnBlur"]);
   const datePicker = useDatePickerContext();
   const mergedProps = mergeProps(datePicker.getInputProps(inputProps), localProps);
   return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });

package/dist/components/date-picker/date-picker-preset-trigger.cjs

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
 
+const splitPresetTriggerProps = createSplitProps.createSplitProps();
 const DatePickerPresetTrigger = react.forwardRef((props, ref) => {
-  const [presetTriggerProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [presetTriggerProps, localProps] = splitPresetTriggerProps(props, ["value"]);
   const datePicker = useDatePickerContext.useDatePickerContext();
   const mergedProps = react$1.mergeProps(datePicker.getPresetTriggerProps(presetTriggerProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });

package/dist/components/date-picker/date-picker-preset-trigger.js

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 
+const splitPresetTriggerProps = createSplitProps();
 const DatePickerPresetTrigger = forwardRef((props, ref) => {
-  const [presetTriggerProps, localProps] = createSplitProps()(props, ["value"]);
+  const [presetTriggerProps, localProps] = splitPresetTriggerProps(props, ["value"]);
   const datePicker = useDatePickerContext();
   const mergedProps = mergeProps(datePicker.getPresetTriggerProps(presetTriggerProps), localProps);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });

package/dist/components/date-picker/date-picker-root-provider.cjs

@@ -13,9 +13,10 @@ const usePresence = require('../presence/use-presence.cjs');
 const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
 
+const splitRootProviderProps = createSplitProps.createSplitProps();
 const DatePickerRootProvider = react.forwardRef((props, ref) => {
   const [presenceProps, datePickerProps] = splitPresenceProps.splitPresenceProps(props);
-  const [{ value: datePicker }, localProps] = createSplitProps.createSplitProps()(datePickerProps, ["value"]);
+  const [{ value: datePicker }, localProps] = splitRootProviderProps(datePickerProps, ["value"]);
   const presence = usePresence.usePresence(react$1.mergeProps({ present: datePicker.open }, presenceProps));
   const mergedProps = react$1.mergeProps(datePicker.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useDatePickerContext.DatePickerProvider, { value: datePicker, children: /* @__PURE__ */ jsxRuntime.jsx(usePresenceContext.PresenceProvider, { value: presence, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) }) });

package/dist/components/date-picker/date-picker-root-provider.js

@@ -9,9 +9,10 @@ import { usePresence } from '../presence/use-presence.js';
 import { PresenceProvider } from '../presence/use-presence-context.js';
 import { DatePickerProvider } from './use-date-picker-context.js';
 
+const splitRootProviderProps = createSplitProps();
 const DatePickerRootProvider = forwardRef((props, ref) => {
   const [presenceProps, datePickerProps] = splitPresenceProps(props);
-  const [{ value: datePicker }, localProps] = createSplitProps()(datePickerProps, ["value"]);
+  const [{ value: datePicker }, localProps] = splitRootProviderProps(datePickerProps, ["value"]);
   const presence = usePresence(mergeProps({ present: datePicker.open }, presenceProps));
   const mergedProps = mergeProps(datePicker.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(DatePickerProvider, { value: datePicker, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presence, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) }) });

package/dist/components/date-picker/date-picker-root.cjs

@@ -14,9 +14,10 @@ const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useDatePicker = require('./use-date-picker.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const DatePickerRoot = react.forwardRef((props, ref) => {
   const [presenceProps, datePickerProps] = splitPresenceProps.splitPresenceProps(props);
-  const [useDatePickerProps, localProps] = createSplitProps.createSplitProps()(datePickerProps, [
+  const [useDatePickerProps, localProps] = splitRootProps(datePickerProps, [
     "closeOnSelect",
     "defaultFocusedValue",
     "defaultOpen",

package/dist/components/date-picker/date-picker-root.js

@@ -10,9 +10,10 @@ import { PresenceProvider } from '../presence/use-presence-context.js';
 import { useDatePicker } from './use-date-picker.js';
 import { DatePickerProvider } from './use-date-picker-context.js';
 
+const splitRootProps = createSplitProps();
 const DatePickerRoot = forwardRef((props, ref) => {
   const [presenceProps, datePickerProps] = splitPresenceProps(props);
-  const [useDatePickerProps, localProps] = createSplitProps()(datePickerProps, [
+  const [useDatePickerProps, localProps] = splitRootProps(datePickerProps, [
     "closeOnSelect",
     "defaultFocusedValue",
     "defaultOpen",

package/dist/components/date-picker/date-picker-table-cell.cjs

@@ -12,13 +12,9 @@ const useDatePickerContext = require('./use-date-picker-context.cjs');
 const useDatePickerTableCellPropsContext = require('./use-date-picker-table-cell-props-context.cjs');
 const useDatePickerViewPropsContext = require('./use-date-picker-view-props-context.cjs');
 
+const splitTableCellProps = createSplitProps.createSplitProps();
 const DatePickerTableCell = react.forwardRef((props, ref) => {
-  const [cellProps, localProps] = createSplitProps.createSplitProps()(props, [
-    "disabled",
-    "value",
-    "visibleRange",
-    "columns"
-  ]);
+  const [cellProps, localProps] = splitTableCellProps(props, ["disabled", "value", "visibleRange", "columns"]);
   const datePicker = useDatePickerContext.useDatePickerContext();
   const viewProps = useDatePickerViewPropsContext.useDatePickerViewPropsContext();
   const tableCellProps = {

package/dist/components/date-picker/date-picker-table-cell.js

@@ -8,13 +8,9 @@ import { useDatePickerContext } from './use-date-picker-context.js';
 import { DatePickerTableCellPropsProvider } from './use-date-picker-table-cell-props-context.js';
 import { useDatePickerViewPropsContext } from './use-date-picker-view-props-context.js';
 
+const splitTableCellProps = createSplitProps();
 const DatePickerTableCell = forwardRef((props, ref) => {
-  const [cellProps, localProps] = createSplitProps()(props, [
-    "disabled",
-    "value",
-    "visibleRange",
-    "columns"
-  ]);
+  const [cellProps, localProps] = splitTableCellProps(props, ["disabled", "value", "visibleRange", "columns"]);
   const datePicker = useDatePickerContext();
   const viewProps = useDatePickerViewPropsContext();
   const tableCellProps = {

package/dist/components/date-picker/date-picker-table.cjs

@@ -12,8 +12,9 @@ const useDatePickerContext = require('./use-date-picker-context.cjs');
 const useDatePickerTablePropsContext = require('./use-date-picker-table-props-context.cjs');
 const useDatePickerViewPropsContext = require('./use-date-picker-view-props-context.cjs');
 
+const splitTableProps = createSplitProps.createSplitProps();
 const DatePickerTable = react.forwardRef((props, ref) => {
-  const [{ columns }, localProps] = createSplitProps.createSplitProps()(props, ["columns"]);
+  const [{ columns }, localProps] = splitTableProps(props, ["columns"]);
   const datePicker = useDatePickerContext.useDatePickerContext();
   const viewProps = useDatePickerViewPropsContext.useDatePickerViewPropsContext();
   const tableProps = { columns, id: react.useId(), ...viewProps };

package/dist/components/date-picker/date-picker-table.js

@@ -8,8 +8,9 @@ import { useDatePickerContext } from './use-date-picker-context.js';
 import { DatePickerTablePropsProvider } from './use-date-picker-table-props-context.js';
 import { useDatePickerViewPropsContext } from './use-date-picker-view-props-context.js';
 
+const splitTableProps = createSplitProps();
 const DatePickerTable = forwardRef((props, ref) => {
-  const [{ columns }, localProps] = createSplitProps()(props, ["columns"]);
+  const [{ columns }, localProps] = splitTableProps(props, ["columns"]);
   const datePicker = useDatePickerContext();
   const viewProps = useDatePickerViewPropsContext();
   const tableProps = { columns, id: useId(), ...viewProps };

package/dist/components/date-picker/date-picker-view.cjs

@@ -11,8 +11,9 @@ const datePicker_anatomy = require('./date-picker.anatomy.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
 const useDatePickerViewPropsContext = require('./use-date-picker-view-props-context.cjs');
 
+const splitViewProps = createSplitProps.createSplitProps();
 const DatePickerView = react.forwardRef((props, ref) => {
-  const [viewProps, localProps] = createSplitProps.createSplitProps()(props, ["view"]);
+  const [viewProps, localProps] = splitViewProps(props, ["view"]);
   const datePicker = useDatePickerContext.useDatePickerContext();
   return /* @__PURE__ */ jsxRuntime.jsx(useDatePickerViewPropsContext.DatePickerViewPropsProvider, { value: viewProps, children: /* @__PURE__ */ jsxRuntime.jsx(
     factory.ark.div,

package/dist/components/date-picker/date-picker-view.js

@@ -7,8 +7,9 @@ import { datePickerAnatomy } from './date-picker.anatomy.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 import { DatePickerViewPropsProvider } from './use-date-picker-view-props-context.js';
 
+const splitViewProps = createSplitProps();
 const DatePickerView = forwardRef((props, ref) => {
-  const [viewProps, localProps] = createSplitProps()(props, ["view"]);
+  const [viewProps, localProps] = splitViewProps(props, ["view"]);
   const datePicker = useDatePickerContext();
   return /* @__PURE__ */ jsx(DatePickerViewPropsProvider, { value: viewProps, children: /* @__PURE__ */ jsx(
     ark.div,

package/dist/components/date-picker/date-picker.anatomy.d.cts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const datePickerAnatomy: AnatomyInstance<"root" | "label" | "control" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "nextTrigger" | "presetTrigger" | "prevTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;

package/dist/components/date-picker/date-picker.anatomy.d.ts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const datePickerAnatomy: AnatomyInstance<"root" | "label" | "control" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "nextTrigger" | "presetTrigger" | "prevTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;

package/dist/components/dialog/dialog.d.cts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/dialog';
+export type { FocusOutsideEvent, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, } from '@zag-js/dialog';
 export { DialogBackdrop as Backdrop, type DialogBackdropBaseProps as BackdropBaseProps, type DialogBackdropProps as BackdropProps, } from './dialog-backdrop';
 export { DialogCloseTrigger as CloseTrigger, type DialogCloseTriggerBaseProps as CloseTriggerBaseProps, type DialogCloseTriggerProps as CloseTriggerProps, } from './dialog-close-trigger';
 export { DialogContent as Content, type DialogContentBaseProps as ContentBaseProps, type DialogContentProps as ContentProps, } from './dialog-content';

package/dist/components/dialog/dialog.d.ts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/dialog';
+export type { FocusOutsideEvent, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, } from '@zag-js/dialog';
 export { DialogBackdrop as Backdrop, type DialogBackdropBaseProps as BackdropBaseProps, type DialogBackdropProps as BackdropProps, } from './dialog-backdrop';
 export { DialogCloseTrigger as CloseTrigger, type DialogCloseTriggerBaseProps as CloseTriggerBaseProps, type DialogCloseTriggerProps as CloseTriggerProps, } from './dialog-close-trigger';
 export { DialogContent as Content, type DialogContentBaseProps as ContentBaseProps, type DialogContentProps as ContentProps, } from './dialog-content';

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

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as DialogOpenChangeDetails } from '@zag-js/dialog';
+export type { FocusOutsideEvent as DialogFocusOutsideEvent, InteractOutsideEvent as DialogInteractOutsideEvent, OpenChangeDetails as DialogOpenChangeDetails, PointerDownOutsideEvent as DialogPointerDownOutsideEvent, } from '@zag-js/dialog';
 export { DialogBackdrop, type DialogBackdropBaseProps, type DialogBackdropProps } from './dialog-backdrop';
 export { DialogCloseTrigger, type DialogCloseTriggerBaseProps, type DialogCloseTriggerProps, } from './dialog-close-trigger';
 export { DialogContent, type DialogContentBaseProps, type DialogContentProps } from './dialog-content';

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

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as DialogOpenChangeDetails } from '@zag-js/dialog';
+export type { FocusOutsideEvent as DialogFocusOutsideEvent, InteractOutsideEvent as DialogInteractOutsideEvent, OpenChangeDetails as DialogOpenChangeDetails, PointerDownOutsideEvent as DialogPointerDownOutsideEvent, } from '@zag-js/dialog';
 export { DialogBackdrop, type DialogBackdropBaseProps, type DialogBackdropProps } from './dialog-backdrop';
 export { DialogCloseTrigger, type DialogCloseTriggerBaseProps, type DialogCloseTriggerProps, } from './dialog-close-trigger';
 export { DialogContent, type DialogContentBaseProps, type DialogContentProps } from './dialog-content';

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

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useEditableContext = require('./use-editable-context.cjs');
 
+const splitRootProviderProps = createSplitProps.createSplitProps();
 const EditableRootProvider = react.forwardRef((props, ref) => {
-  const [{ value: editable }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [{ value: editable }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = react$1.mergeProps(editable.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useEditableContext.EditableProvider, { value: editable, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });

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

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { EditableProvider } from './use-editable-context.js';
 
+const splitRootProviderProps = createSplitProps();
 const EditableRootProvider = forwardRef((props, ref) => {
-  const [{ value: editable }, localProps] = createSplitProps()(props, ["value"]);
+  const [{ value: editable }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = mergeProps(editable.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(EditableProvider, { value: editable, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });

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

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useEditable = require('./use-editable.cjs');
 const useEditableContext = require('./use-editable-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const EditableRoot = react.forwardRef((props, ref) => {
-  const [useEditableProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useEditableProps, localProps] = splitRootProps(props, [
     "activationMode",
     "autoResize",
     "defaultEdit",

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

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useEditable } from './use-editable.js';
 import { EditableProvider } from './use-editable-context.js';
 
+const splitRootProps = createSplitProps();
 const EditableRoot = forwardRef((props, ref) => {
-  const [useEditableProps, localProps] = createSplitProps()(props, [
+  const [useEditableProps, localProps] = splitRootProps(props, [
     "activationMode",
     "autoResize",
     "defaultEdit",

package/dist/components/editable/editable.d.cts

@@ -1,4 +1,4 @@
-export type { ValueChangeDetails } from '@zag-js/editable';
+export type { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent, ValueChangeDetails, } from '@zag-js/editable';
 export { EditableArea as Area, type EditableAreaBaseProps as AreaBaseProps, type EditableAreaProps as AreaProps, } from './editable-area';
 export { EditableCancelTrigger as CancelTrigger, type EditableCancelTriggerBaseProps as CancelTriggerBaseProps, type EditableCancelTriggerProps as CancelTriggerProps, } from './editable-cancel-trigger';
 export { EditableContext as Context, type EditableContextProps as ContextProps } from './editable-context';

package/dist/components/editable/editable.d.ts

@@ -1,4 +1,4 @@
-export type { ValueChangeDetails } from '@zag-js/editable';
+export type { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent, ValueChangeDetails, } from '@zag-js/editable';
 export { EditableArea as Area, type EditableAreaBaseProps as AreaBaseProps, type EditableAreaProps as AreaProps, } from './editable-area';
 export { EditableCancelTrigger as CancelTrigger, type EditableCancelTriggerBaseProps as CancelTriggerBaseProps, type EditableCancelTriggerProps as CancelTriggerProps, } from './editable-cancel-trigger';
 export { EditableContext as Context, type EditableContextProps as ContextProps } from './editable-context';

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

@@ -1,4 +1,4 @@
-export type { EditChangeDetails as EditableEditChangeDetails, ValueChangeDetails as EditableValueChangeDetails, } from '@zag-js/editable';
+export type { EditChangeDetails as EditableEditChangeDetails, FocusOutsideEvent as EditableFocusOutsideEvent, InteractOutsideEvent as EditableInteractOutsideEvent, PointerDownOutsideEvent as EditablePointerDownOutsideEvent, ValueChangeDetails as EditableValueChangeDetails, } from '@zag-js/editable';
 export { EditableArea, type EditableAreaBaseProps, type EditableAreaProps } from './editable-area';
 export { EditableCancelTrigger, type EditableCancelTriggerBaseProps, type EditableCancelTriggerProps, } from './editable-cancel-trigger';
 export { EditableContext, type EditableContextProps } from './editable-context';

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

@@ -1,4 +1,4 @@
-export type { EditChangeDetails as EditableEditChangeDetails, ValueChangeDetails as EditableValueChangeDetails, } from '@zag-js/editable';
+export type { EditChangeDetails as EditableEditChangeDetails, FocusOutsideEvent as EditableFocusOutsideEvent, InteractOutsideEvent as EditableInteractOutsideEvent, PointerDownOutsideEvent as EditablePointerDownOutsideEvent, ValueChangeDetails as EditableValueChangeDetails, } from '@zag-js/editable';
 export { EditableArea, type EditableAreaBaseProps, type EditableAreaProps } from './editable-area';
 export { EditableCancelTrigger, type EditableCancelTriggerBaseProps, type EditableCancelTriggerProps, } from './editable-cancel-trigger';
 export { EditableContext, type EditableContextProps } from './editable-context';

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

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useFieldContext = require('./use-field-context.cjs');
 
+const splitRootProviderProps = createSplitProps.createSplitProps();
 const FieldRootProvider = react.forwardRef((props, ref) => {
-  const [{ value: field }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [{ value: field }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = react$1.mergeProps(field.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useFieldContext.FieldProvider, { value: field, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });

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

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { FieldProvider } from './use-field-context.js';
 
+const splitRootProviderProps = createSplitProps();
 const FieldRootProvider = forwardRef((props, ref) => {
-  const [{ value: field }, localProps] = createSplitProps()(props, ["value"]);
+  const [{ value: field }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = mergeProps(field.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(FieldProvider, { value: field, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });

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

@@ -12,8 +12,9 @@ const factory = require('../factory.cjs');
 const useField = require('./use-field.cjs');
 const useFieldContext = require('./use-field-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const FieldRoot = react.forwardRef((props, ref) => {
-  const [useFieldProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useFieldProps, localProps] = splitRootProps(props, [
     "id",
     "ids",
     "disabled",

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

@@ -8,8 +8,9 @@ import { ark } from '../factory.js';
 import { useField } from './use-field.js';
 import { FieldProvider } from './use-field-context.js';
 
+const splitRootProps = createSplitProps();
 const FieldRoot = forwardRef((props, ref) => {
-  const [useFieldProps, localProps] = createSplitProps()(props, [
+  const [useFieldProps, localProps] = splitRootProps(props, [
     "id",
     "ids",
     "disabled",

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

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useFieldsetContext = require('./use-fieldset-context.cjs');
 
+const splitRootProviderProps = createSplitProps.createSplitProps();
 const FieldsetRootProvider = react.forwardRef((props, ref) => {
-  const [{ value: fieldset }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [{ value: fieldset }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = react$1.mergeProps(fieldset.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useFieldsetContext.FieldsetProvider, { value: fieldset, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.fieldset, { ...mergedProps, ref }) });
 });

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

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { FieldsetProvider } from './use-fieldset-context.js';
 
+const splitRootProviderProps = createSplitProps();
 const FieldsetRootProvider = forwardRef((props, ref) => {
-  const [{ value: fieldset }, localProps] = createSplitProps()(props, ["value"]);
+  const [{ value: fieldset }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = mergeProps(fieldset.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(FieldsetProvider, { value: fieldset, children: /* @__PURE__ */ jsx(ark.fieldset, { ...mergedProps, ref }) });
 });

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

@@ -12,8 +12,9 @@ const factory = require('../factory.cjs');
 const useFieldset = require('./use-fieldset.cjs');
 const useFieldsetContext = require('./use-fieldset-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const FieldsetRoot = react.forwardRef((props, ref) => {
-  const [useFieldsetProps, localProps] = createSplitProps.createSplitProps()(props, ["id", "disabled", "invalid"]);
+  const [useFieldsetProps, localProps] = splitRootProps(props, ["id", "disabled", "invalid"]);
   const fieldset = useFieldset.useFieldset(useFieldsetProps);
   const mergedProps = react$1.mergeProps(fieldset.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useFieldsetContext.FieldsetProvider, { value: fieldset, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.fieldset, { ...mergedProps, ref: composeRefs.composeRefs(ref, fieldset.refs.rootRef) }) });

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

@@ -8,8 +8,9 @@ import { ark } from '../factory.js';
 import { useFieldset } from './use-fieldset.js';
 import { FieldsetProvider } from './use-fieldset-context.js';
 
+const splitRootProps = createSplitProps();
 const FieldsetRoot = forwardRef((props, ref) => {
-  const [useFieldsetProps, localProps] = createSplitProps()(props, ["id", "disabled", "invalid"]);
+  const [useFieldsetProps, localProps] = splitRootProps(props, ["id", "disabled", "invalid"]);
   const fieldset = useFieldset(useFieldsetProps);
   const mergedProps = mergeProps(fieldset.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(FieldsetProvider, { value: fieldset, children: /* @__PURE__ */ jsx(ark.fieldset, { ...mergedProps, ref: composeRefs(ref, fieldset.refs.rootRef) }) });

package/dist/components/file-upload/file-upload-dropzone.cjs

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useFileUploadContext = require('./use-file-upload-context.cjs');
 
+const splitDropzoneProps = createSplitProps.createSplitProps();
 const FileUploadDropzone = react.forwardRef((props, ref) => {
-  const [dropzoneProps, localProps] = createSplitProps.createSplitProps()(props, ["disableClick"]);
+  const [dropzoneProps, localProps] = splitDropzoneProps(props, ["disableClick"]);
   const fileUpload = useFileUploadContext.useFileUploadContext();
   const mergedProps = react$1.mergeProps(fileUpload.getDropzoneProps(dropzoneProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });

package/dist/components/file-upload/file-upload-dropzone.js

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useFileUploadContext } from './use-file-upload-context.js';
 
+const splitDropzoneProps = createSplitProps();
 const FileUploadDropzone = forwardRef((props, ref) => {
-  const [dropzoneProps, localProps] = createSplitProps()(props, ["disableClick"]);
+  const [dropzoneProps, localProps] = splitDropzoneProps(props, ["disableClick"]);
   const fileUpload = useFileUploadContext();
   const mergedProps = mergeProps(fileUpload.getDropzoneProps(dropzoneProps), localProps);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });

package/dist/components/file-upload/file-upload-item-group.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useFileUploadContext = require('./use-file-upload-context.cjs');
 const useFileUploadItemGroupPropsContext = require('./use-file-upload-item-group-props-context.cjs');
 
+const splitItemGroupProps = createSplitProps.createSplitProps();
 const FileUploadItemGroup = react.forwardRef((props, ref) => {
-  const [itemGroupProps, localProps] = createSplitProps.createSplitProps()(props, ["type"]);
+  const [itemGroupProps, localProps] = splitItemGroupProps(props, ["type"]);
   const fileUpload = useFileUploadContext.useFileUploadContext();
   const mergedProps = react$1.mergeProps(fileUpload.getItemGroupProps(itemGroupProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useFileUploadItemGroupPropsContext.FileUploadItemGroupPropsProvider, { value: itemGroupProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.ul, { ...mergedProps, ref }) });