bitboss-ui 3.0.0-beta.48 → 3.0.0-beta.49

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

@@ -18,8 +18,10 @@ var h = "__bb-dropdown-group:loading__", g = "__bb-dropdown-group:no-data__", _
 	props: { id: {} },
 	setup(d) {
 		let v = d, y = /* @__PURE__ */ new Set([
-			"key",
-			"text",
+			"value",
+			"label",
+			"rowKey",
+			"keyless",
 			"items",
 			"group",
 			"selectable",
@@ -31,7 +33,7 @@ var h = "__bb-dropdown-group:loading__", g = "__bb-dropdown-group:no-data__", _
 			E.value ? D.value : void 0,
 			e,
 			k()
-		], j = (e) => me(...A(e)), M = ae(!1), N = u(() => !!C.value?.stash), { array: P, add: F, remove: I } = ne(), { getItemText: L } = i(), { getItemValue: R } = a(), z = (e) => R(e, C.value?.itemValue), B = (e) => L(e, C.value?.itemText), V = u(() => s(C.value?.itemProps)), H = u(() => C.value ? ee(C.value) : void 0), fe = (e) => o(V.value.field(e, "description")), U = (e) => {
+		], j = (e) => me(...A(e)), M = ae(!1), N = u(() => !!C.value?.stash), { array: P, add: F, remove: I } = ne(), { getOptionText: L } = i(), { getOptionValue: R } = a(), z = (e) => R(e, C.value?.itemValue), B = (e) => L(e, C.value?.itemText), V = u(() => s(C.value?.itemProps)), H = u(() => C.value ? ee(C.value) : void 0), fe = (e) => o(V.value.field(e, "description")), U = (e) => {
 			if (Array.isArray(e)) return e.map((e) => U(e));
 			if (!e || typeof e != "object") return e;
 			let t = e;
@@ -110,27 +112,27 @@ var h = "__bb-dropdown-group:loading__", g = "__bb-dropdown-group:no-data__", _
 		});
 		let xe = u(() => C.value?.multiple ?? b?.multipleFor(v.id) ?? !1), Q = u(() => G.value && Y.value.length > 0), Se = u(() => {
 			if (G.value && !Y.value.length) return [{
-				key: h,
+				rowKey: h,
 				placeholder: "loading",
-				text: C.value?.loadingText ?? x.loadingText.value ?? T.value,
+				label: C.value?.loadingText ?? x.loadingText.value ?? T.value,
 				disabled: !0
 			}];
 			if (E.value && de.value && !M.value) return [{
-				key: g,
+				rowKey: g,
 				placeholder: "empty",
-				text: le.value,
+				label: le.value,
 				disabled: !0
 			}];
 			let e = _e.value;
 			if (!e.length) return Q.value ? [{
-				key: h,
+				rowKey: h,
 				placeholder: "loading",
-				text: C.value?.loadingText ?? x.loadingText.value ?? T.value,
+				label: C.value?.loadingText ?? x.loadingText.value ?? T.value,
 				disabled: !0
 			}] : K.value === null ? [{
-				key: g,
+				rowKey: g,
 				placeholder: "empty",
-				text: C.value?.emptyText ?? x.emptyText.value ?? se.value,
+				label: C.value?.emptyText ?? x.emptyText.value ?? se.value,
 				disabled: !0
 			}] : [$()];
 			let t = C.value?.max ?? Infinity, n = xe.value && Z.value.length >= t, r = e.map((e) => {
@@ -138,9 +140,9 @@ var h = "__bb-dropdown-group:loading__", g = "__bb-dropdown-group:no-data__", _
 				for (let [n, r] of Object.entries(V.value.all(e.item))) y.has(n) || (t[n] = r);
 				return {
 					...t,
-					key: e.key,
+					rowKey: e.key,
 					slotKey: e.slotToken,
-					text: e.text,
+					label: e.text,
 					description: e.description,
 					fetched: !0,
 					disabled: (H.value ? !H.value(e.item) : !1) || n && !Z.value.includes(e.key)
@@ -148,10 +150,10 @@ var h = "__bb-dropdown-group:loading__", g = "__bb-dropdown-group:no-data__", _
 			});
 			return K.value !== null && r.push($()), r;
 		}), $ = () => ({
-			key: _,
+			rowKey: _,
 			placeholder: "failed",
 			error: K.value,
-			text: C.value?.failedText ?? x.failedText.value ?? ce.value,
+			label: C.value?.failedText ?? x.failedText.value ?? ce.value,
 			disabled: !0
 		});
 		if (b) {

package/dist/components/BbDropdown/DropdownRow.vue.d.ts

@@ -0,0 +1,40 @@
+import { Slot, Slots } from 'vue';
+import { BbDropdownItemSlotProps, KeyedItem, NormalizedGroup } from './types';
+/**
+ * What a row reads from its list: one object the list builds once, so it never
+ * changes a row's props. Everything reactive is read through it inside the
+ * row's own render, which is what lets a row re-render alone.
+ */
+export interface DropdownRowApi {
+    slots: Slots;
+    setItemEl: (index: number, comp: unknown) => void;
+    itemAttrs: (group: NormalizedGroup, item: KeyedItem, index: number, selected: boolean) => Record<string, unknown>;
+    rowPart: (name: 'itemText' | 'itemIcon' | 'itemDescription', item: KeyedItem, selected: boolean) => Record<string, unknown>;
+    slotProps: (group: NormalizedGroup, item: KeyedItem, index: number, selected: boolean) => BbDropdownItemSlotProps;
+    rowSlot: (group: NormalizedGroup, item: KeyedItem, suffix?: 'prepend' | 'append') => Slot | undefined;
+    itemSlot: (item: KeyedItem, suffix?: 'prepend' | 'append') => Slot | undefined;
+    groupRowSlot: (group: NormalizedGroup, suffix?: 'prepend' | 'append') => Slot | undefined;
+    rowTextId: (index: number) => string;
+    rowDescriptionId: (index: number) => string;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import('vue').DefineComponent<{
+    /** The row's group, with a selection that may be stale: read `selected`. */
+    group: NormalizedGroup;
+    item: KeyedItem;
+    /** The row's flat index in its list. */
+    index: number;
+    /** Whether the row is a selectable group's pick. */
+    selected: boolean;
+    row: DropdownRowApi;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+    /** The row's group, with a selection that may be stale: read `selected`. */
+    group: NormalizedGroup;
+    item: KeyedItem;
+    /** The row's flat index in its list. */
+    index: number;
+    /** Whether the row is a selectable group's pick. */
+    selected: boolean;
+    row: DropdownRowApi;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/BbDropdown/DropdownRow.vue.js

@@ -0,0 +1,5 @@
+import e from "./DropdownRow.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/BbDropdown/DropdownRow.vue
+var t = e;
+//#endregion
+export { t as default };

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

@@ -0,0 +1,60 @@
+import e from "../BbIcon/BbIcon.vue.js";
+import t from "../BbBaseButton/BbBaseButton.vue.js";
+import n from "../../assets/svgs/check_stroke.svg_raw.js";
+import r from "../../assets/svgs/chevron_right.svg_raw.js";
+import { Fragment as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, defineComponent as l, mergeProps as u, normalizeProps as d, openBlock as f, resolveDynamicComponent as p, toDisplayString as m, unref as h, withCtx as g } from "vue";
+//#region src/components/BbDropdown/DropdownRow.vue?vue&type=script&setup=true&lang.ts
+var _ = {
+	key: 4,
+	class: "item__content"
+}, v = ["id"], y = ["id"], b = /*@__PURE__*/ l({
+	__name: "DropdownRow",
+	props: {
+		group: {},
+		item: {},
+		index: {},
+		selected: { type: Boolean },
+		row: {}
+	},
+	setup(l) {
+		return (l, b) => (f(), a(t, u({
+			ref: (e) => l.row.setItemEl(l.index, e),
+			class: "bb-dropdown__item"
+		}, l.row.itemAttrs(l.group, l.item, l.index, l.selected)), {
+			default: g(() => [
+				l.row.rowSlot(l.group, l.item, "prepend") ? (f(), a(p(l.row.rowSlot(l.group, l.item, "prepend")), d(u({ key: 0 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : l.row.slots["item:prepend"] ? (f(), a(p(l.row.slots["item:prepend"]), d(u({ key: 1 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : l.item["prepend:icon"] ? (f(), a(e, u({
+					key: 2,
+					class: "bb-dropdown__item-icon item__prepend-icon",
+					icon: l.item["prepend:icon"]
+				}, l.row.rowPart("itemIcon", l.item, l.selected)), null, 16, ["icon"])) : o("", !0),
+				l.row.rowSlot(l.group, l.item) ? (f(), a(p(l.row.rowSlot(l.group, l.item)), d(u({ key: 3 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : (f(), s("span", _, [c("span", u({
+					id: l.row.rowTextId(l.index),
+					class: "bb-dropdown__item-text"
+				}, l.row.rowPart("itemText", l.item, l.selected)), m(l.item.label), 17, v), l.item.description ? (f(), s("span", u({
+					key: 0,
+					id: l.row.rowDescriptionId(l.index),
+					class: "bb-dropdown__item-description"
+				}, l.row.rowPart("itemDescription", l.item, l.selected)), m(l.item.description), 17, y)) : o("", !0)])),
+				l.group.selectable ? (f(), a(e, {
+					key: 5,
+					"aria-hidden": "true",
+					class: "item__check",
+					icon: h(n)
+				}, null, 8, ["icon"])) : o("", !0),
+				l.selected ? o("", !0) : (f(), s(i, { key: 6 }, [l.row.itemSlot(l.item, "append") ? (f(), a(p(l.row.itemSlot(l.item, "append")), d(u({ key: 0 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : l.item.items ? (f(), a(e, {
+					key: 1,
+					"aria-hidden": "true",
+					class: "item__chevron",
+					icon: h(r)
+				}, null, 8, ["icon"])) : l.row.groupRowSlot(l.group, "append") ? (f(), a(p(l.row.groupRowSlot(l.group, "append")), d(u({ key: 2 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : l.row.slots["item:append"] ? (f(), a(p(l.row.slots["item:append"]), d(u({ key: 3 }, l.row.slotProps(l.group, l.item, l.index, l.selected))), null, 16)) : l.item["append:icon"] ? (f(), a(e, u({
+					key: 4,
+					class: "bb-dropdown__item-icon item__append-icon",
+					icon: l.item["append:icon"]
+				}, l.row.rowPart("itemIcon", l.item, l.selected)), null, 16, ["icon"])) : o("", !0)], 64))
+			]),
+			_: 1
+		}, 16));
+	}
+});
+//#endregion
+export { b as default };

package/dist/components/BbDropdown/normalizeGroups.d.ts

@@ -1,4 +1,4 @@
-import { Item, NormalizedGroup } from './types';
+import { InternalItem, Item, NormalizedGroup } from './types';
 /**
  * Normalizes a (possibly mixed) {@link Item} list into a flat array of
  * {@link NormalizedGroup}s, ready to render.
@@ -17,7 +17,7 @@ import { Item, NormalizedGroup } from './types';
  */
 /**
  * Whether a level renders a search field — any of its groups is `searchable`
- * (a keyless group has nowhere to store a query, so it never renders one).
+ * (a group without an `id` has nowhere to store a query, so it never renders one).
  *
  * Load-bearing for the surface's ARIA role: `role="menu"` may not own a
  * searchbox, so a level that has one is a `dialog` whose item lists carry the
@@ -25,3 +25,9 @@ import { Item, NormalizedGroup } from './types';
  */
 export declare const levelHasSearch: (groups: NormalizedGroup[]) => boolean;
 export declare const normalizeGroups: (items?: Item[]) => NormalizedGroup[];
+/**
+ * Whether a row carries its own identity: a `value` of any type, `null`
+ * included (a group's "None" row). Only an absent (or `undefined`) value
+ * makes it an action row.
+ */
+export declare const hasRowValue: (item: InternalItem) => boolean;

package/dist/components/BbDropdown/normalizeGroups.js

@@ -1,9 +1,10 @@
-import { slotKey as e } from "../../utilities/functions/slotKey.js";
-import { groupItemsAsArray as t, isGroup as n, isSelectableGroup as r, selectablePredicateOf as i } from "./types.js";
+import { hash as e } from "../../utilities/functions/hash.js";
+import { slotKey as t } from "../../utilities/functions/slotKey.js";
+import { groupItemsAsArray as n, isGroup as r, isSelectableGroup as i, selectablePredicateOf as a } from "./types.js";
 //#region src/components/BbDropdown/normalizeGroups.ts
-var a = (e) => e.some((e) => !!e.searchable && !!e.key), o = (e = []) => {
-	let a = [], o = [], c = () => {
-		o.length && (a.push({
+var o = (e) => e.some((e) => !!e.searchable && !!e.id), s = (e = []) => {
+	let t = [], o = [], s = () => {
+		o.length && (t.push({
 			selectable: !1,
 			multiple: !1,
 			selected: [],
@@ -11,60 +12,73 @@ var a = (e) => e.some((e) => !!e.searchable && !!e.key), o = (e = []) => {
 			divider: !1
 		}), o = []);
 	};
-	for (let s of e) if (n(s)) {
-		c();
-		let e = t(s.items).flat();
+	for (let c of e) if (r(c)) {
+		s();
+		let e = n(c.items).flat();
 		if (!e.length) continue;
-		let n = r(s) && s.key != null && s.key !== "", o = i(s), l = o ? e.map((e) => e.fetched || e.placeholder || e.disabled || o(e) ? e : {
+		let r = i(c) && c.id != null && c.id !== "", o = a(c), l = o ? e.map((e) => e.fetched || e.placeholder || e.disabled || o(e) ? e : {
 			...e,
 			disabled: !0
 		}) : e;
-		a.push({
-			key: s.key,
-			label: s.label,
-			hideLabel: s.hideLabel,
-			selectable: n,
-			multiple: s.multiple ?? !1,
-			clearable: s.clearable,
+		t.push({
+			id: c.id,
+			label: c.label,
+			hideLabel: c.hideLabel,
+			selectable: r,
+			multiple: c.multiple ?? !1,
+			clearable: c.clearable,
 			selected: [],
 			items: l,
-			"prepend:icon": s["prepend:icon"],
-			"append:icon": s["append:icon"],
-			variant: s.variant,
-			onClick: s.onClick,
-			searchable: s.searchable,
-			searchPlaceholder: s.searchPlaceholder,
-			filterBy: s.filterBy,
-			maxHeight: s.maxHeight,
-			meta: s.meta,
+			"prepend:icon": c["prepend:icon"],
+			"append:icon": c["append:icon"],
+			variant: c.variant,
+			onClick: c.onClick,
+			searchable: c.searchable,
+			searchPlaceholder: c.searchPlaceholder,
+			filterBy: c.filterBy,
+			maxHeight: c.maxHeight,
+			meta: c.meta,
 			divider: !1
 		});
-	} else Array.isArray(s) ? (c(), s.length && a.push({
+	} else Array.isArray(c) ? (s(), c.length && t.push({
 		selectable: !1,
 		multiple: !1,
 		selected: [],
-		items: s,
-		divider: a.length > 0
-	})) : o.push(s);
-	return c(), s(a);
-}, s = (t) => {
-	let n = (e) => e.key != null && e.key !== "";
-	if (t.every((e) => e.items.every(n))) return t;
-	let r = new Set(t.flatMap((e) => e.items.filter(n).map((e) => e.key)));
-	return t.map((t) => t.items.every(n) ? t : {
-		...t,
-		items: t.items.map((i) => {
-			if (n(i)) return i;
-			let a = e(i.text ?? "") || "row", o = a;
-			for (let e = 2; r.has(o); e++) o = `${a}-${e}`;
-			return r.add(o), {
-				...i,
-				key: o,
+		items: c,
+		divider: t.length > 0
+	})) : o.push(c);
+	return s(), l(t);
+}, c = (e) => e.value !== void 0, l = (n) => {
+	let r = /* @__PURE__ */ new Set(), i = (e) => {
+		let t = e || "row";
+		for (let n = 2; r.has(t); n++) t = `${e || "row"}-${n}`;
+		return r.add(t), t;
+	}, a = (e) => {
+		if (e.slotKey) return t(e.slotKey);
+		let n = e.value;
+		return typeof n == "string" || typeof n == "number" ? t(String(n)) : "";
+	};
+	return n.map((n) => ({
+		...n,
+		items: n.items.map((r) => {
+			if (r.rowKey != null || c(r)) {
+				let t = r.rowKey ?? e(r.value);
+				return {
+					...r,
+					rowKey: t,
+					domKey: i(a(r) || (r.placeholder ? t : ""))
+				};
+			}
+			let o = i(t(r.label ?? ""));
+			return {
+				...r,
+				rowKey: o,
+				domKey: o,
 				keyless: !0,
-				...t.selectable ? { disabled: !0 } : {}
+				...n.selectable ? { disabled: !0 } : {}
 			};
 		})
-	});
+	}));
 };
 //#endregion
-export { a as levelHasSearch, o as normalizeGroups };
+export { c as hasRowValue, o as levelHasSearch, s as normalizeGroups };