@vunset/vue 0.0.0-stage → 1.0.0-rc.2

package/dist/components/floating/FloatingTitle.vue.d.ts

@@ -0,0 +1,23 @@
+import { type FloatingState } from './FloatingRoot.vue';
+type __VLS_Props = {
+    /** Element or component to render. */
+    as?: string | object;
+};
+type __VLS_Slots = {
+    /**
+     * The panel's state.
+     * @slotOnly The element carries only the id the panel is labeled by.
+     */
+    default(props: FloatingState): unknown;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string | object;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/floating/FloatingTitle.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,29 @@
+import { Part } from "../../shared/part.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { useRegisteredId } from "../../shared/labeling.js";
+import { useFloatingContext } from "./FloatingRoot.vue_vue_type_script_setup_true_lang.js";
+import { createBlock, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+//#region src/components/floating/FloatingTitle.vue?vue&type=script&setup=true&lang.ts
+var FloatingTitle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "FloatingTitle",
+	inheritAttrs: false,
+	__name: "FloatingTitle",
+	props: { as: { default: "h2" } },
+	setup(__props) {
+		const props = __props;
+		const { titleProps, state, registerTitle } = useFloatingContext();
+		const id = useRegisteredId(registerTitle);
+		const merged = usePartProps(() => ({
+			...titleProps.value,
+			id: id.value
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Part), mergeProps({ as: props.as }, unref(merged)), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(state))))]),
+				_: 3
+			}, 16, ["as"]);
+		};
+	}
+});
+//#endregion
+export { FloatingTitle_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/group/Group.js

@@ -0,0 +1,5 @@
+import Group_vue_vue_type_script_setup_true_lang_default, { perpendicular, provideGroupContext, toolbarItems, useOptionalGroupContext } from "./Group.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/group/Group.vue
+var Group_default = Group_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Group_default as default, perpendicular, provideGroupContext, toolbarItems, useOptionalGroupContext };

package/dist/components/group/Group.vue.d.ts

