@ark-ui/solid 0.8.1 → 0.10.0

package/date-picker/date-picker-positioner.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerPositioner = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().positionerProps, props);
+  return web.createComponent(factory.ark.div, mergedProps);
+};
+
+exports.DatePickerPositioner = DatePickerPositioner;

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

@@ -0,0 +1,4 @@
+import { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type DatePickerPositionerProps = HTMLArkProps<'div'>;
+export declare const DatePickerPositioner: (props: DatePickerPositionerProps) => JSX.Element;

package/date-picker/date-picker-positioner.mjs

@@ -0,0 +1,12 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerPositioner = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().positionerProps, props);
+  return createComponent(ark.div, mergedProps);
+};
+
+export { DatePickerPositioner };

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerPrevTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerPrevTrigger: (props: DatePickerPrevTriggerProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerRowGroupProps = HTMLArkProps<'div'>;
 export declare const DatePickerRowGroup: (props: DatePickerRowGroupProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerRowHeaderProps = HTMLArkProps<'div'>;
 export declare const DatePickerRowHeader: (props: DatePickerRowHeaderProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerRowProps = HTMLArkProps<'div'>;
 export declare const DatePickerRow: (props: DatePickerRowProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerTrigger: (props: DatePickerTriggerProps) => JSX.Element;

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

@@ -1,5 +1,5 @@
-import type { JSX } from 'solid-js';
-import type { ViewProps } from '@zag-js/date-picker/dist/date-picker.types';
+import { JSX } from 'solid-js';
+import type { ViewProps } from '@zag-js/date-picker';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 export type DatePickerViewTriggerProps = Assign<HTMLArkProps<'button'>, ViewProps>;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerYearCellTriggerProps = HTMLArkProps<'button'>;
 export declare const DatePickerYearCellTrigger: (props: DatePickerYearCellTriggerProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import type { CellProps } from '@zag-js/date-picker';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';

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

@@ -8,7 +8,7 @@ const solidJs = require('solid-js');
 const factory = require('../factory.cjs');
 const datePickerContext = require('./date-picker-context.cjs');
 
-const _tmpl$ = ["<option", ">", "</option>"];
+const _tmpl$ = /*#__PURE__*/web.template(`<option>`);
 const DatePickerYearSelect = props => {
   const datePicker = datePickerContext.useDatePickerContext();
   const mergedProps = solid.mergeProps(() => datePicker().yearSelectProps, props);
@@ -21,7 +21,12 @@ const DatePickerYearSelect = props => {
             to: 4_000
           });
         },
-        children: year => web.ssr(_tmpl$, web.ssrHydrationKey() + web.ssrAttribute("value", web.escape(year, true), false), web.escape(year))
+        children: year => (() => {
+          const _el$ = _tmpl$();
+          _el$.value = year;
+          web.insert(_el$, year);
+          return _el$;
+        })()
       });
     }
   }));

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DatePickerYearSelectProps = HTMLArkProps<'select'>;
 export declare const DatePickerYearSelect: (props: DatePickerYearSelectProps) => JSX.Element;

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

@@ -1,10 +1,10 @@
-import { createComponent, mergeProps as mergeProps$1, ssr, ssrHydrationKey, ssrAttribute, escape } from 'solid-js/web';
+import { createComponent, mergeProps as mergeProps$1, insert, template } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
 import { For } from 'solid-js';
 import { ark } from '../factory.mjs';
 import { useDatePickerContext } from './date-picker-context.mjs';
 
-const _tmpl$ = ["<option", ">", "</option>"];
+const _tmpl$ = /*#__PURE__*/template(`<option>`);
 const DatePickerYearSelect = props => {
   const datePicker = useDatePickerContext();
   const mergedProps = mergeProps(() => datePicker().yearSelectProps, props);
@@ -17,7 +17,12 @@ const DatePickerYearSelect = props => {
             to: 4_000
           });
         },
