@ark-ui/vue 5.29.1 → 5.31.0

package/dist/components/date-picker/date-picker-value-text.vue.d.cts

@@ -0,0 +1,42 @@
+import { DateValue } from '@zag-js/date-picker';
+import { HTMLAttributes, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { PolymorphicProps } from '../factory';
+export interface DatePickerValueTextRenderProps {
+    value: DateValue;
+    index: number;
+    valueAsString: string;
+    remove: () => void;
+}
+export interface DatePickerValueTextBaseProps extends PolymorphicProps {
+    /**
+     * Text to display when no date is selected.
+     */
+    placeholder?: string | undefined;
+    /**
+     * The separator to use between multiple date values when using default rendering.
+     * @default ", "
+     */
+    separator?: string | undefined;
+}
+export interface DatePickerValueTextProps extends DatePickerValueTextBaseProps, 
+/**
+ * @vue-ignore
+ */
+HTMLAttributes {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<DatePickerValueTextProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DatePickerValueTextProps> & Readonly<{}>, {
+    separator: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?(_: {
+        value: DateValue;
+        index: number;
+        valueAsString: string;
+        remove: () => void;
+    }): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/date-picker/date-picker-value-text.vue.d.ts

@@ -0,0 +1,42 @@
+import { DateValue } from '@zag-js/date-picker';
+import { HTMLAttributes, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { PolymorphicProps } from '../factory';
+export interface DatePickerValueTextRenderProps {
+    value: DateValue;
+    index: number;
+    valueAsString: string;
+    remove: () => void;
+}
+export interface DatePickerValueTextBaseProps extends PolymorphicProps {
+    /**
+     * Text to display when no date is selected.
+     */
+    placeholder?: string | undefined;
+    /**
+     * The separator to use between multiple date values when using default rendering.
+     * @default ", "
+     */
+    separator?: string | undefined;
+}
+export interface DatePickerValueTextProps extends DatePickerValueTextBaseProps, 
+/**
+ * @vue-ignore
+ */
+HTMLAttributes {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<DatePickerValueTextProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DatePickerValueTextProps> & Readonly<{}>, {
+    separator: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?(_: {
+        value: DateValue;
+        index: number;
+        valueAsString: string;
+        remove: () => void;
+    }): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/date-picker/date-picker-value-text.vue.js

@@ -0,0 +1,51 @@
+import { defineComponent, computed, openBlock, createElementBlock, Fragment, renderList, unref, renderSlot, mergeProps, createTextVNode, toDisplayString, createBlock, withCtx } from 'vue';
+import { useForwardExpose } from '../../utils/use-forward-expose.js';
+import { ark } from '../factory.js';
+import { datePickerAnatomy } from './date-picker.anatomy.js';
+import { useDatePickerContext } from './use-date-picker-context.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "date-picker-value-text",
+  props: {
+    placeholder: {},
+    separator: { default: ", " },
+    asChild: { type: Boolean }
+  },
+  setup(__props) {
+    const props = __props;
+    const datePicker = useDatePickerContext();
+    const hasValue = computed(() => datePicker.value.value.length > 0);
+    const displayValue = computed(() => {
+      if (!hasValue.value) return props.placeholder;
+      return datePicker.value.valueAsString.join(props.separator);
+    });
+    const getRenderProps = (value, index) => ({
+      value,
+      index,
+      valueAsString: datePicker.value.valueAsString[index],
+      remove: () => {
+        datePicker.value.setValue(datePicker.value.value.filter((_, i) => i !== index));
+      }
+    });
+    useForwardExpose();
+    return (_ctx, _cache) => {
+      return _ctx.$slots.default ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+        hasValue.value ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(datePicker).value, (value, index) => {
+          return renderSlot(_ctx.$slots, "default", mergeProps({
+            key: index,
+            ref_for: true
+          }, getRenderProps(value, index)));
+        }), 128)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          createTextVNode(toDisplayString(__props.placeholder), 1)
+        ], 64))
+      ], 64)) : (openBlock(), createBlock(unref(ark).span, mergeProps({ key: 1 }, unref(datePickerAnatomy).build().valueText.attrs, { "as-child": __props.asChild }), {
+        default: withCtx(() => [
+          createTextVNode(toDisplayString(displayValue.value), 1)
+        ]),
+        _: 1
+      }, 16, ["as-child"]));
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/date-picker/date-picker-value-text.vue2.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const datePickerValueText_vue_vue_type_script_setup_true_lang = require('./date-picker-value-text.vue.cjs');
+
+
+
+exports.default = datePickerValueText_vue_vue_type_script_setup_true_lang.default;