@@ -0,0 +1,60 @@
+import { type ComputedRef } from 'vue';
+import type { Orientation } from '../../shared/use-roving-focus';
+export type GroupVariant = 'group' | 'toolbar';
+export interface GroupState {
+    /** `group` for related controls, `toolbar` for a row of tools. */
+    variant: GroupVariant;
+    /** Which way the controls run. */
+    orientation: Orientation;
+}
+export interface GroupContext {
+    state: ComputedRef<GroupState>;
+}
+export declare const provideGroupContext: (value: GroupContext) => GroupContext, useGroupContext: () => GroupContext, useOptionalGroupContext: () => GroupContext | null;
+export declare function perpendicular(orientation: Orientation): Orientation;
+/**
+ * The toolbar's items, per `specs/group.md`: its controls in document order, a
+ * nested set counting once, as the member it leaves in the tab order. `ours`
+ * holds the elements whose `tabindex` the toolbar set itself.
+ */
+export declare function toolbarItems(root: HTMLElement, ours: ReadonlySet<Element>): {
+    plain: HTMLElement[];
+    all: HTMLElement[];
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** `group` gives `role="group"`, `toolbar` gives `role="toolbar"` with its orientation. */
+    variant?: GroupVariant;
+    /** Which way the controls run. A `Separator` inside runs across it. */
+    orientation?: Orientation;
+    /** Names the group for assistive technology, as `aria-label`. */
+    label?: string;
+    /** Element or component to render. */
+    as?: string | object;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** `group` gives `role="group"`, `toolbar` gives `role="toolbar"` with its orientation. */
+    variant?: GroupVariant;
+    /** Which way the controls run. A `Separator` inside runs across it. */
+    orientation?: Orientation;
+    /** Names the group for assistive technology, as `aria-label`. */
+    label?: string;
+    /** Element or component to render. */
+    as?: string | object;
+}> & Readonly<{}>, {
+    orientation: Orientation;
+    as: string | object;
+    variant: GroupVariant;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {
+        /** `group` for related controls, `toolbar` for a row of tools. */
+        variant: GroupVariant;
+        /** Which way the controls run. */
+        orientation: Orientation;
+    }) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/group/Group.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,186 @@
+import { mergeProps as mergeProps$1 } from "../../shared/merge-props.js";
+import { Part } from "../../shared/part.js";
+import { dataAttrs } from "../../shared/data-attrs.js";
+import { createContext } from "../../shared/context.js";
+import { computed, createBlock, defineComponent, guardReactiveProps, mergeProps, normalizeProps, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, unref, useAttrs, watch, withCtx } from "vue";
+//#region src/components/group/Group.vue?vue&type=script&setup=true&lang.ts
+var { provideContext: provideGroupContext, useContext: useGroupContext, useOptionalContext: useOptionalGroupContext } = createContext("Group");
+function perpendicular(orientation) {
+	return orientation === "horizontal" ? "vertical" : "horizontal";
+}
+var CONTROL = "a[href], button, input:not([type=\"hidden\"]), select, textarea, [tabindex], [contenteditable=\"true\"]";
+var SET_ROLES = /* @__PURE__ */ new Set([
+	"radiogroup",
+	"tablist",
+	"listbox",
+	"menubar",
+	"toolbar"
+]);
+var TEXT_INPUTS = /* @__PURE__ */ new Set([
+	"text",
+	"search",
+	"email",
+	"url",
+	"tel",
+	"password",
+	"number"
+]);
+var disabled = (el) => el.hasAttribute("disabled") || el.getAttribute("aria-disabled") === "true";
+/**
+* Whether a key belongs to the field it lands in: arrows move the caret, except
+* past either end of a single-line field, where they carry on to the next item.
+*/
+function keepsKey(el, key, next, previous) {
+	if (el instanceof HTMLTextAreaElement || el.isContentEditable) return true;
+	if (!(el instanceof HTMLInputElement) || !TEXT_INPUTS.has(el.type)) return false;
+	const { selectionStart: start, selectionEnd: end, value } = el;
+	if (start === null || start !== end) return true;
+	if (key === next && next === "ArrowRight") return start < value.length;
+	if (key === previous && previous === "ArrowLeft") return start > 0;
+	return true;
+}
+/**
+* The toolbar's items, per `specs/group.md`: its controls in document order, a
+* nested set counting once, as the member it leaves in the tab order. `ours`
+* holds the elements whose `tabindex` the toolbar set itself.
+*/
+function toolbarItems(root, ours) {
+	const plain = [];
+	const all = [];
+	const sets = /* @__PURE__ */ new Set();
+	const setOf = (el) => {
+		for (let node = el.parentElement; node && node !== root; node = node.parentElement) {
+			const role = node.getAttribute("role") ?? "";
+			if (SET_ROLES.has(role)) return node;
+			if (role === "group") {
+				if (Array.from(node.querySelectorAll(CONTROL)).some((control) => control.getAttribute("tabindex") === "-1" && !ours.has(control))) return node;
+			}
+		}
+		return null;
+	};
+	for (const el of root.querySelectorAll(CONTROL)) {
+		if (disabled(el)) continue;
+		const set = setOf(el);
+		if (!set) {
+			plain.push(el);
+			all.push(el);
+		} else if (!sets.has(set) && el.getAttribute("tabindex") !== "-1") {
+			sets.add(set);
+			all.push(el);
+		}
+	}
+	return {
+		plain,
+		all
+	};
+}
+var Group_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "Group",
+	inheritAttrs: false,
+	__name: "Group",
+	props: {
+		variant: { default: "group" },
+		orientation: { default: "horizontal" },
+		label: {},
+		as: { default: "div" }
+	},
+	setup(__props) {
+		const props = __props;
+		const state = computed(() => ({
+			variant: props.variant,
+			orientation: props.orientation
+		}));
+		provideGroupContext({ state });
+		const element = ref(null);
+		const toolbar = () => state.value.variant === "toolbar";
+		const touched = /* @__PURE__ */ new Map();
+		let current = null;
+		let inSet = false;
+		function setTabIndex(el, value) {
+			if (!touched.has(el)) touched.set(el, el.getAttribute("tabindex"));
+			if (el.getAttribute("tabindex") !== value) el.setAttribute("tabindex", value);
+		}
+		function restore() {
+			for (const [el, value] of touched) if (value === null) el.removeAttribute("tabindex");
+			else el.setAttribute("tabindex", value);
+			touched.clear();
+			current = null;
+			inSet = false;
+		}
+		/** One tab stop among the plain items: the current one, else the first. */
+		function sync() {
+			const root = element.value;
+			if (!root || !toolbar()) return;
+			const { plain } = toolbarItems(root, new Set(touched.keys()));
+			if (current && !plain.includes(current)) current = null;
+			const stop = inSet ? null : current ?? plain[0];
+			for (const el of plain) setTabIndex(el, el === stop ? "0" : "-1");
+		}
+		function onFocusin(event) {
+			const root = element.value;
+			if (!root || !toolbar()) return;
+			const { plain } = toolbarItems(root, new Set(touched.keys()));
+			const target = event.target;
+			if (plain.includes(target)) {
+				current = target;
+				inSet = false;
+			} else if (target.matches(CONTROL)) inSet = true;
+			sync();
+		}
+		function onKeydown(event) {
+			const root = element.value;
+			if (!root || !toolbar() || event.defaultPrevented) return;
+			const vertical = state.value.orientation === "vertical";
+			const next = vertical ? "ArrowDown" : "ArrowRight";
+			const previous = vertical ? "ArrowUp" : "ArrowLeft";
+			if (![
+				next,
+				previous,
+				"Home",
+				"End"
+			].includes(event.key)) return;
+			if (keepsKey(event.target, event.key, next, previous)) return;
+			const { all } = toolbarItems(root, new Set(touched.keys()));
+			if (!all.length) return;
+			const from = all.findIndex((el) => el === event.target || el.contains(event.target));
+			const index = event.key === "Home" ? 0 : event.key === "End" ? all.length - 1 : (from + (event.key === next ? 1 : -1) + all.length) % all.length;
+			event.preventDefault();
+			all[index].focus();
+		}
+		let observer = null;
+		onMounted(() => {
+			sync();
+			observer = new MutationObserver(() => sync());
+			if (element.value) observer.observe(element.value, {
+				childList: true,
+				subtree: true,
+				attributes: true,
+				attributeFilter: ["disabled", "aria-disabled"]
+			});
+		});
+		watch(toolbar, (on) => on ? sync() : restore(), { flush: "post" });
+		onBeforeUnmount(() => {
+			observer?.disconnect();
+			restore();
+		});
+		const attrs = useAttrs();
+		const rootProps = computed(() => mergeProps$1({
+			...dataAttrs(state.value),
+			"data-part": "control-group",
+			ref: (el) => element.value = el ?? null,
+			role: state.value.variant === "toolbar" ? "toolbar" : "group",
+			"aria-orientation": state.value.variant === "toolbar" ? state.value.orientation : void 0,
+			"aria-label": props.label,
+			onFocusin,
+			onKeydown
+		}, attrs));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Part), mergeProps({ as: props.as }, rootProps.value), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(state.value)))]),
+				_: 3
+			}, 16, ["as"]);
+		};
+	}
+});
+//#endregion
+export { Group_vue_vue_type_script_setup_true_lang_default as default, perpendicular, provideGroupContext, toolbarItems, useOptionalGroupContext };

