bitboss-ui 3.0.0-beta.2 → 3.0.0-beta.21

package/dist/components/BbDropdown/BbDropdown.vue_vue_type_script_setup_true_lang.js

@@ -1,50 +1,50 @@
-import { useId as e } from "../../composables/useId.js";
-import { useUntil as t } from "../../composables/useUntil.js";
-import { removedPropsFor as n } from "../../deprecation/removedProps.js";
-import { useLogger as r } from "../../composables/useLogger.js";
-import { warnRemovedAttrs as i } from "../../utilities/functions/warnRemovedAttrs.js";
-import { extractDomContainer as a } from "../../utilities/functions/extractDomContainer.js";
-import { transitions as o } from "../../utilities/misc/transitions.js";
-import ee from "../CommonPopover/CommonPopover.vue.js";
-import { parseWidthString as s } from "../../utilities/functions/parseWidthString.js";
-import { isTopEscapeEntry as te, pushEscapeEntry as ne, removeEscapeEntry as re } from "../../utils/overlayEscapeStack.js";
-import { useBbDropdownContextHost as ie } from "../../composables/useBbDropdownContext.js";
-import { useMobile as ae } from "../../composables/useMobile.js";
-import { provideSheetSurface as oe } from "../../composables/useSheetSurface.js";
-import { useClosingInert as se } from "../../composables/useClosingInert.js";
-import { wait as ce } from "../../utilities/functions/wait.js";
-import { groupItemsAsArray as c, isGroup as l } from "./types.js";
+import { useConfig as e } from "../../composables/useConfig.js";
+import { useId as t } from "../../composables/useId.js";
+import { useUntil as n } from "../../composables/useUntil.js";
+import { removedPropsFor as r } from "../../deprecation/removedProps.js";
+import { useLogger as i } from "../../composables/useLogger.js";
+import { warnRemovedAttrs as a } from "../../utilities/functions/warnRemovedAttrs.js";
+import { extractDomContainer as o } from "../../utilities/functions/extractDomContainer.js";
+import { transitions as ee } from "../../utilities/misc/transitions.js";
+import s from "../CommonPopover/CommonPopover.vue.js";
+import { parseWidthString as te } from "../../utilities/functions/parseWidthString.js";
+import { isTopEscapeEntry as ne, pushEscapeEntry as re, removeEscapeEntry as ie } from "../../utils/overlayEscapeStack.js";
+import { useBbDropdownContextHost as ae } from "../../composables/useBbDropdownContext.js";
+import { useMobile as oe } from "../../composables/useMobile.js";
+import { provideSheetSurface as se } from "../../composables/useSheetSurface.js";
+import { useClosingInert as ce } from "../../composables/useClosingInert.js";
+import { wait as c } from "../../utilities/functions/wait.js";
+import { groupItemsAsArray as l, isGroup as u } from "./types.js";
 import { levelHasSearch as le, normalizeGroups as ue } from "./normalizeGroups.js";
 import { provideDropdownContext as de } from "./useDropdownContext.js";
 import fe from "./BbDropdownList.vue.js";
-import pe from "./AdaptiveDropdown.vue.js";
-import { hash as me } from "../../utilities/functions/hash.js";
+import { hash as pe } from "../../utilities/functions/hash.js";
+import me from "./AdaptiveDropdown.vue.js";
 import { provideDropdownGroupRegistry as he } from "./useDropdownGroupRegistry.js";
 import ge from "./DropdownPipelineResolver.vue.js";
-import { config as _e } from "virtual:bitboss-ui/config";
-import { Fragment as ve, computed as u, createBlock as d, createCommentVNode as ye, createElementBlock as f, createElementVNode as be, createVNode as xe, defineComponent as Se, mergeProps as Ce, normalizeProps as we, normalizeStyle as Te, onBeforeUnmount as Ee, openBlock as p, reactive as m, ref as h, renderList as De, renderSlot as g, toDisplayString as Oe, unref as _, useSlots as ke, useTemplateRef as Ae, watch as v, withCtx as je } from "vue";
-import { useElementSize as Me, useIntersectionObserver as Ne } from "@vueuse/core";
+import { Fragment as _e, computed as d, createBlock as ve, createCommentVNode as ye, createElementBlock as f, createElementVNode as be, createVNode as xe, defineComponent as Se, mergeProps as Ce, normalizeClass as we, normalizeProps as Te, normalizeStyle as Ee, onBeforeUnmount as De, openBlock as p, reactive as m, ref as h, renderList as Oe, renderSlot as g, toDisplayString as ke, unref as _, useSlots as Ae, useTemplateRef as je, watch as v, withCtx as Me } from "vue";
+import { useElementSize as Ne, useIntersectionObserver as Pe } from "@vueuse/core";
 //#region src/components/BbDropdown/BbDropdown.vue?vue&type=script&setup=true&lang.ts
