@ark-ui/solid 0.5.0 → 0.7.0

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

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+const datePickerDayCellContext = require('./date-picker-day-cell-context.cjs');
+
+const DatePickerDayCell = props => {
+  const [cellProps, localProps] = createSplitProps.createSplitProps()(props, ['value', 'disabled', 'offset']);
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getDayCellProps(cellProps), localProps);
+  return web.createComponent(datePickerDayCellContext.DatePickerDayCellProvider, {
+    value: cellProps,
+    get children() {
+      return web.createComponent(factory.ark.div, mergedProps);
+    }
+  });
+};
+
+exports.DatePickerDayCell = DatePickerDayCell;

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

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import type { DayCellProps } from '@zag-js/date-picker';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export type DatePickerDayCellProps = Assign<HTMLArkProps<'div'>, DayCellProps>;
+export declare const DatePickerDayCell: (props: DatePickerDayCellProps) => JSX.Element;

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

@@ -0,0 +1,20 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+import { DatePickerDayCellProvider } from './date-picker-day-cell-context.mjs';
+
+const DatePickerDayCell = props => {
+  const [cellProps, localProps] = createSplitProps()(props, ['value', 'disabled', 'offset']);
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().getDayCellProps(cellProps), localProps);
+  return createComponent(DatePickerDayCellProvider, {
+    value: cellProps,
+    get children() {
+      return createComponent(ark.div, mergedProps);
+    }
+  });
+};
+
+export { DatePickerDayCell };

package/date-picker/date-picker-grid.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const solidJs = require('solid-js');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerGrid = props => {
+  const [gridProps, localProps] = createSplitProps.createSplitProps()(props, ['view', 'columns', 'id']);
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getGridProps({
+    view: datePicker().view,
+    id: solidJs.createUniqueId(),
+    ...gridProps
+  }), localProps);
+  return web.createComponent(factory.ark.div, mergedProps);
+};
+
+exports.DatePickerGrid = DatePickerGrid;

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

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import type { GridProps } from '@zag-js/date-picker/dist/date-picker.types';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export type DatePickerGridProps = Assign<HTMLArkProps<'div'>, GridProps>;
+export declare const DatePickerGrid: (props: DatePickerGridProps) => JSX.Element;

package/date-picker/date-picker-grid.mjs

@@ -0,0 +1,19 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createUniqueId } from 'solid-js';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerGrid = props => {
+  const [gridProps, localProps] = createSplitProps()(props, ['view', 'columns', 'id']);
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().getGridProps({
+    view: datePicker().view,
+    id: createUniqueId(),
+    ...gridProps
+  }), localProps);
+  return createComponent(ark.div, mergedProps);
+};
+
+export { DatePickerGrid };

package/date-picker/date-picker-input.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 DatePickerInput = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().inputProps, props);
+  return web.createComponent(factory.ark.input, mergedProps);
+};
+
+exports.DatePickerInput = DatePickerInput;

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

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

package/date-picker/date-picker-input.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 DatePickerInput = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().inputProps, props);
+  return createComponent(ark.input, mergedProps);
+};
+
+export { DatePickerInput };

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

@@ -0,0 +1,18 @@
+'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 datePickerCellContext = require('./date-picker-cell-context.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerMonthCellTrigger = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const cellProps = datePickerCellContext.useDatePickerCellContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getMonthCellTriggerProps(cellProps), props);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerMonthCellTrigger = DatePickerMonthCellTrigger;

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

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

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

@@ -0,0 +1,14 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
+import { useDatePickerCellContext } from './date-picker-cell-context.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerMonthCellTrigger = props => {
+  const datePicker = useDatePickerContext();
+  const cellProps = useDatePickerCellContext();
+  const mergedProps = mergeProps(() => datePicker().getMonthCellTriggerProps(cellProps), props);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerMonthCellTrigger };

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

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const datePickerCellContext = require('./date-picker-cell-context.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerMonthCell = props => {
+  const [cellProps, localProps] = createSplitProps.createSplitProps()(props, ['value', 'disabled']);
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getMonthCellProps(cellProps), localProps);
+  return web.createComponent(datePickerCellContext.DatePickerCellProvider, {
+    value: cellProps,
+    get children() {
+      return web.createComponent(factory.ark.div, mergedProps);
+    }
+  });
+};
+
+exports.DatePickerMonthCell = DatePickerMonthCell;

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

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import type { CellProps } from '@zag-js/date-picker';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export type DatePickerMonthCellProps = Assign<HTMLArkProps<'div'>, CellProps>;
+export declare const DatePickerMonthCell: (props: DatePickerMonthCellProps) => JSX.Element;

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