-        children: year => ssr(_tmpl$, ssrHydrationKey() + ssrAttribute("value", escape(year, true), false), escape(year))
+        children: year => (() => {
+          const _el$ = _tmpl$();
+          _el$.value = year;
+          insert(_el$, year);
+          return _el$;
+        })()
       });
     }
   }));

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" | "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>;
+import { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
+export declare const datePickerAnatomy: AnatomyInstance<"input" | "content" | "grid" | "row" | "trigger" | "positioner" | "control" | "clearTrigger" | "cellTrigger" | "monthSelect" | "nextTrigger" | "prevTrigger" | "rowHeader" | "viewTrigger" | "yearSelect" | "rowGroup" | "columnHeader">;
+export declare const parts: Record<"input" | "content" | "grid" | "row" | "trigger" | "positioner" | "control" | "clearTrigger" | "cellTrigger" | "monthSelect" | "nextTrigger" | "prevTrigger" | "rowHeader" | "viewTrigger" | "yearSelect" | "rowGroup" | "columnHeader", AnatomyPart>;

package/date-picker/date-picker.cjs

@@ -9,7 +9,7 @@ const datePickerContext = require('./date-picker-context.cjs');
 const useDatePicker = require('./use-date-picker.cjs');
 
 const DatePicker = props => {
-  const [useDatePickerProps, localProps] = createSplitProps.createSplitProps()(props, ['dir', 'disabled', 'fixedWeeks', 'focusedValue', 'format', 'getRootNode', 'id', 'ids', 'inline', 'isDateUnavailable', 'isDateUnavailable', 'locale', 'max', 'messages', 'min', 'modal', 'name', 'numOfMonths', 'onChange', 'onFocusChange', 'onViewChange', 'parse', 'readOnly', 'selectionMode', 'startOfWeek', 'timeZone', 'value', 'view']);
+  const [useDatePickerProps, localProps] = createSplitProps.createSplitProps()(props, ['dir', 'disabled', 'fixedWeeks', 'focusedValue', 'format', 'getRootNode', 'id', 'ids', 'inline', 'isDateUnavailable', 'isDateUnavailable', 'locale', 'max', 'messages', 'min', 'modal', 'name', 'numOfMonths', 'onChange', 'onFocusChange', 'onViewChange', 'parse', 'positioning', 'readOnly', 'selectionMode', 'startOfWeek', 'timeZone', 'value', 'view']);
   const api = useDatePicker.useDatePicker(useDatePickerProps);
   const getChildren = () => runIfFn.runIfFn(localProps.children, api);
   return web.createComponent(datePickerContext.DatePickerProvider, {

package/date-picker/date-picker.mjs

@@ -5,7 +5,7 @@ import { DatePickerProvider } from './date-picker-context.mjs';
 import { useDatePicker } from './use-date-picker.mjs';
 
 const DatePicker = props => {
-  const [useDatePickerProps, localProps] = createSplitProps()(props, ['dir', 'disabled', 'fixedWeeks', 'focusedValue', 'format', 'getRootNode', 'id', 'ids', 'inline', 'isDateUnavailable', 'isDateUnavailable', 'locale', 'max', 'messages', 'min', 'modal', 'name', 'numOfMonths', 'onChange', 'onFocusChange', 'onViewChange', 'parse', 'readOnly', 'selectionMode', 'startOfWeek', 'timeZone', 'value', 'view']);
+  const [useDatePickerProps, localProps] = createSplitProps()(props, ['dir', 'disabled', 'fixedWeeks', 'focusedValue', 'format', 'getRootNode', 'id', 'ids', 'inline', 'isDateUnavailable', 'isDateUnavailable', 'locale', 'max', 'messages', 'min', 'modal', 'name', 'numOfMonths', 'onChange', 'onFocusChange', 'onViewChange', 'parse', 'positioning', 'readOnly', 'selectionMode', 'startOfWeek', 'timeZone', 'value', 'view']);
   const api = useDatePicker(useDatePickerProps);
   const getChildren = () => runIfFn(localProps.children, api);
   return createComponent(DatePickerProvider, {

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

@@ -0,0 +1,9 @@
+import { JSX } from 'solid-js';
+import type { Meta } from 'storybook-solidjs';
+import { DatePicker } from './';
+type DatePickerType = typeof DatePicker;
+declare const meta: Meta<DatePickerType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const RangeWithSingleGrid: () => JSX.Element;
+export declare const RangeWithTwoGrids: () => JSX.Element;

package/date-picker/index.cjs

@@ -3,11 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const datePicker = require('./date-picker.cjs');
+const datePickerCellContext = require('./date-picker-cell-context.cjs');
 const datePickerClearTrigger = require('./date-picker-clear-trigger.cjs');
 const datePickerColumnHeader = require('./date-picker-column-header.cjs');
 const datePickerContent = require('./date-picker-content.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
 const datePickerControl = require('./date-picker-control.cjs');
 const datePickerDayCell = require('./date-picker-day-cell.cjs');
+const datePickerDayCellContext = require('./date-picker-day-cell-context.cjs');
 const datePickerDayCellTrigger = require('./date-picker-day-cell-trigger.cjs');
 const datePickerGrid = require('./date-picker-grid.cjs');
 const datePickerInput = require('./date-picker-input.cjs');
@@ -15,6 +18,7 @@ const datePickerMonthCell = require('./date-picker-month-cell.cjs');
 const datePickerMonthCellTrigger = require('./date-picker-month-cell-trigger.cjs');
 const datePickerMonthSelect = require('./date-picker-month-select.cjs');
 const datePickerNextTrigger = require('./date-picker-next-trigger.cjs');
+const datePickerPositioner = require('./date-picker-positioner.cjs');
 const datePickerPrevTrigger = require('./date-picker-prev-trigger.cjs');
 const datePickerRow = require('./date-picker-row.cjs');
 const datePickerRowGroup = require('./date-picker-row-group.cjs');
@@ -26,14 +30,40 @@ const datePickerYearCellTrigger = require('./date-picker-year-cell-trigger.cjs')
 const datePickerYearSelect = require('./date-picker-year-select.cjs');
 const datePicker_anatomy = require('./date-picker.anatomy.cjs');
 
+const DatePicker = Object.assign(datePicker.DatePicker, {
+  Root: datePicker.DatePicker,
+  ClearTrigger: datePickerClearTrigger.DatePickerClearTrigger,
+  ColumnHeader: datePickerColumnHeader.DatePickerColumnHeader,
+  Content: datePickerContent.DatePickerContent,
+  Control: datePickerControl.DatePickerControl,
+  DayCell: datePickerDayCell.DatePickerDayCell,
+  DayCellTrigger: datePickerDayCellTrigger.DatePickerDayCellTrigger,
+  Grid: datePickerGrid.DatePickerGrid,
+  Input: datePickerInput.DatePickerInput,
+  MonthCell: datePickerMonthCell.DatePickerMonthCell,
+  MonthCellTrigger: datePickerMonthCellTrigger.DatePickerMonthCellTrigger,
+  MonthSelect: datePickerMonthSelect.DatePickerMonthSelect,
+  NextTrigger: datePickerNextTrigger.DatePickerNextTrigger,
+  Positioner: datePickerPositioner.DatePickerPositioner,
+  PrevTrigger: datePickerPrevTrigger.DatePickerPrevTrigger,
+  Row: datePickerRow.DatePickerRow,
+  RowGroup: datePickerRowGroup.DatePickerRowGroup,
+  RowHeader: datePickerRowHeader.DatePickerRowHeader,
+  Trigger: datePickerTrigger.DatePickerTrigger,
+  ViewTrigger: datePickerViewTrigger.DatePickerViewTrigger,
+  YearCell: datePickerYearCell.DatePickerYearCell,
+  YearCellTrigger: datePickerYearCellTrigger.DatePickerYearCellTrigger,
+  YearSelect: datePickerYearSelect.DatePickerYearSelect
+});
 
-
-exports.DatePicker = datePicker.DatePicker;
+exports.useDatePickerCellContext = datePickerCellContext.useDatePickerCellContext;
 exports.DatePickerClearTrigger = datePickerClearTrigger.DatePickerClearTrigger;
 exports.DatePickerColumnHeader = datePickerColumnHeader.DatePickerColumnHeader;
 exports.DatePickerContent = datePickerContent.DatePickerContent;
+exports.useDatePickerContext = datePickerContext.useDatePickerContext;
 exports.DatePickerControl = datePickerControl.DatePickerControl;
 exports.DatePickerDayCell = datePickerDayCell.DatePickerDayCell;
+exports.useDatePickerDayCellContext = datePickerDayCellContext.useDatePickerDayCellContext;
 exports.DatePickerDayCellTrigger = datePickerDayCellTrigger.DatePickerDayCellTrigger;
 exports.DatePickerGrid = datePickerGrid.DatePickerGrid;
 exports.DatePickerInput = datePickerInput.DatePickerInput;
@@ -41,6 +71,7 @@ exports.DatePickerMonthCell = datePickerMonthCell.DatePickerMonthCell;
 exports.DatePickerMonthCellTrigger = datePickerMonthCellTrigger.DatePickerMonthCellTrigger;
 exports.DatePickerMonthSelect = datePickerMonthSelect.DatePickerMonthSelect;
 exports.DatePickerNextTrigger = datePickerNextTrigger.DatePickerNextTrigger;
+exports.DatePickerPositioner = datePickerPositioner.DatePickerPositioner;
 exports.DatePickerPrevTrigger = datePickerPrevTrigger.DatePickerPrevTrigger;
 exports.DatePickerRow = datePickerRow.DatePickerRow;
 exports.DatePickerRowGroup = datePickerRowGroup.DatePickerRowGroup;
@@ -51,3 +82,4 @@ exports.DatePickerYearCell = datePickerYearCell.DatePickerYearCell;
 exports.DatePickerYearCellTrigger = datePickerYearCellTrigger.DatePickerYearCellTrigger;
 exports.DatePickerYearSelect = datePickerYearSelect.DatePickerYearSelect;
 exports.datePickerAnatomy = datePicker_anatomy.datePickerAnatomy;
+exports.DatePicker = DatePicker;

package/date-picker/index.d.ts

@@ -1,23 +1,55 @@
-export { DatePicker, type DatePickerProps } from './date-picker';
-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 { DatePickerControl, type DatePickerControlProps } from './date-picker-control';
-export { DatePickerDayCell, type DatePickerDayCellProps } from './date-picker-day-cell';
-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 { JSX } from 'solid-js';
+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: (props: DatePickerClearTriggerProps) => JSX.Element;
+    ColumnHeader: (props: DatePickerColumnHeaderProps) => JSX.Element;
+    Content: (props: DatePickerContentProps) => JSX.Element;
+    Control: (props: DatePickerControlProps) => JSX.Element;
+    DayCell: (props: DatePickerDayCellProps) => JSX.Element;
+    DayCellTrigger: (props: DatePickerDayCellTriggerProps) => JSX.Element;
+    Grid: (props: DatePickerGridProps) => JSX.Element;
+    Input: (props: DatePickerInputProps) => JSX.Element;
+    MonthCell: (props: DatePickerMonthCellProps) => JSX.Element;
+    MonthCellTrigger: (props: DatePickerMonthCellTriggerProps) => JSX.Element;
+    MonthSelect: (props: DatePickerMonthSelectProps) => JSX.Element;
+    NextTrigger: (props: DatePickerNextTriggerProps) => JSX.Element;
+    Positioner: (props: DatePickerPositionerProps) => JSX.Element;
+    PrevTrigger: (props: DatePickerPrevTriggerProps) => JSX.Element;
+    Row: (props: DatePickerRowProps) => JSX.Element;
+    RowGroup: (props: DatePickerRowGroupProps) => JSX.Element;
+    RowHeader: (props: DatePickerRowHeaderProps) => JSX.Element;
+    Trigger: (props: DatePickerTriggerProps) => JSX.Element;
+    ViewTrigger: (props: DatePickerViewTriggerProps) => JSX.Element;
+    YearCell: (props: DatePickerYearCellProps) => JSX.Element;
+    YearCellTrigger: (props: DatePickerYearCellTriggerProps) => JSX.Element;
+    YearSelect: (props: DatePickerYearSelectProps) => JSX.Element;
+};
+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,23 +1,55 @@
-export { DatePicker } from './date-picker.mjs';
-export { DatePickerClearTrigger } from './date-picker-clear-trigger.mjs';
-export { DatePickerColumnHeader } from './date-picker-column-header.mjs';
-export { DatePickerContent } from './date-picker-content.mjs';
-export { DatePickerControl } from './date-picker-control.mjs';
-export { DatePickerDayCell } from './date-picker-day-cell.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 { DatePicker as DatePicker$1 } from './date-picker.mjs';
+export { useDatePickerCellContext } from './date-picker-cell-context.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';
+import { DatePickerControl } from './date-picker-control.mjs';
+import { DatePickerDayCell } from './date-picker-day-cell.mjs';
+export { useDatePickerDayCellContext } from './date-picker-day-cell-context.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

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

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

@@ -1,132 +1,7 @@
-import type { matchView } from '@zag-js/date-picker/dist/date-picker.utils';
-import type { Accessor, JSX } from 'solid-js';
 import * as datePicker from '@zag-js/date-picker';
+import { type PropTypes } from '@zag-js/solid';
+import { type Accessor } from 'solid-js';
 import { type Optional } from '../types';
 export type UseDatePickerProps = Optional<datePicker.Context, 'id'>;
-export type UseDatePickerReturn = ReturnType<typeof useDatePicker>;
-export declare const useDatePicker: (props: UseDatePickerProps) => Accessor<{
-    isFocused: boolean;
-    isOpen: boolean | undefined;
-    view: datePicker.DateView;
-    matchView: typeof matchView;
-    getDaysInWeek(weekIndex: number, from?: datePicker.DateValue | undefined): datePicker.DateValue[];
-    getOffset(months: number): {
-        amount: number;
-        visibleRange: {
-            start: datePicker.CalendarDate | datePicker.CalendarDateTime | datePicker.ZonedDateTime;
-            end: datePicker.CalendarDate | datePicker.CalendarDateTime | datePicker.ZonedDateTime;
-        };
-        weeks: datePicker.DateValue[][];
-    };
-    getMonthDays(from?: datePicker.DateValue | undefined): datePicker.DateValue[][];
-    isUnavailable(date: datePicker.DateValue): boolean;
-    readonly weeks: datePicker.DateValue[][];
-    weekDays: {
-        value: datePicker.CalendarDate | datePicker.CalendarDateTime | datePicker.ZonedDateTime;
-        short: string;
-        long: string;
-        narrow: string;
-    }[];
-    visibleRangeText: {
-        start: string;
-        end: string;
-        formatted: string;
-    };
-    value: datePicker.DateValue[];
-    valueAsDate: Date[];
-    valueAsString: string[];
-    focusedValue: datePicker.DateValue;
-    focusedValueAsDate: Date;
-    focusedValueAsString: string;
-    selectToday(): void;
-    setValue(values: datePicker.CalendarDate[]): void;
-    setFocusedValue(value: datePicker.CalendarDate): void;
-    clearValue(): void;
-    open(): void;
-    close(): void;
-    focusMonth(month: number): void;
-    focusYear(year: number): void;
-    visibleRange: {
-        start: datePicker.DateValue;
-        end: datePicker.DateValue;
-    };
-    getYears(): {
-        label: string;
-        value: number;
-    }[];
-    getYearsGrid(props?: {
-        columns?: number | undefined;
-    } | undefined): {
-        label: string;
-        value: number;
-    }[][];
-    getDecade(): {
-        start: number | undefined;
-        end: number | undefined;
-    };
-    getMonths(props?: {
-        format?: "short" | "long" | undefined;
-    } | undefined): {
-        label: string;
-        value: number;
-    }[];
-    getMonthsGrid(props?: {
-        columns?: number | undefined;
-        format?: "short" | "long" | undefined;
-    } | undefined): {
-        label: string;
-        value: number;
-    }[][];
-    format(value: datePicker.CalendarDate, opts?: Intl.DateTimeFormatOptions | undefined): string;
-    setView(view: datePicker.DateView): void;
-    goToNext(): void;
-    goToPrev(): void;
-    controlProps: JSX.HTMLAttributes<any>;
-    contentProps: JSX.HTMLAttributes<any>;
-    getGridProps(props?: datePicker.GridProps | undefined): JSX.HTMLAttributes<any>;
-    getDayCellState(props: datePicker.DayCellProps): {
-        isInvalid: boolean;
-        isDisabled: boolean;
-        isSelected: boolean;
-        isUnavailable: boolean;
-        isOutsideRange: boolean;
-        isInRange: boolean;
-        isFirstInRange: boolean;
-        isLastInRange: boolean;
-        isToday: boolean;
-        isWeekend: boolean;
-        formattedDate: string;
-        readonly isFocused: boolean;
-        readonly ariaLabel: string;
-        readonly isSelectable: boolean;
-    };
-    getDayCellProps(props: datePicker.DayCellProps): JSX.HTMLAttributes<any>;
-    getDayCellTriggerProps(props: datePicker.DayCellProps): JSX.HTMLAttributes<any>;
-    getMonthCellState(props: datePicker.CellProps): {
-        isFocused: boolean;
-        isSelectable: boolean;
-        isSelected: boolean;
-        valueText: string;
-        readonly isDisabled: boolean;
-    };
-    getMonthCellProps(props: datePicker.CellProps): JSX.HTMLAttributes<any>;
-    getMonthCellTriggerProps(props: datePicker.CellProps): JSX.HTMLAttributes<any>;
-    getYearCellState(props: datePicker.CellProps): {
-        isFocused: boolean;
-        isSelectable: boolean;
-        isSelected: boolean;
-        valueText: string;
-        readonly isDisabled: boolean;
-    };
-    getYearCellProps(props: datePicker.CellProps): JSX.HTMLAttributes<any>;
-    getYearCellTriggerProps(props: datePicker.CellProps): JSX.HTMLAttributes<any>;
-    getNextTriggerProps(props?: datePicker.ViewProps | undefined): JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    getPrevTriggerProps(props?: datePicker.ViewProps | undefined): JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    getHeaderProps(props?: datePicker.ViewProps | undefined): JSX.HTMLAttributes<any>;
-    clearTriggerProps: JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    triggerProps: JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    getViewTriggerProps(props?: datePicker.ViewProps | undefined): JSX.ButtonHTMLAttributes<HTMLButtonElement>;
-    inputProps: JSX.InputHTMLAttributes<HTMLInputElement>;
-    monthSelectProps: JSX.SelectHTMLAttributes<HTMLSelectElement>;
-    yearSelectProps: JSX.SelectHTMLAttributes<HTMLSelectElement>;
-}>;
+export type UseDatePickerReturn = Accessor<datePicker.Api<PropTypes>>;
+export declare const useDatePicker: (props: UseDatePickerProps) => UseDatePickerReturn;

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

@@ -1,6 +1,7 @@
 import * as datePicker from '@zag-js/date-picker';
 import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
 import { createUniqueId, createMemo } from 'solid-js';
+import '../environment/index.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
 
 const useDatePicker = props => {

package/dialog/dialog-backdrop.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DialogBackdropProps = HTMLArkProps<'div'>;
 export declare const DialogBackdrop: (props: DialogBackdropProps) => JSX.Element;

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

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DialogCloseTriggerProps = HTMLArkProps<'button'>;
 export declare const DialogCloseTrigger: (props: DialogCloseTriggerProps) => JSX.Element;

package/dialog/dialog-container.d.ts

@@ -1,4 +1,4 @@
-import type { JSX } from 'solid-js';
+import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
 export type DialogContainerProps = HTMLArkProps<'div'>;
 export declare const DialogContainer: (props: DialogContainerProps) => JSX.Element;