@ark-ui/react 0.10.0-beta.0 → 0.10.0

package/date-picker/date-picker-prev-trigger.mjs

@@ -1,14 +1,17 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerPrevTrigger = forwardRef((props, ref) => {
-  const { getPrevTriggerProps, view } = useDatePickerContext();
-  const mergedProps = mergeProps(getPrevTriggerProps({ view }), props);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const DatePickerPrevTrigger = forwardRef(
+  (props, ref) => {
+    const { getPrevTriggerProps, view } = useDatePickerContext();
+    const mergedProps = mergeProps(getPrevTriggerProps({ view }), props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+DatePickerPrevTrigger.displayName = "DatePickerPrevTrigger";
 
 export { DatePickerPrevTrigger };

package/date-picker/date-picker-row-group.cjs

@@ -4,10 +4,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePicker_anatomy = require('./date-picker.anatomy.cjs');
 
-const DatePickerRowGroup = forwardRef.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "rowgroup", ...datePicker_anatomy.parts.rowGroup.attrs, ...props, ref }));
+const DatePickerRowGroup = react.forwardRef(
+  (props, ref) => /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "rowgroup", ...datePicker_anatomy.parts.rowGroup.attrs, ...props, ref })
+);
+DatePickerRowGroup.displayName = "DatePickerRowGroup";
 
 exports.DatePickerRowGroup = DatePickerRowGroup;

package/date-picker/date-picker-row-group.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerRowGroupProps = HTMLArkProps<'div'>;
-export declare const DatePickerRowGroup: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerRowGroupProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const DatePickerRowGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/date-picker/date-picker-row-group.mjs

@@ -1,9 +1,12 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { parts } from './date-picker.anatomy.mjs';
 
-const DatePickerRowGroup = forwardRef((props, ref) => /* @__PURE__ */ jsx(ark.div, { role: "rowgroup", ...parts.rowGroup.attrs, ...props, ref }));
+const DatePickerRowGroup = forwardRef(
+  (props, ref) => /* @__PURE__ */ jsx(ark.div, { role: "rowgroup", ...parts.rowGroup.attrs, ...props, ref })
+);
+DatePickerRowGroup.displayName = "DatePickerRowGroup";
 
 export { DatePickerRowGroup };

package/date-picker/date-picker-row-header.cjs

@@ -4,15 +4,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerRowHeader = forwardRef.forwardRef((props, ref) => {
-  const { getHeaderProps } = datePickerContext.useDatePickerContext();
-  const mergedProps = react.mergeProps(getHeaderProps({ view: "day" }), props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "row", ...mergedProps, "aria-hidden": false, ref });
-});
+const DatePickerRowHeader = react.forwardRef(
+  (props, ref) => {
+    const { getHeaderProps } = datePickerContext.useDatePickerContext();
+    const mergedProps = react$1.mergeProps(getHeaderProps({ view: "day" }), props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "row", ...mergedProps, "aria-hidden": false, ref });
+  }
+);
+DatePickerRowHeader.displayName = "DatePickerRowHeader";
 
 exports.DatePickerRowHeader = DatePickerRowHeader;

package/date-picker/date-picker-row-header.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerRowHeaderProps = HTMLArkProps<'div'>;
-export declare const DatePickerRowHeader: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerRowHeaderProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const DatePickerRowHeader: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/date-picker/date-picker-row-header.mjs

@@ -1,14 +1,17 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerRowHeader = forwardRef((props, ref) => {
-  const { getHeaderProps } = useDatePickerContext();
-  const mergedProps = mergeProps(getHeaderProps({ view: "day" }), props);
-  return /* @__PURE__ */ jsx(ark.div, { role: "row", ...mergedProps, "aria-hidden": false, ref });
-});
+const DatePickerRowHeader = forwardRef(
+  (props, ref) => {
+    const { getHeaderProps } = useDatePickerContext();
+    const mergedProps = mergeProps(getHeaderProps({ view: "day" }), props);
+    return /* @__PURE__ */ jsx(ark.div, { role: "row", ...mergedProps, "aria-hidden": false, ref });
+  }
+);
+DatePickerRowHeader.displayName = "DatePickerRowHeader";
 
 export { DatePickerRowHeader };

package/date-picker/date-picker-row.cjs