-var Pe = [
+var Fe = [
 	"id",
 	"aria-labelledby",
 	"data-bb-dropdown-surface",
 	"inert",
 	"role"
-], Fe = {
+], Ie = {
 	key: 0,
 	class: "bb-dropdown__header"
-}, Ie = [
+}, Le = [
 	"id",
 	"aria-labelledby",
 	"role"
-], Le = {
+], Re = {
 	class: "sr-only",
 	role: "status"
-}, Re = {
+}, ze = {
 	key: 1,
 	class: "bb-dropdown__footer"
-}, ze = "bb-dropdown:open", Be = 500, Ve = 10, y = /*@__PURE__*/ Se({
+}, Be = "bb-dropdown:open", Ve = 500, He = 10, y = /*@__PURE__*/ Se({
 	inheritAttrs: !1,
 	__name: "BbDropdown",
 	props: {
@@ -53,6 +53,7 @@ var Pe = [
 			type: Boolean,
 			default: void 0
 		},
+		compact: { type: Boolean },
 		anchor: {},
 		boundary: {},
 		disabled: { type: Boolean },
@@ -67,34 +68,35 @@ var Pe = [
 		padding: { default: 10 },
 		placement: { default: "bottom" },
 		queryDebounceTime: { default: 300 },
-		transitionDuration: { default: o.fast },
+		transitionDuration: { default: ee.fast },
 		trigger: { default: "click" },
 		width: { default: "auto" }
 	},
 	emits: ["item:selected", "item:unselected"],
-	setup(o, { emit: Se }) {
-		let y = o, He = Se;
-		process.env.NODE_ENV !== "production" && i("BbDropdown", n("BbDropdown"));
-		let Ue = r(), b = y.id ?? `bb_${e().id.value}`, We = Symbol("bb-dropdown-escape"), x = h(b), S = h(), Ge = u(() => a(S.value)), Ke = u(() => y.activator != null), C = h(!1), qe = t(C, { initialValue: y.eager }), Je = se(C, () => y.transitionDuration), w = m({}), Ye = m(/* @__PURE__ */ new Set()), { isMobile: Xe } = ae(), Ze = () => (y.adaptive ?? _e.adaptive) && Xe.value ? "canvas" : "popover", Qe = h(Ze()), T = u(() => Qe.value === "canvas");
+	setup(ee, { emit: Se }) {
+		let y = ee, Ue = Se, We = e();
+		process.env.NODE_ENV !== "production" && a("BbDropdown", r("BbDropdown"));
+		let Ge = i(), b = y.id ?? `bb_${t().id.value}`, x = Symbol("bb-dropdown-escape"), S = h(b), C = h(), Ke = d(() => o(C.value)), qe = d(() => y.activator != null), w = h(!1), Je = n(w, { initialValue: y.eager }), Ye = ce(w, () => y.transitionDuration), T = m({}), Xe = m(/* @__PURE__ */ new Set()), { isMobile: Ze } = oe(), Qe = () => (y.adaptive ?? We.adaptive) && Ze.value ? "canvas" : "popover", $e = h(Qe()), E = d(() => $e.value === "canvas");
 		v([
 			() => y.adaptive,
-			Xe,
-			C
+			Ze,
+			w
 		], () => {
-			C.value || (Qe.value = Ze());
-		}), oe(T);
-		let $e = u(() => ({
+			w.value || ($e.value = Qe());
+		}), se(E);
+		let et = d(() => ({
 			side: "bottom",
 			size: "auto",
 			draggable: !0,
 			eager: y.eager,
 			disabled: y.disabled,
 			transitionDuration: y.transitionDuration,
+			hideClose: !0,
 			...y.offCanvasProps
-		})), et = u(() => {
+		})), tt = d(() => {
 			let e = y.trigger;
 			return new Set(Array.isArray(e) ? e : [e]);
-		}), E = (e, t) => ({ getBoundingClientRect: () => ({
+		}), nt = (e, t) => ({ getBoundingClientRect: () => ({
 			x: e,
 			y: t,
 			width: 0,
@@ -106,23 +108,23 @@ var Pe = [
 			toJSON() {
 				return this;
 			}
-		}) }), D = h(null), tt = u(() => y.anchor ?? S.value), nt = u(() => a(tt.value)), rt = u(() => y.placement === "cursor" && D.value ? D.value : tt.value), it = (e) => {
-			let t = a(e);
-			t && (S.value = t);
-		}, at = !1, { resume: ot, pause: st } = Ne(Ge, async ([{ intersectionRatio: e }]) => {
-			if (at) {
-				at = !1;
+		}) }), D = h(null), rt = d(() => y.anchor ?? C.value), it = d(() => o(rt.value)), at = d(() => y.placement === "cursor" && D.value ? D.value : rt.value), ot = (e) => {
+			let t = o(e);
+			t && (C.value = t);
+		}, st = !1, { resume: ct, pause: lt } = Pe(Ke, async ([{ intersectionRatio: e }]) => {
+			if (st) {
+				st = !1;
 				return;
 			}
-			e !== 1 && C.value && await Q();
+			e !== 1 && w.value && await Q();
 		}, {
 			threshold: [0, 1],
 			immediate: !1
-		}), O = m({}), ct = m(/* @__PURE__ */ new Map()), k = m(/* @__PURE__ */ new Map()), A = (e, t) => {
+		}), O = m({}), ut = m(/* @__PURE__ */ new Map()), k = m(/* @__PURE__ */ new Map()), A = (e, t) => {
 			for (let n of e) {
-				if (l(n)) {
+				if (u(n)) {
 					if (n.key === t) return n;
-					for (let e of c(n.items)) {
+					for (let e of l(n.items)) {
 						let n = Array.isArray(e) ? e : [e];
 						for (let e of n) {
 							let n = e.items ? A(e.items, t) : void 0;
@@ -146,9 +148,9 @@ var Pe = [
 					if (e) return e;
 					continue;
 				}
-				if (l(n)) {
+				if (u(n)) {
 					if (n.key === t) return "group";
-					for (let e of c(n.items)) {
+					for (let e of l(n.items)) {
 						let n = Array.isArray(e) ? e : [e];
 						for (let e of n) {
 							if (e.key === t) return "item";
@@ -166,7 +168,7 @@ var Pe = [
 					if (e) return e;
 				}
 			}
-		}, lt = u(() => Array.from(ct.values()).map((e) => e.value).sort((e, t) => e.order - t.order)), ut = (e, t) => ({
+		}, dt = d(() => Array.from(ut.values()).map((e) => e.value).sort((e, t) => e.order - t.order)), ft = (e, t) => ({
 			...e,
 			group: !0,
 			key: e.key,
@@ -179,7 +181,7 @@ var Pe = [
 			"append:icon": t["append:icon"] ?? e["append:icon"],
 			variant: t.variant ?? e.variant,
 			onClick: t.onClick ?? e.onClick
-		}), dt = (e, t) => ({
+		}), pt = (e, t) => ({
 			group: !0,
 			key: e.key,
 			label: e.label ?? t?.label,
@@ -191,10 +193,10 @@ var Pe = [
 			"append:icon": e["append:icon"] ?? t?.["append:icon"],
 			variant: e.variant ?? t?.variant,
 			onClick: e.onClick ?? t?.onClick
-		}), ft = (e, t) => {
+		}), M = (e, t) => {
 			let n = !1, r = (e) => {
 				if (!e.items) return e;
-				let r = ft(e.items, t);
+				let r = M(e.items, t);
 				return r.found ? (n = !0, {
 					...e,
 					items: r.items
@@ -202,42 +204,42 @@ var Pe = [
 			};
 			return {
 				items: e.map((e) => {
-					if (l(e)) {
-						if (e.key === t.key) return n = !0, ut(e, t);
+					if (u(e)) {
+						if (e.key === t.key) return n = !0, ft(e, t);
 						if (typeof e.items == "function") return e;
-						let i = c(e.items).map((e) => Array.isArray(e) ? e.map((e) => r(e)) : r(e));
+						let i = l(e.items).map((e) => Array.isArray(e) ? e.map((e) => r(e)) : r(e));
 						return {
 							...e,
 							items: i
 						};
 					}
 					if (Array.isArray(e)) {
-						let r = ft(e, t);
+						let r = M(e, t);
 						return r.found && (n = !0), r.items;
 					}
 					return r(e);
 				}),
 				found: n
 			};
-		}, M = u(() => {
+		}, N = d(() => {
 			let e = [...y.items ?? []];
-			for (let t of lt.value) {
+			for (let t of dt.value) {
 				let n = A(e, t.key);
-				!n && !t.items?.length && (j(e, t.key) === "item" && Ue.throw(`[BbDropdownGroup] "${t.key}" refers to a menu item, not a selectable group. \`<BbDropdownGroup>\` can only attach to a group (an entry with \`selectable\`, \`multiple\`, or \`group: true\`). Point \`id\` at a group key.`), Ue.throw(`[BbDropdownGroup] Missing minimum config for group "${t.key}". Provide \`items\`, \`selectable\`, \`multiple\`, or \`group\` keys in order to identify a group or define a baseline group with the same key in \`BbDropdown.items\`.`));
-				let r = dt(t, n), i = ft(e, r);
+				!n && !t.items?.length && (j(e, t.key) === "item" && Ge.throw(`[BbDropdownGroup] "${t.key}" refers to a menu item, not a selectable group. \`<BbDropdownGroup>\` can only attach to a group (an entry with \`selectable\`, \`multiple\`, or \`group: true\`). Point \`id\` at a group key.`), Ge.throw(`[BbDropdownGroup] Missing minimum config for group "${t.key}". Provide \`items\`, \`selectable\`, \`multiple\`, or \`group\` keys in order to identify a group or define a baseline group with the same key in \`BbDropdown.items\`.`));
+				let r = pt(t, n), i = M(e, r);
 				e = i.found ? i.items : [...i.items, r];
 			}
 			return e;
-		}), N = u(() => ue(M.value).map((e) => e.selectable ? {
+		}), P = d(() => ue(N.value).map((e) => e.selectable ? {
 			...e,
 			selected: O[e.key ?? ""] ?? []
-		} : e)), P = u(() => le(N.value)), pt = h(), mt = u(() => P.value || T.value ? "dialog" : "menu"), ht = u(() => P.value && !T.value ? `dialog_${b}` : `menu_${b}`), gt = (e) => typeof e.items == "function" || e.itemText != null || e.itemValue != null || e.max != null, F = (e, t = []) => {
-			for (let n of e) if (l(n)) {
+		} : e)), F = d(() => le(P.value)), I = h(), mt = d(() => F.value || E.value ? "dialog" : "menu"), ht = d(() => F.value && !E.value ? `dialog_${b}` : `menu_${b}`), gt = (e) => typeof e.items == "function" || e.itemText != null || e.itemValue != null || e.max != null, L = (e, t = []) => {
+			for (let n of e) if (u(n)) {
 				n.key && gt(n) && t.push(n.key);
-				for (let e of c(n.items)) for (let n of Array.isArray(e) ? e : [e]) n.items && F(n.items, t);
-			} else Array.isArray(n) ? F(n, t) : n.items && F(n.items, t);
+				for (let e of l(n.items)) for (let n of Array.isArray(e) ? e : [e]) n.items && L(n.items, t);
+			} else Array.isArray(n) ? L(n, t) : n.items && L(n.items, t);
 			return t;
-		}, I = u(() => F(y.items ?? [])), _t = u(() => (y.items ?? []).filter((e) => l(e) && !!e.key && gt(e)).map((e) => e.key)), L = m({}), R = m({}), z = m({}), B = (e, t) => I.value.includes(e) ? L[e]?.valueByKey.get(t) : t, vt = (e) => {
+		}, R = d(() => L(y.items ?? [])), _t = d(() => (y.items ?? []).filter((e) => u(e) && !!e.key && gt(e)).map((e) => e.key)), z = m({}), vt = m({}), yt = m({}), B = (e, t) => R.value.includes(e) ? z[e]?.valueByKey.get(t) : t, bt = (e) => {
 			let t = A(y.items ?? [], e);
 			if (t) return {
 				multiple: t.multiple ?? !1,
@@ -253,15 +255,15 @@ var Pe = [
 					}
 				}
 			};
-			return t(M.value);
-		}, yt = (e, t) => I.value.includes(e) ? me(t) : t, bt = (e) => {
+			return t(N.value);
+		}, xt = (e, t) => R.value.includes(e) ? pe(t) : t, St = (e) => {
 			if (k.has(e)) return k.get(e);
 			let t = (O[e] ?? []).map((t) => B(e, t));
-			return vt(e)?.multiple ? t : t[0] ?? null;
+			return bt(e)?.multiple ? t : t[0] ?? null;
 		};
 		he({
-			register: (e, t) => ct.set(e, t),
-			unregister: (e) => ct.delete(e),
+			register: (e, t) => ut.set(e, t),
+			unregister: (e) => ut.delete(e),
 			seed: (e, t) => {
 				e in O || (O[e] = t);
 			},
@@ -269,48 +271,48 @@ var Pe = [
 				O[e] = t;
 			},
 			selectionFor: (e) => O[e] ?? [],
-			isPipeline: (e) => I.value.includes(e),
+			isPipeline: (e) => R.value.includes(e),
 			publishPipeline: (e, t) => {
-				t ? L[e] = t : delete L[e];
+				t ? z[e] = t : delete z[e];
 			},
 			publishLoading: (e, t) => {
-				t ? R[e] = !0 : delete R[e];
+				t ? vt[e] = !0 : delete vt[e];
 			},
 			publishFetching: (e, t) => {
-				t ? z[e] = !0 : delete z[e];
+				t ? yt[e] = !0 : delete yt[e];
 			},
 			publishModel: (e, t) => {
 				t === void 0 ? k.delete(e) : k.set(e, t);
 			},
-			modelValueFor: bt,
+			modelValueFor: St,
 			valueForKey: B,
-			keyForValue: yt,
-			itemForKey: (e, t) => L[e]?.itemByKey.get(t) ?? V(e)?.items.find((e) => e.key === t),
+			keyForValue: xt,
+			itemForKey: (e, t) => z[e]?.itemByKey.get(t) ?? V(e)?.items.find((e) => e.key === t),
 			configFor: (e) => A(y.items ?? [], e),
 			itemsFor: (e) => V(e)?.items ?? [],
-			selectableFor: (e) => vt(e)?.selectable,
-			multipleFor: (e) => vt(e)?.multiple
+			selectableFor: (e) => bt(e)?.selectable,
+			multipleFor: (e) => bt(e)?.multiple
 		});
 		let H = (e, t = []) => {
-			for (let n of e) if (l(n)) {
+			for (let n of e) if (u(n)) {
 				let e = n.selectable ?? n.multiple != null;
 				n.key && e && t.push(n.key);
-				for (let e of c(n.items)) for (let n of Array.isArray(e) ? e : [e]) n.items && H(n.items, t);
+				for (let e of l(n.items)) for (let n of Array.isArray(e) ? e : [e]) n.items && H(n.items, t);
 			} else Array.isArray(n) ? H(n, t) : n.items && H(n.items, t);
 			return t;
-		}, xt = u(() => {
+		}, Ct = d(() => {
 			let e = {};
-			for (let t of H(M.value)) {
-				let n = bt(t), r = [].concat(n).filter((e) => e != null), i = L[t], a = V(t), o = A(M.value, t), { items: ee, ...s } = o ?? {};
+			for (let t of H(N.value)) {
+				let n = St(t), r = [].concat(n).filter((e) => e != null), i = z[t], a = V(t), o = A(N.value, t), { items: ee, ...s } = o ?? {};
 				e[t] = {
 					...s,
 					key: t,
 					value: n,
 					multiple: o?.multiple ?? !1,
 					selectable: o?.selectable ?? o?.multiple != null,
-					loading: !!z[t],
+					loading: !!yt[t],
 					selectedOptions: r.map((e) => {
-						let n = yt(t, e);
+						let n = xt(t, e);
 						return {
 							value: e,
 							text: i?.textByKey.get(n) ?? a?.items.find((e) => e.key === n)?.text,
@@ -321,11 +323,11 @@ var Pe = [
 			}
 			return e;
 		});
-		ie(() => y.id, {
-			open: () => C.value,
-			groups: () => xt.value
+		ae(() => y.id, {
+			open: () => w.value,
+			groups: () => Ct.value
 		});
-		let St = u(() => N.value.filter((e) => e.selectable).length), Ct = (e, t) => {
+		let wt = d(() => P.value.filter((e) => e.selectable).length), Tt = (e, t) => {
 			let n = e.key;
 			if (!n) return;
 			let r = O[n] ?? [], i = new Set(r);
@@ -334,19 +336,19 @@ var Pe = [
 			O[n] = a;
 			let o = a.filter((e) => !r.includes(e)), ee = r.filter((e) => !a.includes(e)), s = (t) => e.items.find((e) => e.key === t);
 			o.forEach((e) => {
-				s(e) && He("item:selected", B(n, e));
+				s(e) && Ue("item:selected", B(n, e));
 			}), ee.forEach((e) => {
-				s(e) && He("item:unselected", B(n, e));
+				s(e) && Ue("item:unselected", B(n, e));
 			});
-			let te = St.value === 1 && N.value.some((e) => e.selectable && e.key === n);
+			let te = wt.value === 1 && P.value.some((e) => e.selectable && e.key === n);
 			o.length && !e.multiple && te && (Q(), G());
-		}, U = m(/* @__PURE__ */ new Set()), wt = (e) => U.has(e), Tt = u(() => U.size > 0), Et = (e) => e != null && (typeof e == "object" || typeof e == "function") && typeof e.then == "function", Dt = async () => {
+		}, U = m(/* @__PURE__ */ new Set()), Et = (e) => U.has(e), Dt = d(() => U.size > 0), Ot = (e) => e != null && (typeof e == "object" || typeof e == "function") && typeof e.then == "function", kt = async () => {
 			await Q();
 			let e = document.activeElement;
 			e instanceof HTMLElement && e !== document.body && !e.closest(`[data-bb-dropdown-surface="${b}"]`) || G();
-		}, Ot = async (e, t, { close: n = !1 } = {}) => {
+		}, At = async (e, t, { close: n = !1 } = {}) => {
 			let r = e.onClick?.(t);
-			if (n && await Dt(), Et(r)) {
+			if (n && await kt(), Ot(r)) {
 				U.add(e.key);
 				try {
 					await r;
@@ -354,37 +356,37 @@ var Pe = [
 					U.delete(e.key);
 				}
 			}
-		}, W = Ae("rootList"), G = () => {
-			(S.value ?? (x.value ? document.getElementById(x.value) : null))?.focus();
+		}, W = je("rootList"), G = () => {
+			(C.value ?? (S.value ? document.getElementById(S.value) : null))?.focus();
 		};
 		de({
 			rootId: b,
-			activatorId: x,
+			activatorId: S,
 			setStatus: (e) => {
-				pt.value = e;
+				I.value = e;
 			},
-			status: pt,
-			open: C,
-			queryFor: (e) => w[e] ?? "",
+			status: I,
+			open: w,
+			queryFor: (e) => T[e] ?? "",
 			setQuery: (e, t) => {
-				w[e] = t;
+				T[e] = t;
 			},
 			activateGroup: (e) => {
-				Ye.has(e) || Ye.add(e);
+				Xe.has(e) || Xe.add(e);
 			},
-			isActivated: (e) => Ye.has(e),
-			isPipelineGroup: (e) => I.value.includes(e),
-			isGroupLoading: (e) => !!R[e],
+			isActivated: (e) => Xe.has(e),
+			isPipelineGroup: (e) => R.value.includes(e),
+			isGroupLoading: (e) => !!vt[e],
 			isTopLevelPipeline: (e) => _t.value.includes(e),
-			queryDebounceTime: u(() => y.queryDebounceTime ?? 300),
+			queryDebounceTime: d(() => y.queryDebounceTime ?? 300),
 			selectedFor: (e) => O[e] ?? [],
-			loadingText: u(() => y.loadingText),
-			noDataText: u(() => y.noDataText),
-			enforceCoherence: u(() => y.enforceCoherence),
-			placement: u(() => y.placement),
-			disabled: u(() => !!y.disabled),
+			loadingText: d(() => y.loadingText),
+			noDataText: d(() => y.noDataText),
+			enforceCoherence: d(() => y.enforceCoherence),
+			placement: d(() => y.placement),
+			disabled: d(() => !!y.disabled),
 			selectedChipsFor: (e) => {
-				let t = V(e), n = L[e];
+				let t = V(e), n = z[e];
 				return (O[e] ?? []).map((e) => ({
 					key: e,
 					text: n?.textByKey.get(e) ?? t?.items.find((t) => t.key === e)?.text ?? e
@@ -392,142 +394,147 @@ var Pe = [
 			},
 			deselect: (e, t) => {
 				let n = O[e] ?? [];
-				n.includes(t) && (O[e] = n.filter((e) => e !== t), He("item:unselected", B(e, t)));
+				n.includes(t) && (O[e] = n.filter((e) => e !== t), Ue("item:unselected", B(e, t)));
 			},
 			close: () => Q(),
 			focusActivator: G,
-			toggleSelect: Ct,
-			isItemLoading: wt,
-			runItemAction: Ot,
-			slots: ke()
+			toggleSelect: Tt,
+			isItemLoading: Et,
+			runItemAction: At,
+			slots: Ae()
 		});
-		let kt = (e) => {
+		let jt = (e) => {
 			if (!y.disabled) {
 				if (q) {
 					q = !1, e.preventDefault(), e.stopPropagation();
 					return;
 				}
-				e.stopPropagation(), y.placement === "cursor" && (D.value = E(e.clientX, e.clientY)), C.value ? Q() : Z();
+				e.stopPropagation(), y.placement === "cursor" && (D.value = nt(e.clientX, e.clientY)), w.value ? Q() : Z();
 			}
-		}, At = async (e) => {
+		}, Mt = async (e) => {
 			if (!y.disabled) {
 				if (e.preventDefault(), e.stopPropagation(), y.placement === "cursor") {
-					let t = E(e.clientX, e.clientY);
-					if (C.value) {
-						await Q(), await ce(y.transitionDuration), D.value = t, await Z();
+					let t = nt(e.clientX, e.clientY);
+					if (w.value) {
+						await Q(), await c(y.transitionDuration), D.value = t, await Z();
 						return;
 					}
 					D.value = t;
 				}
-				C.value ? Q() : Z();
+				w.value ? Q() : Z();
 			}
-		}, jt, K = null, q = !1, J = () => {
-			clearTimeout(jt), K = null;
-		}, Mt = (e) => {
+		}, Nt, K = null, q = !1, J = () => {
+			clearTimeout(Nt), K = null;
+		}, Pt = (e) => {
 			y.disabled || e.pointerType === "mouse" || (q = !1, K = {
 				x: e.clientX,
 				y: e.clientY
-			}, jt = setTimeout(() => {
-				q = !0, y.placement === "cursor" && K && (D.value = E(K.x, K.y)), K = null, Z();
-			}, Be));
-		}, Nt = (e) => {
+			}, Nt = setTimeout(() => {
+				q = !0, y.placement === "cursor" && K && (D.value = nt(K.x, K.y)), K = null, Z();
+			}, Ve));
+		}, Ft = (e) => {
 			if (!K) return;
 			let t = e.clientX - K.x, n = e.clientY - K.y;
-			Math.sqrt(t * t + n * n) > Ve && J();
+			Math.sqrt(t * t + n * n) > He && J();
 		}, Y = () => {
 			J();
-		}, Pt = async (e) => {
-			y.disabled || (e.key === "ArrowDown" ? (e.preventDefault(), C.value || await Z(), await ce(0), W.value?.focusFirst()) : e.key === "ArrowUp" ? (e.preventDefault(), C.value || await Z(), await ce(0), W.value?.focusLast()) : e.key === "Tab" && C.value && !e.shiftKey && (e.preventDefault(), W.value?.focusFirst()));
+		}, It = async (e) => {
+			y.disabled || (e.key === "ArrowDown" ? (e.preventDefault(), w.value || await Z(), await c(0), W.value?.focusFirst()) : e.key === "ArrowUp" ? (e.preventDefault(), w.value || await Z(), await c(0), W.value?.focusLast()) : e.key === "Tab" && w.value && !e.shiftKey && (e.preventDefault(), W.value?.focusFirst()));
 		}, X = (e) => {
 			let t = e.target;
 			t instanceof HTMLElement && (t.closest(`[data-bb-dropdown-surface="${b}"]`) || Q());
-		}, Ft = (e) => {
+		}, Lt = (e) => {
 			let t = e.detail;
 			!t || t.surfaceId === b || t.activator?.closest(`[data-bb-dropdown-surface="${b}"]`) || Q();
-		}, It = (e) => {
-			!C.value || e.key !== "Escape" || te(We) && (e.stopImmediatePropagation(), e.preventDefault(), document.activeElement !== S.value && G(), Q());
+		}, Rt = (e) => {
+			!w.value || e.key !== "Escape" || ne(x) && (e.stopImmediatePropagation(), e.preventDefault(), document.activeElement !== C.value && G(), Q());
 		}, Z = async () => {
-			Qe.value = Ze(), at = !0, C.value = !0, document.dispatchEvent(new CustomEvent(ze, { detail: {
+			$e.value = Qe(), st = !0, w.value = !0, document.dispatchEvent(new CustomEvent(Be, { detail: {
 				surfaceId: b,
-				activator: S.value
-			} })), !T.value && (ot(), ne(We), document.addEventListener("click", X, { passive: !0 }), document.addEventListener("contextmenu", X, { passive: !0 }), document.addEventListener("focusin", X, { passive: !0 }), document.addEventListener("keydown", It, { capture: !0 }), document.addEventListener(ze, Ft));
+				activator: C.value
+			} })), !E.value && (ct(), re(x), document.addEventListener("click", X, { passive: !0 }), document.addEventListener("contextmenu", X, { passive: !0 }), document.addEventListener("focusin", X, { passive: !0 }), document.addEventListener("keydown", Rt, { capture: !0 }), document.addEventListener(Be, Lt));
 		}, Q = async () => {
-			C.value = !1, st();
-		}, Lt = () => {
-			re(We), document.removeEventListener("click", X), document.removeEventListener("contextmenu", X), document.removeEventListener("focusin", X), document.removeEventListener("keydown", It, { capture: !0 }), document.removeEventListener(ze, Ft);
+			w.value = !1, lt();
+		}, zt = () => {
+			ie(x), document.removeEventListener("click", X), document.removeEventListener("contextmenu", X), document.removeEventListener("focusin", X), document.removeEventListener("keydown", Rt, { capture: !0 }), document.removeEventListener(Be, Lt);
 		};
-		v(C, (e) => {
+		v(w, (e) => {
 			if (!e) {
-				Lt();
-				for (let e of Object.keys(w)) w[e] = "";
+				zt();
+				for (let e of Object.keys(T)) T[e] = "";
 			}
 		}), v(() => y.activator, (e) => {
-			e && it(e);
+			e && ot(e);
 		}, { immediate: !0 });
 		let $ = null;
-		v([S, et], ([e, t]) => {
+		v([C, tt], ([e, t]) => {
 			if ($ &&= ($(), null), !e) return;
 			let n = !1;
-			e.id || (e.id = b, n = !0), x.value = e.id;
+			e.id || (e.id = b, n = !0), S.value = e.id;
 			let r = [];
-			t.has("click") && (e.addEventListener("click", kt), r.push(() => e.removeEventListener("click", kt))), t.has("contextMenu") && (e.addEventListener("contextmenu", At), e.addEventListener("pointerdown", Mt), e.addEventListener("pointermove", Nt), e.addEventListener("pointerup", Y), e.addEventListener("pointercancel", Y), r.push(() => {
-				e.removeEventListener("contextmenu", At), e.removeEventListener("pointerdown", Mt), e.removeEventListener("pointermove", Nt), e.removeEventListener("pointerup", Y), e.removeEventListener("pointercancel", Y), J();
-			})), e.addEventListener("keydown", Pt), r.push(() => e.removeEventListener("keydown", Pt)), $ = () => {
+			t.has("click") && (e.addEventListener("click", jt), r.push(() => e.removeEventListener("click", jt))), t.has("contextMenu") && (e.addEventListener("contextmenu", Mt), e.addEventListener("pointerdown", Pt), e.addEventListener("pointermove", Ft), e.addEventListener("pointerup", Y), e.addEventListener("pointercancel", Y), r.push(() => {
+				e.removeEventListener("contextmenu", Mt), e.removeEventListener("pointerdown", Pt), e.removeEventListener("pointermove", Ft), e.removeEventListener("pointerup", Y), e.removeEventListener("pointercancel", Y), J();
+			})), e.addEventListener("keydown", It), r.push(() => e.removeEventListener("keydown", It)), $ = () => {
 				r.forEach((e) => e()), n && e.removeAttribute("id"), e.removeAttribute("aria-haspopup"), e.removeAttribute("aria-expanded"), e.removeAttribute("aria-controls");
 			};
 		}, { immediate: !0 }), v([
-			S,
 			C,
-			qe,
+			w,
+			Je,
 			mt,
 			ht
 		], ([e, t, n, r, i]) => {
 			e && (e.setAttribute("aria-haspopup", r), e.setAttribute("aria-expanded", n ? String(t) : "false"), n ? e.setAttribute("aria-controls", i) : e.removeAttribute("aria-controls"));
-		}, { immediate: !0 }), Ee(() => {
-			J(), $?.(), Lt();
+		}, { immediate: !0 }), De(() => {
+			J(), $?.(), zt();
 		});
-		let { width: Rt } = Me(nt, {
+		let Bt = d(() => y.width === "auto"), { width: Vt } = Ne(d(() => w.value ? it.value : null), {
 			width: 0,
 			height: 0
-		}, { box: "border-box" }), zt = u(() => {
+		}, { box: "border-box" }), Ht = d(() => {
 			if (y.width !== "auto") {
 				if (y.width) {
-					let { value: e, unit: t } = s(y.width);
-					return t === "%" ? nt.value ? `${Rt.value * (e / 100)}px` : "0px" : `${e}px`;
+					let { value: e, unit: t } = te(y.width);
+					return t === "%" ? it.value ? `${Vt.value * (e / 100)}px` : "0px" : `${e}px`;
 				}
 				return "0px";
 			}
 		});
-		return (e, t) => (p(), f(ve, null, [
-			Ke.value ? ye("", !0) : g(e.$slots, "activator", we(Ce({ key: 0 }, {
-				props: { ref: it },
+		return (e, t) => (p(), f(_e, null, [
+			qe.value ? ye("", !0) : g(e.$slots, "activator", Te(Ce({ key: 0 }, {
+				props: { ref: ot },
 				disabled: e.disabled,
-				loading: Tt.value,
-				open: C.value,
+				loading: Dt.value,
+				open: w.value,
 				placement: e.placement
 			}))),
 			g(e.$slots, "default"),
-			(p(!0), f(ve, null, De(I.value, (e) => (p(), d(ge, {
+			(p(!0), f(_e, null, Oe(R.value, (e) => (p(), ve(ge, {
 				id: e,
 				key: e
 			}, null, 8, ["id"]))), 128)),
-			T.value ? (p(), d(pe, {
+			E.value ? (p(), ve(me, {
 				key: 1,
-				modelValue: C.value,
-				"onUpdate:modelValue": t[0] ||= (e) => C.value = e,
-				"off-canvas-props": $e.value,
-				"root-groups": N.value
+				modelValue: w.value,
+				"onUpdate:modelValue": t[0] ||= (e) => w.value = e,
+				compact: e.compact,
+				"off-canvas-props": et.value,
+				"root-groups": P.value
 			}, null, 8, [
 				"modelValue",
+				"compact",
 				"off-canvas-props",
 				"root-groups"
-			])) : (p(), d(ee, Ce({
+			])) : (p(), ve(s, Ce({
 				key: 2,
-				modelValue: C.value,
-				"onUpdate:modelValue": t[1] ||= (e) => C.value = e,
-				anchor: rt.value,
+				modelValue: w.value,
+				"onUpdate:modelValue": t[1] ||= (e) => w.value = e,
+				anchor: at.value,
 				boundary: e.boundary,
-				class: ["bb-dropdown", { "bb-dropdown--mobile": _(Xe) }],
+				class: ["bb-dropdown", {
+					"bb-dropdown--mobile": _(Ze),
+					"bb-dropdown--compact": e.compact
+				}],
 				eager: e.eager,
 				"hide-arrow": "",
 				offset: e.offset,
@@ -535,40 +542,40 @@ var Pe = [
 				placement: e.placement === "cursor" ? "bottom-start" : e.placement,
 				"transition-duration": e.transitionDuration
 			}, e.$attrs), {
-				default: je(({ availableHeight: t }) => [be("span", {
-					id: P.value ? `dialog_${_(b)}` : void 0,
-					"aria-labelledby": P.value ? x.value : void 0,
-					class: "bb-dropdown__panel",
+				default: Me(({ availableHeight: t }) => [be("span", {
+					id: F.value ? `dialog_${_(b)}` : void 0,
+					"aria-labelledby": F.value ? S.value : void 0,
+					class: we(["bb-dropdown__panel", { "bb-dropdown__panel--reserve-check": Bt.value }]),
 					"data-bb-dropdown-surface": _(b),
-					inert: _(Je),
-					role: P.value ? "dialog" : void 0,
-					style: Te({
-						"--w": zt.value,
+					inert: _(Ye),
+					role: F.value ? "dialog" : void 0,
+					style: Ee({
+						"--w": Ht.value,
 						"--max-h": t == null ? void 0 : `${t}px`
 					})
 				}, [
-					e.$slots.header ? (p(), f("div", Fe, [g(e.$slots, "header", {
+					e.$slots.header ? (p(), f("div", Ie, [g(e.$slots, "header", {
 						disabled: e.disabled,
-						open: C.value,
+						open: w.value,
 						placement: e.placement
 					})])) : ye("", !0),
 					be("span", {
 						id: `menu_${_(b)}`,
-						"aria-labelledby": P.value ? void 0 : x.value,
+						"aria-labelledby": F.value ? void 0 : S.value,
 						class: "bb-dropdown__items-container scrollbar-border",
-						role: P.value ? "none" : "menu"
+						role: F.value ? "none" : "menu"
 					}, [xe(fe, {
 						ref_key: "rootList",
 						ref: W,
-						groups: N.value
-					}, null, 8, ["groups"])], 8, Ie),
-					be("span", Le, Oe(pt.value), 1),
-					e.$slots.footer ? (p(), f("div", Re, [g(e.$slots, "footer", {
+						groups: P.value
+					}, null, 8, ["groups"])], 8, Le),
+					be("span", Re, ke(I.value), 1),
+					e.$slots.footer ? (p(), f("div", ze, [g(e.$slots, "footer", {
 						disabled: e.disabled,
-						open: C.value,
+						open: w.value,
 						placement: e.placement
 					})])) : ye("", !0)
-				], 12, Pe)]),
+				], 14, Fe)]),
 				_: 3
 			}, 16, [
 				"modelValue",