@ark-ui/vue 5.21.0 → 5.23.0

package/dist/components/hover-card/hover-card.types.d.ts

@@ -10,6 +10,10 @@ export interface RootProps {
      * Use when you don't need to control the open state of the hover card.
      */
     defaultOpen?: boolean;
+    /**
+     * Whether the hover card is disabled
+     */
+    disabled?: boolean;
     /**
      * The unique identifier of the machine.
      */

package/dist/components/index.cjs

@@ -128,6 +128,7 @@ const useColorPickerContext = require('./color-picker/use-color-picker-context.c
 const colorPicker$1 = require('./color-picker/color-picker.cjs');
 const comboboxClearTrigger_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-clear-trigger.vue.cjs');
 const comboboxContent_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-content.vue.cjs');
+const comboboxEmpty_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-empty.vue.cjs');
 const comboboxContext_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-context.vue.cjs');
 const comboboxControl_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-control.vue.cjs');
 const comboboxInput_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-input.vue.cjs');
@@ -143,10 +144,11 @@ const comboboxPositioner_vue_vue_type_script_setup_true_lang = require('./combob
 const comboboxRootProvider_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-root-provider.vue.cjs');
 const comboboxRoot_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-root.vue.cjs');
 const comboboxTrigger_vue_vue_type_script_setup_true_lang = require('./combobox/combobox-trigger.vue.cjs');
+const combobox_anatomy = require('./combobox/combobox.anatomy.cjs');
 const useCombobox = require('./combobox/use-combobox.cjs');
 const useComboboxContext = require('./combobox/use-combobox-context.cjs');
 const useComboboxItemContext = require('./combobox/use-combobox-item-context.cjs');
-const combobox$1 = require('./combobox/combobox.cjs');
+const combobox = require('./combobox/combobox.cjs');
 const datePicker = require('@zag-js/date-picker');
 const datePickerClearTrigger_vue_vue_type_script_setup_true_lang = require('./date-picker/date-picker-clear-trigger.vue.cjs');
 const datePickerContent_vue_vue_type_script_setup_true_lang = require('./date-picker/date-picker-content.vue.cjs');
@@ -292,6 +294,7 @@ const useJsonTreeView = require('./json-tree-view/use-json-tree-view.cjs');
 const jsonTreeView = require('./json-tree-view/json-tree-view.cjs');
 const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-context.vue.cjs');
 const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-content.vue.cjs');
+const listboxEmpty_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-empty.vue.cjs');
 const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-input.vue.cjs');
 const listboxItem_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item.vue.cjs');
 const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item-context.vue.cjs');
@@ -303,10 +306,11 @@ const listboxLabel_vue_vue_type_script_setup_true_lang = require('./listbox/list
 const listboxRoot_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-root.vue.cjs');
 const listboxRootProvider_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-root-provider.vue.cjs');
 const listboxValueText_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-value-text.vue.cjs');
+const listbox_anatomy = require('./listbox/listbox.anatomy.cjs');
 const useListbox = require('./listbox/use-listbox.cjs');
 const useListboxContext = require('./listbox/use-listbox-context.cjs');
 const useListboxItemContext = require('./listbox/use-listbox-item-context.cjs');
-const listbox$1 = require('./listbox/listbox.cjs');
+const listbox = require('./listbox/listbox.cjs');
 const menuArrowTip_vue_vue_type_script_setup_true_lang = require('./menu/menu-arrow-tip.vue.cjs');
 const menuArrow_vue_vue_type_script_setup_true_lang = require('./menu/menu-arrow.vue.cjs');
 const menuCheckboxItem_vue_vue_type_script_setup_true_lang = require('./menu/menu-checkbox-item.vue.cjs');
@@ -697,13 +701,11 @@ const avatar = require('@zag-js/avatar');
 const carousel = require('@zag-js/carousel');
 const clipboard = require('@zag-js/clipboard');
 const collapsible = require('@zag-js/collapsible');
-const combobox = require('@zag-js/combobox');
 const dialog = require('@zag-js/dialog');
 const editable = require('@zag-js/editable');
 const fileUpload = require('@zag-js/file-upload');
 const floatingPanel = require('@zag-js/floating-panel');
 const hoverCard = require('@zag-js/hover-card');
-const listbox = require('@zag-js/listbox');
 const menu = require('@zag-js/menu');
 const numberInput = require('@zag-js/number-input');
 const pagination = require('@zag-js/pagination');
@@ -862,6 +864,7 @@ exports.useColorPickerContext = useColorPickerContext.useColorPickerContext;
 exports.ColorPicker = colorPicker$1;
 exports.ComboboxClearTrigger = comboboxClearTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxContent = comboboxContent_vue_vue_type_script_setup_true_lang.default;
+exports.ComboboxEmpty = comboboxEmpty_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxContext = comboboxContext_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxControl = comboboxControl_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxInput = comboboxInput_vue_vue_type_script_setup_true_lang.default;
@@ -877,10 +880,11 @@ exports.ComboboxPositioner = comboboxPositioner_vue_vue_type_script_setup_true_l
 exports.ComboboxRootProvider = comboboxRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxRoot = comboboxRoot_vue_vue_type_script_setup_true_lang.default;
 exports.ComboboxTrigger = comboboxTrigger_vue_vue_type_script_setup_true_lang.default;
+exports.comboboxAnatomy = combobox_anatomy.comboboxAnatomy;
 exports.useCombobox = useCombobox.useCombobox;
 exports.useComboboxContext = useComboboxContext.useComboboxContext;
 exports.useComboboxItemContext = useComboboxItemContext.useComboboxItemContext;
-exports.Combobox = combobox$1;
+exports.Combobox = combobox;
 Object.defineProperty(exports, "parseDate", {
 	enumerable: true,
 	get: () => datePicker.parse
@@ -1030,6 +1034,7 @@ exports.useJsonTreeView = useJsonTreeView.useJsonTreeView;
 exports.JsonTreeView = jsonTreeView;
 exports.ListboxContext = listboxContext_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxContent = listboxContent_vue_vue_type_script_setup_true_lang.default;
+exports.ListboxEmpty = listboxEmpty_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxInput = listboxInput_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxItem = listboxItem_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
@@ -1041,10 +1046,11 @@ exports.ListboxLabel = listboxLabel_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxRoot = listboxRoot_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxRootProvider = listboxRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxValueText = listboxValueText_vue_vue_type_script_setup_true_lang.default;
+exports.listboxAnatomy = listbox_anatomy.listboxAnatomy;
 exports.useListbox = useListbox.useListbox;
 exports.useListboxContext = useListboxContext.useListboxContext;
 exports.useListboxItemContext = useListboxItemContext.useListboxItemContext;
-exports.Listbox = listbox$1;
+exports.Listbox = listbox;
 exports.MenuArrowTip = menuArrowTip_vue_vue_type_script_setup_true_lang.default;
 exports.MenuArrow = menuArrow_vue_vue_type_script_setup_true_lang.default;
 exports.MenuCheckboxItem = menuCheckboxItem_vue_vue_type_script_setup_true_lang.default;
@@ -1457,10 +1463,6 @@ Object.defineProperty(exports, "collapsibleAnatomy", {
 	enumerable: true,
 	get: () => collapsible.anatomy
 });
-Object.defineProperty(exports, "comboboxAnatomy", {
-	enumerable: true,
-	get: () => combobox.anatomy
-});
 Object.defineProperty(exports, "dialogAnatomy", {
 	enumerable: true,
 	get: () => dialog.anatomy
@@ -1481,10 +1483,6 @@ Object.defineProperty(exports, "hoverCardAnatomy", {
 	enumerable: true,
 	get: () => hoverCard.anatomy
 });
-Object.defineProperty(exports, "listboxAnatomy", {
-	enumerable: true,
-	get: () => listbox.anatomy
-});
 Object.defineProperty(exports, "menuAnatomy", {
 	enumerable: true,
 	get: () => menu.anatomy

package/dist/components/index.js

@@ -132,6 +132,7 @@ import * as colorPicker from './color-picker/color-picker.js';
 export { colorPicker as ColorPicker };
 export { default as ComboboxClearTrigger } from './combobox/combobox-clear-trigger.vue.js';
 export { default as ComboboxContent } from './combobox/combobox-content.vue.js';
+export { default as ComboboxEmpty } from './combobox/combobox-empty.vue.js';
 export { default as ComboboxContext } from './combobox/combobox-context.vue.js';
 export { default as ComboboxControl } from './combobox/combobox-control.vue.js';
 export { default as ComboboxInput } from './combobox/combobox-input.vue.js';
@@ -147,6 +148,7 @@ export { default as ComboboxPositioner } from './combobox/combobox-positioner.vu
 export { default as ComboboxRootProvider } from './combobox/combobox-root-provider.vue.js';
 export { default as ComboboxRoot } from './combobox/combobox-root.vue.js';
 export { default as ComboboxTrigger } from './combobox/combobox-trigger.vue.js';
+export { comboboxAnatomy } from './combobox/combobox.anatomy.js';
 export { useCombobox } from './combobox/use-combobox.js';
 export { useComboboxContext } from './combobox/use-combobox-context.js';
 export { useComboboxItemContext } from './combobox/use-combobox-item-context.js';
@@ -307,6 +309,7 @@ import * as jsonTreeView from './json-tree-view/json-tree-view.js';
 export { jsonTreeView as JsonTreeView };
 export { default as ListboxContext } from './listbox/listbox-context.vue.js';
 export { default as ListboxContent } from './listbox/listbox-content.vue.js';
+export { default as ListboxEmpty } from './listbox/listbox-empty.vue.js';
 export { default as ListboxInput } from './listbox/listbox-input.vue.js';
 export { default as ListboxItem } from './listbox/listbox-item.vue.js';
 export { default as ListboxItemContext } from './listbox/listbox-item-context.vue.js';
@@ -318,6 +321,7 @@ export { default as ListboxLabel } from './listbox/listbox-label.vue.js';
 export { default as ListboxRoot } from './listbox/listbox-root.vue.js';
 export { default as ListboxRootProvider } from './listbox/listbox-root-provider.vue.js';
 export { default as ListboxValueText } from './listbox/listbox-value-text.vue.js';
+export { listboxAnatomy } from './listbox/listbox.anatomy.js';
 export { useListbox } from './listbox/use-listbox.js';
 export { useListboxContext } from './listbox/use-listbox-context.js';
 export { useListboxItemContext } from './listbox/use-listbox-item-context.js';
@@ -741,13 +745,11 @@ export { anatomy as avatarAnatomy } from '@zag-js/avatar';
 export { anatomy as carouselAnatomy } from '@zag-js/carousel';
 export { anatomy as clipboardAnatomy } from '@zag-js/clipboard';
 export { anatomy as collapsibleAnatomy } from '@zag-js/collapsible';
-export { anatomy as comboboxAnatomy } from '@zag-js/combobox';
 export { anatomy as dialogAnatomy } from '@zag-js/dialog';
 export { anatomy as editableAnatomy } from '@zag-js/editable';
 export { anatomy as fileUploadAnatomy } from '@zag-js/file-upload';
 export { anatomy as floatingPanelAnatomy } from '@zag-js/floating-panel';
 export { anatomy as hoverCardAnatomy } from '@zag-js/hover-card';
-export { anatomy as listboxAnatomy } from '@zag-js/listbox';
 export { anatomy as menuAnatomy } from '@zag-js/menu';
 export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
 export { anatomy as paginationAnatomy } from '@zag-js/pagination';

package/dist/components/listbox/index.cjs

@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const listCollection = require('../collection/list-collection.cjs');
 const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox-context.vue.cjs');
 const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox-content.vue.cjs');
+const listboxEmpty_vue_vue_type_script_setup_true_lang = require('./listbox-empty.vue.cjs');
 const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox-input.vue.cjs');
 const listboxItem_vue_vue_type_script_setup_true_lang = require('./listbox-item.vue.cjs');
 const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox-item-context.vue.cjs');
@@ -16,17 +17,18 @@ const listboxLabel_vue_vue_type_script_setup_true_lang = require('./listbox-labe
 const listboxRoot_vue_vue_type_script_setup_true_lang = require('./listbox-root.vue.cjs');
 const listboxRootProvider_vue_vue_type_script_setup_true_lang = require('./listbox-root-provider.vue.cjs');
 const listboxValueText_vue_vue_type_script_setup_true_lang = require('./listbox-value-text.vue.cjs');
+const listbox_anatomy = require('./listbox.anatomy.cjs');
 const useListbox = require('./use-listbox.cjs');
 const useListboxContext = require('./use-listbox-context.cjs');
 const useListboxItemContext = require('./use-listbox-item-context.cjs');
-const listbox$1 = require('./listbox.cjs');
-const listbox = require('@zag-js/listbox');
+const listbox = require('./listbox.cjs');
 
 
 
 exports.createListCollection = listCollection.createListCollection;
 exports.ListboxContext = listboxContext_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxContent = listboxContent_vue_vue_type_script_setup_true_lang.default;
+exports.ListboxEmpty = listboxEmpty_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxInput = listboxInput_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxItem = listboxItem_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
@@ -38,11 +40,8 @@ exports.ListboxLabel = listboxLabel_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxRoot = listboxRoot_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxRootProvider = listboxRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.ListboxValueText = listboxValueText_vue_vue_type_script_setup_true_lang.default;
+exports.listboxAnatomy = listbox_anatomy.listboxAnatomy;
 exports.useListbox = useListbox.useListbox;
 exports.useListboxContext = useListboxContext.useListboxContext;
 exports.useListboxItemContext = useListboxItemContext.useListboxItemContext;
-exports.Listbox = listbox$1;
-Object.defineProperty(exports, "listboxAnatomy", {
-  enumerable: true,
-  get: () => listbox.anatomy
-});
+exports.Listbox = listbox;

package/dist/components/listbox/index.d.cts

@@ -2,6 +2,7 @@ export type { HighlightChangeDetails as ListboxHighlightChangeDetails, ScrollToI
 export { createListCollection, type CollectionItem, type ListCollection } from '../collection';
 export { default as ListboxContext, type ListboxContextProps } from './listbox-context.vue';
 export { default as ListboxContent, type ListboxContentBaseProps, type ListboxContentProps, } from './listbox-content.vue';
+export { default as ListboxEmpty, type ListboxEmptyBaseProps, type ListboxEmptyProps } from './listbox-empty.vue';
 export { default as ListboxInput, type ListboxInputBaseProps, type ListboxInputProps } from './listbox-input.vue';
 export { default as ListboxItem, type ListboxItemBaseProps, type ListboxItemProps } from './listbox-item.vue';
 export { default as ListboxItemContext, type ListboxItemContextProps } from './listbox-item-context.vue';
@@ -10,8 +11,8 @@ export { default as ListboxItemGroupLabel, type ListboxItemGroupLabelBaseProps,
 export { default as ListboxItemIndicator, type ListboxItemIndicatorBaseProps, type ListboxItemIndicatorProps, } from './listbox-item-indicator.vue';
 export { default as ListboxItemText, type ListboxItemTextBaseProps, type ListboxItemTextProps, } from './listbox-item-text.vue';
 export { default as ListboxLabel, type ListboxLabelBaseProps, type ListboxLabelProps } from './listbox-label.vue';
-export { default as ListboxRoot, type ListboxRootBaseProps, type ListboxRootProps, type ListboxRootEmits, } from './listbox-root.vue';
-export { default as ListboxRootProvider, type ListboxRootProviderBaseProps, type ListboxRootProviderProps, } from './listbox-root-provider.vue';
+export { default as ListboxRoot, type ListboxRootBaseProps, type ListboxRootComponent, type ListboxRootEmits, type ListboxRootProps, } from './listbox-root.vue';
+export { default as ListboxRootProvider, type ListboxRootProviderBaseProps, type ListboxRootProviderProps, type ListboxRootProviderComponent, } from './listbox-root-provider.vue';
 export { default as ListboxValueText, type ListboxValueTextBaseProps, type ListboxValueTextProps, } from './listbox-value-text.vue';
 export { listboxAnatomy } from './listbox.anatomy';
 export { useListbox, type UseListboxProps, type UseListboxReturn } from './use-listbox';

package/dist/components/listbox/index.d.ts

@@ -2,6 +2,7 @@ export type { HighlightChangeDetails as ListboxHighlightChangeDetails, ScrollToI
 export { createListCollection, type CollectionItem, type ListCollection } from '../collection';
 export { default as ListboxContext, type ListboxContextProps } from './listbox-context.vue';
 export { default as ListboxContent, type ListboxContentBaseProps, type ListboxContentProps, } from './listbox-content.vue';
+export { default as ListboxEmpty, type ListboxEmptyBaseProps, type ListboxEmptyProps } from './listbox-empty.vue';
 export { default as ListboxInput, type ListboxInputBaseProps, type ListboxInputProps } from './listbox-input.vue';
 export { default as ListboxItem, type ListboxItemBaseProps, type ListboxItemProps } from './listbox-item.vue';
 export { default as ListboxItemContext, type ListboxItemContextProps } from './listbox-item-context.vue';
@@ -10,8 +11,8 @@ export { default as ListboxItemGroupLabel, type ListboxItemGroupLabelBaseProps,
 export { default as ListboxItemIndicator, type ListboxItemIndicatorBaseProps, type ListboxItemIndicatorProps, } from './listbox-item-indicator.vue';
 export { default as ListboxItemText, type ListboxItemTextBaseProps, type ListboxItemTextProps, } from './listbox-item-text.vue';
 export { default as ListboxLabel, type ListboxLabelBaseProps, type ListboxLabelProps } from './listbox-label.vue';
-export { default as ListboxRoot, type ListboxRootBaseProps, type ListboxRootProps, type ListboxRootEmits, } from './listbox-root.vue';
-export { default as ListboxRootProvider, type ListboxRootProviderBaseProps, type ListboxRootProviderProps, } from './listbox-root-provider.vue';
+export { default as ListboxRoot, type ListboxRootBaseProps, type ListboxRootComponent, type ListboxRootEmits, type ListboxRootProps, } from './listbox-root.vue';
+export { default as ListboxRootProvider, type ListboxRootProviderBaseProps, type ListboxRootProviderProps, type ListboxRootProviderComponent, } from './listbox-root-provider.vue';
 export { default as ListboxValueText, type ListboxValueTextBaseProps, type ListboxValueTextProps, } from './listbox-value-text.vue';
 export { listboxAnatomy } from './listbox.anatomy';
 export { useListbox, type UseListboxProps, type UseListboxReturn } from './use-listbox';

package/dist/components/listbox/index.js

@@ -1,6 +1,7 @@
 export { createListCollection } from '../collection/list-collection.js';
 export { default as ListboxContext } from './listbox-context.vue.js';
 export { default as ListboxContent } from './listbox-content.vue.js';
+export { default as ListboxEmpty } from './listbox-empty.vue.js';
 export { default as ListboxInput } from './listbox-input.vue.js';
 export { default as ListboxItem } from './listbox-item.vue.js';
 export { default as ListboxItemContext } from './listbox-item-context.vue.js';
@@ -12,9 +13,9 @@ export { default as ListboxLabel } from './listbox-label.vue.js';
 export { default as ListboxRoot } from './listbox-root.vue.js';
 export { default as ListboxRootProvider } from './listbox-root-provider.vue.js';
 export { default as ListboxValueText } from './listbox-value-text.vue.js';
+export { listboxAnatomy } from './listbox.anatomy.js';
 export { useListbox } from './use-listbox.js';
 export { useListboxContext } from './use-listbox-context.js';
 export { useListboxItemContext } from './use-listbox-item-context.js';
 import * as listbox from './listbox.js';
 export { listbox as Listbox };
-export { anatomy as listboxAnatomy } from '@zag-js/listbox';

package/dist/components/listbox/listbox-empty.vue.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const vue = require('vue');
+const factory = require('../factory.cjs');
+const listbox_anatomy = require('./listbox.anatomy.cjs');
+const useListboxContext = require('./use-listbox-context.cjs');
+const useForwardExpose = require('../../utils/use-forward-expose.cjs');
+
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "listbox-empty",
+  props: {
+    asChild: { type: Boolean }
+  },
+  setup(__props) {
+    const parts = listbox_anatomy.listboxAnatomy.build();
+    const listbox = useListboxContext.useListboxContext();
+    const isEmpty = vue.computed(() => listbox.value.collection.size === 0);
+    useForwardExpose.useForwardExpose();
+    return (_ctx, _cache) => {
+      return isEmpty.value ? (vue.openBlock(), vue.createBlock(vue.unref(factory.ark).div, vue.mergeProps({ key: 0 }, vue.unref(parts).empty.attrs, {
+        role: "presentation",
+        "as-child": _ctx.asChild
+      }), {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child"])) : vue.createCommentVNode("", true);
+    };
+  }
+});
+
+exports.default = _sfc_main;

package/dist/components/listbox/listbox-empty.vue.d.cts

@@ -0,0 +1,19 @@
+import { HTMLAttributes, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { PolymorphicProps } from '../factory';
+export interface ListboxEmptyBaseProps extends PolymorphicProps {
+}
+export interface ListboxEmptyProps extends ListboxEmptyBaseProps, 
+/**
+ * @vue-ignore
+ */
+HTMLAttributes {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<ListboxEmptyProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ListboxEmptyProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/listbox/listbox-empty.vue.d.ts

@@ -0,0 +1,19 @@
+import { HTMLAttributes, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { PolymorphicProps } from '../factory';
+export interface ListboxEmptyBaseProps extends PolymorphicProps {
+}
+export interface ListboxEmptyProps extends ListboxEmptyBaseProps, 
+/**
+ * @vue-ignore
+ */
+HTMLAttributes {
+}
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<ListboxEmptyProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ListboxEmptyProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,31 @@
+import { defineComponent, computed, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { ark } from '../factory.js';
+import { listboxAnatomy } from './listbox.anatomy.js';
+import { useListboxContext } from './use-listbox-context.js';
+import { useForwardExpose } from '../../utils/use-forward-expose.js';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "listbox-empty",
+  props: {
+    asChild: { type: Boolean }
+  },
+  setup(__props) {
+    const parts = listboxAnatomy.build();
+    const listbox = useListboxContext();
+    const isEmpty = computed(() => listbox.value.collection.size === 0);
+    useForwardExpose();
+    return (_ctx, _cache) => {
+      return isEmpty.value ? (openBlock(), createBlock(unref(ark).div, mergeProps({ key: 0 }, unref(parts).empty.attrs, {
+        role: "presentation",
+        "as-child": _ctx.asChild
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child"])) : createCommentVNode("", true);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/components/listbox/listbox-empty.vue2.cjs

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

package/dist/components/listbox/listbox-empty.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from './listbox-empty.vue.js';
+
+
+
+export { _sfc_main as default };

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

@@ -1,4 +1,5 @@
 import { HTMLAttributes, UnwrapRef, VNodeProps, AllowedComponentProps, ComponentCustomProps, PublicProps, ShallowUnwrapRef, VNode } from 'vue';
+import { Assign } from '../../types';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { UseListboxReturn } from './use-listbox';
@@ -13,6 +14,7 @@ export interface ListboxRootProviderProps<T extends CollectionItem> extends List
  */
 HTMLAttributes {
 }
+export type ListboxRootProviderComponent<P = {}> = <T extends CollectionItem>(props: Assign<ListboxRootProviderProps<T>, P>) => any;
 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> & ListboxRootProviderProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;

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

@@ -1,4 +1,5 @@
 import { HTMLAttributes, UnwrapRef, VNodeProps, AllowedComponentProps, ComponentCustomProps, PublicProps, ShallowUnwrapRef, VNode } from 'vue';
+import { Assign } from '../../types';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { UseListboxReturn } from './use-listbox';
@@ -13,6 +14,7 @@ export interface ListboxRootProviderProps<T extends CollectionItem> extends List
  */
 HTMLAttributes {
 }
+export type ListboxRootProviderComponent<P = {}> = <T extends CollectionItem>(props: Assign<ListboxRootProviderProps<T>, P>) => any;
 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> & ListboxRootProviderProps<T> & Partial<{}>> & PublicProps;
     expose(exposed: ShallowUnwrapRef<{}>): void;

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

@@ -1,4 +1,5 @@
 import { HTMLAttributes, VNodeProps, AllowedComponentProps, ComponentCustomProps, PublicProps, ShallowUnwrapRef, VNode } from 'vue';
+import { Assign } from '../../types';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './listbox.types';
@@ -11,6 +12,7 @@ export interface ListboxRootProps<T extends CollectionItem> extends ListboxRootB
  */
 HTMLAttributes {
 }
+export type ListboxRootComponent<P = {}> = <T extends CollectionItem>(props: Assign<ListboxRootProps<T>, P>) => any;
 export type { RootEmits as ListboxRootEmits } from './listbox.types';
 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<{

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

@@ -1,4 +1,5 @@
 import { HTMLAttributes, VNodeProps, AllowedComponentProps, ComponentCustomProps, PublicProps, ShallowUnwrapRef, VNode } from 'vue';
+import { Assign } from '../../types';
 import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './listbox.types';
@@ -11,6 +12,7 @@ export interface ListboxRootProps<T extends CollectionItem> extends ListboxRootB
  */
 HTMLAttributes {
 }
+export type ListboxRootComponent<P = {}> = <T extends CollectionItem>(props: Assign<ListboxRootProps<T>, P>) => any;
 export type { RootEmits as ListboxRootEmits } from './listbox.types';
 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<{

package/dist/components/listbox/listbox.anatomy.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const listbox = require('@zag-js/listbox');
+
+const listboxAnatomy = listbox.anatomy.extendWith("empty");
+
+exports.listboxAnatomy = listboxAnatomy;

package/dist/components/listbox/listbox.anatomy.d.cts

@@ -1 +1,2 @@
-export { anatomy as listboxAnatomy } from '@zag-js/listbox';
+import { AnatomyInstance } from '@zag-js/anatomy';
+export declare const listboxAnatomy: AnatomyInstance<"input" | "label" | "content" | "root" | "item" | "valueText" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/listbox/listbox.anatomy.d.ts

@@ -1 +1,2 @@
-export { anatomy as listboxAnatomy } from '@zag-js/listbox';
+import { AnatomyInstance } from '@zag-js/anatomy';
+export declare const listboxAnatomy: AnatomyInstance<"input" | "label" | "content" | "root" | "item" | "valueText" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/listbox/listbox.anatomy.js

@@ -0,0 +1,5 @@
+import { anatomy } from '@zag-js/listbox';
+
+const listboxAnatomy = anatomy.extendWith("empty");
+
+export { listboxAnatomy };

package/dist/components/listbox/listbox.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox-context.vue.cjs');
 const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox-content.vue.cjs');
+const listboxEmpty_vue_vue_type_script_setup_true_lang = require('./listbox-empty.vue.cjs');
 const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox-input.vue.cjs');
 const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox-item-context.vue.cjs');
 const listboxItemGroupLabel_vue_vue_type_script_setup_true_lang = require('./listbox-item-group-label.vue.cjs');
@@ -20,6 +21,7 @@ const listboxValueText_vue_vue_type_script_setup_true_lang = require('./listbox-
 
 exports.Context = listboxContext_vue_vue_type_script_setup_true_lang.default;
 exports.Content = listboxContent_vue_vue_type_script_setup_true_lang.default;
+exports.Empty = listboxEmpty_vue_vue_type_script_setup_true_lang.default;
 exports.Input = listboxInput_vue_vue_type_script_setup_true_lang.default;
 exports.ItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
 exports.ItemGroupLabel = listboxItemGroupLabel_vue_vue_type_script_setup_true_lang.default;

package/dist/components/listbox/listbox.d.cts

@@ -1,6 +1,7 @@
 export type { HighlightChangeDetails, ScrollToIndexDetails, SelectionDetails, SelectionMode, ValueChangeDetails, } from '@zag-js/listbox';
 export { default as Context, type ListboxContextProps as ContextProps } from './listbox-context.vue';
 export { default as Content, type ListboxContentBaseProps as ContentBaseProps, type ListboxContentProps as ContentProps, } from './listbox-content.vue';
+export { default as Empty, type ListboxEmptyBaseProps as EmptyBaseProps, type ListboxEmptyProps as EmptyProps, } from './listbox-empty.vue';
 export { default as Input, type ListboxInputBaseProps as InputBaseProps, type ListboxInputProps as InputProps, } from './listbox-input.vue';
 export { default as ItemContext, type ListboxItemContextProps as ItemContextProps } from './listbox-item-context.vue';
 export { default as ItemGroupLabel, type ListboxItemGroupLabelBaseProps as ItemGroupLabelBaseProps, type ListboxItemGroupLabelProps as ItemGroupLabelProps, } from './listbox-item-group-label.vue';
@@ -9,6 +10,6 @@ export { default as ItemIndicator, type ListboxItemIndicatorBaseProps as ItemInd
 export { default as ItemText, type ListboxItemTextBaseProps as ItemTextBaseProps, type ListboxItemTextProps as ItemTextProps, } from './listbox-item-text.vue';
 export { default as Item, type ListboxItemBaseProps as ItemBaseProps, type ListboxItemProps as ItemProps, } from './listbox-item.vue';
 export { default as Label, type ListboxLabelBaseProps as LabelBaseProps, type ListboxLabelProps as LabelProps, } from './listbox-label.vue';
-export { default as RootProvider, type ListboxRootProviderBaseProps as RootProviderBaseProps, type ListboxRootProviderProps as RootProviderProps, } from './listbox-root-provider.vue';
-export { default as Root, type ListboxRootBaseProps as RootBaseProps, type ListboxRootEmits as RootEmits, type ListboxRootProps as RootProps, } from './listbox-root.vue';
+export { default as RootProvider, type ListboxRootProviderBaseProps as RootProviderBaseProps, type ListboxRootProviderProps as RootProviderProps, type ListboxRootProviderComponent as RootProviderComponent, } from './listbox-root-provider.vue';
+export { default as Root, type ListboxRootBaseProps as RootBaseProps, type ListboxRootComponent as RootComponent, type ListboxRootEmits as RootEmits, type ListboxRootProps as RootProps, } from './listbox-root.vue';
 export { default as ValueText, type ListboxValueTextBaseProps as ValueTextBaseProps, type ListboxValueTextProps as ValueTextProps, } from './listbox-value-text.vue';

package/dist/components/listbox/listbox.d.ts

@@ -1,6 +1,7 @@
 export type { HighlightChangeDetails, ScrollToIndexDetails, SelectionDetails, SelectionMode, ValueChangeDetails, } from '@zag-js/listbox';
 export { default as Context, type ListboxContextProps as ContextProps } from './listbox-context.vue';
 export { default as Content, type ListboxContentBaseProps as ContentBaseProps, type ListboxContentProps as ContentProps, } from './listbox-content.vue';
+export { default as Empty, type ListboxEmptyBaseProps as EmptyBaseProps, type ListboxEmptyProps as EmptyProps, } from './listbox-empty.vue';
 export { default as Input, type ListboxInputBaseProps as InputBaseProps, type ListboxInputProps as InputProps, } from './listbox-input.vue';
 export { default as ItemContext, type ListboxItemContextProps as ItemContextProps } from './listbox-item-context.vue';
 export { default as ItemGroupLabel, type ListboxItemGroupLabelBaseProps as ItemGroupLabelBaseProps, type ListboxItemGroupLabelProps as ItemGroupLabelProps, } from './listbox-item-group-label.vue';
@@ -9,6 +10,6 @@ export { default as ItemIndicator, type ListboxItemIndicatorBaseProps as ItemInd
 export { default as ItemText, type ListboxItemTextBaseProps as ItemTextBaseProps, type ListboxItemTextProps as ItemTextProps, } from './listbox-item-text.vue';
 export { default as Item, type ListboxItemBaseProps as ItemBaseProps, type ListboxItemProps as ItemProps, } from './listbox-item.vue';
 export { default as Label, type ListboxLabelBaseProps as LabelBaseProps, type ListboxLabelProps as LabelProps, } from './listbox-label.vue';
-export { default as RootProvider, type ListboxRootProviderBaseProps as RootProviderBaseProps, type ListboxRootProviderProps as RootProviderProps, } from './listbox-root-provider.vue';
-export { default as Root, type ListboxRootBaseProps as RootBaseProps, type ListboxRootEmits as RootEmits, type ListboxRootProps as RootProps, } from './listbox-root.vue';
+export { default as RootProvider, type ListboxRootProviderBaseProps as RootProviderBaseProps, type ListboxRootProviderProps as RootProviderProps, type ListboxRootProviderComponent as RootProviderComponent, } from './listbox-root-provider.vue';
+export { default as Root, type ListboxRootBaseProps as RootBaseProps, type ListboxRootComponent as RootComponent, type ListboxRootEmits as RootEmits, type ListboxRootProps as RootProps, } from './listbox-root.vue';
 export { default as ValueText, type ListboxValueTextBaseProps as ValueTextBaseProps, type ListboxValueTextProps as ValueTextProps, } from './listbox-value-text.vue';

package/dist/components/listbox/listbox.js

@@ -1,5 +1,6 @@
 export { default as Context } from './listbox-context.vue.js';
 export { default as Content } from './listbox-content.vue.js';
+export { default as Empty } from './listbox-empty.vue.js';
 export { default as Input } from './listbox-input.vue.js';
 export { default as ItemContext } from './listbox-item-context.vue.js';
 export { default as ItemGroupLabel } from './listbox-item-group-label.vue.js';

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

@@ -38,7 +38,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     open: void 0,
     typeahead: void 0
   }),
-  emits: ["escapeKeyDown", "focusOutside", "highlightChange", "interactOutside", "openChange", "pointerDownOutside", "select", "update:open", "update:highlightedValue"],
+  emits: ["escapeKeyDown", "focusOutside", "highlightChange", "interactOutside", "openChange", "pointerDownOutside", "requestDismiss", "select", "update:open", "update:highlightedValue"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;

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

@@ -20,6 +20,12 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<MenuRootProps,
     highlightChange: (details: HighlightChangeDetails) => any;
     "update:highlightedValue": (highlightedValue: string | null) => any;
     escapeKeyDown: (event: KeyboardEvent) => any;
+    requestDismiss: (event: CustomEvent<{
+        originalLayer: HTMLElement;
+        targetLayer: HTMLElement | undefined;
+        originalIndex: number;
+        targetIndex: number;
+    }>) => any;
 }, string, PublicProps, Readonly<MenuRootProps> & Readonly<{
     onSelect?: ((details: SelectionDetails) => any) | undefined;
     onOpenChange?: ((details: OpenChangeDetails) => any) | undefined;
@@ -30,6 +36,12 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<MenuRootProps,
     onHighlightChange?: ((details: HighlightChangeDetails) => any) | undefined;
     "onUpdate:highlightedValue"?: ((highlightedValue: string | null) => any) | undefined;
     onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
+    onRequestDismiss?: ((event: CustomEvent<{
+        originalLayer: HTMLElement;
+        targetLayer: HTMLElement | undefined;
+        originalIndex: number;
+        targetIndex: number;
+    }>) => any) | undefined;
 }>, {
     open: boolean;
     defaultOpen: boolean;