@ark-ui/react 5.28.0 → 5.29.0

package/dist/components/rating-group/rating-group-root.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useRatingGroup = require('./use-rating-group.cjs');
 const useRatingGroupContext = require('./use-rating-group-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const RatingGroupRoot = react.forwardRef((props, ref) => {
-  const [useRatingProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useRatingProps, localProps] = splitRootProps(props, [
     "allowHalf",
     "autoFocus",
     "count",

package/dist/components/rating-group/rating-group-root.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useRatingGroup } from './use-rating-group.js';
 import { RatingGroupProvider } from './use-rating-group-context.js';
 
+const splitRootProps = createSplitProps();
 const RatingGroupRoot = forwardRef((props, ref) => {
-  const [useRatingProps, localProps] = createSplitProps()(props, [
+  const [useRatingProps, localProps] = splitRootProps(props, [
     "allowHalf",
     "autoFocus",
     "count",

package/dist/components/scroll-area/scroll-area-root-provider.cjs

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

package/dist/components/scroll-area/scroll-area-root-provider.js

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

package/dist/components/scroll-area/scroll-area-root.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useScrollArea = require('./use-scroll-area.cjs');
 const useScrollAreaContext = require('./use-scroll-area-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const ScrollAreaRoot = react.forwardRef((props, ref) => {
-  const [useScrollAreaProps, localProps] = createSplitProps.createSplitProps()(props, ["id", "ids"]);
+  const [useScrollAreaProps, localProps] = splitRootProps(props, ["id", "ids"]);
   const scrollArea = useScrollArea.useScrollArea(useScrollAreaProps);
   const mergedProps = react$1.mergeProps(scrollArea.getRootProps(), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useScrollAreaContext.ScrollAreaProvider, { value: scrollArea, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });

package/dist/components/scroll-area/scroll-area-root.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useScrollArea } from './use-scroll-area.js';
 import { ScrollAreaProvider } from './use-scroll-area-context.js';
 
+const splitRootProps = createSplitProps();
 const ScrollAreaRoot = forwardRef((props, ref) => {
-  const [useScrollAreaProps, localProps] = createSplitProps()(props, ["id", "ids"]);
+  const [useScrollAreaProps, localProps] = splitRootProps(props, ["id", "ids"]);
   const scrollArea = useScrollArea(useScrollAreaProps);
   const mergedProps = mergeProps(scrollArea.getRootProps(), localProps);
   return /* @__PURE__ */ jsx(ScrollAreaProvider, { value: scrollArea, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });

package/dist/components/scroll-area/scroll-area-scrollbar.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useScrollAreaContext = require('./use-scroll-area-context.cjs');
 const useScrollAreaScrollbarContext = require('./use-scroll-area-scrollbar-context.cjs');
 
+const splitScrollbarProps = createSplitProps.createSplitProps();
 const ScrollAreaScrollbar = react.forwardRef((props, ref) => {
-  const [scrollbarProps, localProps] = createSplitProps.createSplitProps()(props, ["orientation"]);
+  const [scrollbarProps, localProps] = splitScrollbarProps(props, ["orientation"]);
   const scrollAreaApi = useScrollAreaContext.useScrollAreaContext();
   const mergedProps = react$1.mergeProps(scrollAreaApi.getScrollbarProps(scrollbarProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useScrollAreaScrollbarContext.ScrollAreaScrollbarProvider, { value: scrollbarProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });

package/dist/components/scroll-area/scroll-area-scrollbar.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useScrollAreaContext } from './use-scroll-area-context.js';
 import { ScrollAreaScrollbarProvider } from './use-scroll-area-scrollbar-context.js';
 
+const splitScrollbarProps = createSplitProps();
 const ScrollAreaScrollbar = forwardRef((props, ref) => {
-  const [scrollbarProps, localProps] = createSplitProps()(props, ["orientation"]);
+  const [scrollbarProps, localProps] = splitScrollbarProps(props, ["orientation"]);
   const scrollAreaApi = useScrollAreaContext();
   const mergedProps = mergeProps(scrollAreaApi.getScrollbarProps(scrollbarProps), localProps);
   return /* @__PURE__ */ jsx(ScrollAreaScrollbarProvider, { value: scrollbarProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });

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

@@ -13,8 +13,9 @@ const useSegmentGroupContext = require('./use-segment-group-context.cjs');
 const useSegmentGroupItemContext = require('./use-segment-group-item-context.cjs');
 const useSegmentGroupItemPropsContext = require('./use-segment-group-item-props-context.cjs');
 
+const splitItemProps = createSplitProps.createSplitProps();
 const SegmentGroupItem = react.forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps.createSplitProps()(props, ["value", "disabled", "invalid"]);
+  const [itemProps, localProps] = splitItemProps(props, ["value", "disabled", "invalid"]);
   const segmentGroup = useSegmentGroupContext.useSegmentGroupContext();
   const mergedProps = react$1.mergeProps(
     segmentGroup.getItemProps(itemProps),

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

@@ -9,8 +9,9 @@ import { useSegmentGroupContext } from './use-segment-group-context.js';
 import { SegmentGroupItemProvider } from './use-segment-group-item-context.js';
 import { SegmentGroupItemPropsProvider } from './use-segment-group-item-props-context.js';
 
+const splitItemProps = createSplitProps();
 const SegmentGroupItem = forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps()(props, ["value", "disabled", "invalid"]);
+  const [itemProps, localProps] = splitItemProps(props, ["value", "disabled", "invalid"]);
   const segmentGroup = useSegmentGroupContext();
   const mergedProps = mergeProps(
     segmentGroup.getItemProps(itemProps),

package/dist/components/segment-group/segment-group-root-provider.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const segmentGroup_anatomy = require('./segment-group.anatomy.cjs');
 const useSegmentGroupContext = require('./use-segment-group-context.cjs');
 
+const splitRootProviderProps = createSplitProps.createSplitProps();
 const SegmentGroupRootProvider = react.forwardRef((props, ref) => {
-  const [{ value: segmentGroup }, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [{ value: segmentGroup }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = react$1.mergeProps(segmentGroup.getRootProps(), segmentGroup_anatomy.parts.root.attrs, localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useSegmentGroupContext.SegmentGroupProvider, { value: segmentGroup, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
 });

package/dist/components/segment-group/segment-group-root-provider.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { parts } from './segment-group.anatomy.js';
 import { SegmentGroupProvider } from './use-segment-group-context.js';
 
+const splitRootProviderProps = createSplitProps();
 const SegmentGroupRootProvider = forwardRef((props, ref) => {
-  const [{ value: segmentGroup }, localProps] = createSplitProps()(props, ["value"]);
+  const [{ value: segmentGroup }, localProps] = splitRootProviderProps(props, ["value"]);
   const mergedProps = mergeProps(segmentGroup.getRootProps(), parts.root.attrs, localProps);
   return /* @__PURE__ */ jsx(SegmentGroupProvider, { value: segmentGroup, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });

package/dist/components/segment-group/segment-group-root.cjs

@@ -12,8 +12,9 @@ const segmentGroup_anatomy = require('./segment-group.anatomy.cjs');
 const useSegmentGroup = require('./use-segment-group.cjs');
 const useSegmentGroupContext = require('./use-segment-group-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const SegmentGroupRoot = react.forwardRef((props, ref) => {
-  const [useSegmentGroupProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useSegmentGroupProps, localProps] = splitRootProps(props, [
     "defaultValue",
     "disabled",
     "form",

package/dist/components/segment-group/segment-group-root.js

@@ -8,8 +8,9 @@ import { parts } from './segment-group.anatomy.js';
 import { useSegmentGroup } from './use-segment-group.js';
 import { SegmentGroupProvider } from './use-segment-group-context.js';
 
+const splitRootProps = createSplitProps();
 const SegmentGroupRoot = forwardRef((props, ref) => {
-  const [useSegmentGroupProps, localProps] = createSplitProps()(props, [
+  const [useSegmentGroupProps, localProps] = splitRootProps(props, [
     "defaultValue",
     "disabled",
     "form",

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

@@ -11,9 +11,10 @@ const factory = require('../factory.cjs');
 const useSelectContext = require('./use-select-context.cjs');
 const useSelectItemGroupProps = require('./use-select-item-group-props.cjs');
 
+const splitItemGroupProps = createSplitProps.createSplitProps();
 const SelectItemGroup = 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 select = useSelectContext.useSelectContext();
   const mergedProps = react$1.mergeProps(select.getItemGroupProps(itemGroupProps), localProps);

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

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

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

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

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

@@ -8,8 +8,9 @@ import { useSelectContext } from './use-select-context.js';
 import { SelectItemProvider } from './use-select-item-context.js';
 import { SelectItemPropsProvider } from './use-select-item-props-context.js';
 
+const splitItemProps = createSplitProps();
 const SelectItem = forwardRef((props, ref) => {
-  const [itemProps, localProps] = createSplitProps()(props, ["item", "persistFocus"]);
+  const [itemProps, localProps] = splitItemProps(props, ["item", "persistFocus"]);
   const select = useSelectContext();
   const mergedProps = mergeProps(select.getItemProps(itemProps), localProps);
   const itemState = select.getItemState(itemProps);

package/dist/components/signature-pad/signature-pad-hidden-input.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useFieldContext = require('../field/use-field-context.cjs');
 const useSignaturePadContext = require('./use-signature-pad-context.cjs');
 
+const splitHiddenInputProps = createSplitProps.createSplitProps();
 const SignaturePadHiddenInput = react.forwardRef((props, ref) => {
-  const [hiddenInputProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [hiddenInputProps, localProps] = splitHiddenInputProps(props, ["value"]);
   const signaturePad = useSignaturePadContext.useSignaturePadContext();
   const mergedProps = react$1.mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
   const field = useFieldContext.useFieldContext();

package/dist/components/signature-pad/signature-pad-hidden-input.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useFieldContext } from '../field/use-field-context.js';
 import { useSignaturePadContext } from './use-signature-pad-context.js';
 
+const splitHiddenInputProps = createSplitProps();
 const SignaturePadHiddenInput = forwardRef((props, ref) => {
-  const [hiddenInputProps, localProps] = createSplitProps()(props, ["value"]);
+  const [hiddenInputProps, localProps] = splitHiddenInputProps(props, ["value"]);
   const signaturePad = useSignaturePadContext();
   const mergedProps = mergeProps(signaturePad.getHiddenInputProps(hiddenInputProps), localProps);
   const field = useFieldContext();

package/dist/components/signature-pad/signature-pad-root-provider.cjs

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

package/dist/components/signature-pad/signature-pad-root-provider.js

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

package/dist/components/signature-pad/signature-pad-root.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useSignaturePad = require('./use-signature-pad.cjs');
 const useSignaturePadContext = require('./use-signature-pad-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const SignaturePadRoot = react.forwardRef((props, ref) => {
-  const [useSignaturePadProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useSignaturePadProps, localProps] = splitRootProps(props, [
     "id",
     "ids",
     "defaultPaths",

package/dist/components/signature-pad/signature-pad-root.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useSignaturePad } from './use-signature-pad.js';
 import { SignaturePadProvider } from './use-signature-pad-context.js';
 
+const splitRootProps = createSplitProps();
 const SignaturePadRoot = forwardRef((props, ref) => {
-  const [useSignaturePadProps, localProps] = createSplitProps()(props, [
+  const [useSignaturePadProps, localProps] = splitRootProps(props, [
     "id",
     "ids",
     "defaultPaths",

package/dist/components/slider/slider-marker.cjs

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useSliderContext = require('./use-slider-context.cjs');
 
+const splitMarkerProps = createSplitProps.createSplitProps();
 const SliderMarker = react.forwardRef((props, ref) => {
-  const [markerProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [markerProps, localProps] = splitMarkerProps(props, ["value"]);
   const slider = useSliderContext.useSliderContext();
   const mergedProps = react$1.mergeProps(slider.getMarkerProps(markerProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref });

package/dist/components/slider/slider-marker.js

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useSliderContext } from './use-slider-context.js';
 
+const splitMarkerProps = createSplitProps();
 const SliderMarker = forwardRef((props, ref) => {
-  const [markerProps, localProps] = createSplitProps()(props, ["value"]);
+  const [markerProps, localProps] = splitMarkerProps(props, ["value"]);
   const slider = useSliderContext();
   const mergedProps = mergeProps(slider.getMarkerProps(markerProps), localProps);
   return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref });

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

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

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

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

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

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useSlider = require('./use-slider.cjs');
 const useSliderContext = require('./use-slider-context.cjs');
 
+const splitRootProps = createSplitProps.createSplitProps();
 const SliderRoot = react.forwardRef((props, ref) => {
-  const [useSliderProps, localProps] = createSplitProps.createSplitProps()(props, [
+  const [useSliderProps, localProps] = splitRootProps(props, [
     "aria-label",
     "aria-labelledby",
     "defaultValue",

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

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useSlider } from './use-slider.js';
 import { SliderProvider } from './use-slider-context.js';
 
+const splitRootProps = createSplitProps();
 const SliderRoot = forwardRef((props, ref) => {
-  const [useSliderProps, localProps] = createSplitProps()(props, [
+  const [useSliderProps, localProps] = splitRootProps(props, [
     "aria-label",
     "aria-labelledby",
     "defaultValue",

package/dist/components/slider/slider-thumb.cjs

@@ -11,8 +11,9 @@ const factory = require('../factory.cjs');
 const useSliderContext = require('./use-slider-context.cjs');
 const useSliderThumbPropsContext = require('./use-slider-thumb-props-context.cjs');
 
+const splitThumbProps = createSplitProps.createSplitProps();
 const SliderThumb = react.forwardRef((props, ref) => {
-  const [thumbProps, localProps] = createSplitProps.createSplitProps()(props, ["index", "name"]);
+  const [thumbProps, localProps] = splitThumbProps(props, ["index", "name"]);
   const slider = useSliderContext.useSliderContext();
   const mergedProps = react$1.mergeProps(slider.getThumbProps(thumbProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(useSliderThumbPropsContext.SliderThumbPropsProvider, { value: thumbProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });

package/dist/components/slider/slider-thumb.js

@@ -7,8 +7,9 @@ import { ark } from '../factory.js';
 import { useSliderContext } from './use-slider-context.js';
 import { SliderThumbPropsProvider } from './use-slider-thumb-props-context.js';
 
+const splitThumbProps = createSplitProps();
 const SliderThumb = forwardRef((props, ref) => {
-  const [thumbProps, localProps] = createSplitProps()(props, ["index", "name"]);
+  const [thumbProps, localProps] = splitThumbProps(props, ["index", "name"]);
   const slider = useSliderContext();
   const mergedProps = mergeProps(slider.getThumbProps(thumbProps), localProps);
   return /* @__PURE__ */ jsx(SliderThumbPropsProvider, { value: thumbProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });

package/dist/components/splitter/index.cjs

@@ -2,27 +2,33 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
+const splitter = require('@zag-js/splitter');
 const splitterContext = require('./splitter-context.cjs');
 const splitterPanel = require('./splitter-panel.cjs');
 const splitterResizeTrigger = require('./splitter-resize-trigger.cjs');
+const splitterResizeTriggerIndicator = require('./splitter-resize-trigger-indicator.cjs');
 const splitterRoot = require('./splitter-root.cjs');
 const splitterRootProvider = require('./splitter-root-provider.cjs');
 const useSplitter = require('./use-splitter.cjs');
 const useSplitterContext = require('./use-splitter-context.cjs');
 const splitter$1 = require('./splitter.cjs');
-const splitter = require('@zag-js/splitter');
 
 
 
+Object.defineProperty(exports, "getSplitterLayout", {
+  enumerable: true,
+  get: () => splitter.layout
+});
+Object.defineProperty(exports, "splitterAnatomy", {
+  enumerable: true,
+  get: () => splitter.anatomy
+});
 exports.SplitterContext = splitterContext.SplitterContext;
 exports.SplitterPanel = splitterPanel.SplitterPanel;
 exports.SplitterResizeTrigger = splitterResizeTrigger.SplitterResizeTrigger;
+exports.SplitterResizeTriggerIndicator = splitterResizeTriggerIndicator.SplitterResizeTriggerIndicator;
 exports.SplitterRoot = splitterRoot.SplitterRoot;
 exports.SplitterRootProvider = splitterRootProvider.SplitterRootProvider;
 exports.useSplitter = useSplitter.useSplitter;
 exports.useSplitterContext = useSplitterContext.useSplitterContext;
 exports.Splitter = splitter$1;
-Object.defineProperty(exports, "splitterAnatomy", {
-  enumerable: true,
-  get: () => splitter.anatomy
-});

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

@@ -1,7 +1,9 @@
+export { layout as getSplitterLayout } from '@zag-js/splitter';
 export type { ExpandCollapseDetails as SplitterExpandCollapseDetails, PanelData as SplitterPanelData, ResizeDetails as SplitterResizeDetails, ResizeEndDetails as SplitterResizeEndDetails, } from '@zag-js/splitter';
 export { SplitterContext, type SplitterContextProps } from './splitter-context';
 export { SplitterPanel, type SplitterPanelBaseProps, type SplitterPanelProps } from './splitter-panel';
 export { SplitterResizeTrigger, type SplitterResizeTriggerBaseProps, type SplitterResizeTriggerProps, } from './splitter-resize-trigger';
+export { SplitterResizeTriggerIndicator, type SplitterResizeTriggerIndicatorBaseProps, type SplitterResizeTriggerIndicatorProps, } from './splitter-resize-trigger-indicator';
 export { SplitterRoot, type SplitterRootBaseProps, type SplitterRootProps } from './splitter-root';
 export { SplitterRootProvider, type SplitterRootProviderBaseProps, type SplitterRootProviderProps, } from './splitter-root-provider';
 export { splitterAnatomy } from './splitter.anatomy';

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

@@ -1,7 +1,9 @@
+export { layout as getSplitterLayout } from '@zag-js/splitter';
 export type { ExpandCollapseDetails as SplitterExpandCollapseDetails, PanelData as SplitterPanelData, ResizeDetails as SplitterResizeDetails, ResizeEndDetails as SplitterResizeEndDetails, } from '@zag-js/splitter';
 export { SplitterContext, type SplitterContextProps } from './splitter-context';
 export { SplitterPanel, type SplitterPanelBaseProps, type SplitterPanelProps } from './splitter-panel';
 export { SplitterResizeTrigger, type SplitterResizeTriggerBaseProps, type SplitterResizeTriggerProps, } from './splitter-resize-trigger';
+export { SplitterResizeTriggerIndicator, type SplitterResizeTriggerIndicatorBaseProps, type SplitterResizeTriggerIndicatorProps, } from './splitter-resize-trigger-indicator';
 export { SplitterRoot, type SplitterRootBaseProps, type SplitterRootProps } from './splitter-root';
 export { SplitterRootProvider, type SplitterRootProviderBaseProps, type SplitterRootProviderProps, } from './splitter-root-provider';
 export { splitterAnatomy } from './splitter.anatomy';

package/dist/components/splitter/index.js

@@ -1,10 +1,11 @@
+export { layout as getSplitterLayout, anatomy as splitterAnatomy } from '@zag-js/splitter';
 export { SplitterContext } from './splitter-context.js';
 export { SplitterPanel } from './splitter-panel.js';
 export { SplitterResizeTrigger } from './splitter-resize-trigger.js';
+export { SplitterResizeTriggerIndicator } from './splitter-resize-trigger-indicator.js';
 export { SplitterRoot } from './splitter-root.js';
 export { SplitterRootProvider } from './splitter-root-provider.js';
 export { useSplitter } from './use-splitter.js';
 export { useSplitterContext } from './use-splitter-context.js';
 import * as splitter from './splitter.js';
 export { splitter as Splitter };
-export { anatomy as splitterAnatomy } from '@zag-js/splitter';

package/dist/components/splitter/splitter-panel.cjs

@@ -10,8 +10,9 @@ const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useSplitterContext = require('./use-splitter-context.cjs');
 
+const splitPanelProps = createSplitProps.createSplitProps();
 const SplitterPanel = react.forwardRef((props, ref) => {
-  const [splitterPanelProps, localProps] = createSplitProps.createSplitProps()(props, ["id"]);
+  const [splitterPanelProps, localProps] = splitPanelProps(props, ["id"]);
   const splitter = useSplitterContext.useSplitterContext();
   const mergedProps = react$1.mergeProps(splitter.getPanelProps(splitterPanelProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });

package/dist/components/splitter/splitter-panel.js

@@ -6,8 +6,9 @@ import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useSplitterContext } from './use-splitter-context.js';
 
+const splitPanelProps = createSplitProps();
 const SplitterPanel = forwardRef((props, ref) => {
-  const [splitterPanelProps, localProps] = createSplitProps()(props, ["id"]);
+  const [splitterPanelProps, localProps] = splitPanelProps(props, ["id"]);
   const splitter = useSplitterContext();
   const mergedProps = mergeProps(splitter.getPanelProps(splitterPanelProps), localProps);
   return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });

package/dist/components/splitter/splitter-resize-trigger-indicator.cjs

@@ -0,0 +1,23 @@
+'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 factory = require('../factory.cjs');
+const useSplitterContext = require('./use-splitter-context.cjs');
+const useSplitterResizeTriggerPropsContext = require('./use-splitter-resize-trigger-props-context.cjs');
+
+const SplitterResizeTriggerIndicator = react.forwardRef(
+  (props, ref) => {
+    const splitter = useSplitterContext.useSplitterContext();
+    const triggerProps = useSplitterResizeTriggerPropsContext.useSplitterResizeTriggerPropsContext();
+    const mergedProps = react$1.mergeProps(splitter.getResizeTriggerIndicator(triggerProps), props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ref, ...mergedProps });
+  }
+);
+SplitterResizeTriggerIndicator.displayName = "SplitterResizeTriggerIndicator";
+
+exports.SplitterResizeTriggerIndicator = SplitterResizeTriggerIndicator;

package/dist/components/splitter/splitter-resize-trigger-indicator.d.cts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface SplitterResizeTriggerIndicatorBaseProps extends PolymorphicProps {
+}
+export interface SplitterResizeTriggerIndicatorProps extends HTMLProps<'div'>, SplitterResizeTriggerIndicatorBaseProps {
+}
+export declare const SplitterResizeTriggerIndicator: ForwardRefExoticComponent<SplitterResizeTriggerIndicatorProps & RefAttributes<HTMLDivElement>>;

package/dist/components/splitter/splitter-resize-trigger-indicator.d.ts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface SplitterResizeTriggerIndicatorBaseProps extends PolymorphicProps {
+}
+export interface SplitterResizeTriggerIndicatorProps extends HTMLProps<'div'>, SplitterResizeTriggerIndicatorBaseProps {
+}
+export declare const SplitterResizeTriggerIndicator: ForwardRefExoticComponent<SplitterResizeTriggerIndicatorProps & RefAttributes<HTMLDivElement>>;

package/dist/components/splitter/splitter-resize-trigger-indicator.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.js';
+import { useSplitterContext } from './use-splitter-context.js';
+import { useSplitterResizeTriggerPropsContext } from './use-splitter-resize-trigger-props-context.js';
+
+const SplitterResizeTriggerIndicator = forwardRef(
+  (props, ref) => {
+    const splitter = useSplitterContext();
+    const triggerProps = useSplitterResizeTriggerPropsContext();
+    const mergedProps = mergeProps(splitter.getResizeTriggerIndicator(triggerProps), props);
+    return /* @__PURE__ */ jsx(ark.div, { ref, ...mergedProps });
+  }
+);
+SplitterResizeTriggerIndicator.displayName = "SplitterResizeTriggerIndicator";
+
+export { SplitterResizeTriggerIndicator };

package/dist/components/splitter/splitter-resize-trigger.cjs

@@ -9,12 +9,14 @@ const react = require('react');
 const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useSplitterContext = require('./use-splitter-context.cjs');
+const useSplitterResizeTriggerPropsContext = require('./use-splitter-resize-trigger-props-context.cjs');
 
+const splitResizeTriggerProps = createSplitProps.createSplitProps();
 const SplitterResizeTrigger = react.forwardRef((props, ref) => {
-  const [triggerProps, localProps] = createSplitProps.createSplitProps()(props, ["disabled", "id"]);
+  const [triggerProps, localProps] = splitResizeTriggerProps(props, ["disabled", "id"]);
   const splitter = useSplitterContext.useSplitterContext();
   const mergedProps = react$1.mergeProps(splitter.getResizeTriggerProps(triggerProps), localProps);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ref, ...mergedProps });
+  return /* @__PURE__ */ jsxRuntime.jsx(useSplitterResizeTriggerPropsContext.SplitterResizeTriggerPropsProvider, { value: triggerProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ref, ...mergedProps }) });
 });
 SplitterResizeTrigger.displayName = "SplitterResizeTrigger";
 

package/dist/components/splitter/splitter-resize-trigger.js

@@ -5,12 +5,14 @@ import { forwardRef } from 'react';
 import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useSplitterContext } from './use-splitter-context.js';
+import { SplitterResizeTriggerPropsProvider } from './use-splitter-resize-trigger-props-context.js';
 
+const splitResizeTriggerProps = createSplitProps();
 const SplitterResizeTrigger = forwardRef((props, ref) => {
-  const [triggerProps, localProps] = createSplitProps()(props, ["disabled", "id"]);
+  const [triggerProps, localProps] = splitResizeTriggerProps(props, ["disabled", "id"]);
   const splitter = useSplitterContext();
   const mergedProps = mergeProps(splitter.getResizeTriggerProps(triggerProps), localProps);
-  return /* @__PURE__ */ jsx(ark.button, { ref, ...mergedProps });
+  return /* @__PURE__ */ jsx(SplitterResizeTriggerPropsProvider, { value: triggerProps, children: /* @__PURE__ */ jsx(ark.button, { ref, ...mergedProps }) });
 });
 SplitterResizeTrigger.displayName = "SplitterResizeTrigger";
 

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

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