@ark-ui/react 5.34.1 → 5.36.0

package/dist/components/anatomy.cjs

@@ -20,6 +20,7 @@ const angleSlider = require('@zag-js/angle-slider');
 const avatar = require('@zag-js/avatar');
 const clipboard = require('@zag-js/clipboard');
 const collapsible = require('@zag-js/collapsible');
+const dateInput = require('@zag-js/date-input');
 const dialog = require('@zag-js/dialog');
 const drawer = require('@zag-js/drawer');
 const editable = require('@zag-js/editable');
@@ -88,6 +89,10 @@ Object.defineProperty(exports, "collapsibleAnatomy", {
 	enumerable: true,
 	get: () => collapsible.anatomy
 });
+Object.defineProperty(exports, "dateInputAnatomy", {
+	enumerable: true,
+	get: () => dateInput.anatomy
+});
 Object.defineProperty(exports, "dialogAnatomy", {
 	enumerable: true,
 	get: () => dialog.anatomy

package/dist/components/anatomy.d.cts

@@ -9,6 +9,7 @@ export { clipboardAnatomy } from './clipboard/clipboard.anatomy';
 export { collapsibleAnatomy } from './collapsible/collapsible.anatomy';
 export { colorPickerAnatomy } from './color-picker/color-picker.anatomy';
 export { comboboxAnatomy } from './combobox/combobox.anatomy';
+export { dateInputAnatomy } from './date-input/date-input.anatomy';
 export { datePickerAnatomy } from './date-picker/date-picker.anatomy';
 export { dialogAnatomy } from './dialog/dialog.anatomy';
 export { editableAnatomy } from './editable/editable.anatomy';

package/dist/components/anatomy.d.ts

@@ -9,6 +9,7 @@ export { clipboardAnatomy } from './clipboard/clipboard.anatomy';
 export { collapsibleAnatomy } from './collapsible/collapsible.anatomy';
 export { colorPickerAnatomy } from './color-picker/color-picker.anatomy';
 export { comboboxAnatomy } from './combobox/combobox.anatomy';
+export { dateInputAnatomy } from './date-input/date-input.anatomy';
 export { datePickerAnatomy } from './date-picker/date-picker.anatomy';
 export { dialogAnatomy } from './dialog/dialog.anatomy';
 export { editableAnatomy } from './editable/editable.anatomy';

package/dist/components/anatomy.js

@@ -16,6 +16,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/dist/components/clipboard/clipboard-root.cjs

@@ -20,6 +20,7 @@ const ClipboardRoot = react.forwardRef((props, ref) => {
     "onStatusChange",
     "onValueChange",
     "timeout",
+    "translations",
     "value"
   ]);
   const clipboard = useClipboard.useClipboard(useClipboardProps);

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

@@ -16,6 +16,7 @@ const ClipboardRoot = forwardRef((props, ref) => {
     "onStatusChange",
     "onValueChange",
     "timeout",
+    "translations",
     "value"
   ]);
   const clipboard = useClipboard(useClipboardProps);

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

@@ -0,0 +1,10 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const useDateInputContext = require('./use-date-input-context.cjs');
+
+const DateInputContext = (props) => props.children(useDateInputContext.useDateInputContext());
+
+exports.DateInputContext = DateInputContext;

package/dist/components/date-input/date-input-context.d.cts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+import { UseDateInputContext } from './use-date-input-context';
+export interface DateInputContextProps {
+    children: (context: UseDateInputContext) => ReactNode;
+}
+export declare const DateInputContext: (props: DateInputContextProps) => ReactNode;

package/dist/components/date-input/date-input-context.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+import { UseDateInputContext } from './use-date-input-context';
+export interface DateInputContextProps {
+    children: (context: UseDateInputContext) => ReactNode;
+}
+export declare const DateInputContext: (props: DateInputContextProps) => ReactNode;

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

@@ -0,0 +1,6 @@
+'use client';
+import { useDateInputContext } from './use-date-input-context.js';
+
+const DateInputContext = (props) => props.children(useDateInputContext());
+
+export { DateInputContext };

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

@@ -0,0 +1,19 @@
+'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 useDateInputContext = require('./use-date-input-context.cjs');
+
+const DateInputControl = react.forwardRef((props, ref) => {
+  const dateInput = useDateInputContext.useDateInputContext();
+  const mergedProps = react$1.mergeProps(dateInput.getControlProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+});
+DateInputControl.displayName = "DateInputControl";
+
+exports.DateInputControl = DateInputControl;

package/dist/components/date-input/date-input-control.d.cts

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

package/dist/components/date-input/date-input-control.d.ts

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

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

@@ -0,0 +1,15 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.js';
+import { useDateInputContext } from './use-date-input-context.js';
+
+const DateInputControl = forwardRef((props, ref) => {
+  const dateInput = useDateInputContext();
+  const mergedProps = mergeProps(dateInput.getControlProps(), props);
+  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+});
+DateInputControl.displayName = "DateInputControl";
+
+export { DateInputControl };

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

@@ -0,0 +1,22 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useDateInputContext = require('./use-date-input-context.cjs');
+
+const splitHiddenInputProps = createSplitProps.createSplitProps();
+const DateInputHiddenInput = react.forwardRef((props, ref) => {
+  const [hiddenInputProps, localProps] = splitHiddenInputProps(props, ["index", "name"]);
+  const dateInput = useDateInputContext.useDateInputContext();
+  const mergedProps = react$1.mergeProps(dateInput.getHiddenInputProps(hiddenInputProps), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { ...mergedProps, ref });
+});
+DateInputHiddenInput.displayName = "DateInputHiddenInput";
+
+exports.DateInputHiddenInput = DateInputHiddenInput;

package/dist/components/date-input/date-input-hidden-input.d.cts

@@ -0,0 +1,8 @@
+import { HiddenInputProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputHiddenInputBaseProps extends PolymorphicProps, HiddenInputProps {
+}
+export interface DateInputHiddenInputProps extends HTMLProps<'input'>, DateInputHiddenInputBaseProps {
+}
+export declare const DateInputHiddenInput: ForwardRefExoticComponent<DateInputHiddenInputProps & RefAttributes<HTMLInputElement>>;

package/dist/components/date-input/date-input-hidden-input.d.ts

@@ -0,0 +1,8 @@
+import { HiddenInputProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputHiddenInputBaseProps extends PolymorphicProps, HiddenInputProps {
+}
+export interface DateInputHiddenInputProps extends HTMLProps<'input'>, DateInputHiddenInputBaseProps {
+}
+export declare const DateInputHiddenInput: ForwardRefExoticComponent<DateInputHiddenInputProps & RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,18 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { useDateInputContext } from './use-date-input-context.js';
+
+const splitHiddenInputProps = createSplitProps();
+const DateInputHiddenInput = forwardRef((props, ref) => {
+  const [hiddenInputProps, localProps] = splitHiddenInputProps(props, ["index", "name"]);
+  const dateInput = useDateInputContext();
+  const mergedProps = mergeProps(dateInput.getHiddenInputProps(hiddenInputProps), localProps);
+  return /* @__PURE__ */ jsx(ark.input, { ...mergedProps, ref });
+});
+DateInputHiddenInput.displayName = "DateInputHiddenInput";
+
+export { DateInputHiddenInput };

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

@@ -0,0 +1,19 @@
+'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 useDateInputContext = require('./use-date-input-context.cjs');
+
+const DateInputLabel = react.forwardRef((props, ref) => {
+  const dateInput = useDateInputContext.useDateInputContext();
+  const mergedProps = react$1.mergeProps(dateInput.getLabelProps(), props);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
+});
+DateInputLabel.displayName = "DateInputLabel";
+
+exports.DateInputLabel = DateInputLabel;

package/dist/components/date-input/date-input-label.d.cts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputLabelBaseProps extends PolymorphicProps {
+}
+export interface DateInputLabelProps extends HTMLProps<'label'>, DateInputLabelBaseProps {
+}
+export declare const DateInputLabel: ForwardRefExoticComponent<DateInputLabelProps & RefAttributes<HTMLLabelElement>>;

package/dist/components/date-input/date-input-label.d.ts

@@ -0,0 +1,7 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputLabelBaseProps extends PolymorphicProps {
+}
+export interface DateInputLabelProps extends HTMLProps<'label'>, DateInputLabelBaseProps {
+}
+export declare const DateInputLabel: ForwardRefExoticComponent<DateInputLabelProps & RefAttributes<HTMLLabelElement>>;

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

@@ -0,0 +1,15 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { ark } from '../factory.js';
+import { useDateInputContext } from './use-date-input-context.js';
+
+const DateInputLabel = forwardRef((props, ref) => {
+  const dateInput = useDateInputContext();
+  const mergedProps = mergeProps(dateInput.getLabelProps(), props);
+  return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
+});
+DateInputLabel.displayName = "DateInputLabel";
+
+export { DateInputLabel };

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

@@ -0,0 +1,21 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useDateInputContext = require('./use-date-input-context.cjs');
+
+const splitRootProviderProps = createSplitProps.createSplitProps();
+const DateInputRootProvider = react.forwardRef((props, ref) => {
+  const [{ value: dateInput }, localProps] = splitRootProviderProps(props, ["value"]);
+  const mergedProps = react$1.mergeProps(dateInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(useDateInputContext.DateInputProvider, { value: dateInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
+DateInputRootProvider.displayName = "DateInputRootProvider";
+
+exports.DateInputRootProvider = DateInputRootProvider;

package/dist/components/date-input/date-input-root-provider.d.cts

@@ -0,0 +1,12 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { UseDateInputReturn } from './use-date-input';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+interface RootProviderProps {
+    value: UseDateInputReturn;
+}
+export interface DateInputRootProviderBaseProps extends RootProviderProps, PolymorphicProps {
+}
+export interface DateInputRootProviderProps extends HTMLProps<'div'>, DateInputRootProviderBaseProps {
+}
+export declare const DateInputRootProvider: ForwardRefExoticComponent<DateInputRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/date-input/date-input-root-provider.d.ts

@@ -0,0 +1,12 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { UseDateInputReturn } from './use-date-input';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+interface RootProviderProps {
+    value: UseDateInputReturn;
+}
+export interface DateInputRootProviderBaseProps extends RootProviderProps, PolymorphicProps {
+}
+export interface DateInputRootProviderProps extends HTMLProps<'div'>, DateInputRootProviderBaseProps {
+}
+export declare const DateInputRootProvider: ForwardRefExoticComponent<DateInputRootProviderProps & RefAttributes<HTMLDivElement>>;
+export {};

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

@@ -0,0 +1,17 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { DateInputProvider } from './use-date-input-context.js';
+
+const splitRootProviderProps = createSplitProps();
+const DateInputRootProvider = forwardRef((props, ref) => {
+  const [{ value: dateInput }, localProps] = splitRootProviderProps(props, ["value"]);
+  const mergedProps = mergeProps(dateInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsx(DateInputProvider, { value: dateInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
+DateInputRootProvider.displayName = "DateInputRootProvider";
+
+export { DateInputRootProvider };

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

@@ -0,0 +1,55 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useDateInput = require('./use-date-input.cjs');
+const useDateInputContext = require('./use-date-input-context.cjs');
+
+const splitRootProps = createSplitProps.createSplitProps();
+const DateInputRoot = react.forwardRef((props, ref) => {
+  const [useDateInputProps, localProps] = splitRootProps(props, [
+    "dir",
+    "disabled",
+    "getRootNode",
+    "id",
+    "ids",
+    "invalid",
+    "locale",
+    "max",
+    "min",
+    "name",
+    "form",
+    "onFocusChange",
+    "onPlaceholderChange",
+    "onValueChange",
+    "readOnly",
+    "required",
+    "selectionMode",
+    "timeZone",
+    "translations",
+    "value",
+    "defaultValue",
+    "hourCycle",
+    "granularity",
+    "shouldForceLeadingZeros",
+    "allSegments",
+    "formatter",
+    "placeholderValue",
+    "defaultPlaceholderValue",
+    "format",
+    "createCalendar",
+    "isDateUnavailable"
+  ]);
+  const dateInput = useDateInput.useDateInput(useDateInputProps);
+  const mergedProps = react$1.mergeProps(dateInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(useDateInputContext.DateInputProvider, { value: dateInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
+DateInputRoot.displayName = "DateInputRoot";
+
+exports.DateInputRoot = DateInputRoot;

package/dist/components/date-input/date-input-root.d.cts

@@ -0,0 +1,9 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { UseDateInputProps } from './use-date-input';
+import { Assign } from '../../types';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputRootBaseProps extends UseDateInputProps, PolymorphicProps {
+}
+export interface DateInputRootProps extends Assign<HTMLProps<'div'>, DateInputRootBaseProps> {
+}
+export declare const DateInputRoot: ForwardRefExoticComponent<DateInputRootProps & RefAttributes<HTMLDivElement>>;

package/dist/components/date-input/date-input-root.d.ts

@@ -0,0 +1,9 @@
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { UseDateInputProps } from './use-date-input';
+import { Assign } from '../../types';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputRootBaseProps extends UseDateInputProps, PolymorphicProps {
+}
+export interface DateInputRootProps extends Assign<HTMLProps<'div'>, DateInputRootBaseProps> {
+}
+export declare const DateInputRoot: ForwardRefExoticComponent<DateInputRootProps & RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,51 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { useDateInput } from './use-date-input.js';
+import { DateInputProvider } from './use-date-input-context.js';
+
+const splitRootProps = createSplitProps();
+const DateInputRoot = forwardRef((props, ref) => {
+  const [useDateInputProps, localProps] = splitRootProps(props, [
+    "dir",
+    "disabled",
+    "getRootNode",
+    "id",
+    "ids",
+    "invalid",
+    "locale",
+    "max",
+    "min",
+    "name",
+    "form",
+    "onFocusChange",
+    "onPlaceholderChange",
+    "onValueChange",
+    "readOnly",
+    "required",
+    "selectionMode",
+    "timeZone",
+    "translations",
+    "value",
+    "defaultValue",
+    "hourCycle",
+    "granularity",
+    "shouldForceLeadingZeros",
+    "allSegments",
+    "formatter",
+    "placeholderValue",
+    "defaultPlaceholderValue",
+    "format",
+    "createCalendar",
+    "isDateUnavailable"
+  ]);
+  const dateInput = useDateInput(useDateInputProps);
+  const mergedProps = mergeProps(dateInput.getRootProps(), localProps);
+  return /* @__PURE__ */ jsx(DateInputProvider, { value: dateInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
+DateInputRoot.displayName = "DateInputRoot";
+
+export { DateInputRoot };

package/dist/components/date-input/date-input-segment-context.cjs

@@ -0,0 +1,17 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
+const useDateInputContext = require('./use-date-input-context.cjs');
+const useDateInputSegmentGroupPropsContext = require('./use-date-input-segment-group-props-context.cjs');
+
+const DateInputSegmentContext = (props) => {
+  const dateInput = useDateInputContext.useDateInputContext();
+  const segmentGroupProps = useDateInputSegmentGroupPropsContext.useDateInputSegmentGroupPropsContext();
+  return dateInput.getSegments(segmentGroupProps).map((segment, index) => /* @__PURE__ */ jsxRuntime.jsx(react.Fragment, { children: props.children(segment) }, `${segment.type}-${index}`));
+};
+
+exports.DateInputSegmentContext = DateInputSegmentContext;

package/dist/components/date-input/date-input-segment-context.d.cts

@@ -0,0 +1,6 @@
+import { DateSegment } from '@zag-js/date-input';
+import { ReactNode } from 'react';
+export interface DateInputSegmentContextProps {
+    children: (segment: DateSegment) => ReactNode;
+}
+export declare const DateInputSegmentContext: (props: DateInputSegmentContextProps) => import("react/jsx-runtime").JSX.Element[];

package/dist/components/date-input/date-input-segment-context.d.ts

@@ -0,0 +1,6 @@
+import { DateSegment } from '@zag-js/date-input';
+import { ReactNode } from 'react';
+export interface DateInputSegmentContextProps {
+    children: (segment: DateSegment) => ReactNode;
+}
+export declare const DateInputSegmentContext: (props: DateInputSegmentContextProps) => import("react/jsx-runtime").JSX.Element[];

package/dist/components/date-input/date-input-segment-context.js

@@ -0,0 +1,13 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Fragment } from 'react';
+import { useDateInputContext } from './use-date-input-context.js';
+import { useDateInputSegmentGroupPropsContext } from './use-date-input-segment-group-props-context.js';
+
+const DateInputSegmentContext = (props) => {
+  const dateInput = useDateInputContext();
+  const segmentGroupProps = useDateInputSegmentGroupPropsContext();
+  return dateInput.getSegments(segmentGroupProps).map((segment, index) => /* @__PURE__ */ jsx(Fragment, { children: props.children(segment) }, `${segment.type}-${index}`));
+};
+
+export { DateInputSegmentContext };

package/dist/components/date-input/date-input-segment-group.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 createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useDateInputContext = require('./use-date-input-context.cjs');
+const useDateInputSegmentGroupPropsContext = require('./use-date-input-segment-group-props-context.cjs');
+
+const splitSegmentGroupProps = createSplitProps.createSplitProps();
+const DateInputSegmentGroup = react.forwardRef((props, ref) => {
+  const [segmentGroupProps, localProps] = splitSegmentGroupProps(props, ["index"]);
+  const dateInput = useDateInputContext.useDateInputContext();
+  const mergedProps = react$1.mergeProps(dateInput.getSegmentGroupProps(segmentGroupProps), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(useDateInputSegmentGroupPropsContext.DateInputSegmentGroupPropsProvider, { value: segmentGroupProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
+DateInputSegmentGroup.displayName = "DateInputSegmentGroup";
+
+exports.DateInputSegmentGroup = DateInputSegmentGroup;

package/dist/components/date-input/date-input-segment-group.d.cts

@@ -0,0 +1,8 @@
+import { SegmentGroupProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputSegmentGroupBaseProps extends PolymorphicProps, SegmentGroupProps {
+}
+export interface DateInputSegmentGroupProps extends HTMLProps<'div'>, DateInputSegmentGroupBaseProps {
+}
+export declare const DateInputSegmentGroup: ForwardRefExoticComponent<DateInputSegmentGroupProps & RefAttributes<HTMLDivElement>>;

package/dist/components/date-input/date-input-segment-group.d.ts

@@ -0,0 +1,8 @@
+import { SegmentGroupProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputSegmentGroupBaseProps extends PolymorphicProps, SegmentGroupProps {
+}
+export interface DateInputSegmentGroupProps extends HTMLProps<'div'>, DateInputSegmentGroupBaseProps {
+}
+export declare const DateInputSegmentGroup: ForwardRefExoticComponent<DateInputSegmentGroupProps & RefAttributes<HTMLDivElement>>;

package/dist/components/date-input/date-input-segment-group.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../../utils/create-split-props.js';
+import { ark } from '../factory.js';
+import { useDateInputContext } from './use-date-input-context.js';
+import { DateInputSegmentGroupPropsProvider } from './use-date-input-segment-group-props-context.js';
+
+const splitSegmentGroupProps = createSplitProps();
+const DateInputSegmentGroup = forwardRef((props, ref) => {
+  const [segmentGroupProps, localProps] = splitSegmentGroupProps(props, ["index"]);
+  const dateInput = useDateInputContext();
+  const mergedProps = mergeProps(dateInput.getSegmentGroupProps(segmentGroupProps), localProps);
+  return /* @__PURE__ */ jsx(DateInputSegmentGroupPropsProvider, { value: segmentGroupProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
+DateInputSegmentGroup.displayName = "DateInputSegmentGroup";
+
+export { DateInputSegmentGroup };

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

@@ -0,0 +1,27 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../../utils/create-split-props.cjs');
+const factory = require('../factory.cjs');
+const useDateInputContext = require('./use-date-input-context.cjs');
+const useDateInputSegmentGroupPropsContext = require('./use-date-input-segment-group-props-context.cjs');
+
+const splitSegmentProps = createSplitProps.createSplitProps();
+const DateInputSegment = react.forwardRef((props, ref) => {
+  const [segmentProps, localProps] = splitSegmentProps(props, ["segment"]);
+  const segmentGroupProps = useDateInputSegmentGroupPropsContext.useDateInputSegmentGroupPropsContext();
+  const dateInput = useDateInputContext.useDateInputContext();
+  const mergedProps = react$1.mergeProps(
+    dateInput.getSegmentProps({ ...segmentProps, index: segmentGroupProps.index }),
+    localProps
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref, children: segmentProps.segment.text });
+});
+DateInputSegment.displayName = "DateInputSegment";
+
+exports.DateInputSegment = DateInputSegment;

package/dist/components/date-input/date-input-segment.d.cts

@@ -0,0 +1,8 @@
+import { SegmentProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputSegmentBaseProps extends PolymorphicProps, Pick<SegmentProps, 'segment'> {
+}
+export interface DateInputSegmentProps extends HTMLProps<'span'>, DateInputSegmentBaseProps {
+}
+export declare const DateInputSegment: ForwardRefExoticComponent<DateInputSegmentProps & RefAttributes<HTMLSpanElement>>;

package/dist/components/date-input/date-input-segment.d.ts

@@ -0,0 +1,8 @@
+import { SegmentProps } from '@zag-js/date-input';
+import { HTMLProps, PolymorphicProps } from '../factory';
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+export interface DateInputSegmentBaseProps extends PolymorphicProps, Pick<SegmentProps, 'segment'> {
+}
+export interface DateInputSegmentProps extends HTMLProps<'span'>, DateInputSegmentBaseProps {
+}
+export declare const DateInputSegment: ForwardRefExoticComponent<DateInputSegmentProps & RefAttributes<HTMLSpanElement>>;