@bridge-ui/vue 0.7.0 → 0.9.0

package/dist/Components/FormField/composables/useFormField.js

@@ -1,11 +1,11 @@
 import { hasNamedSlot as e, hasSlotOrProp as t } from "../../../Utils/slotOrProp.js";
-import { mergeNestedComponentProps as n, mergePartBind as r, useBridgeUIComponent as i, useBridgeUIMergedRegistryClasses as a } from "../../../Utils/index.js";
-import { computed as o, toValue as s, useId as c, useSlots as l } from "vue";
-import { get as u, omit as d } from "es-toolkit/compat";
-import { formFieldColorProps as f, formFieldRoundedProps as p, formFieldSizeProps as m, formFieldVariantProps as h } from "@bridge-ui/core/Tokens";
-import { cn as g, getColorToken as _, mergeBridgeUILayeredClasses as v, splitComponentProps as y } from "@bridge-ui/core/Utils";
+import { mergeNestedComponentProps as n, mergePartBind as r, useBridgeUIComponent as ee, useBridgeUIMergedRegistryClasses as i } from "../../../Utils/index.js";
+import { computed as a, toValue as o, useId as s, useSlots as c } from "vue";
+import { get as l, omit as u } from "es-toolkit/compat";
+import { formFieldColorProps as d, formFieldRoundedProps as f, formFieldSizeProps as p, formFieldVariantProps as m } from "@bridge-ui/core/Tokens";
+import { cn as h, getColorToken as g, mergeBridgeUILayeredClasses as _, splitComponentProps as v } from "@bridge-ui/core/Utils";
 //#region src/Components/FormField/composables/useFormField.ts