package/dist/components/date-picker/date-picker-value-text.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './date-picker-value-text.vue.js';
+
+
+
+export { _sfc_main as default };

package/dist/components/date-picker/date-picker-view-control.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/date-picker/date-picker-view-trigger.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 import { useDatePickerViewPropsContext } from './use-date-picker-view-props-context.js';

package/dist/components/date-picker/date-picker-view.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 import { DatePickerViewPropsProvider } from './use-date-picker-view-props-context.js';

package/dist/components/date-picker/date-picker-year-select.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, createElementBlock, Fragment, renderList, toDisplayString } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, createElementBlock, Fragment, renderList, toDisplayString } from 'vue';
 import { ark } from '../factory.js';
 import { useDatePickerContext } from './use-date-picker-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/date-picker/date-picker.anatomy.cjs

@@ -4,6 +4,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const datePicker = require('@zag-js/date-picker');
 
-const datePickerAnatomy = datePicker.anatomy.extendWith("view");
+const datePickerAnatomy = datePicker.anatomy.extendWith("view", "valueText");
 
 exports.datePickerAnatomy = datePickerAnatomy;

package/dist/components/date-picker/date-picker.anatomy.d.cts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "valueText" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;

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

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;
+export declare const datePickerAnatomy: AnatomyInstance<"root" | "control" | "nextTrigger" | "prevTrigger" | "label" | "content" | "trigger" | "positioner" | "valueText" | "view" | "input" | "clearTrigger" | "table" | "monthSelect" | "presetTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect">;

package/dist/components/date-picker/date-picker.anatomy.js

@@ -1,5 +1,5 @@
 import { anatomy } from '@zag-js/date-picker';
 
-const datePickerAnatomy = anatomy.extendWith("view");
+const datePickerAnatomy = anatomy.extendWith("view", "valueText");
 
 export { datePickerAnatomy };

package/dist/components/date-picker/date-picker.cjs

