@ark-ui/react 5.35.0 → 5.36.0

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

@@ -1,5 +1,6 @@
 export { layout as getLayout } from '@zag-js/splitter';
 export type { ExpandCollapseDetails, PanelData, ResizeDetails, ResizeEndDetails } from '@zag-js/splitter';
+export { createSplitterRegistry as createRegistry } from './create-splitter-registry';
 export { SplitterContext as Context, type SplitterContextProps as ContextProps } from './splitter-context';
 export { SplitterPanel as Panel, type SplitterPanelBaseProps as PanelBaseProps, type SplitterPanelProps as PanelProps, } from './splitter-panel';
 export { SplitterResizeTrigger as ResizeTrigger, type SplitterResizeTriggerBaseProps as ResizeTriggerBaseProps, type SplitterResizeTriggerProps as ResizeTriggerProps, } from './splitter-resize-trigger';

package/dist/components/splitter/splitter.js

@@ -1,4 +1,5 @@
 export { layout as getLayout } from '@zag-js/splitter';
+export { createSplitterRegistry as createRegistry } from './create-splitter-registry.js';
 export { SplitterContext as Context } from './splitter-context.js';
 export { SplitterPanel as Panel } from './splitter-panel.js';
 export { SplitterResizeTrigger as ResizeTrigger } from './splitter-resize-trigger.js';

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