-var b = [
+var y = [
 	"end",
 	"size",
 	"color",
@@ -26,216 +26,220 @@ var b = [
 	"description",
 	"errorMessage",
 	"showErrorIcon",
-	"hideErrorMessage"
+	"hideErrorMessage",
+	"showDescriptionOnError"
 ];
-function x(x, ee, S = {}) {
-	let C = c(), w = l(), T = o(() => y({
-		props: s(x),
-		bridgeKeys: b
-	})), { merged: E, entry: D } = i({
-		libDefaults: ee,
-		componentName: S.componentName,
-		props: () => T.value.componentProps
-	}), O = o(() => E.value.customProps), k = o(() => S.control?.() ?? "input"), A = a({
+function b(b, x, S = {}) {
+	let te = s(), C = c(), w = a(() => v({
+		props: o(b),
+		bridgeKeys: y
+	})), T = S.componentName ?? "FormField", { merged: E, entry: D, chromeEntry: O } = ee({
+		libDefaults: x,
+		componentName: T,
+		props: () => w.value.componentProps
+	}), k = a(() => E.value.customProps), A = a(() => S.control?.() ?? "input"), j = i({
 		entry: D,
-		props: () => T.value.componentProps
-	}), j = o(() => E.value.error === !0), M = o(() => !!E.value.disabled), N = o(() => !!E.value.readonly), P = o(() => E.value.variant ?? "outline"), F = o(() => E.value.errorIcon ?? "alert"), I = o(() => P.value === "notched"), L = o(() => P.value === "stacked"), R = o(() => P.value === "underlined"), z = o(() => k.value === "textarea"), B = o(() => z.value && !!S.likeInput?.()), V = o(() => !E.value.hideErrorMessage), H = o(() => {
-		let e = T.value.inheritedAttrs.id;
-		return E.value.controlId ?? e ?? C;
-	}), U = o(() => j.value && t(w, "errorMessage", E.value.errorMessage)), W = o(() => (I.value || L.value) && (t(w, "label", E.value.label) || t(w, "corner", E.value.corner))), G = o(() => t(w, "label", E.value.label) ? "justify-between items-end" : "justify-end"), K = o(() => {
+		chromeEntry: O,
+		props: () => w.value.componentProps
+	}), M = a(() => E.value.error === !0), N = a(() => !!E.value.disabled), P = a(() => !!E.value.readonly), F = a(() => E.value.variant ?? "outline"), ne = a(() => E.value.errorIcon ?? "alert"), I = a(() => F.value === "notched"), L = a(() => F.value === "stacked"), R = a(() => F.value === "underlined"), z = a(() => A.value === "textarea"), B = a(() => z.value && !!S.likeInput?.()), V = a(() => !E.value.hideErrorMessage && !t(C, "description", E.value.description)), H = a(() => {
+		let e = w.value.inheritedAttrs.id;
+		return E.value.controlId ?? e ?? te;
+	}), U = a(() => M.value && !E.value.hideErrorMessage && t(C, "errorMessage", E.value.errorMessage)), W = a(() => t(C, "description", E.value.description) ? !U.value || E.value.showDescriptionOnError === !0 : !1), G = a(() => U.value || V.value), K = a(() => (I.value || L.value) && (t(C, "label", E.value.label) || t(C, "corner", E.value.corner))), q = a(() => t(C, "label", E.value.label) ? "justify-between items-end" : "justify-end"), J = a(() => {
 		let e = [];
-		return !j.value && t(w, "description", E.value.description) && e.push(`${H.value}-description`), j.value && !E.value.hideErrorMessage && t(w, "errorMessage", E.value.errorMessage) && e.push(`${H.value}-error`), e.length > 0 ? e.join(" ") : void 0;
-	}), q = o(() => {
-		let e = v(m, D.value?.tokens?.size);
-		return u(e, [E.value.size, P.value]);
-	}), J = o(() => {
-		let e = v(f, D.value?.tokens?.color);
-		return _({
+		return W.value && e.push(`${H.value}-description`), U.value && e.push(`${H.value}-error`), e.length > 0 ? e.join(" ") : void 0;
+	}), Y = a(() => {
+		let e = _(p, l(O.value ?? D.value, ["tokens", "size"]));
+		return l(e, [E.value.size, F.value]);
+	}), X = a(() => {
+		let e = _(d, l(O.value ?? D.value, ["tokens", "color"]));
+		return g({
 			tokens: e,
 			color: E.value.color,
-			invalid: j.value
+			invalid: M.value
 		});
-	}), Y = o(() => {
-		let e = v(p, D.value?.tokens?.rounded);
-		return u(e, E.value.rounded);
-	}), X = o(() => {
-		let e = v(h, D.value?.tokens?.variant);
-		return u(e, P.value);
-	}), Z = o(() => R.value ? J.value?.underlined : J.value?.input), Q = o(() => {
-		if (L.value) return g({
-			[q.value?.insetTop ?? ""]: !0,
-			[q.value?.insetStart ?? ""]: !0,
-			[q.value?.insetEnd ?? ""]: !0
+	}), Z = a(() => {
+		let e = _(f, l(O.value ?? D.value, ["tokens", "rounded"]));
+		return l(e, E.value.rounded);
+	}), Q = a(() => {
+		let e = _(m, l(O.value ?? D.value, ["tokens", "variant"]));
+		return l(e, F.value);
+	}), re = a(() => R.value ? X.value?.underlined : X.value?.input), ie = a(() => {
+		if (L.value) return h({
+			[Y.value?.insetTop ?? ""]: !0,
+			[Y.value?.insetStart ?? ""]: !0,
+			[Y.value?.insetEnd ?? ""]: !0
 		});
-	}), te = o(() => {
-		let t = S.reservedSlots?.() ?? [], n = e(w, "end") || t.includes("end"), r = e(w, "start") || t.includes("start");
-		if (!L.value) return !r && !n ? q.value?.padding : g({
-			[q.value?.insetStart ?? ""]: !r,
-			[q.value?.insetEnd ?? ""]: !n
+	}), ae = a(() => {
+		let t = S.reservedSlots?.() ?? [], n = e(C, "end") || t.includes("end"), r = e(C, "start") || t.includes("start");
+		if (!L.value) return !r && !n ? Y.value?.padding : h({
+			[Y.value?.insetStart ?? ""]: !r,
+			[Y.value?.insetEnd ?? ""]: !n
 		});
-	}), ne = o(() => r(O.value?.end, {}, g({
+	}), oe = a(() => r(k.value?.end, {}, h({
 		"shrink-0 self-center flex items-center whitespace-nowrap select-none pointer-events-none": !0,
 		"text-dark-500": !0,
-		[J.value?.end ?? ""]: !0,
-		[A.value.end ?? ""]: !0
-	}))), re = o(() => {
-		let e = T.value.inheritedAttrs;
-		return r(O.value?.root, {
-			class: g(e.class),
-			...d(e, ["class"])
-		}, g({
+		[X.value?.end ?? ""]: !0,
+		[j.value.end ?? ""]: !0
+	}))), se = a(() => {
+		let e = w.value.inheritedAttrs;
+		return r(k.value?.root, {
+			class: h(e.class),
+			...u(e, ["class"])
+		}, h({
 			"group w-full relative": !0,
 			"aria-disabled:pointer-events-none aria-disabled:select-none aria-disabled:opacity-60": !0,
 			"aria-readonly:pointer-events-none aria-readonly:select-none": !0,
-			[A.value.root ?? ""]: !0
+			[j.value.root ?? ""]: !0
 		}));
-	}), ie = o(() => r(O.value?.errorMessage, {}, g({
+	}), ce = a(() => r(k.value?.errorMessage, {}, h({
 		"mt-1": !0,
 		"min-h-[1lh]": V.value,
 		"text-error-600 dark:text-error-400": !0,
-		[q.value?.text ?? ""]: !0,
-		[q.value?.insetStart ?? ""]: !0,
-		[q.value?.insetEnd ?? ""]: !0,
-		[A.value.errorMessage ?? ""]: !0
-	}))), ae = o(() => r({
-		...O.value?.input,
+		[Y.value?.text ?? ""]: !0,
+		[Y.value?.insetStart ?? ""]: !0,
+		[Y.value?.insetEnd ?? ""]: !0,
+		[j.value.errorMessage ?? ""]: !0
+	}))), le = a(() => r({
+		...k.value?.input,
 		id: H.value,
-		disabled: M.value,
-		readonly: N.value,
-		"aria-describedby": K.value,
-		"aria-invalid": j.value || void 0
-	}, d(T.value.inheritedAttrs, [
+		disabled: N.value,
+		readonly: P.value,
+		"aria-describedby": J.value,
+		"aria-invalid": M.value || void 0
+	}, u(w.value.inheritedAttrs, [
 		"class",
 		"modelValue",
 		"onUpdate:modelValue"
-	]), g({
+	]), h({
 		"flex-1 min-w-0 min-h-0 bg-transparent border-0 shadow-none": !0,
 		"h-full": !z.value && !L.value,
 		"max-h-none": z.value,
 		"text-dark-900 dark:text-dark-100 placeholder:text-dark-400": !0,
 		"outline-none ring-0 focus:outline-none focus:ring-0": !0,
 		"disabled:cursor-not-allowed": !0,
-		[q.value?.input ?? ""]: !z.value,
-		[q.value?.textarea ?? ""]: z.value,
-		[q.value?.textareaLikeInput ?? ""]: B.value,
-		[A.value.input ?? ""]: !0
-	}))), oe = o(() => n(O.value?.label, {
+		[Y.value?.input ?? ""]: !z.value,
+		[Y.value?.textarea ?? ""]: z.value,
+		[Y.value?.textareaLikeInput ?? ""]: B.value,
+		[j.value.input ?? ""]: !0
+	}))), ue = a(() => n(k.value?.label, {
 		for: H.value,
 		size: E.value.size,
-		error: j.value,
+		error: M.value,
 		required: E.value.required,
 		classes: {
-			required: A.value.required,
-			root: g({
-				[X.value?.label ?? ""]: I.value,
-				[A.value.label ?? ""]: !0
+			required: j.value.required,
+			root: h({
+				[Q.value?.label ?? ""]: I.value,
+				[j.value.label ?? ""]: !0
 			})
 		}
-	})), $ = o(() => r(O.value?.start, {}, g({
+	})), de = a(() => r(k.value?.start, {}, h({
 		"shrink-0 self-center flex items-center whitespace-nowrap select-none pointer-events-none": !0,
 		"text-dark-400": !0,
-		[J.value?.start ?? ""]: !0,
-		[A.value.start ?? ""]: !0
-	}))), se = o(() => n(O.value?.corner, {
+		[X.value?.start ?? ""]: !0,
+		[j.value.start ?? ""]: !0
+	}))), fe = a(() => n(k.value?.corner, {
 		for: H.value,
 		size: E.value.size,
-		classes: { root: g({
-			[X.value?.corner ?? ""]: I.value,
-			[A.value.corner ?? ""]: !0
+		classes: { root: h({
+			[Q.value?.corner ?? ""]: I.value,
+			[j.value.corner ?? ""]: !0
 		}) }
-	})), ce = o(() => {
-		let e = t(w, "label", E.value.label);
-		return r(O.value?.header, {}, g({
+	})), pe = a(() => {
+		let e = t(C, "label", E.value.label);
+		return r(k.value?.header, {}, h({
 			flex: !0,
 			"w-full shrink-0": !0,
 			"justify-between": e,
 			"justify-end": !e,
 			"items-center": I.value,
 			"items-end": L.value,
-			[X.value?.labelRow ?? ""]: W.value,
-			[A.value.header ?? ""]: !0
+			[Q.value?.labelRow ?? ""]: K.value,
+			[j.value.header ?? ""]: !0
 		}));
-	}), le = o(() => r(O.value?.header, {}, g({
+	}), $ = a(() => r(k.value?.header, {}, h({
 		flex: !0,
 		"mb-1": !0,
-		[G.value]: !0,
-		[A.value.header ?? ""]: !0
-	}))), ue = o(() => r(O.value?.endIcon, {}, g({ "inline-flex shrink-0 items-center justify-center self-center": L.value }))), de = o(() => r(O.value?.end, {}, g({
+		[q.value]: !0,
+		[j.value.header ?? ""]: !0
+	}))), me = a(() => r(k.value?.endIcon, {}, h({ "inline-flex shrink-0 items-center justify-center self-center": L.value }))), he = a(() => r(k.value?.end, {}, h({
 		"group/end wrapper-end-slot shrink-0 flex w-auto items-stretch self-stretch [&>*]:min-h-0": !0,
 		"self-stretch min-h-0 overflow-hidden py-0.5 pe-0.5": L.value,
 		"h-full min-h-0 overflow-hidden py-0.5 pe-0.5": !L.value,
-		[A.value.end ?? ""]: !0
-	}))), fe = o(() => r({}, {}, g({
+		[j.value.end ?? ""]: !0
+	}))), ge = a(() => r({}, {}, h({
 		"flex min-h-0 min-w-0 flex-1 flex-col": !0,
-		[Q.value ?? ""]: !0
-	}))), pe = o(() => r({}, {}, g({
+		[ie.value ?? ""]: !0
+	}))), _e = a(() => r({}, {}, h({
 		"flex w-full min-w-0 flex-1 items-stretch gap-x-2": !0,
-		[q.value?.controlRow ?? ""]: !0
+		[Y.value?.controlRow ?? ""]: !0
 	})));
 	return {
-		slots: w,
+		slots: C,
 		merged: E,
-		control: k,
-		endBind: ne,
-		rootBind: re,
+		control: A,
+		endBind: oe,
+		rootBind: se,
 		controlId: H,
-		errorBind: ie,
-		errorIcon: F,
-		inputBind: ae,
+		errorBind: ce,
+		errorIcon: ne,
+		inputBind: le,
 		isNotched: I,
 		isStacked: L,
-		startBind: $,
-		headerBind: le,
-		isDisabled: M,
-		isReadonly: N,
-		variantKey: P,
-		endIconBind: ue,
-		endSlotBind: de,
-		invalidated: j,
-		containerBind: o(() => r(O.value?.container, {
-			"data-bridge-variant": P.value,
+		startBind: de,
+		headerBind: $,
+		isDisabled: N,
+		isReadonly: P,
+		variantKey: F,
+		endIconBind: me,
+		endSlotBind: he,
+		invalidated: M,
+		containerBind: a(() => r(k.value?.container, {
+			"data-bridge-variant": F.value,
 			"data-bridge-rounded": E.value.rounded ?? "md"
-		}, g({
+		}, h({
 			"group/field relative flex flex-row items-stretch overflow-hidden": L.value,
 			"group/field relative flex justify-start gap-x-2 items-stretch": !L.value,
 			"transition-all ease-in-out duration-150 outline-none": !0,
-			"bg-dark-100 dark:bg-dark-800": M.value && !j.value,
-			[q.value?.container ?? ""]: !z.value,
-			[q.value?.containerTextareaLikeInput ?? ""]: B.value,
-			[q.value?.containerTextarea ?? ""]: z.value && !B.value,
-			[X.value?.container ?? ""]: !0,
-			[Y.value ?? ""]: !R.value,
-			[te.value ?? ""]: !0,
-			[Z.value ?? ""]: !0,
+			"bg-dark-100 dark:bg-dark-800": N.value && !M.value,
+			[Y.value?.container ?? ""]: !z.value,
+			[Y.value?.containerTextareaLikeInput ?? ""]: B.value,
+			[Y.value?.containerTextarea ?? ""]: z.value && !B.value,
+			[Q.value?.container ?? ""]: !0,
+			[Z.value ?? ""]: !R.value,
+			[ae.value ?? ""]: !0,
+			[re.value ?? ""]: !0,
 			"rounded-none": R.value,
-			"bg-error-50 ring-error-500 dark:bg-error-700/10 dark:ring-error-600": j.value && !R.value,
-			"border-error-500 dark:border-error-600": j.value && R.value,
-			[A.value.container ?? ""]: !0
+			"bg-error-50 ring-error-500 dark:bg-error-700/10 dark:ring-error-600": M.value && !R.value,
+			"border-error-500 dark:border-error-600": M.value && R.value,
+			[j.value.container ?? ""]: !0
 		}))),
-		startIconBind: o(() => r(O.value?.startIcon, {}, g({ "inline-flex shrink-0 items-center justify-center self-center": L.value }))),
-		startSlotBind: o(() => r(O.value?.start, {}, g({
+		startIconBind: a(() => r(k.value?.startIcon, {}, h({ "inline-flex shrink-0 items-center justify-center self-center": L.value }))),
+		startSlotBind: a(() => r(k.value?.start, {}, h({
 			"group/start wrapper-start-slot shrink-0 flex w-auto items-stretch self-stretch [&>*]:min-h-0": !0,
 			"self-stretch min-h-0 overflow-hidden py-0.5 ps-0.5": L.value,
 			"h-full min-h-0 overflow-hidden py-0.5 ps-0.5": !L.value,
-			[A.value.start ?? ""]: !0
+			[j.value.start ?? ""]: !0
 		}))),
-		fieldLabelProps: oe,
-		ariaDescribedBy: K,
-		descriptionBind: o(() => r(O.value?.description, {}, g({
+		fieldLabelProps: ue,
+		ariaDescribedBy: J,
+		descriptionBind: a(() => r(k.value?.description, {}, h({
 			"mt-1 text-dark-500 dark:text-dark-400": !0,
-			[q.value?.text ?? ""]: !0,
-			[q.value?.insetStart ?? ""]: !0,
-			[q.value?.insetEnd ?? ""]: !0,
-			[A.value.description ?? ""]: !0
+			[Y.value?.text ?? ""]: !0,
+			[Y.value?.insetStart ?? ""]: !0,
+			[Y.value?.insetEnd ?? ""]: !0,
+			[j.value.description ?? ""]: !0
 		}))),
-		stackedBodyBind: fe,
-		fieldCornerProps: se,
-		hasInsetLabelRow: W,
-		insetLabelRowBind: ce,
-		stackedInputRowBind: pe,
+		stackedBodyBind: ge,
+		fieldCornerProps: fe,
+		hasInsetLabelRow: K,
+		insetLabelRowBind: pe,
+		stackedInputRowBind: _e,
+		showErrorMessageRow: G,
+		showDescriptionContent: W,
 		showErrorMessageContent: U,
 		reservesErrorMessageSpace: V
 	};
 }
 //#endregion
-export { b as formFieldBridgeKeys, x as useFormField };
+export { y as formFieldBridgeKeys, b as useFormField };

package/dist/Components/FormField/formField.types.d.ts

@@ -142,7 +142,8 @@ export interface FormFieldOwnProps {
      */
     customProps?: FormFieldCustomProps;
     /**
-     * Helper text below the control (hidden when the field is invalid).
+     * Helper text below the control. Hidden when `error` is true and an error
+     * message is shown, unless `showDescriptionOnError` is true.
      *
      * @default undefined
      */
@@ -166,7 +167,8 @@ export interface FormFieldOwnProps {
      */
     endIcon?: IconSource;
     /**
-     * When `true`, applies invalid styling on the label and hides description.
+     * When `true`, applies invalid styling on the label. Hides description when
+     * an error message is shown, unless `showDescriptionOnError` is true.
      *
      * @default false
      */
@@ -192,7 +194,8 @@ export interface FormFieldOwnProps {
      */
     field?: UseFormFieldReturn;
     /**
-     * When `true`, does not reserve space below the control for error messages.
+     * When `true`, does not reserve the error row. That row is also omitted
+     * while a description is shown.
      *
      * @default false
      */
@@ -221,6 +224,12 @@ export interface FormFieldOwnProps {
      * @default "md"
      */
     rounded?: MergeProps<FormFieldRounded, FormFieldRoundedOverrides>;
+    /**
+     * When `true`, keeps the description visible while the field is invalid.
+     *
+     * @default false
+     */
+    showDescriptionOnError?: boolean;
     /**
      * When `true` and the field is invalid, shows an error icon at the inline end
      * when no `endIcon` or `end` slot is present.
@@ -269,7 +278,8 @@ export interface FormFieldSlots {
      */
     default?: Slot<undefined>;
     /**
-     * Helper text below the control (hidden when the field is invalid).
+     * Helper text below the control. Hidden when the field is invalid and an
+     * error message is shown, unless `showDescriptionOnError` is true.
      */
     description?: Slot<undefined>;
     /**

package/dist/Components/ListItem/ListItem.vue.d.ts

@@ -2,8 +2,8 @@ import { ListItemOwnProps, ListItemSlots } from './listItem.types';
 type __VLS_Slots = ListItemSlots;
 declare const __VLS_base: import('vue').DefineComponent<ListItemOwnProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ListItemOwnProps> & Readonly<{}>, {
     role: "button" | "option" | "menuitem";
-    disabled: boolean;
     as: "li" | "div";
+    disabled: boolean;
     selected: boolean;
     divider: boolean;
     interactive: boolean;

package/dist/Components/ListItem/composables/useListItem.d.ts

@@ -11,7 +11,7 @@ export declare function useListItem(props: ListItemOwnProps, libDefaults: ListIt
     rootBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<{
         class: string;
         id: string | undefined;
-    }, "class", import('vue').HTMLAttributes | undefined, Omit<Omit<ListItemProps, "role" | "value" | "classes" | "customProps" | "primary" | "secondary" | "disabled" | "as" | "selected" | "dense" | "divider" | "interactive" | "selectedIcon">, never>>>;
+    }, "class", import('vue').HTMLAttributes | undefined, Omit<Omit<ListItemProps, "role" | "value" | "classes" | "customProps" | "primary" | "secondary" | "as" | "disabled" | "selected" | "dense" | "divider" | "interactive" | "selectedIcon">, never>>>;
     rowClass: import('vue').ComputedRef<string>;
     startBind: import('vue').ComputedRef<import('@bridge-ui/core/Utils').MergePartBind<object, "class", import('vue').HTMLAttributes | undefined, {}>>;
     hasPrimary: import('vue').ComputedRef<boolean>;

package/dist/Components/Listbox/Listbox.vue.d.ts

@@ -7,16 +7,16 @@ type __VLS_ModelProps = {
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    select: (option: ListboxOption) => any;
     apply: () => any;
     cancel: () => any;
+    select: (option: ListboxOption) => any;
     "update:modelValue": (value: boolean) => any;
     "show-change": (show: boolean) => any;
     "registered-options-change": (options: ListboxOption[]) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    onSelect?: ((option: ListboxOption) => any) | undefined;
     onApply?: (() => any) | undefined;
     onCancel?: (() => any) | undefined;
+    onSelect?: ((option: ListboxOption) => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     "onShow-change"?: ((show: boolean) => any) | undefined;
     "onRegistered-options-change"?: ((options: ListboxOption[]) => any) | undefined;
@@ -25,11 +25,11 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     size: import('@bridge-ui/core/Utils').MergeProps<import('@bridge-ui/core/Tokens').ListboxSize, import('./listbox.types').ListboxSizeOverrides>;
     overlay: import('@bridge-ui/core/Domain').FieldOverlayMode;
     showFooter: boolean;
-    multiple: boolean;
     loading: boolean;
+    multiple: boolean;
+    hideEmptyMessage: boolean;
     placement: import('@floating-ui/utils').Placement;
     disableAutoFocus: boolean;
-    hideEmptyMessage: boolean;
     highlightedIndex: number;
     showCheckmark: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;