package/dist/components/icon/Icon.js

@@ -0,0 +1,5 @@
+import Icon_vue_vue_type_script_setup_true_lang_default from "./Icon.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/icon/Icon.vue
+var Icon_default = Icon_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Icon_default as default };

package/dist/components/icon/Icon.vue.d.ts

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    /** The symbol id in the sprite, or the filename in the icon folder. */
+    name: string;
+    /** Put the file's markup in the document instead of referencing the sprite. */
+    inline?: boolean;
+    /** Overrides the configured sprite, for this one icon. */
+    sprite?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/icon/Icon.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,64 @@
+import { mergeProps as mergeProps$1 } from "../../shared/merge-props.js";
+import { defaultIcon, iconSprite, loadInlineIcon, loadedInlineIcon } from "../../shared/icons.js";
+import { computed, createElementBlock, createElementVNode, defineComponent, mergeProps, openBlock, shallowRef, unref, useAttrs, watch } from "vue";
+//#region src/components/icon/Icon.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["innerHTML"];
+var _hoisted_2 = ["href"];
+var Icon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "Icon",
+	inheritAttrs: false,
+	__name: "Icon",
+	props: {
+		name: {},
+		inline: { type: Boolean },
+		sprite: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = useAttrs();
+		const icon = shallowRef();
+		const hooks = computed(() => {
+			const named = attrs["aria-label"] != null || attrs["aria-labelledby"] != null;
+			return {
+				"data-part": "icon",
+				"data-name": props.name,
+				"aria-hidden": named ? void 0 : true,
+				role: named ? "img" : void 0
+			};
+		});
+		const spriteProps = computed(() => mergeProps$1(hooks.value, attrs));
+		const inlineProps = computed(() => mergeProps$1(icon.value?.attrs ?? {}, hooks.value, attrs));
+		watch(() => [props.inline, props.name], async ([isInline, name], _, onCleanup) => {
+			let stale = false;
+			onCleanup(() => stale = true);
+			icon.value = void 0;
+			if (!isInline) return;
+			const ready = loadedInlineIcon(name);
+			if (ready) {
+				icon.value = ready;
+				return;
+			}
+			const load = loadInlineIcon(name);
+			if (!load) {
+				const fallback = defaultIcon(name);
+				if (fallback) icon.value = fallback;
+				else if (fallback === null) console.warn(`[Icon] '${name}' has no <svg> element to render.`);
+				else console.warn(`[Icon] '${name}' not found.`);
+				return;
+			}
+			try {
+				const parsed = await load;
+				if (stale) return;
+				if (!parsed) return console.warn(`[Icon] '${name}' has no <svg> element to render.`);
+				icon.value = parsed;
+			} catch (error) {
+				console.warn(`[Icon] Could not read '${name}'.`, error);
+			}
+		}, { immediate: true });
+		return (_ctx, _cache) => {
+			return props.inline ? (openBlock(), createElementBlock("svg", mergeProps({ key: 0 }, inlineProps.value, { innerHTML: icon.value?.content }), null, 16, _hoisted_1)) : (openBlock(), createElementBlock("svg", mergeProps({ key: 1 }, spriteProps.value, { fill: "none" }), [createElementVNode("use", { href: `${__props.sprite ?? unref(iconSprite)()}#${__props.name}` }, null, 8, _hoisted_2)], 16));
+		};
+	}
+});
+//#endregion
+export { Icon_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/input/Input.js

@@ -0,0 +1,5 @@
+import Input_vue_vue_type_script_setup_true_lang_default from "./Input.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/input/Input.vue
+var Input_default = Input_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Input_default as default };