@@ -4,10 +4,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePicker_anatomy = require('./date-picker.anatomy.cjs');
 
-const DatePickerRow = forwardRef.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "row", ...datePicker_anatomy.parts.row.attrs, ...props, ref }));
+const DatePickerRow = react.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { role: "row", ...datePicker_anatomy.parts.row.attrs, ...props, ref }));
+DatePickerRow.displayName = "DatePickerRow";
 
 exports.DatePickerRow = DatePickerRow;

package/date-picker/date-picker-row.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerRowProps = HTMLArkProps<'div'>;
-export declare const DatePickerRow: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerRowProps = ComponentPropsWithoutRef<typeof ark.div>;
+export declare const DatePickerRow: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLDivElement>>;

package/date-picker/date-picker-row.mjs

@@ -1,9 +1,10 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { parts } from './date-picker.anatomy.mjs';
 
 const DatePickerRow = forwardRef((props, ref) => /* @__PURE__ */ jsx(ark.div, { role: "row", ...parts.row.attrs, ...props, ref }));
+DatePickerRow.displayName = "DatePickerRow";
 
 export { DatePickerRow };

package/date-picker/date-picker-trigger.cjs

@@ -4,15 +4,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerTrigger = forwardRef.forwardRef((props, ref) => {
-  const { triggerProps } = datePickerContext.useDatePickerContext();
-  const mergedProps = react.mergeProps(triggerProps, props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-});
+const DatePickerTrigger = react.forwardRef(
+  (props, ref) => {
+    const { triggerProps } = datePickerContext.useDatePickerContext();
+    const mergedProps = react$1.mergeProps(triggerProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
+DatePickerTrigger.displayName = "DatePickerTrigger";
 
 exports.DatePickerTrigger = DatePickerTrigger;

package/date-picker/date-picker-trigger.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerTriggerProps = HTMLArkProps<'button'>;
-export declare const DatePickerTrigger: ForwardRefExoticComponent<Assign<AsChildComponentProps<"button">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
+export declare const DatePickerTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLButtonElement>>;

package/date-picker/date-picker-trigger.mjs

@@ -1,14 +1,17 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerTrigger = forwardRef((props, ref) => {
-  const { triggerProps } = useDatePickerContext();
-  const mergedProps = mergeProps(triggerProps, props);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const DatePickerTrigger = forwardRef(
+  (props, ref) => {
+    const { triggerProps } = useDatePickerContext();
+    const mergedProps = mergeProps(triggerProps, props);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+DatePickerTrigger.displayName = "DatePickerTrigger";
 
 export { DatePickerTrigger };

package/date-picker/date-picker-view-trigger.cjs

@@ -4,17 +4,23 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerViewTrigger = forwardRef.forwardRef((props, ref) => {
-  const [viewProps, localProps] = createSplitProps.createSplitProps()(props, ["view"]);
-  const { getViewTriggerProps, view } = datePickerContext.useDatePickerContext();
-  const mergedProps = react.mergeProps(getViewTriggerProps({ view: viewProps.view ?? view }), localProps);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
-});
+const DatePickerViewTrigger = react.forwardRef(
+  (props, ref) => {
+    const [viewProps, localProps] = createSplitProps.createSplitProps()(props, ["view"]);
+    const { getViewTriggerProps, view } = datePickerContext.useDatePickerContext();
+    const mergedProps = react$1.mergeProps(
+      getViewTriggerProps({ view: viewProps.view ?? view }),
+      localProps
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
+DatePickerViewTrigger.displayName = "DatePickerViewTrigger";
 
 exports.DatePickerViewTrigger = DatePickerViewTrigger;

package/date-picker/date-picker-view-trigger.d.ts

@@ -1,6 +1,10 @@
-import type { ForwardRefExoticComponent } from 'react';
 import type { ViewProps } from '@zag-js/date-picker';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
 import type { Assign } from '../types';
-export type DatePickerViewTriggerProps = Assign<HTMLArkProps<'button'>, ViewProps>;
-export declare const DatePickerViewTrigger: ForwardRefExoticComponent<Assign<AsChildComponentProps<"button">, ViewProps>>;
+export type DatePickerViewTriggerProps = Assign<ComponentPropsWithoutRef<typeof ark.button>, ViewProps>;
+export declare const DatePickerViewTrigger: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, "view"> & ViewProps & RefAttributes<HTMLButtonElement>>;

package/date-picker/date-picker-view-trigger.mjs

@@ -1,16 +1,22 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerViewTrigger = forwardRef((props, ref) => {
-  const [viewProps, localProps] = createSplitProps()(props, ["view"]);
-  const { getViewTriggerProps, view } = useDatePickerContext();
-  const mergedProps = mergeProps(getViewTriggerProps({ view: viewProps.view ?? view }), localProps);
-  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
-});
+const DatePickerViewTrigger = forwardRef(
+  (props, ref) => {
+    const [viewProps, localProps] = createSplitProps()(props, ["view"]);
+    const { getViewTriggerProps, view } = useDatePickerContext();
+    const mergedProps = mergeProps(
+      getViewTriggerProps({ view: viewProps.view ?? view }),
+      localProps
+    );
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+DatePickerViewTrigger.displayName = "DatePickerViewTrigger";
 
 export { DatePickerViewTrigger };

package/date-picker/date-picker-year-cell-trigger.cjs

@@ -4,17 +4,18 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerCellContext = require('./date-picker-cell-context.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerYearCellTrigger = forwardRef.forwardRef((props, ref) => {
+const DatePickerYearCellTrigger = react.forwardRef((props, ref) => {
   const { getYearCellTriggerProps } = datePickerContext.useDatePickerContext();
   const cellProps = datePickerCellContext.useDatePickerCellContext();
-  const mergedProps = react.mergeProps(getYearCellTriggerProps(cellProps), props);
+  const mergedProps = react$1.mergeProps(getYearCellTriggerProps(cellProps), props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
 });
+DatePickerYearCellTrigger.displayName = "DatePickerYearCellTrigger";
 
 exports.DatePickerYearCellTrigger = DatePickerYearCellTrigger;

package/date-picker/date-picker-year-cell-trigger.d.ts

@@ -1,5 +1,8 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerYearCellTriggerProps = HTMLArkProps<'button'>;
-export declare const DatePickerYearCellTrigger: ForwardRefExoticComponent<Assign<AsChildComponentProps<"button">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerYearCellTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
+export declare const DatePickerYearCellTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLButtonElement>>;

package/date-picker/date-picker-year-cell-trigger.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerCellContext } from './date-picker-cell-context.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
@@ -12,5 +12,6 @@ const DatePickerYearCellTrigger = forwardRef((props, ref) => {
   const mergedProps = mergeProps(getYearCellTriggerProps(cellProps), props);
   return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
 });
+DatePickerYearCellTrigger.displayName = "DatePickerYearCellTrigger";
 
 export { DatePickerYearCellTrigger };

package/date-picker/date-picker-year-cell.cjs

@@ -4,18 +4,21 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerCellContext = require('./date-picker-cell-context.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerYearCell = forwardRef.forwardRef((props, ref) => {
-  const { getYearCellProps } = datePickerContext.useDatePickerContext();
-  const [cellProps, localProps] = createSplitProps.createSplitProps()(props, ["value", "disabled"]);
-  const mergedProps = react.mergeProps(getYearCellProps(cellProps), localProps);
-  return /* @__PURE__ */ jsxRuntime.jsx(datePickerCellContext.DatePickerCellProvider, { value: cellProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
-});
+const DatePickerYearCell = react.forwardRef(
+  (props, ref) => {
+    const { getYearCellProps } = datePickerContext.useDatePickerContext();
+    const [cellProps, localProps] = createSplitProps.createSplitProps()(props, ["value", "disabled"]);
+    const mergedProps = react$1.mergeProps(getYearCellProps(cellProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(datePickerCellContext.DatePickerCellProvider, { value: cellProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+  }
+);
+DatePickerYearCell.displayName = "DatePickerYearCell";
 
 exports.DatePickerYearCell = DatePickerYearCell;

package/date-picker/date-picker-year-cell.d.ts

@@ -1,6 +1,10 @@
-import type { ForwardRefExoticComponent } from 'react';
 import type { CellProps } from '@zag-js/date-picker';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
+import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
 import type { Assign } from '../types';
-export type DatePickerYearCellProps = Assign<HTMLArkProps<'div'>, CellProps>;
-export declare const DatePickerYearCell: ForwardRefExoticComponent<Assign<AsChildComponentProps<"div">, CellProps>>;
+export type DatePickerYearCellProps = Assign<ComponentPropsWithoutRef<typeof ark.div>, CellProps>;
+export declare const DatePickerYearCell: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref">, keyof CellProps> & CellProps & RefAttributes<HTMLDivElement>>;

package/date-picker/date-picker-year-cell.mjs

@@ -1,17 +1,20 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { DatePickerCellProvider } from './date-picker-cell-context.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerYearCell = forwardRef((props, ref) => {
-  const { getYearCellProps } = useDatePickerContext();
-  const [cellProps, localProps] = createSplitProps()(props, ["value", "disabled"]);
-  const mergedProps = mergeProps(getYearCellProps(cellProps), localProps);
-  return /* @__PURE__ */ jsx(DatePickerCellProvider, { value: cellProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
-});
+const DatePickerYearCell = forwardRef(
+  (props, ref) => {
+    const { getYearCellProps } = useDatePickerContext();
+    const [cellProps, localProps] = createSplitProps()(props, ["value", "disabled"]);
+    const mergedProps = mergeProps(getYearCellProps(cellProps), localProps);
+    return /* @__PURE__ */ jsx(DatePickerCellProvider, { value: cellProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+  }
+);
+DatePickerYearCell.displayName = "DatePickerYearCell";
 
 export { DatePickerYearCell };

package/date-picker/date-picker-year-select.cjs

@@ -4,16 +4,19 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const DatePickerYearSelect = forwardRef.forwardRef((props, ref) => {
-  const { yearSelectProps } = datePickerContext.useDatePickerContext();
-  const mergedProps = react.mergeProps(yearSelectProps, props);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.select, { ...mergedProps, ref, children: getYearsRange({ from: 1e3, to: 4e3 }).map((year, i) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: year, children: year }, i)) });
-});
+const DatePickerYearSelect = react.forwardRef(
+  (props, ref) => {
+    const { yearSelectProps } = datePickerContext.useDatePickerContext();
+    const mergedProps = react$1.mergeProps(yearSelectProps, props);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.select, { ...mergedProps, ref, children: getYearsRange({ from: 1e3, to: 4e3 }).map((year, i) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: year, children: year }, i)) });
+  }
+);
+DatePickerYearSelect.displayName = "DatePickerYearSelect";
 function getYearsRange(range) {
   const years = [];
   for (let year = range.from; year <= range.to; year += 1) {

package/date-picker/date-picker-year-select.d.ts

@@ -1,8 +1,11 @@
-import type { Assign } from '../types';
-import type { ForwardRefExoticComponent } from 'react';
-import type { AsChildComponentProps, type HTMLArkProps } from '../factory';
-export type DatePickerYearSelectProps = HTMLArkProps<'select'>;
-export declare const DatePickerYearSelect: ForwardRefExoticComponent<Assign<AsChildComponentProps<"select">, Record<never, never>>>;
+import type { ForwardRefExoticComponent, DetailedHTMLProps, SelectHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ark } from '../factory';
+export type DatePickerYearSelectProps = ComponentPropsWithoutRef<typeof ark.select>;
+export declare const DatePickerYearSelect: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & {
+    ref?: ((instance: HTMLSelectElement | null) => void) | RefObject<HTMLSelectElement> | null | undefined;
+} & {
+    asChild?: boolean | undefined;
+}, "ref"> & RefAttributes<HTMLSelectElement>>;
 export interface YearsRange {
     from: number;
     to: number;

package/date-picker/date-picker-year-select.mjs

@@ -1,15 +1,18 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { forwardRef } from '../forward-ref.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const DatePickerYearSelect = forwardRef((props, ref) => {
-  const { yearSelectProps } = useDatePickerContext();
-  const mergedProps = mergeProps(yearSelectProps, props);
-  return /* @__PURE__ */ jsx(ark.select, { ...mergedProps, ref, children: getYearsRange({ from: 1e3, to: 4e3 }).map((year, i) => /* @__PURE__ */ jsx("option", { value: year, children: year }, i)) });
-});
+const DatePickerYearSelect = forwardRef(
+  (props, ref) => {
+    const { yearSelectProps } = useDatePickerContext();
+    const mergedProps = mergeProps(yearSelectProps, props);
+    return /* @__PURE__ */ jsx(ark.select, { ...mergedProps, ref, children: getYearsRange({ from: 1e3, to: 4e3 }).map((year, i) => /* @__PURE__ */ jsx("option", { value: year, children: year }, i)) });
+  }
+);
+DatePickerYearSelect.displayName = "DatePickerYearSelect";
 function getYearsRange(range) {
   const years = [];
   for (let year = range.from; year <= range.to; year += 1) {

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

@@ -1,3 +1,3 @@
 import type { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
-export declare const datePickerAnatomy: AnatomyInstance<"header" | "input" | "label" | "grid" | "row" | "content" | "nextTrigger" | "control" | "trigger" | "viewTrigger" | "cellTrigger" | "prevTrigger" | "clearTrigger" | "monthSelect" | "yearSelect" | "rowGroup" | "columnHeader">;
-export declare const parts: Record<"header" | "input" | "label" | "grid" | "row" | "content" | "nextTrigger" | "control" | "trigger" | "viewTrigger" | "cellTrigger" | "prevTrigger" | "clearTrigger" | "monthSelect" | "yearSelect" | "rowGroup" | "columnHeader", AnatomyPart>;
+export declare const datePickerAnatomy: AnatomyInstance<"header" | "input" | "label" | "content" | "grid" | "row" | "nextTrigger" | "control" | "trigger" | "viewTrigger" | "cellTrigger" | "prevTrigger" | "clearTrigger" | "monthSelect" | "yearSelect" | "rowGroup" | "columnHeader">;
+export declare const parts: Record<"header" | "input" | "label" | "content" | "grid" | "row" | "nextTrigger" | "control" | "trigger" | "viewTrigger" | "cellTrigger" | "prevTrigger" | "clearTrigger" | "monthSelect" | "yearSelect" | "rowGroup" | "columnHeader", AnatomyPart>;

package/date-picker/use-date-picker.cjs

@@ -4,8 +4,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const datePicker = require('@zag-js/date-picker');
-const react = require('@zag-js/react');
-const React = require('react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {
@@ -30,12 +30,12 @@ const datePicker__namespace = /*#__PURE__*/_interopNamespaceDefault(datePicker);
 const useDatePicker = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
   const context = {
-    id: React.useId(),
+    id: react.useId(),
     getRootNode,
     ...props
   };
-  const [state, send] = react.useMachine(datePicker__namespace.machine(context), { context });
-  return datePicker__namespace.connect(state, send, react.normalizeProps);
+  const [state, send] = react$1.useMachine(datePicker__namespace.machine(context), { context });
+  return datePicker__namespace.connect(state, send, react$1.normalizeProps);
 };
 
 exports.useDatePicker = useDatePicker;

package/dialog/dialog-backdrop.cjs

@@ -4,17 +4,19 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const react = require('@zag-js/react');
+const react$1 = require('@zag-js/react');
+const react = require('react');
 const factory = require('../factory.cjs');
-const forwardRef = require('../forward-ref.cjs');
 const dialogContext = require('./dialog-context.cjs');
 const dialogPresence = require('./dialog-presence.cjs');
 
-const DialogBackdrop = forwardRef.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(dialogPresence.DialogPresence, { children: /* @__PURE__ */ jsxRuntime.jsx(InnerDialogBackdrop, { ref, ...props }) }));
-const InnerDialogBackdrop = forwardRef.forwardRef((props, ref) => {
+const DialogBackdrop = react.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(dialogPresence.DialogPresence, { children: /* @__PURE__ */ jsxRuntime.jsx(InnerDialogBackdrop, { ref, ...props }) }));
+DialogBackdrop.displayName = "DialogBackdrop";
+const InnerDialogBackdrop = react.forwardRef((props, ref) => {
   const { backdropProps } = dialogContext.useDialogContext();
-  const mergedProps = react.mergeProps(backdropProps, props);
+  const mergedProps = react$1.mergeProps(backdropProps, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
 });
+InnerDialogBackdrop.displayName = "InnerDialogBackdrop";
 
 exports.DialogBackdrop = DialogBackdrop;