@@ -0,0 +1,20 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { DatePickerCellProvider } from './date-picker-cell-context.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerMonthCell = props => {
+  const [cellProps, localProps] = createSplitProps()(props, ['value', 'disabled']);
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().getMonthCellProps(cellProps), localProps);
+  return createComponent(DatePickerCellProvider, {
+    value: cellProps,
+    get children() {
+      return createComponent(ark.div, mergedProps);
+    }
+  });
+};
+
+export { DatePickerMonthCell };

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

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const solidJs = require('solid-js');
+const factory = require('../factory.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const _tmpl$ = /*#__PURE__*/web.template(`<option>`);
+const DatePickerMonthSelect = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().monthSelectProps, props);
+  return web.createComponent(factory.ark.select, web.mergeProps(mergedProps, {
+    get children() {
+      return web.createComponent(solidJs.For, {
+        get each() {
+          return datePicker().getMonths();
+        },
+        children: month => (() => {
+          const _el$ = _tmpl$();
+          web.insert(_el$, () => month.label);
+          web.effect(() => _el$.value = month.value);
+          return _el$;
+        })()
+      });
+    }
+  }));
+};
+
+exports.DatePickerMonthSelect = DatePickerMonthSelect;

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

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

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

@@ -0,0 +1,28 @@
+import { createComponent, mergeProps as mergeProps$1, insert, effect, 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$ = /*#__PURE__*/template(`<option>`);
+const DatePickerMonthSelect = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().monthSelectProps, props);
+  return createComponent(ark.select, mergeProps$1(mergedProps, {
+    get children() {
+      return createComponent(For, {
+        get each() {
+          return datePicker().getMonths();
+        },
+        children: month => (() => {
+          const _el$ = _tmpl$();
+          insert(_el$, () => month.label);
+          effect(() => _el$.value = month.value);
+          return _el$;
+        })()
+      });
+    }
+  }));
+};
+
+export { DatePickerMonthSelect };

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

@@ -0,0 +1,18 @@
+'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 DatePickerNextTrigger = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(datePicker().getNextTriggerProps({
+    view: datePicker().view
+  }), props);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerNextTrigger = DatePickerNextTrigger;

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

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

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

@@ -0,0 +1,14 @@
+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 DatePickerNextTrigger = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(datePicker().getNextTriggerProps({
+    view: datePicker().view
+  }), props);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerNextTrigger };

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

@@ -0,0 +1,18 @@
+'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 DatePickerPrevTrigger = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(datePicker().getPrevTriggerProps({
+    view: datePicker().view
+  }), props);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerPrevTrigger = DatePickerPrevTrigger;

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

@@ -0,0 +1,4 @@
+import type { 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-prev-trigger.mjs

@@ -0,0 +1,14 @@
+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 DatePickerPrevTrigger = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(datePicker().getPrevTriggerProps({
+    view: datePicker().view
+  }), props);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerPrevTrigger };

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

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const factory = require('../factory.cjs');
+const datePicker_anatomy = require('./date-picker.anatomy.cjs');
+
+const DatePickerRowGroup = props => web.createComponent(factory.ark.div, web.mergeProps({
+  role: "rowgroup"
+}, () => datePicker_anatomy.parts.rowGroup.attrs, props));
+
+exports.DatePickerRowGroup = DatePickerRowGroup;

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