@@ -14,6 +14,7 @@ const datePickerPositioner_vue_vue_type_script_setup_true_lang = require('./date
 const datePickerPresetTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker-preset-trigger.vue.cjs');
 const datePickerPrevTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker-prev-trigger.vue.cjs');
 const datePickerRangeText_vue_vue_type_script_setup_true_lang = require('./date-picker-range-text.vue.cjs');
+const datePickerValueText_vue_vue_type_script_setup_true_lang = require('./date-picker-value-text.vue.cjs');
 const datePickerRootProvider_vue_vue_type_script_setup_true_lang = require('./date-picker-root-provider.vue.cjs');
 const datePickerRoot_vue_vue_type_script_setup_true_lang = require('./date-picker-root.vue.cjs');
 const datePickerTableBody_vue_vue_type_script_setup_true_lang = require('./date-picker-table-body.vue.cjs');
@@ -43,6 +44,7 @@ exports.Positioner = datePickerPositioner_vue_vue_type_script_setup_true_lang.de
 exports.PresetTrigger = datePickerPresetTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.PrevTrigger = datePickerPrevTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.RangeText = datePickerRangeText_vue_vue_type_script_setup_true_lang.default;
+exports.ValueText = datePickerValueText_vue_vue_type_script_setup_true_lang.default;
 exports.RootProvider = datePickerRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.Root = datePickerRoot_vue_vue_type_script_setup_true_lang.default;
 exports.TableBody = datePickerTableBody_vue_vue_type_script_setup_true_lang.default;

package/dist/components/date-picker/date-picker.d.cts

@@ -11,6 +11,7 @@ export { default as Positioner, type DatePickerPositionerProps as PositionerProp
 export { default as PresetTrigger, type DatePickerPresetTriggerProps as PresetTriggerProps, type DatePickerPresetTriggerBaseProps as PresetTriggerBaseProps, } from './date-picker-preset-trigger.vue';
 export { default as PrevTrigger, type DatePickerPrevTriggerProps as PrevTriggerProps, type DatePickerPrevTriggerBaseProps as PrevTriggerBaseProps, } from './date-picker-prev-trigger.vue';
 export { default as RangeText, type DatePickerRangeTextProps as RangeTextProps, type DatePickerRangeTextBaseProps as RangeTextBaseProps, } from './date-picker-range-text.vue';
+export { default as ValueText, type DatePickerValueTextProps as ValueTextProps, type DatePickerValueTextBaseProps as ValueTextBaseProps, type DatePickerValueTextRenderProps as ValueTextRenderProps, } from './date-picker-value-text.vue';
 export { default as RootProvider, type DatePickerRootProviderProps as RootProviderProps, type DatePickerRootProviderBaseProps as RootProviderBaseProps, } from './date-picker-root-provider.vue';
 export { default as Root, type DatePickerRootEmits as RootEmits, type DatePickerRootBaseProps as RootBaseProps, type DatePickerRootProps as RootProps, } from './date-picker-root.vue';
 export { default as TableBody, type DatePickerTableBodyProps as TableBodyProps, type DatePickerTableBodyBaseProps as TableBodyBaseProps, } from './date-picker-table-body.vue';

package/dist/components/date-picker/date-picker.d.ts

@@ -11,6 +11,7 @@ export { default as Positioner, type DatePickerPositionerProps as PositionerProp
 export { default as PresetTrigger, type DatePickerPresetTriggerProps as PresetTriggerProps, type DatePickerPresetTriggerBaseProps as PresetTriggerBaseProps, } from './date-picker-preset-trigger.vue';
 export { default as PrevTrigger, type DatePickerPrevTriggerProps as PrevTriggerProps, type DatePickerPrevTriggerBaseProps as PrevTriggerBaseProps, } from './date-picker-prev-trigger.vue';
 export { default as RangeText, type DatePickerRangeTextProps as RangeTextProps, type DatePickerRangeTextBaseProps as RangeTextBaseProps, } from './date-picker-range-text.vue';
+export { default as ValueText, type DatePickerValueTextProps as ValueTextProps, type DatePickerValueTextBaseProps as ValueTextBaseProps, type DatePickerValueTextRenderProps as ValueTextRenderProps, } from './date-picker-value-text.vue';
 export { default as RootProvider, type DatePickerRootProviderProps as RootProviderProps, type DatePickerRootProviderBaseProps as RootProviderBaseProps, } from './date-picker-root-provider.vue';
 export { default as Root, type DatePickerRootEmits as RootEmits, type DatePickerRootBaseProps as RootBaseProps, type DatePickerRootProps as RootProps, } from './date-picker-root.vue';
 export { default as TableBody, type DatePickerTableBodyProps as TableBodyProps, type DatePickerTableBodyBaseProps as TableBodyBaseProps, } from './date-picker-table-body.vue';

package/dist/components/date-picker/date-picker.js

@@ -10,6 +10,7 @@ export { default as Positioner } from './date-picker-positioner.vue.js';
 export { default as PresetTrigger } from './date-picker-preset-trigger.vue.js';
 export { default as PrevTrigger } from './date-picker-prev-trigger.vue.js';
 export { default as RangeText } from './date-picker-range-text.vue.js';
+export { default as ValueText } from './date-picker-value-text.vue.js';
 export { default as RootProvider } from './date-picker-root-provider.vue.js';
 export { default as Root } from './date-picker-root.vue.js';
 export { default as TableBody } from './date-picker-table-body.vue.js';

package/dist/components/date-picker/date-picker.types.d.cts

@@ -171,8 +171,20 @@ export interface RootProps {
      * Whether the date picker is inline
      */
     inline?: boolean;
+    /**
+     * Whether the date picker is in an invalid state
+     */
+    invalid?: boolean;
+    /**
+     * Whether the date picker is required
+     */
+    required?: boolean;
 }
 export type RootEmits = {
+    /**
+     * Function called when the animation ends in the closed state
+     */
+    exitComplete: [];
     /**
      * Function called when the focused date changes.
      */
@@ -189,6 +201,10 @@ export type RootEmits = {
      * Function called when the view changes.
      */
     viewChange: [details: datePicker.ViewChangeDetails];
+    /**
+     * Function called when the visible date range changes.
+     */
+    visibleRangeChange: [details: datePicker.VisibleRangeChangeDetails];
     /**
      * The callback fired when the model value changes.
      */

package/dist/components/date-picker/date-picker.types.d.ts

@@ -171,8 +171,20 @@ export interface RootProps {
      * Whether the date picker is inline
      */
     inline?: boolean;
+    /**
+     * Whether the date picker is in an invalid state
+     */
+    invalid?: boolean;
+    /**
+     * Whether the date picker is required
+     */
+    required?: boolean;
 }
 export type RootEmits = {
+    /**
+     * Function called when the animation ends in the closed state
+     */
+    exitComplete: [];
     /**
      * Function called when the focused date changes.
      */
@@ -189,6 +201,10 @@ export type RootEmits = {
      * Function called when the view changes.
      */
     viewChange: [details: datePicker.ViewChangeDetails];
+    /**
+     * Function called when the visible date range changes.
+     */
+    visibleRangeChange: [details: datePicker.VisibleRangeChangeDetails];
     /**
      * The callback fired when the model value changes.
      */

package/dist/components/date-picker/index.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const datePicker = require('@zag-js/date-picker');
+const datePicker$1 = require('@zag-js/date-picker');
 const datePickerClearTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker-clear-trigger.vue.cjs');
 const datePickerContent_vue_vue_type_script_setup_true_lang = require('./date-picker-content.vue.cjs');
 const datePickerContext_vue_vue_type_script_setup_true_lang = require('./date-picker-context.vue.cjs');
@@ -15,6 +15,7 @@ const datePickerPositioner_vue_vue_type_script_setup_true_lang = require('./date
 const datePickerPresetTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker-preset-trigger.vue.cjs');
 const datePickerPrevTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker-prev-trigger.vue.cjs');
 const datePickerRangeText_vue_vue_type_script_setup_true_lang = require('./date-picker-range-text.vue.cjs');
+const datePickerValueText_vue_vue_type_script_setup_true_lang = require('./date-picker-value-text.vue.cjs');
 const datePickerRootProvider_vue_vue_type_script_setup_true_lang = require('./date-picker-root-provider.vue.cjs');
 const datePickerRoot_vue_vue_type_script_setup_true_lang = require('./date-picker-root.vue.cjs');
 const datePickerTableBody_vue_vue_type_script_setup_true_lang = require('./date-picker-table-body.vue.cjs');
@@ -32,13 +33,13 @@ const datePickerYearSelect_vue_vue_type_script_setup_true_lang = require('./date
 const datePicker_anatomy = require('./date-picker.anatomy.cjs');
 const useDatePicker = require('./use-date-picker.cjs');
 const useDatePickerContext = require('./use-date-picker-context.cjs');
-const datePicker$1 = require('./date-picker.cjs');
+const datePicker = require('./date-picker.cjs');
 
 
 
 Object.defineProperty(exports, "parseDate", {
   enumerable: true,
-  get: () => datePicker.parse
+  get: () => datePicker$1.parse
 });
 exports.DatePickerClearTrigger = datePickerClearTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerContent = datePickerContent_vue_vue_type_script_setup_true_lang.default;
@@ -52,6 +53,7 @@ exports.DatePickerPositioner = datePickerPositioner_vue_vue_type_script_setup_tr
 exports.DatePickerPresetTrigger = datePickerPresetTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerPrevTrigger = datePickerPrevTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerRangeText = datePickerRangeText_vue_vue_type_script_setup_true_lang.default;
+exports.DatePickerValueText = datePickerValueText_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerRootProvider = datePickerRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerRoot = datePickerRoot_vue_vue_type_script_setup_true_lang.default;
 exports.DatePickerTableBody = datePickerTableBody_vue_vue_type_script_setup_true_lang.default;
@@ -69,4 +71,4 @@ exports.DatePickerYearSelect = datePickerYearSelect_vue_vue_type_script_setup_tr
 exports.datePickerAnatomy = datePicker_anatomy.datePickerAnatomy;
 exports.useDatePicker = useDatePicker.useDatePicker;
 exports.useDatePickerContext = useDatePickerContext.useDatePickerContext;
-exports.DatePicker = datePicker$1;
+exports.DatePicker = datePicker;

package/dist/components/date-picker/index.d.cts

@@ -12,7 +12,8 @@ export { default as DatePickerPositioner, type DatePickerPositionerBaseProps, ty
 export { default as DatePickerPresetTrigger, type DatePickerPresetTriggerBaseProps, type DatePickerPresetTriggerProps, } from './date-picker-preset-trigger.vue';
 export { default as DatePickerPrevTrigger, type DatePickerPrevTriggerBaseProps, type DatePickerPrevTriggerProps, } from './date-picker-prev-trigger.vue';
 export { default as DatePickerRangeText, type DatePickerRangeTextBaseProps, type DatePickerRangeTextProps, } from './date-picker-range-text.vue';
-export { default as DatePickerRootProvider, type DatePickerRootProviderBaseProps, type DatePickerRootProviderProps, } from './date-picker-root-provider.vue';
+export { default as DatePickerValueText, type DatePickerValueTextBaseProps, type DatePickerValueTextProps, type DatePickerValueTextRenderProps, } from './date-picker-value-text.vue';
+export { default as DatePickerRootProvider, type DatePickerRootProviderBaseProps, type DatePickerRootProviderEmits, type DatePickerRootProviderProps, } from './date-picker-root-provider.vue';
 export { default as DatePickerRoot, type DatePickerRootBaseProps, type DatePickerRootEmits, type DatePickerRootProps, } from './date-picker-root.vue';
 export { default as DatePickerTableBody, type DatePickerTableBodyBaseProps, type DatePickerTableBodyProps, } from './date-picker-table-body.vue';
 export { default as DatePickerTableCellTrigger, type DatePickerTableCellTriggerBaseProps, type DatePickerTableCellTriggerProps, } from './date-picker-table-cell-trigger.vue';

package/dist/components/date-picker/index.d.ts

@@ -12,7 +12,8 @@ export { default as DatePickerPositioner, type DatePickerPositionerBaseProps, ty
 export { default as DatePickerPresetTrigger, type DatePickerPresetTriggerBaseProps, type DatePickerPresetTriggerProps, } from './date-picker-preset-trigger.vue';
 export { default as DatePickerPrevTrigger, type DatePickerPrevTriggerBaseProps, type DatePickerPrevTriggerProps, } from './date-picker-prev-trigger.vue';
 export { default as DatePickerRangeText, type DatePickerRangeTextBaseProps, type DatePickerRangeTextProps, } from './date-picker-range-text.vue';
-export { default as DatePickerRootProvider, type DatePickerRootProviderBaseProps, type DatePickerRootProviderProps, } from './date-picker-root-provider.vue';
+export { default as DatePickerValueText, type DatePickerValueTextBaseProps, type DatePickerValueTextProps, type DatePickerValueTextRenderProps, } from './date-picker-value-text.vue';
+export { default as DatePickerRootProvider, type DatePickerRootProviderBaseProps, type DatePickerRootProviderEmits, type DatePickerRootProviderProps, } from './date-picker-root-provider.vue';
 export { default as DatePickerRoot, type DatePickerRootBaseProps, type DatePickerRootEmits, type DatePickerRootProps, } from './date-picker-root.vue';
 export { default as DatePickerTableBody, type DatePickerTableBodyBaseProps, type DatePickerTableBodyProps, } from './date-picker-table-body.vue';
 export { default as DatePickerTableCellTrigger, type DatePickerTableCellTriggerBaseProps, type DatePickerTableCellTriggerProps, } from './date-picker-table-cell-trigger.vue';

package/dist/components/date-picker/index.js

@@ -11,6 +11,7 @@ export { default as DatePickerPositioner } from './date-picker-positioner.vue.js
 export { default as DatePickerPresetTrigger } from './date-picker-preset-trigger.vue.js';
 export { default as DatePickerPrevTrigger } from './date-picker-prev-trigger.vue.js';
 export { default as DatePickerRangeText } from './date-picker-range-text.vue.js';
+export { default as DatePickerValueText } from './date-picker-value-text.vue.js';
 export { default as DatePickerRootProvider } from './date-picker-root-provider.vue.js';
 export { default as DatePickerRoot } from './date-picker-root.vue.js';
 export { default as DatePickerTableBody } from './date-picker-table-body.vue.js';

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

@@ -60,6 +60,10 @@ const useDatePicker = (props = {}, emit) => {
         emit?.("valueChange", details);
         emit?.("update:modelValue", details.value);
         localeProps.onValueChange?.(details);
+      },
+      onVisibleRangeChange: (details) => {
+        emit?.("visibleRangeChange", details);
+        localeProps.onVisibleRangeChange?.(details);
       }
     };
   });

package/dist/components/date-picker/use-date-picker.js

@@ -37,6 +37,10 @@ const useDatePicker = (props = {}, emit) => {
         emit?.("valueChange", details);
         emit?.("update:modelValue", details.value);
         localeProps.onValueChange?.(details);
+      },
+      onVisibleRangeChange: (details) => {
+        emit?.("visibleRangeChange", details);
+        localeProps.onVisibleRangeChange?.(details);
       }
     };
   });

package/dist/components/dialog/dialog-backdrop.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, createCommentVNode, unref, openBlock, mergeProps as mergeProps$1, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, unref, openBlock, createBlock, mergeProps as mergeProps$1, withCtx, renderSlot, createCommentVNode } from 'vue';
 import { mergeProps } from '@zag-js/vue';
 import { useRenderStrategyProps } from '../../utils/use-render-strategy.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/dialog/dialog-close-trigger.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useDialogContext } from './use-dialog-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/dialog/dialog-content.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, createCommentVNode, unref, openBlock, mergeProps as mergeProps$1, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, unref, openBlock, createBlock, mergeProps as mergeProps$1, withCtx, renderSlot, createCommentVNode } from 'vue';
 import { ark } from '../factory.js';
 import { useDialogContext } from './use-dialog-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/dialog/dialog-description.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useDialogContext } from './use-dialog-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/dialog/dialog-positioner.vue.cjs

@@ -4,11 +4,9 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 
 const vue = require('vue');
 const factory = require('../factory.cjs');
-const usePresence = require('../presence/use-presence.cjs');
 const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useDialogContext = require('./use-dialog-context.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
-const useRenderStrategy = require('../../utils/use-render-strategy.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "dialog-positioner",
@@ -17,14 +15,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     const dialog = useDialogContext.useDialogContext();
-    const renderStrategy = useRenderStrategy.useRenderStrategyProps();
-    const presence = usePresence.usePresence(
-      vue.computed(() => ({
-        ...renderStrategy.value,
-        present: dialog.value.open
-      }))
-    );
-    usePresenceContext.PresenceProvider(presence);
+    const presence = usePresenceContext.usePresenceContext();
     useForwardExpose.useForwardExpose();
     return (_ctx, _cache) => {
       return !vue.unref(presence).unmounted ? (vue.openBlock(), vue.createBlock(vue.unref(factory.ark).div, vue.mergeProps({ key: 0 }, vue.unref(dialog).getPositionerProps(), { "as-child": __props.asChild }), {

package/dist/components/dialog/dialog-positioner.vue.js

@@ -1,10 +1,8 @@
-import { defineComponent, computed, createBlock, createCommentVNode, unref, openBlock, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, unref, openBlock, createBlock, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
 import { ark } from '../factory.js';
-import { usePresence } from '../presence/use-presence.js';
-import { PresenceProvider } from '../presence/use-presence-context.js';
+import { usePresenceContext } from '../presence/use-presence-context.js';
 import { useDialogContext } from './use-dialog-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';
-import { useRenderStrategyProps } from '../../utils/use-render-strategy.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "dialog-positioner",
@@ -13,14 +11,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const dialog = useDialogContext();
-    const renderStrategy = useRenderStrategyProps();
-    const presence = usePresence(
-      computed(() => ({
-        ...renderStrategy.value,
-        present: dialog.value.open
-      }))
-    );
-    PresenceProvider(presence);
+    const presence = usePresenceContext();
     useForwardExpose();
     return (_ctx, _cache) => {
       return !unref(presence).unmounted ? (openBlock(), createBlock(unref(ark).div, mergeProps({ key: 0 }, unref(dialog).getPositionerProps(), { "as-child": __props.asChild }), {

package/dist/components/dialog/dialog-root-provider.vue.cjs

@@ -4,6 +4,8 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 
 const vue = require('vue');
 const useRenderStrategy = require('../../utils/use-render-strategy.cjs');
+const usePresence = require('../presence/use-presence.cjs');
+const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useDialogContext = require('./use-dialog-context.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
 
@@ -14,10 +16,22 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     lazyMount: { type: Boolean },
     unmountOnExit: { type: Boolean }
   },
-  setup(__props) {
+  emits: ["exitComplete"],
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const dialog = vue.computed(() => props.value);
+    const presence = usePresence.usePresence(
+      vue.computed(() => ({
+        present: dialog.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      // @ts-expect-error TODO tweak EmitFn
+      emits
+    );
     useDialogContext.DialogProvider(dialog);
+    usePresenceContext.PresenceProvider(presence);
     useRenderStrategy.RenderStrategyPropsProvider(vue.computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose.useForwardExpose();
     return (_ctx, _cache) => {

package/dist/components/dialog/dialog-root-provider.vue.d.cts

@@ -1,6 +1,7 @@
 import { UnwrapRef, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { UseDialogReturn } from './use-dialog';
+import { RootEmits as PresenceEmits } from '../presence/presence.types';
 interface RootProviderProps {
     value: UnwrapRef<UseDialogReturn>;
 }
@@ -8,7 +9,13 @@ export interface DialogRootProviderBaseProps extends RootProviderProps, RenderSt
 }
 export interface DialogRootProviderProps extends DialogRootProviderBaseProps {
 }
-declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProviderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DialogRootProviderProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+export interface DialogRootProviderEmits extends PresenceEmits {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProviderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    exitComplete: () => any;
+}, string, PublicProps, Readonly<DialogRootProviderProps> & Readonly<{
+    onExitComplete?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/components/dialog/dialog-root-provider.vue.d.ts

@@ -1,6 +1,7 @@
 import { UnwrapRef, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { UseDialogReturn } from './use-dialog';
+import { RootEmits as PresenceEmits } from '../presence/presence.types';
 interface RootProviderProps {
     value: UnwrapRef<UseDialogReturn>;
 }
@@ -8,7 +9,13 @@ export interface DialogRootProviderBaseProps extends RootProviderProps, RenderSt
 }
 export interface DialogRootProviderProps extends DialogRootProviderBaseProps {
 }
-declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProviderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DialogRootProviderProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+export interface DialogRootProviderEmits extends PresenceEmits {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<DialogRootProviderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    exitComplete: () => any;
+}, string, PublicProps, Readonly<DialogRootProviderProps> & Readonly<{
+    onExitComplete?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;