package/dist/components/input/Input.vue.d.ts

@@ -0,0 +1,53 @@
+import { type InputModelModifiers } from '../../shared/model-modifiers';
+import { type FieldFilter } from '../../shared/use-input';
+type __VLS_Props = {
+    /** The value, bound with `v-model`. Always emitted as a string. */
+    modelValue?: string | number | null;
+    /** `v-model.optional` writes `undefined` once emptied; `.trim` and `.number` work as on an `<input>`. */
+    modelModifiers?: InputModelModifiers;
+    /** The value at first, when no `v-model` owns it. */
+    defaultValue?: string | number;
+    /** Ignores interaction. Inside a `FieldRoot`, follows the field. */
+    disabled?: boolean;
+    /** Can be read and selected but not edited. Inside a `FieldRoot`, follows the field. */
+    readOnly?: boolean;
+    /** Needs a value. Announced and styled, not enforced. Inside a `FieldRoot`, follows the field. */
+    required?: boolean;
+    /** Sets `aria-invalid` and `data-invalid`, as a number outside `min`, `max` or `step` does. Inside a `FieldRoot`, follows the field. */
+    invalid?: boolean;
+    /** The input's id. Inside a `FieldRoot`, the field's control id. */
+    id?: string;
+    /** The form field name. Inside a `FieldRoot`, the field's name. */
+    name?: string;
+    /** The native `type`. `number` renders a text input that only lets numeric text be typed. */
+    type?: string;
+    /** The native `minlength`. */
+    minLength?: number;
+    /** The native `maxlength`, also enforced while typing and pasting. */
+    maxLength?: number;
+    /** The lowest valid number; below it the input is invalid. At zero or more, a minus can't be typed at all. */
+    min?: number | string;
+    /** The highest valid number. */
+    max?: number | string;
+    /** The increment a valid number keeps to. */
+    step?: number | string;
+    /** The native `pattern`, checked on the finished value when the form submits. */
+    pattern?: string;
+    /** What may be typed at all, checked on every keystroke and paste: a regex source, a RegExp or a function. */
+    filter?: FieldFilter;
+    /** Rewrites the typed text once it's committed: on blur, or Enter in an input. Not applied to `v-model`'s own writes. */
+    transform?: (value: string) => string;
+    /** Element or component to render. */
+    as?: string | object;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, import("../../shared/use-input").UseInputReturn, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {
+    defaultValue: string | number;
+    as: string | object;
+    modelValue: string | number | null;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/input/Input.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,68 @@
+import { Part } from "../../shared/part.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { applyModelModifiers } from "../../shared/model-modifiers.js";
+import { provideInputContext, useInput } from "../../shared/use-input.js";
+import { createBlock, defineComponent, mergeProps, openBlock, toRef, unref } from "vue";
+//#region src/components/input/Input.vue?vue&type=script&setup=true&lang.ts
+var Input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "Input",
+	inheritAttrs: false,
+	__name: "Input",
+	props: {
+		modelValue: { default: void 0 },
+		modelModifiers: {},
+		defaultValue: { default: void 0 },
+		disabled: { type: Boolean },
+		readOnly: { type: Boolean },
+		required: { type: Boolean },
+		invalid: { type: Boolean },
+		id: {},
+		name: {},
+		type: {},
+		minLength: {},
+		maxLength: {},
+		min: {},
+		max: {},
+		step: {},
+		pattern: {},
+		filter: {},
+		transform: {},
+		as: { default: "input" }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const api = useInput({
+			value: toRef(() => props.modelValue),
+			defaultValue: toRef(() => props.defaultValue),
+			disabled: toRef(() => props.disabled ?? false),
+			readOnly: toRef(() => props.readOnly ?? false),
+			required: toRef(() => props.required ?? false),
+			invalid: toRef(() => props.invalid ?? false),
+			id: toRef(() => props.id),
+			name: toRef(() => props.name),
+			type: toRef(() => props.type),
+			minLength: toRef(() => props.minLength),
+			maxLength: toRef(() => props.maxLength),
+			min: toRef(() => props.min),
+			max: toRef(() => props.max),
+			step: toRef(() => props.step),
+			pattern: toRef(() => props.pattern),
+			filter: toRef(() => props.filter),
+			transform: toRef(() => props.transform),
+			onChange: (value) => emit("update:modelValue", applyModelModifiers(value, props.modelModifiers))
+		});
+		provideInputContext(api);
+		__expose(api);
+		const merged = usePartProps(() => ({
+			...api.controlProps.value,
+			"data-part": "input"
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(Part), mergeProps({ as: props.as }, unref(merged)), null, 16, ["as"]);
+		};
+	}
+});
+//#endregion
+export { Input_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/listbox/ListboxClear.js

@@ -0,0 +1,5 @@
+import ListboxClear_vue_vue_type_script_setup_true_lang_default from "./ListboxClear.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/listbox/ListboxClear.vue
+var ListboxClear_default = ListboxClear_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ListboxClear_default as default };

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

@@ -0,0 +1,35 @@
+type __VLS_Props = {
+    /** Element or component to render. */
+    as?: string | object;
+};
+declare var __VLS_8: {
+    mode: import("../..").ListboxMode;
+    open: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    required: boolean;
+    invalid: boolean;
+    multiple: boolean;
+    searchable: boolean;
+    creating: boolean;
+    filled: boolean;
+    empty: boolean;
+    alignedToItem: boolean;
+    side: import("../..").Side;
+    align: import("../..").Align;
+    transitionStatus: import("../..").TransitionStatus;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string | object;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/listbox/ListboxClear.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,27 @@
+import { Part } from "../../shared/part.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { useListboxContext } from "../../shared/use-listbox.js";
+import { createBlock, createCommentVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+//#region src/components/listbox/ListboxClear.vue?vue&type=script&setup=true&lang.ts
+var ListboxClear_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "ListboxClear",
+	inheritAttrs: false,
+	__name: "ListboxClear",
+	props: { as: { default: "button" } },
+	setup(__props) {
+		const props = __props;
+		const { clearProps, showClear, state } = useListboxContext();
+		const merged = usePartProps(clearProps);
+		return (_ctx, _cache) => {
+			return unref(showClear) ? (openBlock(), createBlock(unref(Part), mergeProps({
+				key: 0,
+				as: props.as
+			}, unref(merged)), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(state))))]),
+				_: 3
+			}, 16, ["as"])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { ListboxClear_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/listbox/ListboxEmpty.js

@@ -0,0 +1,5 @@
+import ListboxEmpty_vue_vue_type_script_setup_true_lang_default from "./ListboxEmpty.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/listbox/ListboxEmpty.vue
+var ListboxEmpty_default = ListboxEmpty_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { ListboxEmpty_default as default };

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

@@ -0,0 +1,35 @@
+type __VLS_Props = {
+    /** Element or component to render. */
+    as?: string | object;
+};
+declare var __VLS_8: {
+    mode: import("../..").ListboxMode;
+    open: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    required: boolean;
+    invalid: boolean;
+    multiple: boolean;
+    searchable: boolean;
+    creating: boolean;
+    filled: boolean;
+    empty: boolean;
+    alignedToItem: boolean;
+    side: import("../..").Side;
+    align: import("../..").Align;
+    transitionStatus: import("../..").TransitionStatus;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    as: string | object;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/listbox/ListboxEmpty.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,27 @@
+import { Part } from "../../shared/part.js";
+import { usePartProps } from "../../shared/use-part-props.js";
+import { useListboxContext } from "../../shared/use-listbox.js";
+import { createBlock, createCommentVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+//#region src/components/listbox/ListboxEmpty.vue?vue&type=script&setup=true&lang.ts
+var ListboxEmpty_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "ListboxEmpty",
+	inheritAttrs: false,
+	__name: "ListboxEmpty",
+	props: { as: { default: "div" } },
+	setup(__props) {
+		const props = __props;
+		const { emptyProps, state } = useListboxContext();
+		const merged = usePartProps(emptyProps);
+		return (_ctx, _cache) => {
+			return unref(state).empty ? (openBlock(), createBlock(unref(Part), mergeProps({
+				key: 0,
+				as: props.as
+			}, unref(merged)), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(state))))]),
+				_: 3
+			}, 16, ["as"])) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { ListboxEmpty_vue_vue_type_script_setup_true_lang_default as default };