@@ -0,0 +1,4 @@
+import type { 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-group.mjs

@@ -0,0 +1,9 @@
+import { createComponent, mergeProps } from 'solid-js/web';
+import { ark } from '../factory.mjs';
+import { parts } from './date-picker.anatomy.mjs';
+
+const DatePickerRowGroup = props => createComponent(ark.div, mergeProps({
+  role: "rowgroup"
+}, () => parts.rowGroup.attrs, props));
+
+export { DatePickerRowGroup };

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

@@ -0,0 +1,22 @@
+'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 DatePickerRowHeader = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getHeaderProps({
+    view: 'day'
+  }), props);
+  return web.createComponent(factory.ark.div, web.mergeProps({
+    role: "row"
+  }, mergedProps, {
+    "aria-hidden": false
+  }));
+};
+
+exports.DatePickerRowHeader = DatePickerRowHeader;

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

@@ -0,0 +1,4 @@
+import type { 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-header.mjs

@@ -0,0 +1,18 @@
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerRowHeader = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().getHeaderProps({
+    view: 'day'
+  }), props);
+  return createComponent(ark.div, mergeProps$1({
+    role: "row"
+  }, mergedProps, {
+    "aria-hidden": false
+  }));
+};
+
+export { DatePickerRowHeader };

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

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const factory = require('../factory.cjs');
+const datePicker_anatomy = require('./date-picker.anatomy.cjs');
+
+const DatePickerRow = props => web.createComponent(factory.ark.div, web.mergeProps({
+  role: "row"
+}, () => datePicker_anatomy.parts.row.attrs, props));
+
+exports.DatePickerRow = DatePickerRow;

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

@@ -0,0 +1,4 @@
+import type { 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-row.mjs

@@ -0,0 +1,9 @@
+import { createComponent, mergeProps } from 'solid-js/web';
+import { ark } from '../factory.mjs';
+import { parts } from './date-picker.anatomy.mjs';
+
+const DatePickerRow = props => createComponent(ark.div, mergeProps({
+  role: "row"
+}, () => parts.row.attrs, props));
+
+export { DatePickerRow };

package/date-picker/date-picker-trigger.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 DatePickerTrigger = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().triggerProps, props);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerTrigger = DatePickerTrigger;

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

@@ -0,0 +1,4 @@
+import type { 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-trigger.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 DatePickerTrigger = props => {
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().triggerProps, props);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerTrigger };

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

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerViewTrigger = props => {
+  const [viewProps, localProps] = createSplitProps.createSplitProps()(props, ['view']);
+  const datePicker = datePickerContext.useDatePickerContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getViewTriggerProps({
+    view: viewProps.view ?? datePicker().view
+  }), localProps);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerViewTrigger = DatePickerViewTrigger;

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

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import type { ViewProps } from '@zag-js/date-picker/dist/date-picker.types';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export type DatePickerViewTriggerProps = Assign<HTMLArkProps<'button'>, ViewProps>;
+export declare const DatePickerViewTrigger: (props: DatePickerViewTriggerProps) => JSX.Element;

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

@@ -0,0 +1,16 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerViewTrigger = props => {
+  const [viewProps, localProps] = createSplitProps()(props, ['view']);
+  const datePicker = useDatePickerContext();
+  const mergedProps = mergeProps(() => datePicker().getViewTriggerProps({
+    view: viewProps.view ?? datePicker().view
+  }), localProps);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerViewTrigger };

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

@@ -0,0 +1,18 @@
+'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 datePickerCellContext = require('./date-picker-cell-context.cjs');
+const datePickerContext = require('./date-picker-context.cjs');
+
+const DatePickerYearCellTrigger = props => {
+  const datePicker = datePickerContext.useDatePickerContext();
+  const cellProps = datePickerCellContext.useDatePickerCellContext();
+  const mergedProps = solid.mergeProps(() => datePicker().getYearCellTriggerProps(cellProps), props);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.DatePickerYearCellTrigger = DatePickerYearCellTrigger;

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

@@ -0,0 +1,4 @@
+import type { 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-trigger.mjs

@@ -0,0 +1,14 @@
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
+import { useDatePickerCellContext } from './date-picker-cell-context.mjs';
+import { useDatePickerContext } from './date-picker-context.mjs';
+
+const DatePickerYearCellTrigger = props => {
+  const datePicker = useDatePickerContext();
+  const cellProps = useDatePickerCellContext();
+  const mergedProps = mergeProps(() => datePicker().getYearCellTriggerProps(cellProps), props);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { DatePickerYearCellTrigger };