@@ -42,6 +42,7 @@ const TagsInputRoot = react.forwardRef((props, ref) => {
     "placeholder",
     "readOnly",
     "required",
+    "sanitizeValue",
     "translations",
     "validate",
     "value"

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

@@ -38,6 +38,7 @@ const TagsInputRoot = forwardRef((props, ref) => {
     "placeholder",
     "readOnly",
     "required",
+    "sanitizeValue",
     "translations",
     "validate",
     "value"

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

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as TooltipOpenChangeDetails } from '@zag-js/tooltip';
+export type { OpenChangeDetails as TooltipOpenChangeDetails, TriggerValueChangeDetails as TooltipTriggerValueChangeDetails, } from '@zag-js/tooltip';
 export { TooltipArrow, type TooltipArrowBaseProps, type TooltipArrowProps } from './tooltip-arrow';
 export { TooltipArrowTip, type TooltipArrowTipBaseProps, type TooltipArrowTipProps } from './tooltip-arrow-tip';
 export { TooltipContent, type TooltipContentBaseProps, type TooltipContentProps } from './tooltip-content';

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

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as TooltipOpenChangeDetails } from '@zag-js/tooltip';
+export type { OpenChangeDetails as TooltipOpenChangeDetails, TriggerValueChangeDetails as TooltipTriggerValueChangeDetails, } from '@zag-js/tooltip';
 export { TooltipArrow, type TooltipArrowBaseProps, type TooltipArrowProps } from './tooltip-arrow';
 export { TooltipArrowTip, type TooltipArrowTipBaseProps, type TooltipArrowTipProps } from './tooltip-arrow-tip';
 export { TooltipContent, type TooltipContentBaseProps, type TooltipContentProps } from './tooltip-content';

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

@@ -6,12 +6,15 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const react$1 = require('@zag-js/react');
 const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
 const factory = require('../factory.cjs');
 const useTooltipContext = require('./use-tooltip-context.cjs');
 
+const splitTriggerProps = createSplitProps.createSplitProps();
 const TooltipTrigger = react.forwardRef((props, ref) => {
+  const [triggerProps, localProps] = splitTriggerProps(props, ["value"]);
   const tooltip = useTooltipContext.useTooltipContext();
-  const mergedProps = react$1.mergeProps(tooltip.getTriggerProps(), props);
+  const mergedProps = react$1.mergeProps(tooltip.getTriggerProps(triggerProps), localProps);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
 TooltipTrigger.displayName = "TooltipTrigger";

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

@@ -1,7 +1,9 @@
+import { TriggerProps } from '@zag-js/tooltip';
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
-export interface TooltipTriggerBaseProps extends PolymorphicProps {
+export interface TooltipTriggerBaseProps extends TriggerProps, PolymorphicProps {
 }
-export interface TooltipTriggerProps extends HTMLProps<'button'>, TooltipTriggerBaseProps {
+export interface TooltipTriggerProps extends Assign<HTMLProps<'button'>, TooltipTriggerBaseProps> {
 }
 export declare const TooltipTrigger: ForwardRefExoticComponent<TooltipTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -1,7 +1,9 @@
+import { TriggerProps } from '@zag-js/tooltip';
+import { Assign } from '../../types';
 import { HTMLProps, PolymorphicProps } from '../factory';
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
-export interface TooltipTriggerBaseProps extends PolymorphicProps {
+export interface TooltipTriggerBaseProps extends TriggerProps, PolymorphicProps {
 }
-export interface TooltipTriggerProps extends HTMLProps<'button'>, TooltipTriggerBaseProps {
+export interface TooltipTriggerProps extends Assign<HTMLProps<'button'>, TooltipTriggerBaseProps> {
 }
 export declare const TooltipTrigger: ForwardRefExoticComponent<TooltipTriggerProps & RefAttributes<HTMLButtonElement>>;

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

@@ -2,12 +2,15 @@
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
 import { ark } from '../factory.js';
 import { useTooltipContext } from './use-tooltip-context.js';
 
+const splitTriggerProps = createSplitProps();
 const TooltipTrigger = forwardRef((props, ref) => {
+  const [triggerProps, localProps] = splitTriggerProps(props, ["value"]);
   const tooltip = useTooltipContext();
-  const mergedProps = mergeProps(tooltip.getTriggerProps(), props);
+  const mergedProps = mergeProps(tooltip.getTriggerProps(triggerProps), localProps);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
 TooltipTrigger.displayName = "TooltipTrigger";

package/dist/components/tooltip/tooltip.d.cts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/tooltip';
+export type { OpenChangeDetails, TriggerValueChangeDetails } from '@zag-js/tooltip';
 export { TooltipArrow as Arrow, type TooltipArrowBaseProps as ArrowBaseProps, type TooltipArrowProps as ArrowProps, } from './tooltip-arrow';
 export { TooltipArrowTip as ArrowTip, type TooltipArrowTipBaseProps as ArrowTipBaseProps, type TooltipArrowTipProps as ArrowTipProps, } from './tooltip-arrow-tip';
 export { TooltipContent as Content, type TooltipContentBaseProps as ContentBaseProps, type TooltipContentProps as ContentProps, } from './tooltip-content';

package/dist/components/tooltip/tooltip.d.ts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/tooltip';
+export type { OpenChangeDetails, TriggerValueChangeDetails } from '@zag-js/tooltip';
 export { TooltipArrow as Arrow, type TooltipArrowBaseProps as ArrowBaseProps, type TooltipArrowProps as ArrowProps, } from './tooltip-arrow';
 export { TooltipArrowTip as ArrowTip, type TooltipArrowTipBaseProps as ArrowTipBaseProps, type TooltipArrowTipProps as ArrowTipProps, } from './tooltip-arrow-tip';
 export { TooltipContent as Content, type TooltipContentBaseProps as ContentBaseProps, type TooltipContentProps as ContentProps, } from './tooltip-content';

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

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const tourAnatomy: AnatomyInstance<"control" | "progressText" | "positioner" | "content" | "actionTrigger" | "closeTrigger" | "title" | "description" | "arrow" | "arrowTip" | "backdrop" | "spotlight">;
+export declare const tourAnatomy: AnatomyInstance<"control" | "progressText" | "positioner" | "content" | "title" | "actionTrigger" | "closeTrigger" | "description" | "arrow" | "arrowTip" | "backdrop" | "spotlight">;

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

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const tourAnatomy: AnatomyInstance<"control" | "progressText" | "positioner" | "content" | "actionTrigger" | "closeTrigger" | "title" | "description" | "arrow" | "arrowTip" | "backdrop" | "spotlight">;
+export declare const tourAnatomy: AnatomyInstance<"control" | "progressText" | "positioner" | "content" | "title" | "actionTrigger" | "closeTrigger" | "description" | "arrow" | "arrowTip" | "backdrop" | "spotlight">;

package/dist/index.cjs

@@ -169,6 +169,18 @@ const useCombobox = require('./components/combobox/use-combobox.cjs');
 const useComboboxContext = require('./components/combobox/use-combobox-context.cjs');
 const useComboboxItemContext = require('./components/combobox/use-combobox-item-context.cjs');
 const combobox = require('./components/combobox/combobox.cjs');
+const useDateInput = require('./components/date-input/use-date-input.cjs');
+const useDateInputContext = require('./components/date-input/use-date-input-context.cjs');
+const dateInputContext = require('./components/date-input/date-input-context.cjs');
+const dateInputLabel = require('./components/date-input/date-input-label.cjs');
+const dateInputRoot = require('./components/date-input/date-input-root.cjs');
+const dateInputRootProvider = require('./components/date-input/date-input-root-provider.cjs');
+const dateInputSegment = require('./components/date-input/date-input-segment.cjs');
+const dateInputSegmentGroup = require('./components/date-input/date-input-segment-group.cjs');
+const dateInputHiddenInput = require('./components/date-input/date-input-hidden-input.cjs');
+const dateInputControl = require('./components/date-input/date-input-control.cjs');
+const dateInputSegmentContext = require('./components/date-input/date-input-segment-context.cjs');
+const dateInput = require('./components/date-input/date-input.cjs');
 const datePicker$1 = require('@zag-js/date-picker');
 const datePickerClearTrigger = require('./components/date-picker/date-picker-clear-trigger.cjs');
 const datePickerContent = require('./components/date-picker/date-picker-content.cjs');
@@ -591,6 +603,7 @@ const sliderValueText = require('./components/slider/slider-value-text.cjs');
 const useSlider = require('./components/slider/use-slider.cjs');
 const useSliderContext = require('./components/slider/use-slider-context.cjs');
 const slider = require('./components/slider/slider.cjs');
+const createSplitterRegistry = require('./components/splitter/create-splitter-registry.cjs');
 const splitter$1 = require('@zag-js/splitter');
 const splitterContext = require('./components/splitter/splitter-context.cjs');
 const splitterPanel = require('./components/splitter/splitter-panel.cjs');
@@ -771,6 +784,7 @@ const angleSlider$1 = require('@zag-js/angle-slider');
 const avatar$1 = require('@zag-js/avatar');
 const clipboard$1 = require('@zag-js/clipboard');
 const collapsible$1 = require('@zag-js/collapsible');
+const dateInput$1 = require('@zag-js/date-input');
 const dialog$1 = require('@zag-js/dialog');
 const drawer$1 = require('@zag-js/drawer');
 const editable$1 = require('@zag-js/editable');
@@ -977,6 +991,18 @@ exports.useCombobox = useCombobox.useCombobox;
 exports.useComboboxContext = useComboboxContext.useComboboxContext;
 exports.useComboboxItemContext = useComboboxItemContext.useComboboxItemContext;
 exports.Combobox = combobox;
+exports.useDateInput = useDateInput.useDateInput;
+exports.useDateInputContext = useDateInputContext.useDateInputContext;
+exports.DateInputContext = dateInputContext.DateInputContext;
+exports.DateInputLabel = dateInputLabel.DateInputLabel;
+exports.DateInputRoot = dateInputRoot.DateInputRoot;
+exports.DateInputRootProvider = dateInputRootProvider.DateInputRootProvider;
+exports.DateInputSegment = dateInputSegment.DateInputSegment;
+exports.DateInputSegmentGroup = dateInputSegmentGroup.DateInputSegmentGroup;
+exports.DateInputHiddenInput = dateInputHiddenInput.DateInputHiddenInput;
+exports.DateInputControl = dateInputControl.DateInputControl;
+exports.DateInputSegmentContext = dateInputSegmentContext.DateInputSegmentContext;
+exports.DateInput = dateInput;
 Object.defineProperty(exports, "parseDate", {
 	enumerable: true,
 	get: () => datePicker$1.parse
@@ -1404,6 +1430,7 @@ exports.SliderValueText = sliderValueText.SliderValueText;
 exports.useSlider = useSlider.useSlider;
 exports.useSliderContext = useSliderContext.useSliderContext;
 exports.Slider = slider;
+exports.createSplitterRegistry = createSplitterRegistry.createSplitterRegistry;
 Object.defineProperty(exports, "getSplitterLayout", {
 	enumerable: true,
 	get: () => splitter$1.layout
@@ -1620,6 +1647,10 @@ Object.defineProperty(exports, "collapsibleAnatomy", {
 	enumerable: true,
 	get: () => collapsible$1.anatomy
 });
+Object.defineProperty(exports, "dateInputAnatomy", {
+	enumerable: true,
+	get: () => dateInput$1.anatomy
+});
 Object.defineProperty(exports, "dialogAnatomy", {
 	enumerable: true,
 	get: () => dialog$1.anatomy

package/dist/index.js

@@ -175,6 +175,19 @@ export { useComboboxContext } from './components/combobox/use-combobox-context.j
 export { useComboboxItemContext } from './components/combobox/use-combobox-item-context.js';
 import * as combobox from './components/combobox/combobox.js';
 export { combobox as Combobox };
+export { useDateInput } from './components/date-input/use-date-input.js';
+export { useDateInputContext } from './components/date-input/use-date-input-context.js';
+export { DateInputContext } from './components/date-input/date-input-context.js';
+export { DateInputLabel } from './components/date-input/date-input-label.js';
+export { DateInputRoot } from './components/date-input/date-input-root.js';
+export { DateInputRootProvider } from './components/date-input/date-input-root-provider.js';
+export { DateInputSegment } from './components/date-input/date-input-segment.js';
+export { DateInputSegmentGroup } from './components/date-input/date-input-segment-group.js';
+export { DateInputHiddenInput } from './components/date-input/date-input-hidden-input.js';
+export { DateInputControl } from './components/date-input/date-input-control.js';
+export { DateInputSegmentContext } from './components/date-input/date-input-segment-context.js';
+import * as dateInput from './components/date-input/date-input.js';
+export { dateInput as DateInput };
 export { parse as parseDate } from '@zag-js/date-picker';
 export { DatePickerClearTrigger } from './components/date-picker/date-picker-clear-trigger.js';
 export { DatePickerContent } from './components/date-picker/date-picker-content.js';
@@ -626,6 +639,7 @@ export { useSlider } from './components/slider/use-slider.js';
 export { useSliderContext } from './components/slider/use-slider-context.js';
 import * as slider from './components/slider/slider.js';
 export { slider as Slider };
+export { createSplitterRegistry } from './components/splitter/create-splitter-registry.js';
 export { layout as getSplitterLayout, anatomy as splitterAnatomy } from '@zag-js/splitter';
 export { SplitterContext } from './components/splitter/splitter-context.js';
 export { SplitterPanel } from './components/splitter/splitter-panel.js';
@@ -819,6 +833,7 @@ export { anatomy as angleSliderAnatomy } from '@zag-js/angle-slider';
 export { anatomy as avatarAnatomy } from '@zag-js/avatar';
 export { anatomy as clipboardAnatomy } from '@zag-js/clipboard';
 export { anatomy as collapsibleAnatomy } from '@zag-js/collapsible';
+export { anatomy as dateInputAnatomy } from '@zag-js/date-input';
 export { anatomy as dialogAnatomy } from '@zag-js/dialog';
 export { anatomy as drawerAnatomy } from '@zag-js/drawer';
 export { anatomy as editableAnatomy } from '@zag-js/editable';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ark-ui/react",
   "type": "module",
-  "version": "5.35.0",
+  "version": "5.36.0",
   "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
   "keywords": [
     "accordion",
@@ -13,6 +13,7 @@
     "collapsible",
     "color picker",
     "combobox",
+    "date input",
     "date picker",
     "dialog",
     "editable",
@@ -149,71 +150,72 @@
   "sideEffects": false,
   "dependencies": {
     "@internationalized/date": "3.12.0",
-    "@zag-js/accordion": "1.38.2",
-    "@zag-js/anatomy": "1.38.2",
-    "@zag-js/angle-slider": "1.38.2",
-    "@zag-js/async-list": "1.38.2",
-    "@zag-js/auto-resize": "1.38.2",
-    "@zag-js/avatar": "1.38.2",
-    "@zag-js/carousel": "1.38.2",
-    "@zag-js/cascade-select": "1.38.2",
-    "@zag-js/checkbox": "1.38.2",
-    "@zag-js/clipboard": "1.38.2",
-    "@zag-js/collapsible": "1.38.2",
-    "@zag-js/collection": "1.38.2",
-    "@zag-js/color-picker": "1.38.2",
-    "@zag-js/color-utils": "1.38.2",
-    "@zag-js/combobox": "1.38.2",
-    "@zag-js/core": "1.38.2",
-    "@zag-js/date-picker": "1.38.2",
-    "@zag-js/date-utils": "1.38.2",
-    "@zag-js/dialog": "1.38.2",
-    "@zag-js/dom-query": "1.38.2",
-    "@zag-js/drawer": "1.38.2",
-    "@zag-js/editable": "1.38.2",
-    "@zag-js/file-upload": "1.38.2",
-    "@zag-js/focus-visible": "1.38.2",
-    "@zag-js/file-utils": "1.38.2",
-    "@zag-js/floating-panel": "1.38.2",
-    "@zag-js/focus-trap": "1.38.2",
-    "@zag-js/highlight-word": "1.38.2",
-    "@zag-js/hover-card": "1.38.2",
-    "@zag-js/i18n-utils": "1.38.2",
-    "@zag-js/image-cropper": "1.38.2",
-    "@zag-js/json-tree-utils": "1.38.2",
-    "@zag-js/listbox": "1.38.2",
-    "@zag-js/marquee": "1.38.2",
-    "@zag-js/menu": "1.38.2",
-    "@zag-js/navigation-menu": "1.38.2",
-    "@zag-js/number-input": "1.38.2",
-    "@zag-js/pagination": "1.38.2",
-    "@zag-js/password-input": "1.38.2",
-    "@zag-js/pin-input": "1.38.2",
-    "@zag-js/popover": "1.38.2",
-    "@zag-js/presence": "1.38.2",
-    "@zag-js/progress": "1.38.2",
-    "@zag-js/qr-code": "1.38.2",
-    "@zag-js/radio-group": "1.38.2",
-    "@zag-js/rating-group": "1.38.2",
-    "@zag-js/react": "1.38.2",
-    "@zag-js/scroll-area": "1.38.2",
-    "@zag-js/select": "1.38.2",
-    "@zag-js/signature-pad": "1.38.2",
-    "@zag-js/slider": "1.38.2",
-    "@zag-js/splitter": "1.38.2",
-    "@zag-js/steps": "1.38.2",
-    "@zag-js/switch": "1.38.2",
-    "@zag-js/tabs": "1.38.2",
-    "@zag-js/tags-input": "1.38.2",
-    "@zag-js/timer": "1.38.2",
-    "@zag-js/toast": "1.38.2",
-    "@zag-js/toggle": "1.38.2",
-    "@zag-js/toggle-group": "1.38.2",
-    "@zag-js/tooltip": "1.38.2",
-    "@zag-js/tour": "1.38.2",
-    "@zag-js/tree-view": "1.38.2",
-    "@zag-js/types": "1.38.2",
-    "@zag-js/utils": "1.38.2"
+    "@zag-js/accordion": "1.39.1",
+    "@zag-js/anatomy": "1.39.1",
+    "@zag-js/angle-slider": "1.39.1",
+    "@zag-js/async-list": "1.39.1",
+    "@zag-js/auto-resize": "1.39.1",
+    "@zag-js/avatar": "1.39.1",
+    "@zag-js/carousel": "1.39.1",
+    "@zag-js/cascade-select": "1.39.1",
+    "@zag-js/checkbox": "1.39.1",
+    "@zag-js/clipboard": "1.39.1",
+    "@zag-js/collapsible": "1.39.1",
+    "@zag-js/collection": "1.39.1",
+    "@zag-js/color-picker": "1.39.1",
+    "@zag-js/color-utils": "1.39.1",
+    "@zag-js/combobox": "1.39.1",
+    "@zag-js/core": "1.39.1",
+    "@zag-js/date-input": "1.39.1",
+    "@zag-js/date-picker": "1.39.1",
+    "@zag-js/date-utils": "1.39.1",
+    "@zag-js/dialog": "1.39.1",
+    "@zag-js/dom-query": "1.39.1",
+    "@zag-js/drawer": "1.39.1",
+    "@zag-js/editable": "1.39.1",
+    "@zag-js/file-upload": "1.39.1",
+    "@zag-js/focus-visible": "1.39.1",
+    "@zag-js/file-utils": "1.39.1",
+    "@zag-js/floating-panel": "1.39.1",
+    "@zag-js/focus-trap": "1.39.1",
+    "@zag-js/highlight-word": "1.39.1",
+    "@zag-js/hover-card": "1.39.1",
+    "@zag-js/i18n-utils": "1.39.1",
+    "@zag-js/image-cropper": "1.39.1",
+    "@zag-js/json-tree-utils": "1.39.1",
+    "@zag-js/listbox": "1.39.1",
+    "@zag-js/marquee": "1.39.1",
+    "@zag-js/menu": "1.39.1",
+    "@zag-js/navigation-menu": "1.39.1",
+    "@zag-js/number-input": "1.39.1",
+    "@zag-js/pagination": "1.39.1",
+    "@zag-js/password-input": "1.39.1",
+    "@zag-js/pin-input": "1.39.1",
+    "@zag-js/popover": "1.39.1",
+    "@zag-js/presence": "1.39.1",
+    "@zag-js/progress": "1.39.1",
+    "@zag-js/qr-code": "1.39.1",
+    "@zag-js/radio-group": "1.39.1",
+    "@zag-js/rating-group": "1.39.1",
+    "@zag-js/react": "1.39.1",
+    "@zag-js/scroll-area": "1.39.1",
+    "@zag-js/select": "1.39.1",
+    "@zag-js/signature-pad": "1.39.1",
+    "@zag-js/slider": "1.39.1",
+    "@zag-js/splitter": "1.39.1",
+    "@zag-js/steps": "1.39.1",
+    "@zag-js/switch": "1.39.1",
+    "@zag-js/tabs": "1.39.1",
+    "@zag-js/tags-input": "1.39.1",
+    "@zag-js/timer": "1.39.1",
+    "@zag-js/toast": "1.39.1",
+    "@zag-js/toggle": "1.39.1",
+    "@zag-js/toggle-group": "1.39.1",
+    "@zag-js/tooltip": "1.39.1",
+    "@zag-js/tour": "1.39.1",
+    "@zag-js/tree-view": "1.39.1",
+    "@zag-js/types": "1.39.1",
+    "@zag-js/utils": "1.39.1"
   },
   "devDependencies": {
     "@biomejs/biome": "2.4.9",