@ark-ui/react 0.10.0 → 0.11.0-beta.1

package/date-picker/index.d.ts

@@ -1,26 +1,146 @@
-export { DatePicker, type DatePickerProps } from './date-picker';
-export { useDatePickerCellContext } from './date-picker-cell-context';
-export { DatePickerClearTrigger, type DatePickerClearTriggerProps, } from './date-picker-clear-trigger';
-export { DatePickerColumnHeader, type DatePickerColumnHeaderProps, } from './date-picker-column-header';
-export { DatePickerContent, type DatePickerContentProps } from './date-picker-content';
-export { useDatePickerContext } from './date-picker-context';
-export { DatePickerControl, type DatePickerControlProps } from './date-picker-control';
-export { DatePickerDayCell, type DatePickerDayCellProps } from './date-picker-day-cell';
-export { useDatePickerDayCellContext } from './date-picker-day-cell-context';
-export { DatePickerDayCellTrigger, type DatePickerDayCellTriggerProps, } from './date-picker-day-cell-trigger';
-export { DatePickerGrid, type DatePickerGridProps } from './date-picker-grid';
-export { DatePickerInput, type DatePickerInputProps } from './date-picker-input';
-export { DatePickerMonthCell, type DatePickerMonthCellProps } from './date-picker-month-cell';
-export { DatePickerMonthCellTrigger, type DatePickerMonthCellTriggerProps, } from './date-picker-month-cell-trigger';
-export { DatePickerMonthSelect, type DatePickerMonthSelectProps } from './date-picker-month-select';
-export { DatePickerNextTrigger, type DatePickerNextTriggerProps } from './date-picker-next-trigger';
-export { DatePickerPrevTrigger, type DatePickerPrevTriggerProps } from './date-picker-prev-trigger';
-export { DatePickerRow, type DatePickerRowProps } from './date-picker-row';
-export { DatePickerRowGroup, type DatePickerRowGroupProps } from './date-picker-row-group';
-export { DatePickerRowHeader, type DatePickerRowHeaderProps } from './date-picker-row-header';
-export { DatePickerTrigger, type DatePickerTriggerProps } from './date-picker-trigger';
-export { DatePickerViewTrigger, type DatePickerViewTriggerProps } from './date-picker-view-trigger';
-export { DatePickerYearCell, type DatePickerYearCellProps } from './date-picker-year-cell';
-export { DatePickerYearCellTrigger, type DatePickerYearCellTriggerProps, } from './date-picker-year-cell-trigger';
-export { DatePickerYearSelect, type DatePickerYearSelectProps } from './date-picker-year-select';
-export { datePickerAnatomy } from './date-picker.anatomy';
+import { DayCellProps, GridProps, CellProps, ViewProps } from '@zag-js/date-picker';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, HTMLAttributes, InputHTMLAttributes, SelectHTMLAttributes } from 'react';
+import { JSX } from 'react/jsx-runtime';
+/// <reference types="react" />
+import { type DatePickerProps } from './date-picker';
+import { useDatePickerCellContext } from './date-picker-cell-context';
+import { DatePickerClearTrigger, type DatePickerClearTriggerProps } from './date-picker-clear-trigger';
+import { DatePickerColumnHeader, type DatePickerColumnHeaderProps } from './date-picker-column-header';
+import { DatePickerContent, type DatePickerContentProps } from './date-picker-content';
+import { useDatePickerContext } from './date-picker-context';
+import { DatePickerControl, type DatePickerControlProps } from './date-picker-control';
+import { DatePickerDayCell, type DatePickerDayCellProps } from './date-picker-day-cell';
+import { useDatePickerDayCellContext } from './date-picker-day-cell-context';
+import { DatePickerDayCellTrigger, type DatePickerDayCellTriggerProps } from './date-picker-day-cell-trigger';
+import { DatePickerGrid, type DatePickerGridProps } from './date-picker-grid';
+import { DatePickerInput, type DatePickerInputProps } from './date-picker-input';
+import { DatePickerMonthCell, type DatePickerMonthCellProps } from './date-picker-month-cell';
+import { DatePickerMonthCellTrigger, type DatePickerMonthCellTriggerProps } from './date-picker-month-cell-trigger';
+import { DatePickerMonthSelect, type DatePickerMonthSelectProps } from './date-picker-month-select';
+import { DatePickerNextTrigger, type DatePickerNextTriggerProps } from './date-picker-next-trigger';
+import { DatePickerPositioner, type DatePickerPositionerProps } from './date-picker-positioner';
+import { DatePickerPrevTrigger, type DatePickerPrevTriggerProps } from './date-picker-prev-trigger';
+import { DatePickerRow, type DatePickerRowProps } from './date-picker-row';
+import { DatePickerRowGroup, type DatePickerRowGroupProps } from './date-picker-row-group';
+import { DatePickerRowHeader, type DatePickerRowHeaderProps } from './date-picker-row-header';
+import { DatePickerTrigger, type DatePickerTriggerProps } from './date-picker-trigger';
+import { DatePickerViewTrigger, type DatePickerViewTriggerProps } from './date-picker-view-trigger';
+import { DatePickerYearCell, type DatePickerYearCellProps } from './date-picker-year-cell';
+import { DatePickerYearCellTrigger, type DatePickerYearCellTriggerProps } from './date-picker-year-cell-trigger';
+import { DatePickerYearSelect, type DatePickerYearSelectProps } from './date-picker-year-select';
+import { datePickerAnatomy } from './date-picker.anatomy';
+declare const DatePicker: ((props: DatePickerProps) => JSX.Element) & {
+    Root: (props: DatePickerProps) => JSX.Element;
+    ClearTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    ColumnHeader: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Content: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Control: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    DayCell: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, keyof DayCellProps> & DayCellProps & RefAttributes<HTMLDivElement>>;
+    DayCellTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Grid: ForwardRefExoticComponent<Omit<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref">, keyof GridProps> & GridProps & RefAttributes<HTMLDivElement>>;
+    Input: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+        ref?: ((instance: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLInputElement>>;
+    MonthCell: 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>>;
+    MonthCellTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    MonthSelect: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & {
+        ref?: ((instance: HTMLSelectElement | null) => void) | RefObject<HTMLSelectElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLSelectElement>>;
+    NextTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Positioner: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    PrevTrigger: 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>>;
+    Row: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    RowGroup: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    RowHeader: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Trigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    ViewTrigger: 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>>;
+    YearCell: 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>>;
+    YearCellTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    YearSelect: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, "ref"> & {
+        ref?: ((instance: HTMLSelectElement | null) => void) | RefObject<HTMLSelectElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLSelectElement>>;
+};
+export { DatePicker, DatePickerClearTrigger, DatePickerColumnHeader, DatePickerContent, DatePickerControl, DatePickerDayCell, DatePickerDayCellTrigger, DatePickerGrid, DatePickerInput, DatePickerMonthCell, DatePickerMonthCellTrigger, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRow, DatePickerRowGroup, DatePickerRowHeader, DatePickerTrigger, DatePickerViewTrigger, DatePickerYearCell, DatePickerYearCellTrigger, DatePickerYearSelect, datePickerAnatomy, useDatePickerCellContext, useDatePickerContext, useDatePickerDayCellContext, };
+export type { DatePickerClearTriggerProps, DatePickerColumnHeaderProps, DatePickerContentProps, DatePickerControlProps, DatePickerDayCellProps, DatePickerDayCellTriggerProps, DatePickerGridProps, DatePickerInputProps, DatePickerMonthCellProps, DatePickerMonthCellTriggerProps, DatePickerMonthSelectProps, DatePickerNextTriggerProps, DatePickerPositionerProps, DatePickerPrevTriggerProps, DatePickerProps, DatePickerRowGroupProps, DatePickerRowHeaderProps, DatePickerRowProps, DatePickerTriggerProps, DatePickerViewTriggerProps, DatePickerYearCellProps, DatePickerYearCellTriggerProps, DatePickerYearSelectProps, };

package/date-picker/index.mjs

@@ -1,26 +1,55 @@
-export { DatePicker } from './date-picker.mjs';
+import { DatePicker as DatePicker$1 } from './date-picker.mjs';
 export { useDatePickerCellContext } from './date-picker-cell-context.mjs';
-export { DatePickerClearTrigger } from './date-picker-clear-trigger.mjs';
-export { DatePickerColumnHeader } from './date-picker-column-header.mjs';
-export { DatePickerContent } from './date-picker-content.mjs';
+import { DatePickerClearTrigger } from './date-picker-clear-trigger.mjs';
+import { DatePickerColumnHeader } from './date-picker-column-header.mjs';
+import { DatePickerContent } from './date-picker-content.mjs';
 export { useDatePickerContext } from './date-picker-context.mjs';
-export { DatePickerControl } from './date-picker-control.mjs';
-export { DatePickerDayCell } from './date-picker-day-cell.mjs';
+import { DatePickerControl } from './date-picker-control.mjs';
+import { DatePickerDayCell } from './date-picker-day-cell.mjs';
 export { useDatePickerDayCellContext } from './date-picker-day-cell-context.mjs';
-export { DatePickerDayCellTrigger } from './date-picker-day-cell-trigger.mjs';
-export { DatePickerGrid } from './date-picker-grid.mjs';
-export { DatePickerInput } from './date-picker-input.mjs';
-export { DatePickerMonthCell } from './date-picker-month-cell.mjs';
-export { DatePickerMonthCellTrigger } from './date-picker-month-cell-trigger.mjs';
-export { DatePickerMonthSelect } from './date-picker-month-select.mjs';
-export { DatePickerNextTrigger } from './date-picker-next-trigger.mjs';
-export { DatePickerPrevTrigger } from './date-picker-prev-trigger.mjs';
-export { DatePickerRow } from './date-picker-row.mjs';
-export { DatePickerRowGroup } from './date-picker-row-group.mjs';
-export { DatePickerRowHeader } from './date-picker-row-header.mjs';
-export { DatePickerTrigger } from './date-picker-trigger.mjs';
-export { DatePickerViewTrigger } from './date-picker-view-trigger.mjs';
-export { DatePickerYearCell } from './date-picker-year-cell.mjs';
-export { DatePickerYearCellTrigger } from './date-picker-year-cell-trigger.mjs';
-export { DatePickerYearSelect } from './date-picker-year-select.mjs';
+import { DatePickerDayCellTrigger } from './date-picker-day-cell-trigger.mjs';
+import { DatePickerGrid } from './date-picker-grid.mjs';
+import { DatePickerInput } from './date-picker-input.mjs';
+import { DatePickerMonthCell } from './date-picker-month-cell.mjs';
+import { DatePickerMonthCellTrigger } from './date-picker-month-cell-trigger.mjs';
+import { DatePickerMonthSelect } from './date-picker-month-select.mjs';
+import { DatePickerNextTrigger } from './date-picker-next-trigger.mjs';
+import { DatePickerPositioner } from './date-picker-positioner.mjs';
+import { DatePickerPrevTrigger } from './date-picker-prev-trigger.mjs';
+import { DatePickerRow } from './date-picker-row.mjs';
+import { DatePickerRowGroup } from './date-picker-row-group.mjs';
+import { DatePickerRowHeader } from './date-picker-row-header.mjs';
+import { DatePickerTrigger } from './date-picker-trigger.mjs';
+import { DatePickerViewTrigger } from './date-picker-view-trigger.mjs';
+import { DatePickerYearCell } from './date-picker-year-cell.mjs';
+import { DatePickerYearCellTrigger } from './date-picker-year-cell-trigger.mjs';
+import { DatePickerYearSelect } from './date-picker-year-select.mjs';
 export { datePickerAnatomy } from './date-picker.anatomy.mjs';
+
+const DatePicker = Object.assign(DatePicker$1, {
+  Root: DatePicker$1,
+  ClearTrigger: DatePickerClearTrigger,
+  ColumnHeader: DatePickerColumnHeader,
+  Content: DatePickerContent,
+  Control: DatePickerControl,
+  DayCell: DatePickerDayCell,
+  DayCellTrigger: DatePickerDayCellTrigger,
+  Grid: DatePickerGrid,
+  Input: DatePickerInput,
+  MonthCell: DatePickerMonthCell,
+  MonthCellTrigger: DatePickerMonthCellTrigger,
+  MonthSelect: DatePickerMonthSelect,
+  NextTrigger: DatePickerNextTrigger,
+  Positioner: DatePickerPositioner,
+  PrevTrigger: DatePickerPrevTrigger,
+  Row: DatePickerRow,
+  RowGroup: DatePickerRowGroup,
+  RowHeader: DatePickerRowHeader,
+  Trigger: DatePickerTrigger,
+  ViewTrigger: DatePickerViewTrigger,
+  YearCell: DatePickerYearCell,
+  YearCellTrigger: DatePickerYearCellTrigger,
+  YearSelect: DatePickerYearSelect
+});
+
+export { DatePicker, DatePickerClearTrigger, DatePickerColumnHeader, DatePickerContent, DatePickerControl, DatePickerDayCell, DatePickerDayCellTrigger, DatePickerGrid, DatePickerInput, DatePickerMonthCell, DatePickerMonthCellTrigger, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRow, DatePickerRowGroup, DatePickerRowHeader, DatePickerTrigger, DatePickerViewTrigger, DatePickerYearCell, DatePickerYearCellTrigger, DatePickerYearSelect };

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

@@ -6,6 +6,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const datePicker = require('@zag-js/date-picker');
 const react$1 = require('@zag-js/react');
 const react = require('react');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

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

@@ -1,4 +1,5 @@
-import type { HTMLAttributes, CSSProperties } from 'react';
+import { HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import * as datePicker from '@zag-js/date-picker';
 import type { Optional } from '../types';
 export type UseDatePickerProps = Optional<datePicker.Context, 'id'>;

package/date-picker/use-date-picker.mjs

@@ -2,6 +2,7 @@
 import * as datePicker from '@zag-js/date-picker';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useDatePicker = (props) => {

package/dialog/dialog-backdrop.d.ts

@@ -1,5 +1,5 @@
-import type { PresenceProps } from '..';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { PresenceProps } from '..';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import { type DialogPresenceProps } from './dialog-presence';
 export type DialogBackdropProps = ComponentPropsWithoutRef<typeof ark.div> & Omit<DialogPresenceProps, 'children'>;

package/dialog/dialog-close-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type DialogCloseTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const DialogCloseTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/dialog/dialog-container.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type DialogContainerProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const DialogContainer: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {

package/dialog/dialog-content.cjs

@@ -7,9 +7,10 @@ const jsxRuntime = require('react/jsx-runtime');
 const react$1 = require('@zag-js/react');
 const react = require('react');
 const factory = require('../factory.cjs');
-const splitPresenceProps = require('../presence/split-presence-props.cjs');
+require('../presence/index.cjs');
 const dialogContext = require('./dialog-context.cjs');
 const dialogPresence = require('./dialog-presence.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
 
 const DialogContent = react.forwardRef((props, ref) => {
   const [presenceProps, dialogContentProps] = splitPresenceProps.splitPresenceProps(props);

package/dialog/dialog-content.d.ts

@@ -1,5 +1,5 @@
-import type { PresenceProps } from '../presence';
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { PresenceProps } from '../presence';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 import { type DialogPresenceProps } from './dialog-presence';
 export type DialogContentProps = ComponentPropsWithoutRef<typeof ark.div> & Omit<DialogPresenceProps, 'children'>;

package/dialog/dialog-content.mjs

@@ -3,9 +3,10 @@ import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import { splitPresenceProps } from '../presence/split-presence-props.mjs';
+import '../presence/index.mjs';
 import { useDialogContext } from './dialog-context.mjs';
 import { DialogPresence } from './dialog-presence.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 
 const DialogContent = forwardRef((props, ref) => {
   const [presenceProps, dialogContentProps] = splitPresenceProps(props);

package/dialog/dialog-context.d.ts

@@ -1,5 +1,6 @@
-import type { PublicApi } from '@zag-js/dialog';
-import type { Provider, HTMLAttributes, CSSProperties } from 'react';
+import { PublicApi } from '@zag-js/dialog';
+import { Provider, HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import { type UseDialogReturn } from './use-dialog';
 export type DialogContext = UseDialogReturn;
 export declare const DialogProvider: Provider<PublicApi<JSX.IntrinsicElements & {

package/dialog/dialog-description.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type DialogDescriptionProps = ComponentPropsWithoutRef<typeof ark.p>;
 export declare const DialogDescription: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {

package/dialog/dialog-presence.cjs

@@ -4,13 +4,13 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const presence = require('../presence/presence.cjs');
+const index = require('../presence/index.cjs');
 const dialogContext = require('./dialog-context.cjs');
 
 const DialogPresence = (props) => {
   const { present, ...rest } = props;
   const { isOpen } = dialogContext.useDialogContext();
-  return /* @__PURE__ */ jsxRuntime.jsx(presence.Presence, { present: present !== void 0 ? present : isOpen, ...rest });
+  return /* @__PURE__ */ jsxRuntime.jsx(index.Presence, { present: present !== void 0 ? present : isOpen, ...rest });
 };
 
 exports.DialogPresence = DialogPresence;

package/dialog/dialog-presence.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react/jsx-runtime';
 import { type PresenceProps } from '../presence';
 export type DialogPresenceProps = PresenceProps;
 export declare const DialogPresence: (props: DialogPresenceProps) => JSX.Element;

package/dialog/dialog-presence.mjs

@@ -1,6 +1,6 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
-import { Presence } from '../presence/presence.mjs';
+import { Presence } from '../presence/index.mjs';
 import { useDialogContext } from './dialog-context.mjs';
 
 const DialogPresence = (props) => {

package/dialog/dialog-title.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type DialogTitleProps = ComponentPropsWithoutRef<typeof ark.h2>;
 export declare const DialogTitle: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {

package/dialog/dialog-trigger.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type DialogTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
 export declare const DialogTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {

package/dialog/dialog.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'react/jsx-runtime';
+import { JSX } from 'react/jsx-runtime';
 import { type ReactNode } from 'react';
 import { type Assign } from '../types';
 import { type DialogContext } from './dialog-context';

package/dialog/dialog.stories.d.ts

@@ -0,0 +1,10 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+import { Dialog } from './';
+type DialogType = typeof Dialog;
+declare const meta: Meta<DialogType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Controlled: () => JSX.Element;
+export declare const LazyMount: () => JSX.Element;
+export declare const RenderFn: () => JSX.Element;

package/dialog/dialog.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dialog/index.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const dialog = require('./dialog.cjs');
+const dialog$1 = require('./dialog.cjs');
 const dialogBackdrop = require('./dialog-backdrop.cjs');
 const dialogCloseTrigger = require('./dialog-close-trigger.cjs');
 const dialogContainer = require('./dialog-container.cjs');
@@ -11,11 +11,19 @@ const dialogContext = require('./dialog-context.cjs');
 const dialogDescription = require('./dialog-description.cjs');
 const dialogTitle = require('./dialog-title.cjs');
 const dialogTrigger = require('./dialog-trigger.cjs');
-const dialog$1 = require('@zag-js/dialog');
-
+const dialog = require('@zag-js/dialog');
 
+const Dialog = Object.assign(dialog$1.Dialog, {
+  Root: dialog$1.Dialog,
+  Backdrop: dialogBackdrop.DialogBackdrop,
+  CloseTrigger: dialogCloseTrigger.DialogCloseTrigger,
+  Container: dialogContainer.DialogContainer,
+  Content: dialogContent.DialogContent,
+  Description: dialogDescription.DialogDescription,
+  Title: dialogTitle.DialogTitle,
+  Trigger: dialogTrigger.DialogTrigger
+});
 
-exports.Dialog = dialog.Dialog;
 exports.DialogBackdrop = dialogBackdrop.DialogBackdrop;
 exports.DialogCloseTrigger = dialogCloseTrigger.DialogCloseTrigger;
 exports.DialogContainer = dialogContainer.DialogContainer;
@@ -25,6 +33,7 @@ exports.DialogDescription = dialogDescription.DialogDescription;
 exports.DialogTitle = dialogTitle.DialogTitle;
 exports.DialogTrigger = dialogTrigger.DialogTrigger;
 Object.defineProperty(exports, 'dialogAnatomy', {
-	enumerable: true,
-	get: () => dialog$1.anatomy
+  enumerable: true,
+  get: () => dialog.anatomy
 });
+exports.Dialog = Dialog;

package/dialog/index.d.ts

@@ -1,10 +1,54 @@
-export { Dialog, type DialogProps } from './dialog';
-export { DialogBackdrop, type DialogBackdropProps } from './dialog-backdrop';
-export { DialogCloseTrigger, type DialogCloseTriggerProps } from './dialog-close-trigger';
-export { DialogContainer, type DialogContainerProps } from './dialog-container';
-export { DialogContent, type DialogContentProps } from './dialog-content';
-export { useDialogContext } from './dialog-context';
-export { DialogDescription, type DialogDescriptionProps } from './dialog-description';
-export { DialogTitle, type DialogTitleProps } from './dialog-title';
-export { DialogTrigger, type DialogTriggerProps } from './dialog-trigger';
-export { dialogAnatomy } from './dialog.anatomy';
+import { PresenceProps } from '..';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, ButtonHTMLAttributes } from 'react';
+import { JSX } from 'react/jsx-runtime';
+/// <reference types="react" />
+import { type DialogProps } from './dialog';
+import { DialogBackdrop, type DialogBackdropProps } from './dialog-backdrop';
+import { DialogCloseTrigger, type DialogCloseTriggerProps } from './dialog-close-trigger';
+import { DialogContainer, type DialogContainerProps } from './dialog-container';
+import { DialogContent, type DialogContentProps } from './dialog-content';
+import { useDialogContext } from './dialog-context';
+import { DialogDescription, type DialogDescriptionProps } from './dialog-description';
+import { DialogTitle, type DialogTitleProps } from './dialog-title';
+import { DialogTrigger, type DialogTriggerProps } from './dialog-trigger';
+import { dialogAnatomy } from './dialog.anatomy';
+declare const Dialog: ((props: DialogProps) => JSX.Element) & {
+    Root: (props: DialogProps) => JSX.Element;
+    Backdrop: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
+    CloseTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    Container: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLDivElement>>;
+    Content: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
+    Description: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+        ref?: ((instance: HTMLParagraphElement | null) => void) | RefObject<HTMLParagraphElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLParagraphElement>>;
+    Title: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
+        ref?: ((instance: HTMLHeadingElement | null) => void) | RefObject<HTMLHeadingElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLHeadingElement>>;
+    Trigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
+    } & {
+        asChild?: boolean | undefined;
+    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+};
+export { Dialog, DialogBackdrop, DialogCloseTrigger, DialogContainer, DialogContent, DialogDescription, DialogTitle, DialogTrigger, dialogAnatomy, useDialogContext, };
+export type { DialogBackdropProps, DialogCloseTriggerProps, DialogContainerProps, DialogContentProps, DialogDescriptionProps, DialogProps, DialogTitleProps, DialogTriggerProps, };

package/dialog/index.mjs

@@ -1,10 +1,23 @@
-export { Dialog } from './dialog.mjs';
-export { DialogBackdrop } from './dialog-backdrop.mjs';
-export { DialogCloseTrigger } from './dialog-close-trigger.mjs';
-export { DialogContainer } from './dialog-container.mjs';
-export { DialogContent } from './dialog-content.mjs';
+import { Dialog as Dialog$1 } from './dialog.mjs';
+import { DialogBackdrop } from './dialog-backdrop.mjs';
+import { DialogCloseTrigger } from './dialog-close-trigger.mjs';
+import { DialogContainer } from './dialog-container.mjs';
+import { DialogContent } from './dialog-content.mjs';
 export { useDialogContext } from './dialog-context.mjs';
-export { DialogDescription } from './dialog-description.mjs';
-export { DialogTitle } from './dialog-title.mjs';
-export { DialogTrigger } from './dialog-trigger.mjs';
+import { DialogDescription } from './dialog-description.mjs';
+import { DialogTitle } from './dialog-title.mjs';
+import { DialogTrigger } from './dialog-trigger.mjs';
 export { anatomy as dialogAnatomy } from '@zag-js/dialog';
+
+const Dialog = Object.assign(Dialog$1, {
+  Root: Dialog$1,
+  Backdrop: DialogBackdrop,
+  CloseTrigger: DialogCloseTrigger,
+  Container: DialogContainer,
+  Content: DialogContent,
+  Description: DialogDescription,
+  Title: DialogTitle,
+  Trigger: DialogTrigger
+});
+
+export { Dialog, DialogBackdrop, DialogCloseTrigger, DialogContainer, DialogContent, DialogDescription, DialogTitle, DialogTrigger };

package/dialog/use-dialog.cjs

@@ -6,6 +6,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const dialog = require('@zag-js/dialog');
 const react$1 = require('@zag-js/react');
 const react = require('react');
+require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
 
 function _interopNamespaceDefault(e) {

package/dialog/use-dialog.d.ts

@@ -1,4 +1,5 @@
-import type { HTMLAttributes, CSSProperties } from 'react';
+import { HTMLAttributes, CSSProperties } from 'react';
+/// <reference types="react" />
 import * as dialog from '@zag-js/dialog';
 import { type Optional } from '../types';
 export type UseDialogProps = Optional<dialog.Context, 'id'>;

package/dialog/use-dialog.mjs

@@ -2,6 +2,7 @@
 import * as dialog from '@zag-js/dialog';
 import { useMachine, normalizeProps } from '@zag-js/react';
 import { useId } from 'react';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useDialog = (props) => {

package/editable/editable-area.d.ts

@@ -1,4 +1,4 @@
-import type { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
 import { ark } from '../factory';
 export type EditableAreaProps = ComponentPropsWithoutRef<typeof ark.div>;
 export declare const EditableArea: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {