@ark-ui/vue 5.29.1 → 5.31.0

package/dist/components/color-picker/color-picker-root.vue.js

@@ -1,9 +1,11 @@
-import { defineComponent, mergeDefaults, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, mergeDefaults } from 'vue';
+import { RenderStrategyPropsProvider } from '../../utils/use-render-strategy.js';
+import { useForwardExpose } from '../../utils/use-forward-expose.js';
 import { ark } from '../factory.js';
+import { usePresence } from '../presence/use-presence.js';
+import { PresenceProvider } from '../presence/use-presence-context.js';
 import { useColorPicker } from './use-color-picker.js';
 import { ColorPickerProvider } from './use-color-picker-context.js';
-import { RenderStrategyPropsProvider } from '../../utils/use-render-strategy.js';
-import { useForwardExpose } from '../../utils/use-forward-expose.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "color-picker-root",
@@ -40,12 +42,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     required: void 0,
     inline: void 0
   }),
-  emits: ["focusOutside", "formatChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "valueChangeEnd", "update:modelValue", "update:open", "update:format"],
+  emits: ["exitComplete", "focusOutside", "formatChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "valueChangeEnd", "update:modelValue", "update:open", "update:format"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const colorPicker = useColorPicker(props, emits);
+    const presence = usePresence(
+      computed(() => ({
+        present: colorPicker.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      emits
+    );
     ColorPickerProvider(colorPicker);
+    PresenceProvider(presence);
     RenderStrategyPropsProvider(computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose();
     return (_ctx, _cache) => {

package/dist/components/color-picker/color-picker-swatch-group.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 { colorPickerAnatomy } from './color-picker.anatomy.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/color-picker/color-picker-swatch-indicator.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 { useColorPickerContext } from './use-color-picker-context.js';
 import { useColorPickerSwatchPropsContext } from './use-color-picker-swatch-props-context.js';

package/dist/components/color-picker/color-picker-swatch-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 { useColorPickerContext } from './use-color-picker-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/color-picker/color-picker-swatch.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 { useColorPickerContext } from './use-color-picker-context.js';
 import { ColorPickerSwatchPropsProvider } from './use-color-picker-swatch-props-context.js';

package/dist/components/color-picker/color-picker-transparency-grid.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 { useColorPickerContext } from './use-color-picker-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/color-picker/color-picker-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 { useColorPickerContext } from './use-color-picker-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/color-picker/color-picker-value-swatch.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useColorPickerContext } from './use-color-picker-context.js';
 import { ColorPickerSwatchPropsProvider } from './use-color-picker-swatch-props-context.js';

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

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

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

@@ -1,4 +1,4 @@
-import { defineComponent, 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 { colorPickerAnatomy } from './color-picker.anatomy.js';
 import { useColorPickerContext } from './use-color-picker-context.js';

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

@@ -97,6 +97,10 @@ export interface RootProps {
     inline?: boolean;
 }
 export type RootEmits = {
+    /**
+     * Function called when the animation ends in the closed state
+     */
+    exitComplete: [];
     /**
      * Function called when the focus is moved outside the component
      */

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

@@ -97,6 +97,10 @@ export interface RootProps {
     inline?: boolean;
 }
 export type RootEmits = {
+    /**
+     * Function called when the animation ends in the closed state
+     */
+    exitComplete: [];
     /**
      * Function called when the focus is moved outside the component
      */

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const colorPicker = require('@zag-js/color-picker');
+const colorPicker$1 = require('@zag-js/color-picker');
 const colorPickerAreaBackground_vue_vue_type_script_setup_true_lang = require('./color-picker-area-background.vue.cjs');
 const colorPickerAreaThumb_vue_vue_type_script_setup_true_lang = require('./color-picker-area-thumb.vue.cjs');
 const colorPickerArea_vue_vue_type_script_setup_true_lang = require('./color-picker-area.vue.cjs');
@@ -35,13 +35,13 @@ const colorPickerView_vue_vue_type_script_setup_true_lang = require('./color-pic
 const colorPicker_anatomy = require('./color-picker.anatomy.cjs');
 const useColorPicker = require('./use-color-picker.cjs');
 const useColorPickerContext = require('./use-color-picker-context.cjs');
-const colorPicker$1 = require('./color-picker.cjs');
+const colorPicker = require('./color-picker.cjs');
 
 
 
 Object.defineProperty(exports, "parseColor", {
   enumerable: true,
-  get: () => colorPicker.parse
+  get: () => colorPicker$1.parse
 });
 exports.ColorPickerAreaBackground = colorPickerAreaBackground_vue_vue_type_script_setup_true_lang.default;
 exports.ColorPickerAreaThumb = colorPickerAreaThumb_vue_vue_type_script_setup_true_lang.default;
@@ -75,4 +75,4 @@ exports.ColorPickerView = colorPickerView_vue_vue_type_script_setup_true_lang.de
 exports.colorPickerAnatomy = colorPicker_anatomy.colorPickerAnatomy;
 exports.useColorPicker = useColorPicker.useColorPicker;
 exports.useColorPickerContext = useColorPickerContext.useColorPickerContext;
-exports.ColorPicker = colorPicker$1;
+exports.ColorPicker = colorPicker;

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

@@ -18,7 +18,7 @@ export { default as ColorPickerFormatTrigger, type ColorPickerFormatTriggerBaseP
 export { default as ColorPickerHiddenInput, type ColorPickerHiddenInputBaseProps, type ColorPickerHiddenInputProps, } from './color-picker-hidden-input.vue';
 export { default as ColorPickerLabel, type ColorPickerLabelBaseProps, type ColorPickerLabelProps, } from './color-picker-label.vue';
 export { default as ColorPickerPositioner, type ColorPickerPositionerBaseProps, type ColorPickerPositionerProps, } from './color-picker-positioner.vue';
-export { default as ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderProps, } from './color-picker-root-provider.vue';
+export { default as ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderEmits, type ColorPickerRootProviderProps, } from './color-picker-root-provider.vue';
 export { default as ColorPickerRoot, type ColorPickerRootBaseProps, type ColorPickerRootEmits, type ColorPickerRootProps, } from './color-picker-root.vue';
 export { default as ColorPickerSwatchGroup, type ColorPickerSwatchGroupBaseProps, type ColorPickerSwatchGroupProps, } from './color-picker-swatch-group.vue';
 export { default as ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps, } from './color-picker-swatch-indicator.vue';

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

@@ -18,7 +18,7 @@ export { default as ColorPickerFormatTrigger, type ColorPickerFormatTriggerBaseP
 export { default as ColorPickerHiddenInput, type ColorPickerHiddenInputBaseProps, type ColorPickerHiddenInputProps, } from './color-picker-hidden-input.vue';
 export { default as ColorPickerLabel, type ColorPickerLabelBaseProps, type ColorPickerLabelProps, } from './color-picker-label.vue';
 export { default as ColorPickerPositioner, type ColorPickerPositionerBaseProps, type ColorPickerPositionerProps, } from './color-picker-positioner.vue';
-export { default as ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderProps, } from './color-picker-root-provider.vue';
+export { default as ColorPickerRootProvider, type ColorPickerRootProviderBaseProps, type ColorPickerRootProviderEmits, type ColorPickerRootProviderProps, } from './color-picker-root-provider.vue';
 export { default as ColorPickerRoot, type ColorPickerRootBaseProps, type ColorPickerRootEmits, type ColorPickerRootProps, } from './color-picker-root.vue';
 export { default as ColorPickerSwatchGroup, type ColorPickerSwatchGroupBaseProps, type ColorPickerSwatchGroupProps, } from './color-picker-swatch-group.vue';
 export { default as ColorPickerSwatchIndicator, type ColorPickerSwatchIndicatorBaseProps, type ColorPickerSwatchIndicatorProps, } from './color-picker-swatch-indicator.vue';

package/dist/components/combobox/combobox-clear-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 { useComboboxContext } from './use-combobox-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/combobox/combobox-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 { useComboboxContext } from './use-combobox-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/combobox/combobox-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 { useComboboxContext } from './use-combobox-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/combobox/combobox-empty.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
 import { ark } from '../factory.js';
 import { comboboxAnatomy } from './combobox.anatomy.js';
 import { useComboboxContext } from './use-combobox-context.js';

package/dist/components/combobox/combobox-input.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 { useComboboxContext } from './use-combobox-context.js';
 import { useFieldContext } from '../field/use-field-context.js';

package/dist/components/combobox/combobox-item-group-label.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 { useComboboxContext } from './use-combobox-context.js';
 import { useComboboxItemGroupPropsContext } from './use-combobox-item-group-props-context.js';

package/dist/components/combobox/combobox-item-group.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, useId, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, useId, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useComboboxContext } from './use-combobox-context.js';
 import { ComboboxItemGroupPropsProvider } from './use-combobox-item-group-props-context.js';

package/dist/components/combobox/combobox-item-indicator.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 { useComboboxContext } from './use-combobox-context.js';
 import { useComboboxItemPropsContext } from './use-combobox-item-props-context.js';

package/dist/components/combobox/combobox-item-text.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 { useComboboxContext } from './use-combobox-context.js';
 import { useComboboxItemPropsContext } from './use-combobox-item-props-context.js';

package/dist/components/combobox/combobox-item.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useComboboxContext } from './use-combobox-context.js';
 import { ComboboxItemProvider } from './use-combobox-item-context.js';

package/dist/components/combobox/combobox-label.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 { useComboboxContext } from './use-combobox-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

package/dist/components/combobox/combobox-list.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 { useComboboxContext } from './use-combobox-context.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';

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

@@ -3,12 +3,10 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
 const vue = require('vue');
-const useRenderStrategy = require('../../utils/use-render-strategy.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
-const usePresence = require('../presence/use-presence.cjs');
+const factory = require('../factory.cjs');
 const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
-const factory = require('../factory.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "combobox-positioner",
@@ -17,14 +15,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     const combobox = useComboboxContext.useComboboxContext();
-    const renderStrategy = useRenderStrategy.useRenderStrategyProps();
-    const presence = usePresence.usePresence(
-      vue.computed(() => ({
-        ...renderStrategy.value,
-        present: combobox.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(combobox).getPositionerProps(), { "as-child": __props.asChild }), {

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

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

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

@@ -6,6 +6,8 @@ const vue = require('vue');
 const useRenderStrategy = require('../../utils/use-render-strategy.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
 const factory = require('../factory.cjs');
+const usePresence = require('../presence/use-presence.cjs');
+const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
@@ -16,10 +18,22 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     unmountOnExit: { type: Boolean },
     asChild: { type: Boolean }
   },
-  setup(__props) {
+  emits: ["exitComplete"],
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const combobox = vue.computed(() => props.value);
+    const presence = usePresence.usePresence(
+      vue.computed(() => ({
+        present: combobox.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      // @ts-expect-error TODO tweak EmitFn
+      emits
+    );
     useComboboxContext.ComboboxProvider(combobox);
+    usePresenceContext.PresenceProvider(presence);
     useRenderStrategy.RenderStrategyPropsProvider(vue.computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose.useForwardExpose();
     return (_ctx, _cache) => {

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

@@ -4,6 +4,7 @@ import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { UseComboboxReturn } from './use-combobox';
+import { RootEmits as PresenceEmits } from '../presence/presence.types';
 interface RootProviderProps<T extends CollectionItem> {
     value: UnwrapRef<UseComboboxReturn<T>>;
 }
@@ -16,14 +17,18 @@ export interface ComboboxRootProviderProps<T extends CollectionItem> extends Com
 HTMLAttributes {
 }
 export type ComboboxRootProviderComponent<P = {}> = <T extends CollectionItem>(props: Assign<ComboboxRootProviderProps<T>, P>) => any;
+export interface ComboboxRootProviderEmits extends PresenceEmits {
+}
 declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, never> & ComboboxRootProviderProps<T> & Partial<{}>> & PublicProps;
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onExitComplete?: (() => any) | undefined;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onExitComplete"> & ComboboxRootProviderProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
         default?(_: {}): any;
     };
-    emit: {};
+    emit: (evt: "exitComplete") => void;
 }>) => VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

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

@@ -4,6 +4,7 @@ import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { UseComboboxReturn } from './use-combobox';
+import { RootEmits as PresenceEmits } from '../presence/presence.types';
 interface RootProviderProps<T extends CollectionItem> {
     value: UnwrapRef<UseComboboxReturn<T>>;
 }
@@ -16,14 +17,18 @@ export interface ComboboxRootProviderProps<T extends CollectionItem> extends Com
 HTMLAttributes {
 }
 export type ComboboxRootProviderComponent<P = {}> = <T extends CollectionItem>(props: Assign<ComboboxRootProviderProps<T>, P>) => any;
+export interface ComboboxRootProviderEmits extends PresenceEmits {
+}
 declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, never> & ComboboxRootProviderProps<T> & Partial<{}>> & PublicProps;
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onExitComplete?: (() => any) | undefined;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onExitComplete"> & ComboboxRootProviderProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
         default?(_: {}): any;
     };
-    emit: {};
+    emit: (evt: "exitComplete") => void;
 }>) => VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/components/combobox/combobox-root-provider.vue.js

@@ -1,7 +1,9 @@
-import { defineComponent, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { RenderStrategyPropsProvider } from '../../utils/use-render-strategy.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';
 import { ark } from '../factory.js';
+import { usePresence } from '../presence/use-presence.js';
+import { PresenceProvider } from '../presence/use-presence-context.js';
 import { ComboboxProvider } from './use-combobox-context.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -12,10 +14,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     unmountOnExit: { type: Boolean },
     asChild: { type: Boolean }
   },
-  setup(__props) {
+  emits: ["exitComplete"],
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const combobox = computed(() => props.value);
+    const presence = usePresence(
+      computed(() => ({
+        present: combobox.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      // @ts-expect-error TODO tweak EmitFn
+      emits
+    );
     ComboboxProvider(combobox);
+    PresenceProvider(presence);
     RenderStrategyPropsProvider(computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose();
     return (_ctx, _cache) => {

package/dist/components/combobox/combobox-root.vue.cjs

@@ -6,6 +6,8 @@ const vue = require('vue');
 const useRenderStrategy = require('../../utils/use-render-strategy.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
 const factory = require('../factory.cjs');
+const usePresence = require('../presence/use-presence.cjs');
+const usePresenceContext = require('../presence/use-presence-context.cjs');
 const useCombobox = require('./use-combobox.cjs');
 const useComboboxContext = require('./use-combobox-context.cjs');
 
@@ -69,12 +71,21 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     readOnly: void 0,
     required: void 0
   }),
-  emits: ["focusOutside", "highlightChange", "inputValueChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "select", "update:modelValue", "update:highlightedValue", "update:inputValue", "update:open"],
+  emits: ["exitComplete", "focusOutside", "highlightChange", "inputValueChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "select", "update:modelValue", "update:highlightedValue", "update:inputValue", "update:open"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const combobox = useCombobox.useCombobox(props, emits);
+    const presence = usePresence.usePresence(
+      vue.computed(() => ({
+        present: combobox.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      emits
+    );
     useComboboxContext.ComboboxProvider(combobox);
+    usePresenceContext.PresenceProvider(presence);
     useRenderStrategy.RenderStrategyPropsProvider(vue.computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose.useForwardExpose();
     return (_ctx, _cache) => {

package/dist/components/combobox/combobox-root.vue.d.cts

@@ -5,7 +5,7 @@ import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './combobox.types';
 import { ValueChangeDetails, OpenChangeDetails, HighlightChangeDetails, InputValueChangeDetails } from '@zag-js/combobox';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
 export interface ComboboxRootBaseProps<T extends CollectionItem> extends RootProps<T>, RenderStrategyProps, PolymorphicProps {
 }
 export interface ComboboxRootProps<T extends CollectionItem> extends ComboboxRootBaseProps<T>, 
@@ -23,6 +23,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
             value: string[];
             itemValue: string;
         }) => any) | undefined;
+        readonly onExitComplete?: (() => any) | undefined;
         readonly onValueChange?: ((details: ValueChangeDetails<T>) => any) | undefined;
         readonly "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
         readonly onOpenChange?: ((details: OpenChangeDetails) => any) | undefined;
@@ -34,7 +35,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
         readonly onInputValueChange?: ((details: InputValueChangeDetails) => any) | undefined;
         readonly "onUpdate:highlightedValue"?: ((value: string | null) => any) | undefined;
         readonly "onUpdate:inputValue"?: ((value: string) => any) | undefined;
-    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onSelect" | "onValueChange" | "onOpenChange" | "onUpdate:open" | "onUpdate:modelValue" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "onHighlightChange" | "onInputValueChange" | "onUpdate:highlightedValue" | "onUpdate:inputValue"> & ComboboxRootProps<T> & Partial<{}>> & PublicProps;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onSelect" | "onExitComplete" | "onValueChange" | "onOpenChange" | "onUpdate:open" | "onUpdate:modelValue" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "onHighlightChange" | "onInputValueChange" | "onUpdate:highlightedValue" | "onUpdate:inputValue"> & ComboboxRootProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
@@ -43,7 +44,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
     emit: ((evt: "select", details: {
         value: string[];
         itemValue: string;
-    }) => void) & ((evt: "valueChange", details: ValueChangeDetails<T>) => void) & ((evt: "update:modelValue", value: string[]) => void) & ((evt: "openChange", details: OpenChangeDetails) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "focusOutside", event: FocusOutsideEvent) => void) & ((evt: "interactOutside", event: InteractOutsideEvent) => void) & ((evt: "pointerDownOutside", event: PointerDownOutsideEvent) => void) & ((evt: "highlightChange", details: HighlightChangeDetails<T>) => void) & ((evt: "inputValueChange", details: InputValueChangeDetails) => void) & ((evt: "update:highlightedValue", value: string | null) => void) & ((evt: "update:inputValue", value: string) => void);
+    }) => void) & ((evt: "exitComplete") => void) & ((evt: "valueChange", details: ValueChangeDetails<T>) => void) & ((evt: "update:modelValue", value: string[]) => void) & ((evt: "openChange", details: OpenChangeDetails) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "focusOutside", event: FocusOutsideEvent) => void) & ((evt: "interactOutside", event: InteractOutsideEvent) => void) & ((evt: "pointerDownOutside", event: PointerDownOutsideEvent) => void) & ((evt: "highlightChange", details: HighlightChangeDetails<T>) => void) & ((evt: "inputValueChange", details: InputValueChangeDetails) => void) & ((evt: "update:highlightedValue", value: string | null) => void) & ((evt: "update:inputValue", value: string) => void);
 }>) => VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/components/combobox/combobox-root.vue.d.ts

@@ -5,7 +5,7 @@ import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './combobox.types';
 import { ValueChangeDetails, OpenChangeDetails, HighlightChangeDetails, InputValueChangeDetails } from '@zag-js/combobox';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
 export interface ComboboxRootBaseProps<T extends CollectionItem> extends RootProps<T>, RenderStrategyProps, PolymorphicProps {
 }
 export interface ComboboxRootProps<T extends CollectionItem> extends ComboboxRootBaseProps<T>, 
@@ -23,6 +23,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
             value: string[];
             itemValue: string;
         }) => any) | undefined;
+        readonly onExitComplete?: (() => any) | undefined;
         readonly onValueChange?: ((details: ValueChangeDetails<T>) => any) | undefined;
         readonly "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
         readonly onOpenChange?: ((details: OpenChangeDetails) => any) | undefined;
@@ -34,7 +35,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
         readonly onInputValueChange?: ((details: InputValueChangeDetails) => any) | undefined;
         readonly "onUpdate:highlightedValue"?: ((value: string | null) => any) | undefined;
         readonly "onUpdate:inputValue"?: ((value: string) => any) | undefined;
-    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onSelect" | "onValueChange" | "onOpenChange" | "onUpdate:open" | "onUpdate:modelValue" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "onHighlightChange" | "onInputValueChange" | "onUpdate:highlightedValue" | "onUpdate:inputValue"> & ComboboxRootProps<T> & Partial<{}>> & PublicProps;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>, "onSelect" | "onExitComplete" | "onValueChange" | "onOpenChange" | "onUpdate:open" | "onUpdate:modelValue" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside" | "onHighlightChange" | "onInputValueChange" | "onUpdate:highlightedValue" | "onUpdate:inputValue"> & ComboboxRootProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {
@@ -43,7 +44,7 @@ declare const _default: <T extends CollectionItem>(__VLS_props: NonNullable<Awai
     emit: ((evt: "select", details: {
         value: string[];
         itemValue: string;
-    }) => void) & ((evt: "valueChange", details: ValueChangeDetails<T>) => void) & ((evt: "update:modelValue", value: string[]) => void) & ((evt: "openChange", details: OpenChangeDetails) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "focusOutside", event: FocusOutsideEvent) => void) & ((evt: "interactOutside", event: InteractOutsideEvent) => void) & ((evt: "pointerDownOutside", event: PointerDownOutsideEvent) => void) & ((evt: "highlightChange", details: HighlightChangeDetails<T>) => void) & ((evt: "inputValueChange", details: InputValueChangeDetails) => void) & ((evt: "update:highlightedValue", value: string | null) => void) & ((evt: "update:inputValue", value: string) => void);
+    }) => void) & ((evt: "exitComplete") => void) & ((evt: "valueChange", details: ValueChangeDetails<T>) => void) & ((evt: "update:modelValue", value: string[]) => void) & ((evt: "openChange", details: OpenChangeDetails) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "focusOutside", event: FocusOutsideEvent) => void) & ((evt: "interactOutside", event: InteractOutsideEvent) => void) & ((evt: "pointerDownOutside", event: PointerDownOutsideEvent) => void) & ((evt: "highlightChange", details: HighlightChangeDetails<T>) => void) & ((evt: "inputValueChange", details: InputValueChangeDetails) => void) & ((evt: "update:highlightedValue", value: string | null) => void) & ((evt: "update:inputValue", value: string) => void);
 }>) => VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/components/combobox/combobox-root.vue.js

@@ -1,7 +1,9 @@
-import { defineComponent, mergeDefaults, computed, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, mergeDefaults } from 'vue';
 import { RenderStrategyPropsProvider } from '../../utils/use-render-strategy.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';
 import { ark } from '../factory.js';
+import { usePresence } from '../presence/use-presence.js';
+import { PresenceProvider } from '../presence/use-presence-context.js';
 import { useCombobox } from './use-combobox.js';
 import { ComboboxProvider } from './use-combobox-context.js';
 
@@ -65,12 +67,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     readOnly: void 0,
     required: void 0
   }),
-  emits: ["focusOutside", "highlightChange", "inputValueChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "select", "update:modelValue", "update:highlightedValue", "update:inputValue", "update:open"],
+  emits: ["exitComplete", "focusOutside", "highlightChange", "inputValueChange", "interactOutside", "openChange", "pointerDownOutside", "valueChange", "select", "update:modelValue", "update:highlightedValue", "update:inputValue", "update:open"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const combobox = useCombobox(props, emits);
+    const presence = usePresence(
+      computed(() => ({
+        present: combobox.value.open,
+        lazyMount: props.lazyMount,
+        unmountOnExit: props.unmountOnExit
+      })),
+      emits
+    );
     ComboboxProvider(combobox);
+    PresenceProvider(presence);
     RenderStrategyPropsProvider(computed(() => ({ lazyMount: props.lazyMount, unmountOnExit: props.unmountOnExit })));
     useForwardExpose();
     return (_ctx, _cache) => {