@boobooking/dashboard-ui-components 0.15.0 → 0.16.0

package/dist/index.js

@@ -1,14 +1,13 @@
 import { Fragment as e, Transition as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createTextVNode as o, createVNode as s, effectScope as c, mergeProps as l, normalizeClass as u, openBlock as d, renderList as f, renderSlot as p, resolveComponent as m, shallowReactive as h, toDisplayString as g, useId as _, vModelText as v, vShow as y, watch as ee, withCtx as b, withDirectives as x, withKeys as te, withModifiers as S } from "vue";
 import ne from "imask";
 //#region src/i18n.js
-var C = ["ru", "en"];
-function w(e) {
-	return C.includes(e);
+var re = ["ru", "en"];
+function C(e) {
+	return re.includes(e);
 }
-var re = {
+var ie = {
 	ru: {
 		cancel: "Отмена",
-		download: "Скачать",
 		openMenu: "Открыть меню",
 		previousMonth: "Предыдущий месяц",
 		nextMonth: "Следующий месяц",
@@ -52,11 +51,12 @@ var re = {
 		resultsOf: "из",
 		resultsAfter: "",
 		back: "Назад",
-		close: "Закрыть"
+		close: "Закрыть",
+		showText: "Показать текст",
+		fullText: "Полный текст"
 	},
 	en: {
 		cancel: "Cancel",
-		download: "Download",
 		openMenu: "Open menu",
 		previousMonth: "Previous month",
 		nextMonth: "Next month",
@@ -100,20 +100,22 @@ var re = {
 		resultsOf: "of",
 		resultsAfter: "results",
 		back: "Back",
-		close: "Close"
+		close: "Close",
+		showText: "Show text",
+		fullText: "Full text"
 	}
 };
 //#endregion
 //#region src/windows.js
-function T(e, t) {
+function w(e, t) {
 	if (e == null || e === "") return null;
 	let n = new URL(String(e), t);
 	return n.pathname + n.search;
 }
-function ie(e) {
+function ae(e) {
 	return e === null ? null : e.split("?")[0];
 }
-function ae() {
+function oe() {
 	return {
 		windows: [],
 		cards: /* @__PURE__ */ new Map(),
@@ -127,36 +129,36 @@ function ae() {
 		nextId: 1
 	};
 }
-function E(e, t) {
+function T(e, t) {
 	return e.windows.includes(t);
 }
-function oe(e) {
+function se(e) {
 	return e.returnAddress ?? e.fallbackAddress;
 }
-function se(e) {
+function ce(e) {
 	let t = null;
 	for (let n of e.cards.values()) t = n.window;
 	return t;
 }
-function D(e, t) {
+function le(e, t) {
 	let n = t;
-	for (; n !== null && !E(e, n);) n = n.parent;
+	for (; n !== null && !T(e, n);) n = n.parent;
 	return n;
 }
-function ce(e, t) {
+function ue(e, t) {
 	return e.transition = {
 		number: e.transition.number + 1,
 		fromAddress: e.shown,
-		fromWindow: se(e),
+		fromWindow: ce(e),
 		assigned: /* @__PURE__ */ new Map()
 	}, e.shown = t, e.transition.number;
 }
-function le(e, t, n) {
+function de(e, t, n) {
 	let r = e.transition, i = r.assigned.get(t);
-	if (i !== void 0 && E(e, i)) return i;
+	if (i !== void 0 && T(e, i)) return i;
 	let a = r.fromWindow, o = r.fromAddress;
-	a !== null && !E(e, a) && (a = D(e, a), o = null), a !== null && oe(a) === e.shown && (e.windows.splice(e.windows.indexOf(a)), a = a.parent === null ? null : D(e, a.parent), o = null);
-	for (let n = a; n !== null; n = n.parent) if (n.key === t && E(e, n)) return e.windows.splice(e.windows.indexOf(n) + 1), n;
+	a !== null && !T(e, a) && (a = le(e, a), o = null), a !== null && se(a) === e.shown && (e.windows.splice(e.windows.indexOf(a)), a = a.parent === null ? null : le(e, a.parent), o = null);
+	for (let n = a; n !== null; n = n.parent) if (n.key === t && T(e, n)) return e.windows.splice(e.windows.indexOf(n) + 1), n;
 	a === null ? e.windows = [] : e.windows.splice(e.windows.indexOf(a) + 1);
 	let s = {
 		id: e.nextId,
@@ -167,18 +169,18 @@ function le(e, t, n) {
 	};
 	return e.nextId += 1, e.windows.push(s), s;
 }
-function O(e, t, n, r) {
-	let i = le(e, n, r);
+function E(e, t, n, r) {
+	let i = de(e, n, r);
 	return i.fallbackAddress = r, e.transition.assigned.set(n, i), e.cards.delete(t), e.cards.set(t, {
 		key: n,
 		window: i,
 		processed: e.transition.number
 	}), i;
 }
-function ue(e, t, n, r) {
+function fe(e, t, n, r) {
 	let i = e.cards.get(t);
 	return i === void 0 ? {
-		window: O(e, t, n, r),
+		window: E(e, t, n, r),
 		rejected: !1,
 		key: n
 	} : i.key === n ? (i.processed = e.transition.number, {
@@ -190,37 +192,37 @@ function ue(e, t, n, r) {
 		rejected: !0,
 		key: i.key
 	} : (e.cards.delete(t), {
-		window: O(e, t, n, r),
+		window: E(e, t, n, r),
 		rejected: !1,
 		key: n
 	});
 }
-function de(e, t) {
+function pe(e, t) {
 	e.cards.delete(t);
 }
-function fe(e, t, n) {
+function me(e, t, n) {
 	let r = e.cards.get(t);
 	r !== void 0 && (r.window.fallbackAddress = n);
 }
 //#endregion
 //#region src/plugin.js
-var k = Symbol("dashboardUi"), pe = Object.freeze({
+var he = Symbol("dashboardUi"), ge = Object.freeze({
 	lang: "ru",
 	navigate: null,
 	windows: null
-}), A = { uiSettings: {
-	from: k,
-	default: () => pe
+}), _e = { uiSettings: {
+	from: he,
+	default: () => ge
 } };
-function me(e, t) {
-	let n = ae(), r = h({
+function ve(e, t) {
+	let n = oe(), r = h({
 		number: 0,
 		address: null
 	}), i = c(!0);
 	return i.run(() => {
 		ee(t, (e) => {
-			let t = T(e, window.location.origin);
-			t !== null && t !== r.address && (r.number = ce(n, t), r.address = t);
+			let t = w(e, window.location.origin);
+			t !== null && t !== r.address && (r.number = ue(n, t), r.address = t);
 		}, {
 			flush: "sync",
 			immediate: !0
@@ -230,24 +232,104 @@ function me(e, t) {
 		page: r
 	};
 }
-var he = { install(e, t) {
+var ye = { install(e, t) {
 	let n = t ?? {}, r = Object.hasOwn(n, "lang") ? n.lang : "ru";
-	if (!w(r)) throw Error(`dashboardUi: неизвестный lang «${r}», допустимы: ${C.join(", ")}`);
+	if (!C(r)) throw Error(`dashboardUi: неизвестный lang «${r}», допустимы: ${re.join(", ")}`);
 	let i = Object.hasOwn(n, "navigate"), a = i ? n.navigate : null;
 	if (i && typeof a != "function") throw Error("dashboardUi: navigate должен быть функцией (href) => …");
 	let o = Object.hasOwn(n, "currentUrl"), s = o ? n.currentUrl : null;
 	if (o && typeof s != "function") throw Error("dashboardUi: currentUrl должен быть функцией () => адрес страницы");
-	let c = s !== null && typeof window < "u" ? me(e, s) : null;
-	e.provide(k, Object.freeze({
+	let c = s !== null && typeof window < "u" ? ve(e, s) : null;
+	e.provide(he, Object.freeze({
 		lang: r,
 		navigate: a,
 		windows: c
 	}));
-} }, j = (e, t) => {
+} }, be = 4e4;
+function xe(e) {
+	if (typeof e != "string") return null;
+	let t = /filename\*\s*=\s*UTF-8''([^;]+)/i.exec(e);
+	if (t !== null) try {
+		return decodeURIComponent(t[1].trim());
+	} catch {}
+	let n = /filename\s*=\s*"([^"]+)"/i.exec(e);
+	if (n !== null) return n[1];
+	let r = /filename\s*=\s*([^;"\s]+)/i.exec(e);
+	return r === null ? null : r[1];
+}
+function Se(e) {
+	try {
+		let t = new URL(e, window.location.href).pathname.split("/").filter((e) => e !== "");
+		return t.length === 0 ? null : decodeURIComponent(t[t.length - 1]);
+	} catch {
+		return null;
+	}
+}
+async function Ce(e) {
+	let t = await fetch(e, { credentials: "same-origin" });
+	if (t.redirected) throw Error(`downloadFile: сервер перенаправил запрос ${e}`);
+	if (!t.ok) throw Error(`downloadFile: ответ ${t.status} на ${e}`);
+	let n = xe(t.headers.get("Content-Disposition")) ?? Se(e) ?? "download", r = URL.createObjectURL(await t.blob()), i = document.createElement("a");
+	i.href = r, i.download = n, i.style.display = "none", document.body.appendChild(i), i.click(), i.remove(), setTimeout(() => URL.revokeObjectURL(r), be);
+}
+//#endregion
+//#region src/colors.js
+var D = {
+	gray: {
+		pill: "bb:bg-gray-100 bb:text-gray-800",
+		pillHover: "bb:hover:text-gray-600",
+		button: "bb:bg-gray-100 bb:border-gray-300 bb:text-gray-800 bb:hover:bg-gray-200",
+		menuItem: "bb:text-gray-800 bb:focus:bg-gray-100",
+		mark: "bb:text-gray-500"
+	},
+	green: {
+		pill: "bb:bg-green-100 bb:text-green-800",
+		pillHover: "bb:hover:text-green-600",
+		button: "bb:bg-green-100 bb:border-green-300 bb:text-green-800 bb:hover:bg-green-200",
+		menuItem: "bb:text-green-800 bb:focus:bg-green-100",
+		mark: "bb:text-green-500"
+	},
+	yellow: {
+		pill: "bb:bg-yellow-100 bb:text-yellow-800",
+		pillHover: "bb:hover:text-yellow-600",
+		button: "bb:bg-yellow-100 bb:border-yellow-300 bb:text-yellow-800 bb:hover:bg-yellow-200",
+		menuItem: "bb:text-yellow-800 bb:focus:bg-yellow-100",
+		mark: "bb:text-yellow-500"
+	},
+	red: {
+		pill: "bb:bg-red-100 bb:text-red-800",
+		pillHover: "bb:hover:text-red-600",
+		button: "bb:bg-red-100 bb:border-red-300 bb:text-red-800 bb:hover:bg-red-200",
+		menuItem: "bb:text-red-800 bb:focus:bg-red-100",
+		mark: "bb:text-red-500"
+	},
+	indigo: {
+		pill: "bb:bg-indigo-100 bb:text-indigo-800",
+		pillHover: "bb:hover:text-indigo-600",
+		button: "bb:bg-indigo-100 bb:border-indigo-300 bb:text-indigo-800 bb:hover:bg-indigo-200",
+		menuItem: "bb:text-indigo-800 bb:focus:bg-indigo-100",
+		mark: "bb:text-indigo-500"
+	},
+	purple: {
+		pill: "bb:bg-purple-100 bb:text-purple-800",
+		pillHover: "bb:hover:text-purple-600",
+		button: "bb:bg-purple-100 bb:border-purple-300 bb:text-purple-800 bb:hover:bg-purple-200",
+		menuItem: "bb:text-purple-800 bb:focus:bg-purple-100",
+		mark: "bb:text-purple-500"
+	}
+}, we = Object.keys(D);
+function O(e) {
+	return we.includes(e);
+}
+function Te(e, t) {
+	return O(e) ? D[e][t] ?? "" : "";
+}
+var k = { methods: { colorClass: Te } }, A = (e, t) => {
 	let n = e.__vccOpts || e;
 	for (let [e, r] of t) n[e] = r;
 	return n;
-}, ge = {
+}, Ee = {
+	mixins: [k],
 	props: {
 		withPulse: {
 			type: Boolean,
@@ -256,24 +338,12 @@ var he = { install(e, t) {
 		color: {
 			type: String,
 			required: !0,
-			validator: (e) => ["red", "green"].indexOf(e) !== -1
-		}
-	},
-	computed: {
-		isRed() {
-			return this.color === "red";
-		},
-		isGreen() {
-			return this.color === "green";
+			validator: O
 		}
 	}
 };
-function _e(e, t, n, r, o, s) {
-	return d(), i("div", { class: u(["bb-dashboard-ui bb:flex bb:h-full bb:items-center bb:leading-none bb:text-4xl", {
-		"bb:text-red-500": s.isRed,
-		"bb:text-green-500": s.isGreen,
-		"bb:animate-pulse": n.withPulse
-	}]) }, [...t[0] ||= [a("svg", {
+function De(e, t, n, r, o, s) {
+	return d(), i("div", { class: u(["bb-dashboard-ui bb:flex bb:h-full bb:items-center bb:leading-none bb:text-4xl", [e.colorClass(n.color, "mark"), { "bb:animate-pulse": n.withPulse }]]) }, [...t[0] ||= [a("svg", {
 		class: "bb:fill-current bb:w-2 bb:h-2",
 		viewBox: "0 0 120 120"
 	}, [a("circle", {
@@ -282,8 +352,8 @@ function _e(e, t, n, r, o, s) {
 		r: "45"
 	})], -1)]], 2);
 }
-var ve = /*#__PURE__*/ j(ge, [["render", _e]]), ye = {
-	components: { Dot: ve },
+var j = /*#__PURE__*/ A(Ee, [["render", De]]), Oe = {
+	components: { Dot: j },
 	props: {
 		text: {
 			type: String,
@@ -298,14 +368,14 @@ var ve = /*#__PURE__*/ j(ge, [["render", _e]]), ye = {
 			default: !1
 		}
 	}
-}, be = { class: "bb:flex bb:h-6 bb:px-3 bb:bg-white bb:items-center bb:justify-between" }, xe = ["textContent"];
-function Se(e, t, n, r, o, c) {
+}, ke = { class: "bb:flex bb:h-6 bb:px-3 bb:bg-white bb:items-center bb:justify-between" }, Ae = ["textContent"];
+function je(e, t, n, r, o, c) {
 	let l = m("dot");
-	return d(), i("div", be, [
+	return d(), i("div", ke, [
 		a("div", {
 			class: "bb:flex bb:flex-1 bb:h-full bb:items-center bb:text-xs bb:text-gray-500 bb:whitespace-nowrap bb:truncate bb:leading-tight bb:select-none",
 			textContent: g(n.text)
-		}, null, 8, xe),
+		}, null, 8, Ae),
 		x(s(l, {
 			color: "red",
 			"with-pulse": !0,
@@ -317,13 +387,13 @@ function Se(e, t, n, r, o, c) {
 		}, null, 512), [[y, n.isRequired]])
 	]);
 }
-var M = /*#__PURE__*/ j(ye, [["render", Se]]), Ce = {}, we = {
+var M = /*#__PURE__*/ A(Oe, [["render", je]]), Me = {}, Ne = {
 	type: "button",
 	tabindex: "-1",
 	class: "bb:absolute bb:right-0 bb:top-0 bb:flex bb:items-center bb:justify-center bb:bg-transparent bb:cursor-pointer bb:text-gray-300 bb:hover:text-gray-400 bb:focus:outline-hidden"
 };
-function Te(e, t, n, r, o, s) {
-	return d(), i("button", we, [...t[0] ||= [a("svg", {
+function Pe(e, t, n, r, o, s) {
+	return d(), i("button", Ne, [...t[0] ||= [a("svg", {
 		class: "bb:w-6 bb:h-6 bb:stroke-current",
 		fill: "none",
 		viewBox: "0 0 24 24"
@@ -334,10 +404,10 @@ function Te(e, t, n, r, o, s) {
 		d: "M6 18L18 6M6 6l12 12"
 	})], -1)]]);
 }
-var N = /*#__PURE__*/ j(Ce, [["render", Te]]), Ee = 10;
-function De(e) {
+var N = /*#__PURE__*/ A(Me, [["render", Pe]]), Fe = 10;
+function Ie(e) {
 	let t = e.replace(/\D/g, "");
-	return (t.startsWith("7") || t.startsWith("8")) && t[1] === "9" && (t = t.slice(1)), t.slice(0, Ee);
+	return (t.startsWith("7") || t.startsWith("8")) && t[1] === "9" && (t = t.slice(1)), t.slice(0, Fe);
 }
 function P(e) {
 	return e === "" ? "" : `7${e}`;
@@ -348,7 +418,7 @@ function F(e) {
 }
 //#endregion
 //#region src/components/RussianMobileFilter.vue
-var Oe = 400, ke = 3, Ae = {
+var Le = 400, Re = 3, ze = {
 	components: {
 		ElementHeader: M,
 		Eraser: N
@@ -421,7 +491,7 @@ var Oe = 400, ke = 3, Ae = {
 			this.isUnmounted || (this.setLazy(!0), this.digits === "" && this.writeToMask(""), this.commit());
 		},
 		onPaste(e) {
-			this.applyUserDigits(De(e.clipboardData?.getData("text") ?? "")), this.scheduleCommit();
+			this.applyUserDigits(Ie(e.clipboardData?.getData("text") ?? "")), this.scheduleCommit();
 		},
 		clear() {
 			this.applyUserDigits(""), this.commit();
@@ -431,16 +501,16 @@ var Oe = 400, ke = 3, Ae = {
 				this.commit();
 				return;
 			}
-			this.digits.length < ke || (this.debounceTimer = setTimeout(() => this.commit(), Oe));
+			this.digits.length < Re || (this.debounceTimer = setTimeout(() => this.commit(), Le));
 		},
 		commit() {
 			clearTimeout(this.debounceTimer), this.digits !== this.lastCommitted && (this.lastCommitted = this.digits, this.$emit("changed"));
 		}
 	}
-}, je = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, Me = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, Ne = { class: "bb:relative bb:flex bb:h-full bb:w-full" }, Pe = { class: "bb:flex bb:w-full bb:h-full bb:items-center bb:justify-center" };
-function Fe(e, t, n, r, o, c) {
+}, Be = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, Ve = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, He = { class: "bb:relative bb:flex bb:h-full bb:w-full" }, Ue = { class: "bb:flex bb:w-full bb:h-full bb:items-center bb:justify-center" };
+function We(e, t, n, r, o, c) {
 	let l = m("element-header"), u = m("eraser");
-	return d(), i("div", je, [a("div", Me, [s(l, {
+	return d(), i("div", Be, [a("div", Ve, [s(l, {
 		text: n.header,
 		"is-required": n.isRequired,
 		"is-loading": n.isLoading
@@ -448,7 +518,7 @@ function Fe(e, t, n, r, o, c) {
 		"text",
 		"is-required",
 		"is-loading"
-	]), a("div", Ne, [a("label", Pe, [a("input", {
+	]), a("div", He, [a("label", Ue, [a("input", {
 		ref: "input",
 		type: "tel",
 		inputmode: "tel",
@@ -464,7 +534,7 @@ function Fe(e, t, n, r, o, c) {
 		class: "bb:pr-2 bb:h-full"
 	}, null, 8, ["onClick"]), [[y, o.digits.length > 0]])])])])]);
 }
-var Ie = /*#__PURE__*/ j(Ae, [["render", Fe]]), Le = {
+var Ge = /*#__PURE__*/ A(ze, [["render", We]]), Ke = {
 	components: {
 		ElementHeader: M,
 		Eraser: N
@@ -505,10 +575,10 @@ var Ie = /*#__PURE__*/ j(Ae, [["render", Fe]]), Le = {
 			this.$emit("update:modelValue", this.search), this.$emit("changed");
 		}
 	}
-}, Re = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, ze = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, Be = { class: "bb:relative bb:flex bb:h-full bb:w-full" }, Ve = { class: "bb:flex bb:w-full bb:h-full bb:items-center bb:justify-center" };
-function He(e, t, n, r, o, c) {
+}, qe = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, Je = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, Ye = { class: "bb:relative bb:flex bb:h-full bb:w-full" }, Xe = { class: "bb:flex bb:w-full bb:h-full bb:items-center bb:justify-center" };
+function Ze(e, t, n, r, o, c) {
 	let l = m("element-header"), u = m("eraser");
-	return d(), i("div", Re, [a("div", ze, [s(l, {
+	return d(), i("div", qe, [a("div", Je, [s(l, {
 		text: n.header,
 		"is-required": n.isRequired,
 		"is-loading": n.isLoading
@@ -516,7 +586,7 @@ function He(e, t, n, r, o, c) {
 		"text",
 		"is-required",
 		"is-loading"
-	]), a("div", Be, [a("label", Ve, [x(a("input", {
+	]), a("div", Ye, [a("label", Xe, [x(a("input", {
 		class: "bb:flex bb:w-full bb:h-full bb:px-3 bb:py-2 bb:cursor-pointer bb:truncate bb:focus:outline-hidden bb:border-none",
 		"onUpdate:modelValue": t[0] ||= (e) => o.search = e,
 		onInput: t[1] ||= (...e) => c.startSearch && c.startSearch(...e)
@@ -530,12 +600,12 @@ function He(e, t, n, r, o, c) {
 		class: "bb:pr-2 bb:h-full"
 	}, null, 8, ["onClick"]), [[y, c.inputNeedsEraser]])])])])]);
 }
-var Ue = /*#__PURE__*/ j(Le, [["render", He]]), I = 4, L = 8;
-function We(e) {
+var Qe = /*#__PURE__*/ A(Ke, [["render", Ze]]), I = 4, L = 8;
+function $e(e) {
 	return typeof e?.showPopover == "function";
 }
 function R(e) {
-	return We(e) && e.matches(":popover-open");
+	return $e(e) && e.matches(":popover-open");
 }
 function z(e, t, { maxWidth: n = null, align: r = "end", fitsBelow: i = !0, fitsRight: a = !0 } = {}) {
 	let o = e.getBoundingClientRect(), s = document.documentElement.clientWidth, c = document.documentElement.clientHeight, l = Math.max(L, o.left), u = Math.max(L, s - o.right), d = Math.max(0, s - l - L), f = Math.max(0, s - u - L), p = r === "start" && (a || d >= f), m = Math.max(0, c - o.bottom - I - L), h = Math.max(0, o.top - I - L), g = i || m >= h, _ = "";
@@ -552,7 +622,7 @@ function z(e, t, { maxWidth: n = null, align: r = "end", fitsBelow: i = !0, fits
 		maxWidth: _
 	});
 }
-function Ge(e, t, n = {}) {
+function et(e, t, n = {}) {
 	let r = t.scrollHeight <= t.clientHeight + 1, i = t.scrollWidth <= t.clientWidth + 1;
 	r && i || z(e, t, {
 		...n,
@@ -560,7 +630,7 @@ function Ge(e, t, n = {}) {
 		fitsRight: i
 	});
 }
-function Ke(e, t) {
+function tt(e, t) {
 	let n = (n) => {
 		e.contains(n.target) || t();
 	};
@@ -574,7 +644,7 @@ function Ke(e, t) {
 //#endregion
 //#region src/menuFocus.js
 var B = "a[href], button";
-function qe(e, t = () => null) {
+function nt(e, t = () => null) {
 	let n = (n) => {
 		if (n.key !== "ArrowDown" && n.key !== "ArrowUp") return;
 		let r = [...e.querySelectorAll(B)];
@@ -592,8 +662,8 @@ function qe(e, t = () => null) {
 }
 //#endregion
 //#region src/components/PopoverPanel.vue
-var Je = {
-	emits: ["update:modelValue"],
+var rt = {
+	emits: ["update:modelValue", "toggle"],
 	props: {
 		modelValue: {
 			type: Boolean,
@@ -632,6 +702,14 @@ var Je = {
 			type: String,
 			default: null
 		},
+		panelLabel: {
+			type: String,
+			default: null
+		},
+		panelFocusable: {
+			type: Boolean,
+			default: !1
+		},
 		returnFocus: {
 			type: Boolean,
 			default: !1
@@ -657,12 +735,12 @@ var Je = {
 					this.applyPanelState();
 					return;
 				}
-				this.stopListening(), this.panelIsOpen && (this.panelIsOpen = !1, this.$emit("update:modelValue", !1));
+				this.stopListening(), this.reportPanelShown(!1), this.panelIsOpen && (this.panelIsOpen = !1, this.$emit("update:modelValue", !1));
 			}
 		}
 	},
 	created() {
-		this.stopClosing = null, this.stopArrows = null, this.focusWasInside = !1;
+		this.stopClosing = null, this.stopArrows = null, this.focusWasInside = !1, this.panelShown = !1;
 	},
 	mounted() {
 		this.applyPanelState();
@@ -673,12 +751,15 @@ var Je = {
 	methods: {
 		applyPanelState() {
 			let e = this.$refs.panel;
-			We(e) && e.isConnected && (this.panelIsOpen && !R(e) && e.showPopover(), !this.panelIsOpen && R(e) && e.hidePopover());
+			$e(e) && e.isConnected && (this.panelIsOpen && !R(e) && e.showPopover(), !this.panelIsOpen && R(e) && e.hidePopover());
 		},
 		close() {
 			let e = this.$refs.panel;
 			R(e) && e.hidePopover();
 		},
+		reportPanelShown(e) {
+			this.panelShown !== e && (this.panelShown = e, this.$emit("toggle", e));
+		},
 		onClick() {
 			this.closeOnClick && this.close();
 		},
@@ -690,7 +771,7 @@ var Je = {
 				};
 				z(e, this.$refs.panel, t), requestAnimationFrame(() => {
 					let n = this.$refs.panel;
-					R(n) && Ge(e, n, t);
+					R(n) && et(e, n, t);
 				});
 				return;
 			}
@@ -700,7 +781,7 @@ var Je = {
 		onToggle() {
 			this.stopListening();
 			let e = this.$refs.panel, t = R(e);
-			t && (this.stopClosing = Ke(e, this.close), this.arrows && (this.stopArrows = qe(e, this.findSelected))), t || this.restoreFocus(e), t !== this.panelIsOpen && (this.panelIsOpen = t, this.$emit("update:modelValue", t));
+			t && (this.stopClosing = tt(e, this.close), this.arrows && (this.stopArrows = nt(e, this.findSelected))), t || this.restoreFocus(e), this.reportPanelShown(t), t !== this.panelIsOpen && (this.panelIsOpen = t, this.$emit("update:modelValue", t));
 		},
 		restoreFocus(e) {
 			let t = this.focusWasInside;
@@ -712,17 +793,19 @@ var Je = {
 			this.stopClosing !== null && (this.stopClosing(), this.stopClosing = null), this.stopArrows !== null && (this.stopArrows(), this.stopArrows = null);
 		}
 	}
-}, Ye = {
+}, it = {
 	key: 0,
 	class: "bb:relative"
-}, Xe = [
+}, at = [
 	"id",
 	"role",
 	"aria-orientation",
-	"aria-labelledby"
+	"aria-labelledby",
+	"aria-label",
+	"tabindex"
 ];
-function Ze(e, t, n, o, s, c) {
-	return n.hasContent ? (d(), i("span", Ye, [p(e.$slots, "trigger", {
+function ot(e, t, n, o, s, c) {
+	return n.hasContent ? (d(), i("span", it, [p(e.$slots, "trigger", {
 		id: o.buttonId,
 		popovertarget: o.panelId
 	}), a("div", {
@@ -732,13 +815,15 @@ function Ze(e, t, n, o, s, c) {
 		class: u(["bb:m-0 bb:inset-auto", n.panelClass]),
 		role: n.panelRole,
 		"aria-orientation": n.panelRole === "menu" ? "vertical" : null,
-		"aria-labelledby": o.buttonId,
+		"aria-labelledby": n.panelLabel === null ? o.buttonId : null,
+		"aria-label": n.panelLabel,
+		tabindex: n.panelFocusable ? 0 : null,
 		onBeforetoggle: t[0] ||= (...e) => c.onBeforeToggle && c.onBeforeToggle(...e),
 		onToggle: t[1] ||= (...e) => c.onToggle && c.onToggle(...e),
 		onClick: t[2] ||= (...e) => c.onClick && c.onClick(...e)
-	}, [p(e.$slots, "default")], 42, Xe)])) : r("", !0);
+	}, [p(e.$slots, "default")], 42, at)])) : r("", !0);
 }
-var V = /*#__PURE__*/ j(Je, [["render", Ze]]);
+var V = /*#__PURE__*/ A(rt, [["render", ot]]);
 //#endregion
 //#region src/date.js
 function H(e) {
@@ -753,21 +838,21 @@ function U(e) {
 //#endregion
 //#region src/lang.js
 var W = {
-	inject: A,
+	inject: _e,
 	props: { lang: {
 		type: String,
 		default: null,
-		validator: (e) => e === null || w(e)
+		validator: (e) => e === null || C(e)
 	} },
 	computed: {
 		resolvedLang() {
-			return w(this.lang) ? this.lang : this.uiSettings.lang;
+			return C(this.lang) ? this.lang : this.uiSettings.lang;
 		},
 		texts() {
-			return re[this.resolvedLang];
+			return ie[this.resolvedLang];
 		}
 	}
-}, Qe = {
+}, st = {
 	components: {
 		PopoverPanel: V,
 		Eraser: N
@@ -848,17 +933,17 @@ var W = {
 			return !this.withEraser || this.popupIsOpen ? !1 : this.hasValue;
 		}
 	}
-}, $e = { class: "bb-dashboard-ui bb:flex bb:flex-col" }, et = { class: "bb:relative bb:flex bb:h-full" }, tt = ["id", "popovertarget"], nt = { class: "bb:min-w-24 bb:w-full bb:h-full bb:pointer-events-none" }, rt = [
+}, ct = { class: "bb-dashboard-ui bb:flex bb:flex-col" }, lt = { class: "bb:relative bb:flex bb:h-full" }, ut = ["id", "popovertarget"], dt = { class: "bb:min-w-24 bb:w-full bb:h-full bb:pointer-events-none" }, ft = [
 	"disabled",
 	"value",
 	"placeholder"
-], it = {
+], pt = {
 	ref: "container",
 	class: "bb:flex"
 };
-function at(e, t, o, c, l, u) {
+function mt(e, t, o, c, l, u) {
 	let f = m("popover-panel"), p = m("eraser");
-	return d(), i("div", $e, [a("div", et, [s(f, {
+	return d(), i("div", ct, [a("div", lt, [s(f, {
 		class: "bb:flex bb:w-full",
 		modelValue: l.popupIsOpen,
 		"onUpdate:modelValue": t[0] ||= (e) => l.popupIsOpen = e,
@@ -871,15 +956,15 @@ function at(e, t, o, c, l, u) {
 			id: e.id,
 			popovertarget: e.popovertarget,
 			class: "bb:flex bb:w-full bb:items-center bb:cursor-pointer bb:leading-none bb:focus:outline-hidden"
-		}, [a("label", nt, [a("input", {
+		}, [a("label", dt, [a("input", {
 			disabled: l.popupIsOpen,
 			ref: "field",
 			type: "text",
 			value: l.dayValue,
 			placeholder: o.placeholderText,
 			class: "bb:w-full bb:h-full bb:py-2 bb:pr-3 bb:leading-none bb:border bb:border-transparent bb:whitespace-nowrap bb:bg-transparent bb:placeholder:text-sm bb:placeholder-gray-300 bb:cursor-pointer bb:focus:outline-hidden"
-		}, null, 8, rt)])], 8, tt)]),
-		default: b(() => [a("div", it, null, 512)]),
+		}, null, 8, ft)])], 8, ut)]),
+		default: b(() => [a("div", pt, null, 512)]),
 		_: 1
 	}, 8, ["modelValue"]), u.needsEraser ? (d(), n(p, {
 		key: 0,
@@ -889,10 +974,10 @@ function at(e, t, o, c, l, u) {
 }
 //#endregion
 //#region src/components/SelectDateInterval.vue
-var ot = {
+var ht = {
 	components: {
 		ElementHeader: M,
-		PickDay: /* @__PURE__ */ j(Qe, [["render", at]])
+		PickDay: /* @__PURE__ */ A(st, [["render", mt]])
 	},
 	mixins: [W],
 	emits: [
@@ -942,10 +1027,10 @@ var ot = {
 			this.$emit("update:dateTo", e), this.dateTo !== e && this.$emit("changed");
 		}
 	}
-}, st = { class: "bb-dashboard-ui bb:flex" }, ct = { class: "bb:flex bb:border bb:border-white" }, lt = { class: "bb:flex bb:flex-col bb:min-w-72 bb:w-72 bb:bg-white bb:h-full" }, ut = { class: "bb:flex bb:h-full bb:divide-x bb:divide-gray-200" };
-function dt(e, t, n, r, o, c) {
+}, gt = { class: "bb-dashboard-ui bb:flex" }, _t = { class: "bb:flex bb:border bb:border-white" }, vt = { class: "bb:flex bb:flex-col bb:min-w-72 bb:w-72 bb:bg-white bb:h-full" }, yt = { class: "bb:flex bb:h-full bb:divide-x bb:divide-gray-200" };
+function bt(e, t, n, r, o, c) {
 	let l = m("element-header"), u = m("pick-day");
-	return d(), i("div", st, [a("div", ct, [a("div", lt, [s(l, {
+	return d(), i("div", gt, [a("div", _t, [a("div", vt, [s(l, {
 		text: n.header,
 		"is-required": n.isRequired,
 		"is-loading": n.isLoading
@@ -953,7 +1038,7 @@ function dt(e, t, n, r, o, c) {
 		"text",
 		"is-required",
 		"is-loading"
-	]), a("div", ut, [s(u, {
+	]), a("div", yt, [s(u, {
 		modelValue: o.userDateFrom,
 		"onUpdate:modelValue": t[0] ||= (e) => o.userDateFrom = e,
 		class: "bb:flex-1 bb:min-w-36 bb:pl-3",
@@ -975,7 +1060,7 @@ function dt(e, t, n, r, o, c) {
 		"lang"
 	])])])])]);
 }
-var ft = /*#__PURE__*/ j(ot, [["render", dt]]), pt = {
+var xt = /*#__PURE__*/ A(ht, [["render", bt]]), St = {
 	components: {
 		PopoverPanel: V,
 		Eraser: N
@@ -1002,10 +1087,10 @@ var ft = /*#__PURE__*/ j(ot, [["render", dt]]), pt = {
 	computed: { needsEraser() {
 		return !this.isOpen && this.hasValue;
 	} }
-}, mt = { class: "bb:flex bb:flex-col bb:grow bb:bg-white" }, ht = { class: "bb:relative bb:flex bb:w-full bb:h-full" }, gt = ["id", "popovertarget"], _t = ["textContent"];
-function vt(e, t, o, c, l, u) {
+}, Ct = { class: "bb:flex bb:flex-col bb:grow bb:bg-white" }, wt = { class: "bb:relative bb:flex bb:w-full bb:h-full" }, Tt = ["id", "popovertarget"], Et = ["textContent"];
+function Dt(e, t, o, c, l, u) {
 	let f = m("popover-panel"), h = m("eraser");
-	return d(), i("div", mt, [a("div", ht, [s(f, {
+	return d(), i("div", Ct, [a("div", wt, [s(f, {
 		class: "bb:flex bb:w-full bb:h-full",
 		"model-value": o.isOpen,
 		align: "start",
@@ -1023,7 +1108,7 @@ function vt(e, t, o, c, l, u) {
 		}, [a("span", {
 			class: "bb:flex bb:w-full bb:h-full bb:pl-3 bb:pr-12 bb:py-2 bb:items-center bb:whitespace-nowrap bb:leading-none",
 			textContent: g(o.title)
-		}, null, 8, _t)], 8, gt)]),
+		}, null, 8, Et)], 8, Tt)]),
 		default: b(() => [p(e.$slots, "default")]),
 		_: 3
 	}, 8, ["model-value", "find-selected"]), u.needsEraser ? (d(), n(h, {
@@ -1032,7 +1117,7 @@ function vt(e, t, o, c, l, u) {
 		class: "bb:pr-2 bb:h-full"
 	})) : r("", !0)])]);
 }
-var yt = /*#__PURE__*/ j(pt, [["render", vt]]), bt = {
+var Ot = /*#__PURE__*/ A(St, [["render", Dt]]), kt = {
 	props: {
 		isChecked: {
 			type: Boolean,
@@ -1044,31 +1129,31 @@ var yt = /*#__PURE__*/ j(pt, [["render", vt]]), bt = {
 	methods: { toggle() {
 		this.$emit("clicked");
 	} }
-}, xt = { class: "bb:flex bb:w-9 bb:h-9 bb:items-center bb:justify-center" }, St = {
+}, At = { class: "bb:flex bb:w-9 bb:h-9 bb:items-center bb:justify-center" }, jt = {
 	class: "bb:w-5 bb:h-5 bb:fill-current bb:text-green-300",
 	viewBox: "0 0 20 20"
-}, Ct = ["textContent"];
-function wt(e, t, n, r, o, s) {
+}, Mt = ["textContent"];
+function Nt(e, t, n, r, o, s) {
 	return d(), i("button", {
 		type: "button",
 		onClick: t[0] ||= S((...e) => s.toggle && s.toggle(...e), ["prevent"]),
 		class: "bb:flex bb:w-full bb:bg-white bb:cursor-pointer bb:focus:outline-hidden bb:focus:bg-indigo-100"
-	}, [a("span", xt, [x((d(), i("svg", St, [...t[1] ||= [a("path", {
+	}, [a("span", At, [x((d(), i("svg", jt, [...t[1] ||= [a("path", {
 		d: "M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",
 		"clip-rule": "evenodd",
 		"fill-rule": "evenodd"
 	}, null, -1)]], 512)), [[y, n.isChecked]])]), a("span", {
 		class: "bb:flex bb:h-9 bb:justify-center bb:items-center bb:pr-6 bb:whitespace-nowrap bb:select-none",
 		textContent: g(n.name)
-	}, null, 8, Ct)]);
+	}, null, 8, Mt)]);
 }
 //#endregion
 //#region src/components/SelectSingle.vue
-var Tt = {
+var Pt = {
 	components: {
 		ElementHeader: M,
-		DropdownButton: yt,
-		ListElement: /* @__PURE__ */ j(bt, [["render", wt]])
+		DropdownButton: Ot,
+		ListElement: /* @__PURE__ */ A(kt, [["render", Nt]])
 	},
 	emits: ["update:modelValue", "changed"],
 	props: {
@@ -1128,13 +1213,13 @@ var Tt = {
 			return e === -1 ? null : this.$refs.list.querySelectorAll("button")[e];
 		}
 	}
-}, Et = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, Dt = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, Ot = {
+}, Ft = { class: "bb-dashboard-ui bb:flex bb:flex-none" }, It = { class: "bb:flex bb:w-full bb:flex-col bb:border bb:border-white bb:bg-white" }, Lt = {
 	ref: "list",
 	class: "bb:flex bb:flex-col bb:py-1 bb:divide-y bb:divide-gray-200 bb:divide-dashed"
 };
-function kt(t, o, c, l, u, p) {
+function Rt(t, o, c, l, u, p) {
 	let h = m("element-header"), g = m("list-element"), _ = m("dropdown-button");
-	return d(), i("div", Et, [a("div", Dt, [s(h, {
+	return d(), i("div", Ft, [a("div", It, [s(h, {
 		text: c.header,
 		"is-required": c.isRequired,
 		"is-loading": c.isLoading
@@ -1151,7 +1236,7 @@ function kt(t, o, c, l, u, p) {
 		"find-selected": p.activeItemElement,
 		onErased: p.clear
 	}, {
-		default: b(() => [a("div", Ot, [(d(!0), i(e, null, f(p.itemList, (e) => (d(), n(g, {
+		default: b(() => [a("div", Lt, [(d(!0), i(e, null, f(p.itemList, (e) => (d(), n(g, {
 			name: e.name,
 			key: e.id,
 			"is-checked": e.id === c.modelValue,
@@ -1170,7 +1255,8 @@ function kt(t, o, c, l, u, p) {
 		"onErased"
 	])) : r("", !0)])]);
 }
-var At = /*#__PURE__*/ j(Tt, [["render", kt]]), jt = {
+var zt = /*#__PURE__*/ A(Pt, [["render", Rt]]), Bt = {
+	mixins: [k],
 	props: {
 		text: {
 			type: String,
@@ -1179,51 +1265,17 @@ var At = /*#__PURE__*/ j(Tt, [["render", kt]]), jt = {
 		color: {
 			type: String,
 			required: !0,
-			validator: (e) => [
-				"green",
-				"indigo",
-				"gray",
-				"blue",
-				"red",
-				"yellow"
-			].indexOf(e) !== -1
-		}
-	},
-	computed: {
-		isGreen() {
-			return this.color === "green";
-		},
-		isIndigo() {
-			return this.color === "indigo";
-		},
-		isGray() {
-			return this.color === "gray";
-		},
-		isBlue() {
-			return this.color === "blue";
-		},
-		isRed() {
-			return this.color === "red";
-		},
-		isYellow() {
-			return this.color === "yellow";
+			validator: O
 		}
 	}
-}, Mt = ["textContent"];
-function Nt(e, t, n, r, a, o) {
+}, Vt = ["textContent"];
+function Ht(e, t, n, r, a, o) {
 	return d(), i("span", {
-		class: u(["bb-dashboard-ui bb:inline-flex bb:items-center bb:px-3 bb:py-2 bb:rounded-full bb:text-xs bb:font-medium bb:leading-none bb:select-none bb:whitespace-nowrap", {
-			"bb:bg-green-50 bb:text-gray-700": o.isGreen,
-			"bb:bg-indigo-100 bb:text-gray-700": o.isIndigo,
-			"bb:bg-gray-200 bb:text-gray-700": o.isGray,
-			"bb:bg-blue-100 bb:text-blue-800": o.isBlue,
-			"bb:bg-red-100 bb:text-red-800": o.isRed,
-			"bb:bg-yellow-100 bb:text-yellow-800": o.isYellow
-		}]),
+		class: u(["bb-dashboard-ui bb:inline-flex bb:items-center bb:px-3 bb:py-2 bb:rounded-full bb:text-xs bb:font-medium bb:leading-none bb:select-none bb:whitespace-nowrap", e.colorClass(n.color, "pill")]),
 		textContent: g(n.text)
-	}, null, 10, Mt);
+	}, null, 10, Vt);
 }
-var G = /*#__PURE__*/ j(jt, [["render", Nt]]), Pt = {
+var G = /*#__PURE__*/ A(Bt, [["render", Ht]]), Ut = {
 	props: {
 		messages: {
 			type: [Object, Array],
@@ -1243,12 +1295,12 @@ var G = /*#__PURE__*/ j(jt, [["render", Nt]]), Pt = {
 			return this.type === "dangerous";
 		}
 	}
-}, Ft = { class: "bb:flex" }, It = { class: "bb:shrink-0" }, Lt = { class: "bb:ml-3" }, Rt = ["textContent"];
-function zt(t, n, o, s, c, l) {
+}, Wt = { class: "bb:flex" }, Gt = { class: "bb:shrink-0" }, Kt = { class: "bb:ml-3" }, qt = ["textContent"];
+function Jt(t, n, o, s, c, l) {
 	return l.hasErrors ? (d(), i("div", {
 		key: 0,
 		class: u(["bb-dashboard-ui bb:border-l-4 bb:p-4", l.isDangerous ? "bb:bg-red-50 bb:border-red-400" : "bb:bg-yellow-50 bb:border-yellow-400"])
-	}, [a("div", Ft, [a("div", It, [(d(), i("svg", {
+	}, [a("div", Wt, [a("div", Gt, [(d(), i("svg", {
 		class: u(["bb:h-5 bb:w-5", l.isDangerous ? "bb:text-red-400" : "bb:text-yellow-400"]),
 		viewBox: "0 0 20 20",
 		fill: "currentColor"
@@ -1256,55 +1308,137 @@ function zt(t, n, o, s, c, l) {
 		"fill-rule": "evenodd",
 		d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
 		"clip-rule": "evenodd"
-	}, null, -1)]], 2))]), a("div", Lt, [(d(!0), i(e, null, f(o.messages, (e, t) => (d(), i("p", {
+	}, null, -1)]], 2))]), a("div", Kt, [(d(!0), i(e, null, f(o.messages, (e, t) => (d(), i("p", {
 		class: u(["bb:text-sm bb:leading-5", l.isDangerous ? "bb:text-red-700" : "bb:text-yellow-700"]),
 		key: t,
 		textContent: g(e)
-	}, null, 10, Rt))), 128))])])], 2)) : r("", !0);
+	}, null, 10, qt))), 128))])])], 2)) : r("", !0);
 }
-var Bt = /*#__PURE__*/ j(Pt, [["render", zt]]), Vt = {}, Ht = {
+var Yt = /*#__PURE__*/ A(Ut, [["render", Jt]]), Xt = {}, Zt = {
+	class: "bb:w-4 bb:h-4",
+	fill: "none",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"stroke-linecap": "round",
+	viewBox: "0 0 24 24",
+	xmlns: "http://www.w3.org/2000/svg",
+	"aria-hidden": "true"
+};
+function Qt(e, t, n, r, o, s) {
+	return d(), i("svg", Zt, [...t[0] ||= [
+		a("circle", {
+			cx: "12",
+			cy: "12",
+			r: "9"
+		}, null, -1),
+		a("line", {
+			class: "bb:origin-center bb:animate-[spin_12s_linear_infinite] bb:motion-reduce:animate-none",
+			x1: "12",
+			y1: "12",
+			x2: "15",
+			y2: "12"
+		}, null, -1),
+		a("line", {
+			class: "bb:origin-center bb:animate-spin bb:motion-reduce:animate-none",
+			x1: "12",
+			y1: "12",
+			x2: "12",
+			y2: "6.5"
+		}, null, -1)
+	]]);
+}
+var $t = /*#__PURE__*/ A(Xt, [["render", Qt]]), en = {}, tn = {
 	class: "bb:w-4 bb:h-4",
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	xmlns: "http://www.w3.org/2000/svg"
+	xmlns: "http://www.w3.org/2000/svg",
+	"aria-hidden": "true"
 };
-function Ut(e, t, n, r, o, s) {
-	return d(), i("svg", Ht, [...t[0] ||= [a("path", {
+function nn(e, t, n, r, o, s) {
+	return d(), i("svg", tn, [...t[0] ||= [a("path", {
 		"stroke-linecap": "round",
 		"stroke-linejoin": "round",
 		"stroke-width": "2",
 		d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"
 	}, null, -1)]]);
 }
-//#endregion
-//#region src/components/DownloadLink.vue
-var Wt = {
-	components: { "download-icon": /* @__PURE__ */ j(Vt, [["render", Ut]]) },
-	mixins: [W],
+var rn = /*#__PURE__*/ A(en, [["render", nn]]), an = {}, on = {
+	class: "bb:w-4 bb:h-4",
+	fill: "none",
+	stroke: "currentColor",
+	viewBox: "0 0 24 24",
+	xmlns: "http://www.w3.org/2000/svg",
+	"aria-hidden": "true"
+};
+function sn(e, t, n, r, o, s) {
+	return d(), i("svg", on, [...t[0] ||= [a("path", {
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"stroke-width": "2",
+		d: "M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+	}, null, -1)]]);
+}
+var cn = /*#__PURE__*/ A(an, [["render", sn]]), ln = ["download", "refresh"], un = {
+	components: {
+		"clock-icon": $t,
+		"download-icon": rn,
+		"refresh-icon": cn
+	},
+	mixins: [k],
+	emits: ["click"],
 	props: {
-		url: {
+		title: {
 			type: String,
 			required: !0
 		},
-		title: {
+		icon: {
+			type: String,
+			required: !0,
+			validator: (e) => ln.includes(e)
+		},
+		color: {
+			type: String,
+			default: "purple",
+			validator: O
+		},
+		isLoading: {
+			type: Boolean,
+			default: !1
+		},
+		loadingText: {
 			type: String,
 			default: null
 		}
 	},
 	computed: { label() {
-		return this.title ?? this.texts.download;
+		let e = this.isLoading && typeof this.loadingText == "string" && this.loadingText !== "" ? this.loadingText : this.title;
+		return typeof e == "string" ? e : "";
 	} }
-}, Gt = ["href", "title"], Kt = { class: "bb:ml-1" };
-function qt(e, t, n, r, o, c) {
-	let l = m("download-icon");
-	return d(), i("a", {
-		href: n.url,
-		title: c.label,
-		class: "bb-dashboard-ui bb:inline-flex bb:items-center bb:px-3 bb:py-1.5 bb:rounded-full bb:text-xs bb:font-medium bb:leading-none bb:select-none bb:bg-purple-100 bb:text-purple-800 bb:hover:text-purple-600"
-	}, [s(l), a("span", Kt, g(c.label), 1)], 8, Gt);
-}
-var Jt = /*#__PURE__*/ j(Wt, [["render", qt]]), Yt = { props: {
+}, dn = [
+	"title",
+	"disabled",
+	"aria-busy"
+], fn = ["textContent"];
+function pn(e, t, o, s, c, l) {
+	let f = m("clock-icon"), p = m("download-icon"), h = m("refresh-icon");
+	return d(), i("button", {
+		type: "button",
+		class: u(["bb-dashboard-ui bb:inline-flex bb:items-center bb:px-3 bb:py-1.5 bb:rounded-full bb:text-xs bb:font-medium bb:leading-none bb:select-none bb:whitespace-nowrap", [
+			e.colorClass(o.color, "pill"),
+			o.isLoading ? "bb:opacity-60 bb:cursor-not-allowed" : "bb:cursor-pointer",
+			o.isLoading ? "" : e.colorClass(o.color, "pillHover")
+		]]),
+		title: l.label,
+		disabled: o.isLoading,
+		"aria-busy": o.isLoading ? "true" : null,
+		onClick: t[0] ||= (t) => e.$emit("click")
+	}, [o.isLoading ? (d(), n(f, { key: 0 })) : o.icon === "download" ? (d(), n(p, { key: 1 })) : o.icon === "refresh" ? (d(), n(h, { key: 2 })) : r("", !0), a("span", {
+		class: "bb:ml-1",
+		textContent: g(l.label)
+	}, null, 8, fn)], 10, dn);
+}
+var mn = /*#__PURE__*/ A(un, [["render", pn]]), hn = { props: {
 	isOpen: {
 		type: Boolean,
 		default: !1
@@ -1313,9 +1447,9 @@ var Jt = /*#__PURE__*/ j(Wt, [["render", qt]]), Yt = { props: {
 		type: String,
 		required: !0
 	}
-} }, Xt = { class: "bb:flex bb:items-end bb:justify-center bb:min-h-screen bb:pt-4 bb:px-4 bb:pb-20 bb:text-center bb:sm:block bb:sm:p-0" }, Zt = { class: "bb:fixed bb:inset-0 bb:transition-opacity" }, Qt = ["aria-labelledby"];
-function $t(e, n, r, o, c, l) {
-	return d(), i("div", { class: u(["bb-dashboard-ui bb:fixed bb:inset-0 bb:overflow-y-auto bb:z-20", { "bb:pointer-events-none": !r.isOpen }]) }, [a("div", Xt, [
+} }, gn = { class: "bb:flex bb:items-end bb:justify-center bb:min-h-screen bb:pt-4 bb:px-4 bb:pb-20 bb:text-center bb:sm:block bb:sm:p-0" }, _n = { class: "bb:fixed bb:inset-0 bb:transition-opacity" }, vn = ["aria-labelledby"];
+function yn(e, n, r, o, c, l) {
+	return d(), i("div", { class: u(["bb-dashboard-ui bb:fixed bb:inset-0 bb:overflow-y-auto bb:z-20", { "bb:pointer-events-none": !r.isOpen }]) }, [a("div", gn, [
 		s(t, {
 			"enter-active-class": "bb:ease-out bb:duration-300",
 			"enter-from-class": "bb:opacity-0",
@@ -1324,7 +1458,7 @@ function $t(e, n, r, o, c, l) {
 			"leave-from-class": "bb:opacity-100",
 			"leave-to-class": "bb:opacity-0"
 		}, {
-			default: b(() => [x(a("div", Zt, [...n[0] ||= [a("div", { class: "bb:absolute bb:inset-0 bb:bg-gray-500 bb:opacity-75" }, null, -1)]], 512), [[y, r.isOpen]])]),
+			default: b(() => [x(a("div", _n, [...n[0] ||= [a("div", { class: "bb:absolute bb:inset-0 bb:bg-gray-500 bb:opacity-75" }, null, -1)]], 512), [[y, r.isOpen]])]),
 			_: 1
 		}),
 		n[1] ||= a("span", { class: "bb:hidden bb:sm:inline-block bb:sm:align-middle bb:sm:h-screen" }, null, -1),
@@ -1341,12 +1475,12 @@ function $t(e, n, r, o, c, l) {
 				role: "dialog",
 				"aria-modal": "true",
 				"aria-labelledby": r.headingId
-			}, [p(e.$slots, "default")], 8, Qt), [[y, r.isOpen]])]),
+			}, [p(e.$slots, "default")], 8, vn), [[y, r.isOpen]])]),
 			_: 3
 		})
 	])], 2);
 }
-var en = /*#__PURE__*/ j(Yt, [["render", $t]]), tn = {}, nn = {
+var bn = /*#__PURE__*/ A(hn, [["render", yn]]), xn = {}, Sn = {
 	class: "bb:h-7 bb:w-7 bb:text-red-600",
 	xmlns: "http://www.w3.org/2000/svg",
 	fill: "none",
@@ -1354,31 +1488,31 @@ var en = /*#__PURE__*/ j(Yt, [["render", $t]]), tn = {}, nn = {
 	stroke: "currentColor",
 	"aria-hidden": "true"
 };
-function rn(e, t, n, r, o, s) {
-	return d(), i("svg", nn, [...t[0] ||= [a("path", {
+function Cn(e, t, n, r, o, s) {
+	return d(), i("svg", Sn, [...t[0] ||= [a("path", {
 		"stroke-linecap": "round",
 		"stroke-linejoin": "round",
 		"stroke-width": "2",
 		d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
 	}, null, -1)]]);
 }
-var K = /*#__PURE__*/ j(tn, [["render", rn]]), an = {}, on = {
+var K = /*#__PURE__*/ A(xn, [["render", Cn]]), wn = {}, Tn = {
 	class: "bb:h-7 bb:w-7 bb:text-yellow-400",
 	xmlns: "http://www.w3.org/2000/svg",
 	viewBox: "0 0 20 20",
 	fill: "currentColor",
 	"aria-hidden": "true"
 };
-function sn(e, t, n, r, o, s) {
-	return d(), i("svg", on, [...t[0] ||= [a("path", {
+function En(e, t, n, r, o, s) {
+	return d(), i("svg", Tn, [...t[0] ||= [a("path", {
 		"fill-rule": "evenodd",
 		d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
 		"clip-rule": "evenodd"
 	}, null, -1)]]);
 }
-var q = /*#__PURE__*/ j(an, [["render", sn]]), cn = {
+var q = /*#__PURE__*/ A(wn, [["render", En]]), Dn = {
 	components: {
-		Modal: en,
+		Modal: bn,
 		Dangerous: K,
 		Warning: q
 	},
@@ -1422,20 +1556,20 @@ var q = /*#__PURE__*/ j(an, [["render", sn]]), cn = {
 			return this.type === "warning";
 		}
 	}
-}, ln = { class: "bb:flex bb:bg-white bb:rounded-t-lg bb:px-4 bb:pt-5 bb:pb-4 bb:sm:p-6 bb:sm:pb-4" }, un = { class: "bb:sm:flex bb:sm:items-start" }, dn = { class: "bb:mt-3 bb:text-center bb:sm:mt-0 bb:sm:ml-4 bb:sm:text-left" }, fn = ["id"], pn = { class: "bb:mt-2" }, mn = { class: "bb:text-sm bb:text-gray-500" }, hn = { class: "bb:bg-gray-50 bb:rounded-b-lg bb:px-4 bb:py-3 bb:sm:px-6 bb:sm:flex bb:sm:flex-row-reverse" };
-function gn(e, t, i, o, s, c) {
+}, On = { class: "bb:flex bb:bg-white bb:rounded-t-lg bb:px-4 bb:pt-5 bb:pb-4 bb:sm:p-6 bb:sm:pb-4" }, kn = { class: "bb:sm:flex bb:sm:items-start" }, An = { class: "bb:mt-3 bb:text-center bb:sm:mt-0 bb:sm:ml-4 bb:sm:text-left" }, jn = ["id"], Mn = { class: "bb:mt-2" }, Nn = { class: "bb:text-sm bb:text-gray-500" }, Pn = { class: "bb:bg-gray-50 bb:rounded-b-lg bb:px-4 bb:py-3 bb:sm:px-6 bb:sm:flex bb:sm:flex-row-reverse" };
+function Fn(e, t, i, o, s, c) {
 	let l = m("warning"), f = m("dangerous"), p = m("modal");
 	return d(), n(p, {
 		"is-open": i.isOpen,
 		"heading-id": o.headingId
 	}, {
-		default: b(() => [a("div", ln, [a("div", un, [a("div", { class: u(["bb:mx-auto bb:shrink-0 bb:flex bb:items-center bb:justify-center bb:h-12 bb:w-12 bb:rounded-full bb:sm:mx-0 bb:sm:h-10 bb:sm:w-10", {
+		default: b(() => [a("div", On, [a("div", kn, [a("div", { class: u(["bb:mx-auto bb:shrink-0 bb:flex bb:items-center bb:justify-center bb:h-12 bb:w-12 bb:rounded-full bb:sm:mx-0 bb:sm:h-10 bb:sm:w-10", {
 			"bb:bg-red-100": c.isDangerous,
 			"bb:bg-yellow-100": c.isWarning
-		}]) }, [c.isWarning ? (d(), n(l, { key: 0 })) : r("", !0), c.isDangerous ? (d(), n(f, { key: 1 })) : r("", !0)], 2), a("div", dn, [a("h3", {
+		}]) }, [c.isWarning ? (d(), n(l, { key: 0 })) : r("", !0), c.isDangerous ? (d(), n(f, { key: 1 })) : r("", !0)], 2), a("div", An, [a("h3", {
 			class: "bb:text-lg bb:leading-6 bb:font-medium bb:text-gray-900",
 			id: o.headingId
-		}, g(i.confirmationHeading), 9, fn), a("div", pn, [a("p", mn, g(i.confirmationText), 1)])])])]), a("div", hn, [a("button", {
+		}, g(i.confirmationHeading), 9, jn), a("div", Mn, [a("p", Nn, g(i.confirmationText), 1)])])])]), a("div", Pn, [a("button", {
 			type: "button",
 			class: u(["bb:w-full bb:inline-flex bb:justify-center bb:rounded-md bb:border bb:border-transparent bb:shadow-xs bb:px-4 bb:py-2 bb:text-base bb:font-medium bb:text-white bb:focus:outline-hidden bb:focus:ring-2 bb:focus:ring-offset-2 bb:sm:ml-3 bb:sm:w-auto bb:sm:text-sm", {
 				"bb:bg-red-600 bb:hover:bg-red-700 bb:focus:ring-red-500": c.isDangerous,
@@ -1450,50 +1584,38 @@ function gn(e, t, i, o, s, c) {
 		_: 1
 	}, 8, ["is-open", "heading-id"]);
 }
-var _n = /*#__PURE__*/ j(cn, [["render", gn]]), J = ["yellow", "red"];
-function Y(e) {
-	if (typeof e != "object" || !e || typeof e.label != "string" || e.label === "" || e.color !== void 0 && !J.includes(e.color) || e.danger !== void 0) return !1;
+var In = /*#__PURE__*/ A(Dn, [["render", Fn]]);
+//#endregion
+//#region src/menuItems.js
+function J(e) {
+	if (typeof e != "object" || !e || typeof e.label != "string" || e.label === "" || e.color !== void 0 && !O(e.color)) return !1;
 	let t = typeof e.href == "string" && e.href !== "" && e.onSelect === void 0, n = typeof e.onSelect == "function" && e.href === void 0;
 	return t || n;
 }
-function X(e) {
+function Y(e) {
 	return Array.isArray(e) ? e.filter((e) => typeof e == "object" && !!e) : [];
 }
-function Z(e) {
+function Ln(e) {
 	return typeof e.href == "string" && e.href !== "";
 }
-function Q(e) {
-	return e.danger === void 0 && J.includes(e.color) ? e.color : null;
-}
-function vn(e) {
-	return {
-		data() {
-			return { dangerWarned: !1 };
-		},
-		watch: { actions: {
-			immediate: !0,
-			deep: !0,
-			handler(t) {
-				process.env.NODE_ENV === "production" || this.dangerWarned || X(t).some((e) => e.danger !== void 0) && (this.dangerWarned = !0, console.warn(`[dashboard-ui-components] ${e}: поле danger убрано, красный пункт — color: 'red'`));
-			}
-		} }
-	};
+function Rn(e) {
+	return O(e.color) ? e.color : null;
 }
 //#endregion
 //#region src/navigation.js
-function yn(e) {
+function zn(e) {
 	let t = e.currentTarget?.target ?? "";
 	return !(e.defaultPrevented || e.target?.isContentEditable === !0 || e.altKey || e.ctrlKey || e.metaKey || e.shiftKey || t !== "" && t !== "_self" || e.button !== 0);
 }
-var $ = {
-	inject: A,
+var X = {
+	inject: _e,
 	methods: { followLink(e, t) {
 		let n = this.uiSettings.navigate;
-		n !== null && yn(e) && (e.preventDefault(), n(t));
+		n !== null && zn(e) && (e.preventDefault(), n(t));
 	} }
-}, bn = {
+}, Bn = {
 	components: { PopoverPanel: V },
-	mixins: [$],
+	mixins: [X, k],
 	emits: ["update:modelValue"],
 	props: {
 		actions: { default: () => [] },
@@ -1504,7 +1626,7 @@ var $ = {
 	},
 	computed: {
 		actionItems() {
-			return X(this.actions);
+			return Y(this.actions);
 		},
 		hasActions() {
 			return this.actionItems.length > 0;
@@ -1512,21 +1634,21 @@ var $ = {
 	},
 	methods: {
 		color(e) {
-			return Q(e);
+			return Rn(e);
 		},
 		isLink(e) {
-			return Z(e);
+			return Ln(e);
 		},
 		select(e) {
 			if (typeof e.onSelect == "function") return e.onSelect();
 		}
 	}
-}, xn = [
+}, Vn = [
 	"href",
 	"onClick",
 	"textContent"
-], Sn = ["onClick", "textContent"];
-function Cn(t, r, a, o, s, c) {
+], Hn = ["onClick", "textContent"];
+function Un(t, r, a, o, s, c) {
 	let l = m("popover-panel");
 	return d(), n(l, {
 		"model-value": a.modelValue,
@@ -1547,41 +1669,33 @@ function Cn(t, r, a, o, s, c) {
 			key: 0,
 			href: n.href,
 			role: "menuitem",
-			class: u(["bb:block bb:w-full bb:px-4 bb:py-2 bb:text-sm bb:text-left bb:cursor-pointer bb:focus:outline-hidden", {
-				"bb:text-gray-700 bb:focus:bg-gray-100 bb:focus:text-gray-900": c.color(n) === null,
-				"bb:text-yellow-800 bb:focus:bg-yellow-100": c.color(n) === "yellow",
-				"bb:text-red-700 bb:focus:bg-red-50": c.color(n) === "red"
-			}]),
+			class: u(["bb:block bb:w-full bb:px-4 bb:py-2 bb:text-sm bb:text-left bb:cursor-pointer bb:focus:outline-hidden", c.color(n) === null ? "bb:text-gray-700 bb:focus:bg-gray-100 bb:focus:text-gray-900" : t.colorClass(c.color(n), "menuItem")]),
 			onClick: (e) => t.followLink(e, n.href),
 			textContent: g(n.label)
-		}, null, 10, xn)) : (d(), i("button", {
+		}, null, 10, Vn)) : (d(), i("button", {
 			key: 1,
 			type: "button",
 			role: "menuitem",
-			class: u(["bb:block bb:w-full bb:px-4 bb:py-2 bb:text-sm bb:text-left bb:cursor-pointer bb:focus:outline-hidden", {
-				"bb:text-gray-700 bb:focus:bg-gray-100 bb:focus:text-gray-900": c.color(n) === null,
-				"bb:text-yellow-800 bb:focus:bg-yellow-100": c.color(n) === "yellow",
-				"bb:text-red-700 bb:focus:bg-red-50": c.color(n) === "red"
-			}]),
+			class: u(["bb:block bb:w-full bb:px-4 bb:py-2 bb:text-sm bb:text-left bb:cursor-pointer bb:focus:outline-hidden", c.color(n) === null ? "bb:text-gray-700 bb:focus:bg-gray-100 bb:focus:text-gray-900" : t.colorClass(c.color(n), "menuItem")]),
 			onClick: (e) => c.select(n),
 			textContent: g(n.label)
-		}, null, 10, Sn))], 64))), 128))]),
+		}, null, 10, Hn))], 64))), 128))]),
 		_: 3
 	}, 8, ["model-value", "has-content"]);
 }
-var wn = /*#__PURE__*/ j(bn, [["render", Cn]]), Tn = {
-	components: { PopoverMenu: wn },
+var Z = /*#__PURE__*/ A(Bn, [["render", Un]]), Wn = {
+	components: { PopoverMenu: Z },
 	mixins: [
 		W,
-		$,
-		vn("DropdownButtonWithAction")
+		X,
+		k
 	],
 	emits: ["update:modelValue"],
 	props: {
 		actions: {
 			type: Array,
 			default: () => [],
-			validator: (e) => e.every(Y)
+			validator: (e) => e.every(J)
 		},
 		modelValue: {
 			type: Boolean,
@@ -1593,7 +1707,7 @@ var wn = /*#__PURE__*/ j(bn, [["render", Cn]]), Tn = {
 	},
 	computed: {
 		items() {
-			return X(this.actions);
+			return Y(this.actions);
 		},
 		hasActions() {
 			return this.items.length > 0;
@@ -1602,7 +1716,7 @@ var wn = /*#__PURE__*/ j(bn, [["render", Cn]]), Tn = {
 			return this.items[0];
 		},
 		mainColor() {
-			return this.hasActions ? Q(this.mainAction) : null;
+			return this.hasActions ? Rn(this.mainAction) : null;
 		},
 		menuActions() {
 			return this.items.slice(1);
@@ -1622,12 +1736,9 @@ var wn = /*#__PURE__*/ j(bn, [["render", Cn]]), Tn = {
 			}
 		}
 	},
-	created() {
-		process.env.NODE_ENV !== "production" && this.$slots.actions && console.warn("[dashboard-ui-components] DropdownButtonWithAction: слот actions убран, пункты меню передаются пропом actions"), process.env.NODE_ENV !== "production" && this.$slots.button && console.warn("[dashboard-ui-components] DropdownButtonWithAction: слот button убран, основная кнопка — первый пункт actions");
-	},
 	methods: {
 		isLink(e) {
-			return Z(e);
+			return Ln(e);
 		},
 		select(e) {
 			if (typeof e.onSelect == "function") return e.onSelect();
@@ -1636,37 +1747,31 @@ var wn = /*#__PURE__*/ j(bn, [["render", Cn]]), Tn = {
 			this.menuIsOpen = e, this.$emit("update:modelValue", e);
 		}
 	}
-}, En = {
+}, Gn = {
 	key: 0,
 	class: "bb-dashboard-ui bb:relative bb:inline-flex bb:shadow-xs bb:rounded-md"
-}, Dn = ["href", "textContent"], On = ["textContent"], kn = ["id", "popovertarget"], An = { class: "bb:sr-only" };
-function jn(e, t, n, o, c, l) {
+}, Kn = ["href", "textContent"], qn = ["textContent"], Jn = ["id", "popovertarget"], Yn = { class: "bb:sr-only" };
+function Xn(e, t, n, o, c, l) {
 	let f = m("popover-menu");
-	return l.hasActions ? (d(), i("span", En, [l.isLink(l.mainAction) ? (d(), i("a", {
+	return l.hasActions ? (d(), i("span", Gn, [l.isLink(l.mainAction) ? (d(), i("a", {
 		key: 0,
 		href: l.mainAction.href,
-		class: u(["bb:relative bb:inline-flex bb:items-center bb:px-4 bb:py-2 bb:border bb:text-sm bb:font-medium bb:cursor-pointer bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", {
+		class: u(["bb:relative bb:inline-flex bb:items-center bb:px-4 bb:py-2 bb:border bb:text-sm bb:font-medium bb:cursor-pointer bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", [{
 			"bb:rounded-l-md": l.hasMenu,
-			"bb:rounded-md": !l.hasMenu,
-			"bb:bg-white bb:border-gray-300 bb:text-gray-700 bb:hover:bg-gray-50": l.mainColor === null,
-			"bb:bg-yellow-100 bb:border-yellow-300 bb:text-yellow-800 bb:hover:bg-yellow-200": l.mainColor === "yellow",
-			"bb:bg-red-50 bb:border-red-300 bb:text-red-700 bb:hover:bg-red-100": l.mainColor === "red"
-		}]),
+			"bb:rounded-md": !l.hasMenu
+		}, l.mainColor === null ? "bb:bg-white bb:border-gray-300 bb:text-gray-700 bb:hover:bg-gray-50" : e.colorClass(l.mainColor, "button")]]),
 		onClick: t[0] ||= (t) => e.followLink(t, l.mainAction.href),
 		textContent: g(l.mainAction.label)
-	}, null, 10, Dn)) : (d(), i("button", {
+	}, null, 10, Kn)) : (d(), i("button", {
 		key: 1,
 		type: "button",
-		class: u(["bb:relative bb:inline-flex bb:items-center bb:px-4 bb:py-2 bb:border bb:text-sm bb:font-medium bb:cursor-pointer bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", {
+		class: u(["bb:relative bb:inline-flex bb:items-center bb:px-4 bb:py-2 bb:border bb:text-sm bb:font-medium bb:cursor-pointer bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", [{
 			"bb:rounded-l-md": l.hasMenu,
-			"bb:rounded-md": !l.hasMenu,
-			"bb:bg-white bb:border-gray-300 bb:text-gray-700 bb:hover:bg-gray-50": l.mainColor === null,
-			"bb:bg-yellow-100 bb:border-yellow-300 bb:text-yellow-800 bb:hover:bg-yellow-200": l.mainColor === "yellow",
-			"bb:bg-red-50 bb:border-red-300 bb:text-red-700 bb:hover:bg-red-100": l.mainColor === "red"
-		}]),
+			"bb:rounded-md": !l.hasMenu
+		}, l.mainColor === null ? "bb:bg-white bb:border-gray-300 bb:text-gray-700 bb:hover:bg-gray-50" : e.colorClass(l.mainColor, "button")]]),
 		onClick: t[1] ||= (e) => l.select(l.mainAction),
 		textContent: g(l.mainAction.label)
-	}, null, 10, On)), s(f, {
+	}, null, 10, qn)), s(f, {
 		class: "bb:-ml-px bb:flex",
 		actions: l.menuActions,
 		"model-value": n.modelValue,
@@ -1676,12 +1781,8 @@ function jn(e, t, n, o, c, l) {
 			type: "button",
 			id: n.id,
 			popovertarget: n.popovertarget,
-			class: u(["bb:relative bb:inline-flex bb:items-center bb:px-2 bb:py-2 bb:rounded-r-md bb:border bb:text-sm bb:font-medium bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", {
-				"bb:bg-white bb:border-gray-300 bb:text-gray-500 bb:hover:bg-gray-50": l.mainColor === null,
-				"bb:bg-yellow-100 bb:border-yellow-300 bb:text-yellow-800 bb:hover:bg-yellow-200": l.mainColor === "yellow",
-				"bb:bg-red-50 bb:border-red-300 bb:text-red-700 bb:hover:bg-red-100": l.mainColor === "red"
-			}])
-		}, [a("span", An, g(e.texts.openMenu), 1), t[2] ||= a("svg", {
+			class: u(["bb:relative bb:inline-flex bb:items-center bb:px-2 bb:py-2 bb:rounded-r-md bb:border bb:text-sm bb:font-medium bb:focus:z-10 bb:focus:outline-hidden bb:focus:ring-1 bb:focus:ring-indigo-500 bb:focus:border-indigo-500", l.mainColor === null ? "bb:bg-white bb:border-gray-300 bb:text-gray-500 bb:hover:bg-gray-50" : e.colorClass(l.mainColor, "button")])
+		}, [a("span", Yn, g(e.texts.openMenu), 1), t[2] ||= a("svg", {
 			class: "bb:h-5 bb:w-5",
 			xmlns: "http://www.w3.org/2000/svg",
 			viewBox: "0 0 20 20",
@@ -1691,7 +1792,7 @@ function jn(e, t, n, o, c, l) {
 			"fill-rule": "evenodd",
 			d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",
 			"clip-rule": "evenodd"
-		})], -1)], 10, kn)]),
+		})], -1)], 10, Jn)]),
 		_: 1
 	}, 8, [
 		"actions",
@@ -1699,16 +1800,16 @@ function jn(e, t, n, o, c, l) {
 		"onUpdate:modelValue"
 	])])) : r("", !0);
 }
-var Mn = /*#__PURE__*/ j(Tn, [["render", jn]]), Nn = {
-	components: { PopoverMenu: wn },
-	mixins: [W, vn("HamburgerMenu")],
+var Zn = /*#__PURE__*/ A(Wn, [["render", Xn]]), Qn = {
+	components: { PopoverMenu: Z },
+	mixins: [W],
 	props: { actions: {
 		type: Array,
 		default: () => [],
-		validator: (e) => e.every(Y)
+		validator: (e) => e.every(J)
 	} }
-}, Pn = ["id", "popovertarget"], Fn = { class: "bb:sr-only" };
-function In(e, t, r, i, o, s) {
+}, $n = ["id", "popovertarget"], er = { class: "bb:sr-only" };
+function tr(e, t, r, i, o, s) {
 	let c = m("popover-menu");
 	return d(), n(c, {
 		class: "bb-dashboard-ui bb:inline-flex",
@@ -1719,7 +1820,7 @@ function In(e, t, r, i, o, s) {
 			id: n.id,
 			popovertarget: n.popovertarget,
 			class: "bb:relative bb:inline-flex bb:items-center bb:justify-center bb:p-2 bb:rounded-md bb:text-gray-400 bb:hover:text-gray-500 bb:hover:bg-gray-100 bb:focus:outline-hidden bb:focus:bg-gray-100 bb:focus:text-gray-500 bb:transition bb:duration-150 bb:ease-in-out"
-		}, [a("span", Fn, g(e.texts.openMenu), 1), t[0] ||= a("svg", {
+		}, [a("span", er, g(e.texts.openMenu), 1), t[0] ||= a("svg", {
 			class: "bb:h-6 bb:w-6",
 			fill: "none",
 			viewBox: "0 0 24 24",
@@ -1730,48 +1831,48 @@ function In(e, t, r, i, o, s) {
 			"stroke-linejoin": "round",
 			"stroke-width": "2",
 			d: "M4 6h16M4 12h16M4 18h16"
-		})], -1)], 8, Pn)]),
+		})], -1)], 8, $n)]),
 		_: 1
 	}, 8, ["actions"]);
 }
-var Ln = /*#__PURE__*/ j(Nn, [["render", In]]), Rn = {}, zn = {
+var nr = /*#__PURE__*/ A(Qn, [["render", tr]]), rr = {}, ir = {
 	xmlns: "http://www.w3.org/2000/svg",
 	viewBox: "0 0 20 20",
 	fill: "currentColor",
 	"aria-hidden": "true"
 };
-function Bn(e, t, n, r, o, s) {
-	return d(), i("svg", zn, [...t[0] ||= [a("path", {
+function ar(e, t, n, r, o, s) {
+	return d(), i("svg", ir, [...t[0] ||= [a("path", {
 		"fill-rule": "evenodd",
 		"clip-rule": "evenodd",
 		d: "M7.707 14.707a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l2.293 2.293a1 1 0 010 1.414z"
 	}, null, -1)]]);
 }
-var Vn = /*#__PURE__*/ j(Rn, [["render", Bn]]), Hn = {}, Un = {
+var or = /*#__PURE__*/ A(rr, [["render", ar]]), sr = {}, cr = {
 	xmlns: "http://www.w3.org/2000/svg",
 	viewBox: "0 0 20 20",
 	fill: "currentColor",
 	"aria-hidden": "true"
 };
-function Wn(e, t, n, r, o, s) {
-	return d(), i("svg", Un, [...t[0] ||= [a("path", {
+function lr(e, t, n, r, o, s) {
+	return d(), i("svg", cr, [...t[0] ||= [a("path", {
 		"fill-rule": "evenodd",
 		"clip-rule": "evenodd",
 		d: "M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z"
 	}, null, -1)]]);
 }
-var Gn = /*#__PURE__*/ j(Hn, [["render", Wn]]);
+var ur = /*#__PURE__*/ A(sr, [["render", lr]]);
 //#endregion
 //#region src/components/Pagination.vue
-function Kn(e) {
+function dr(e) {
 	return typeof e == "string" && e !== "" ? e : null;
 }
-var qn = {
+var fr = {
 	components: {
-		ArrowNarrowLeft: Vn,
-		ArrowNarrowRight: Gn
+		ArrowNarrowLeft: or,
+		ArrowNarrowRight: ur
 	},
-	mixins: [W, $],
+	mixins: [W, X],
 	props: {
 		links: {
 			type: Object,
@@ -1799,49 +1900,49 @@ var qn = {
 			return typeof this.from == "number" && typeof this.to == "number";
 		},
 		previousPageUrl() {
-			return Kn(this.links?.prev);
+			return dr(this.links?.prev);
 		},
 		nextPageUrl() {
-			return Kn(this.links?.next);
+			return dr(this.links?.next);
 		}
 	}
-}, Jn = {
+}, pr = {
 	key: 0,
 	class: "bb-dashboard-ui bb:px-4 bb:flex bb:items-center bb:justify-between bb:sm:px-0"
-}, Yn = { class: "bb:-mt-px bb:w-0 bb:flex-1 bb:flex" }, Xn = ["href"], Zn = {
+}, mr = { class: "bb:-mt-px bb:w-0 bb:flex-1 bb:flex" }, hr = ["href"], gr = {
 	key: 0,
 	class: "bb:hidden bb:md:-mt-px bb:md:flex bb:text-gray-400 bb:text-sm bb:leading-5"
-}, Qn = { class: "bb:font-medium bb:text-gray-900 bb:mx-1" }, $n = { class: "bb:font-medium bb:text-gray-900 bb:mx-1" }, er = { class: "bb:-mt-px bb:w-0 bb:flex-1 bb:flex bb:justify-end" }, tr = ["href"];
-function nr(e, t, n, c, l, u) {
+}, _r = { class: "bb:font-medium bb:text-gray-900 bb:mx-1" }, vr = { class: "bb:font-medium bb:text-gray-900 bb:mx-1" }, yr = { class: "bb:-mt-px bb:w-0 bb:flex-1 bb:flex bb:justify-end" }, br = ["href"];
+function xr(e, t, n, c, l, u) {
 	let f = m("arrow-narrow-left"), p = m("arrow-narrow-right");
-	return u.hasResults ? (d(), i("nav", Jn, [
-		a("div", Yn, [u.previousPageUrl === null ? r("", !0) : (d(), i("a", {
+	return u.hasResults ? (d(), i("nav", pr, [
+		a("div", mr, [u.previousPageUrl === null ? r("", !0) : (d(), i("a", {
 			key: 0,
 			href: u.previousPageUrl,
 			class: "bb:border-t-2 bb:border-transparent bb:pt-4 bb:pr-1 bb:inline-flex bb:items-center bb:text-sm bb:font-medium bb:text-gray-500 bb:hover:text-gray-700 bb:hover:border-indigo-700",
 			onClick: t[0] ||= (t) => e.followLink(t, u.previousPageUrl)
-		}, [s(f, { class: "bb:mr-3 bb:h-5 bb:w-5 bb:text-gray-400" }), o(" " + g(e.texts.previousPage), 1)], 8, Xn))]),
-		u.hasRange ? (d(), i("div", Zn, [
+		}, [s(f, { class: "bb:mr-3 bb:h-5 bb:w-5 bb:text-gray-400" }), o(" " + g(e.texts.previousPage), 1)], 8, hr))]),
+		u.hasRange ? (d(), i("div", gr, [
 			o(g(e.texts.resultsBefore) + " ", 1),
-			a("span", Qn, g(u.from) + " - " + g(u.to), 1),
+			a("span", _r, g(u.from) + " - " + g(u.to), 1),
 			o(" " + g(e.texts.resultsOf) + " ", 1),
-			a("span", $n, g(u.total), 1),
+			a("span", vr, g(u.total), 1),
 			o(" " + g(e.texts.resultsAfter), 1)
 		])) : r("", !0),
-		a("div", er, [u.nextPageUrl === null ? r("", !0) : (d(), i("a", {
+		a("div", yr, [u.nextPageUrl === null ? r("", !0) : (d(), i("a", {
 			key: 0,
 			href: u.nextPageUrl,
 			class: "bb:border-t-2 bb:border-transparent bb:pt-4 bb:pl-1 bb:inline-flex bb:items-center bb:text-sm bb:font-medium bb:text-gray-500 bb:hover:text-gray-700 bb:hover:border-indigo-700",
 			onClick: t[1] ||= (t) => e.followLink(t, u.nextPageUrl)
-		}, [o(g(e.texts.nextPage) + " ", 1), s(p, { class: "bb:ml-3 bb:h-5 bb:w-5 bb:text-gray-400" })], 8, tr))])
+		}, [o(g(e.texts.nextPage) + " ", 1), s(p, { class: "bb:ml-3 bb:h-5 bb:w-5 bb:text-gray-400" })], 8, br))])
 	])) : r("", !0);
 }
-var rr = /*#__PURE__*/ j(qn, [["render", nr]]), ir = [
+var Sr = /*#__PURE__*/ A(fr, [["render", xr]]), Cr = [
 	"left",
 	"center",
 	"right"
-], ar = ["red", "green"];
-function or(e) {
+];
+function wr(e) {
 	if (typeof e != "object" || !e || typeof e.key != "string" || e.key === "") return null;
 	let t = e.key;
 	return {
@@ -1850,21 +1951,21 @@ function or(e) {
 		value: typeof e.value == "function" ? e.value : (e) => e?.[t],
 		secondary: typeof e.secondary == "function" ? e.secondary : null,
 		muted: e.muted === !0,
-		align: ir.includes(e.align) ? e.align : "left",
+		align: Cr.includes(e.align) ? e.align : "left",
 		wrap: e.wrap === !0,
 		narrow: e.narrow === !0,
 		visible: e.visible !== !1
 	};
 }
-function sr(e) {
+function Tr(e) {
 	return typeof e == "string" && e !== "" ? e : null;
 }
-var cr = {
+var Er = {
 	components: {
-		Pagination: rr,
-		SmallBadge: G
+		Pagination: Sr,
+		InfoPill: G
 	},
-	mixins: [W],
+	mixins: [W, k],
 	props: {
 		rows: {
 			type: Array,
@@ -1899,7 +2000,7 @@ var cr = {
 			default: "page",
 			validator: (e) => ["page", "card"].indexOf(e) !== -1
 		},
-		rowColor: {
+		rowStripe: {
 			type: Function,
 			default: null
 		}
@@ -1909,7 +2010,10 @@ var cr = {
 			return Array.isArray(this.rows) ? this.rows : [];
 		},
 		visibleColumns() {
-			return (Array.isArray(this.columns) ? this.columns : []).map(or).filter((e) => e !== null && e.visible);
+			return (Array.isArray(this.columns) ? this.columns : []).map(wr).filter((e) => e !== null && e.visible);
+		},
+		rowStripes() {
+			return this.normalizedRows.map((e) => this.stripeOf(e));
 		},
 		isCard() {
 			return this.variant === "card";
@@ -1925,10 +2029,10 @@ var cr = {
 		},
 		badgeText() {
 			if (this.hasRecords) {
-				let e = sr(this.foundText);
+				let e = Tr(this.foundText);
 				return e === null ? null : `${e}: ${this.recordCount}`;
 			}
-			return sr(this.emptyText);
+			return Tr(this.emptyText);
 		}
 	},
 	methods: {
@@ -1945,19 +2049,19 @@ var cr = {
 			else typeof this.rowKey == "string" && (n = e?.[this.rowKey]);
 			return n ?? `row-${t}`;
 		},
-		colorOf(e) {
-			if (typeof this.rowColor != "function") return null;
-			let t = this.rowColor(e);
-			return ar.includes(t) ? t : null;
+		stripeOf(e) {
+			if (typeof this.rowStripe != "function") return null;
+			let t = this.rowStripe(e);
+			return O(t) ? t : null;
 		},
 		textOf(e, t) {
 			let n = e(t);
 			return n == null ? "" : String(n);
 		}
 	}
-}, lr = { class: "bb:min-w-full bb:divide-y bb:divide-gray-200 bb:border-collapse" }, ur = { class: "bb:bg-gray-50" }, dr = ["textContent"], fr = { class: "bb:divide-y bb:divide-gray-200" }, pr = ["textContent"], mr = ["textContent"];
-function hr(t, o, s, c, l, h) {
-	let _ = m("small-badge"), v = m("pagination");
+}, Dr = { class: "bb:min-w-full bb:divide-y bb:divide-gray-200 bb:border-collapse" }, Or = { class: "bb:bg-gray-50" }, kr = ["textContent"], Ar = { class: "bb:divide-y bb:divide-gray-200" }, jr = ["textContent"], Mr = ["textContent"];
+function Nr(t, o, s, c, l, h) {
+	let _ = m("info-pill"), v = m("pagination");
 	return d(), i("div", null, [
 		h.hasBadgeRow() ? (d(), i("div", {
 			key: 0,
@@ -1970,7 +2074,7 @@ function hr(t, o, s, c, l, h) {
 		h.normalizedRows.length > 0 ? (d(), i("div", {
 			key: 1,
 			class: u(h.isCard && h.hasBadgeRow() ? "bb:mt-4" : "")
-		}, [a("div", { class: u(["bb:overflow-x-auto", h.isCard ? "bb:border-t bb:border-gray-200" : "bb:shadow-sm bb:border-b bb:border-gray-200 bb:sm:rounded-lg"]) }, [a("table", lr, [a("thead", null, [a("tr", ur, [(d(!0), i(e, null, f(h.visibleColumns, (e) => (d(), i("th", {
+		}, [a("div", { class: u(["bb:overflow-x-auto", h.isCard ? "bb:border-t bb:border-gray-200" : "bb:shadow-sm bb:border-b bb:border-gray-200 bb:sm:rounded-lg"]) }, [a("table", Dr, [a("thead", null, [a("tr", Or, [(d(!0), i(e, null, f(h.visibleColumns, (e) => (d(), i("th", {
 			key: e.key,
 			scope: "col",
 			class: u(["bb:px-6 bb:py-3 bb:text-xs bb:leading-4 bb:font-medium bb:text-gray-500 bb:uppercase bb:tracking-wider bb:whitespace-nowrap", [{
@@ -1979,14 +2083,10 @@ function hr(t, o, s, c, l, h) {
 				"bb:text-right": e.align === "right"
 			}, { "bb:w-px": e.narrow }]]),
 			textContent: g(e.label)
-		}, null, 10, dr))), 128))])]), a("tbody", fr, [(d(!0), i(e, null, f(h.normalizedRows, (n, o) => (d(), i("tr", {
+		}, null, 10, kr))), 128))])]), a("tbody", Ar, [(d(!0), i(e, null, f(h.normalizedRows, (n, o) => (d(), i("tr", {
 			key: h.keyOf(n, o),
-			class: u({
-				"bb:bg-white bb:even:bg-gray-50": h.colorOf(n) === null,
-				"bb:bg-red-50": h.colorOf(n) === "red",
-				"bb:bg-green-50": h.colorOf(n) === "green"
-			})
-		}, [(d(!0), i(e, null, f(h.visibleColumns, (e) => (d(), i("td", {
+			class: "bb:bg-white bb:even:bg-gray-50"
+		}, [(d(!0), i(e, null, f(h.visibleColumns, (e, s) => (d(), i("td", {
 			key: e.key,
 			class: u(["bb:px-6 bb:py-4 bb:align-top bb:relative bb:text-sm bb:leading-5", [
 				{ "bb:whitespace-nowrap": !e.wrap },
@@ -1997,17 +2097,21 @@ function hr(t, o, s, c, l, h) {
 				},
 				{ "bb:w-px": e.narrow }
 			]])
-		}, [p(t.$slots, `cell-${e.key}`, {
+		}, [s === 0 && h.rowStripes[o] !== null ? (d(), i("span", {
+			key: 0,
+			class: u(["bb:absolute bb:left-0 bb:inset-y-0 bb:w-1 bb:bg-current", t.colorClass(h.rowStripes[o], "mark")]),
+			"aria-hidden": "true"
+		}, null, 2)) : r("", !0), p(t.$slots, `cell-${e.key}`, {
 			row: n,
 			index: o
 		}, () => [a("div", {
 			class: u(["bb:font-medium", e.muted ? "bb:text-gray-400" : "bb:text-gray-900"]),
 			textContent: g(h.textOf(e.value, n))
-		}, null, 10, pr), e.secondary !== null && h.textOf(e.secondary, n) !== "" ? (d(), i("div", {
+		}, null, 10, jr), e.secondary !== null && h.textOf(e.secondary, n) !== "" ? (d(), i("div", {
 			key: 0,
 			class: "bb:text-gray-400",
 			textContent: g(h.textOf(e.secondary, n))
-		}, null, 8, mr)) : r("", !0)])], 2))), 128))], 2))), 128))])])], 2)], 2)) : r("", !0),
+		}, null, 8, Mr)) : r("", !0)])], 2))), 128))]))), 128))])])], 2)], 2)) : r("", !0),
 		h.hasMeta ? (d(), n(v, {
 			key: 2,
 			meta: s.meta,
@@ -2022,8 +2126,8 @@ function hr(t, o, s, c, l, h) {
 		])) : r("", !0)
 	]);
 }
-var gr = /*#__PURE__*/ j(cr, [["render", hr]]), _r = {
-	mixins: [$],
+var Pr = /*#__PURE__*/ A(Er, [["render", Nr]]), Fr = {
+	mixins: [X],
 	props: {
 		url: {
 			type: String,
@@ -2038,17 +2142,17 @@ var gr = /*#__PURE__*/ j(cr, [["render", hr]]), _r = {
 			default: !1
 		}
 	}
-}, vr = ["href", "textContent"];
-function yr(e, t, n, r, a, o) {
+}, Ir = ["href", "textContent"];
+function Lr(e, t, n, r, a, o) {
 	return d(), i("a", {
 		href: n.url,
 		class: u([n.isActive ? "bb:border-indigo-400 bb:text-gray-600 bb:focus:border-indigo-700" : "bb:border-transparent bb:text-gray-500 bb:hover:text-gray-600 bb:hover:border-gray-300 bb:focus:text-gray-700 bb:focus:border-gray-300", "bb-dashboard-ui bb:inline-flex bb:items-center bb:px-1 bb:pt-1 bb:border-b-2 bb:text-sm bb:font-medium bb:leading-5 bb:focus:outline-hidden bb:transition bb:duration-150 bb:ease-in-out"]),
 		onClick: t[0] ||= (t) => e.followLink(t, n.url),
 		textContent: g(n.name)
-	}, null, 10, vr);
+	}, null, 10, Ir);
 }
-var br = /*#__PURE__*/ j(_r, [["render", yr]]), xr = { emits: ["clicked"] };
-function Sr(e, t, n, r, o, s) {
+var Rr = /*#__PURE__*/ A(Fr, [["render", Lr]]), zr = { emits: ["clicked"] };
+function Br(e, t, n, r, o, s) {
 	return d(), i("button", {
 		type: "button",
 		tabindex: "-1",
@@ -2065,19 +2169,19 @@ function Sr(e, t, n, r, o, s) {
 		d: "M6 18L18 6M6 6l12 12"
 	})], -1)]]);
 }
-var Cr = /*#__PURE__*/ j(xr, [["render", Sr]]), wr = [
+var Vr = /*#__PURE__*/ A(zr, [["render", Br]]), Hr = [
 	"xl",
 	"4xl",
 	"7xl"
-], Tr = {
-	components: { Closer: Cr },
+], Ur = {
+	components: { Closer: Vr },
 	mixins: [W],
 	inheritAttrs: !1,
 	props: {
 		width: {
 			type: String,
 			default: "xl",
-			validator: (e) => wr.includes(e)
+			validator: (e) => Hr.includes(e)
 		},
 		fallbackUrl: {
 			type: String,
@@ -2093,13 +2197,13 @@ var Cr = /*#__PURE__*/ j(xr, [["render", Sr]]), wr = [
 	},
 	computed: {
 		resolvedWidth() {
-			return wr.includes(this.width) ? this.width : "xl";
+			return Hr.includes(this.width) ? this.width : "xl";
 		},
 		windows() {
 			return this.uiSettings.windows;
 		},
 		resolvedKey() {
-			return this.windowKey !== null && this.windowKey !== "" ? this.windowKey : this.windows === null ? null : ie(this.windows.page.address);
+			return this.windowKey !== null && this.windowKey !== "" ? this.windowKey : this.windows === null ? null : ae(this.windows.page.address);
 		},
 		target() {
 			return this.returnAddress === null ? this.fallbackUrl === null || this.fallbackUrl === "" ? null : this.fallbackUrl : this.returnAddress;
@@ -2109,23 +2213,23 @@ var Cr = /*#__PURE__*/ j(xr, [["render", Sr]]), wr = [
 		}
 	},
 	watch: { fallbackUrl() {
-		this.windows !== null && fe(this.windows.state, this, this.fallbackAddress());
+		this.windows !== null && me(this.windows.state, this, this.fallbackAddress());
 	} },
 	mounted() {
-		this.windows !== null && (this.returnAddress = O(this.windows.state, this, this.resolvedKey, this.fallbackAddress()).returnAddress, this.$watch(() => [this.windows.page.number, this.resolvedKey], () => this.syncWindow(), { flush: "post" }));
+		this.windows !== null && (this.returnAddress = E(this.windows.state, this, this.resolvedKey, this.fallbackAddress()).returnAddress, this.$watch(() => [this.windows.page.number, this.resolvedKey], () => this.syncWindow(), { flush: "post" }));
 	},
 	beforeUnmount() {
-		this.windows !== null && de(this.windows.state, this);
+		this.windows !== null && pe(this.windows.state, this);
 	},
 	methods: {
 		fallbackAddress() {
-			return T(this.fallbackUrl, window.location.origin);
+			return w(this.fallbackUrl, window.location.origin);
 		},
 		forwardedAttrs() {
 			return Object.fromEntries(Object.entries(this.$attrs).filter(([e]) => e.startsWith("data-") || e.startsWith("aria-")));
 		},
 		syncWindow() {
-			let e = ue(this.windows.state, this, this.resolvedKey, this.fallbackAddress());
+			let e = fe(this.windows.state, this, this.resolvedKey, this.fallbackAddress());
 			e.rejected && console.warn(`PageCard: ключ окна сменился на «${this.resolvedKey}» без смены страницы — карточка остаётся в окне «${e.key}»`), this.returnAddress = e.window.returnAddress;
 		},
 		close() {
@@ -2140,7 +2244,7 @@ var Cr = /*#__PURE__*/ j(xr, [["render", Sr]]), wr = [
 		}
 	}
 };
-function Er(e, t, a, o, s, c) {
+function Wr(e, t, a, o, s, c) {
 	let f = m("closer");
 	return d(), i("div", l({
 		class: ["bb:box-border bb:relative bb:my-6 bb:mx-auto bb:bg-white bb:shadow-xl bb:sm:rounded-lg", [
@@ -2173,7 +2277,7 @@ function Er(e, t, a, o, s, c) {
 		"onClicked"
 	])) : r("", !0)], 16);
 }
-var Dr = /*#__PURE__*/ j(Tr, [["render", Er]]), Or = {}, kr = {
+var Gr = /*#__PURE__*/ A(Ur, [["render", Wr]]), Kr = {}, qr = {
 	class: "bb:h-7 bb:w-7 bb:text-green-600",
 	xmlns: "http://www.w3.org/2000/svg",
 	fill: "none",
@@ -2182,22 +2286,22 @@ var Dr = /*#__PURE__*/ j(Tr, [["render", Er]]), Or = {}, kr = {
 	stroke: "currentColor",
 	"aria-hidden": "true"
 };
-function Ar(e, t, n, r, o, s) {
-	return d(), i("svg", kr, [...t[0] ||= [a("path", {
+function Jr(e, t, n, r, o, s) {
+	return d(), i("svg", qr, [...t[0] ||= [a("path", {
 		"stroke-linecap": "round",
 		"stroke-linejoin": "round",
 		d: "M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
 	}, null, -1)]]);
 }
-var jr = /*#__PURE__*/ j(Or, [["render", Ar]]), Mr = {}, Nr = {
+var Yr = /*#__PURE__*/ A(Kr, [["render", Jr]]), Xr = {}, Zr = {
 	class: "bb:h-5 bb:w-5",
 	xmlns: "http://www.w3.org/2000/svg",
 	viewBox: "0 0 20 20",
 	fill: "currentColor",
 	"aria-hidden": "true"
 };
-function Pr(e, t, n, r, o, s) {
-	return d(), i("svg", Nr, [...t[0] ||= [a("path", {
+function Qr(e, t, n, r, o, s) {
+	return d(), i("svg", Zr, [...t[0] ||= [a("path", {
 		"fill-rule": "evenodd",
 		d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
 		"clip-rule": "evenodd"
@@ -2205,10 +2309,10 @@ function Pr(e, t, n, r, o, s) {
 }
 //#endregion
 //#region src/components/NotificationMessage.vue
-var Fr = {
+var $r = {
 	components: {
-		Check: jr,
-		Close: /* @__PURE__ */ j(Mr, [["render", Pr]]),
+		Check: Yr,
+		Close: /* @__PURE__ */ A(Xr, [["render", Qr]]),
 		Dangerous: K,
 		Warning: q
 	},
@@ -2250,8 +2354,8 @@ var Fr = {
 			return this.type === "confirmation";
 		}
 	}
-}, Ir = ["role"], Lr = { class: "bb:p-4" }, Rr = { class: "bb:flex bb:items-start" }, zr = { class: "bb:shrink-0" }, Br = { class: "bb:ml-3 bb:w-0 bb:flex-1 bb:pt-0.5" }, Vr = { class: "bb:text-sm bb:font-medium bb:text-gray-900" }, Hr = { class: "bb:mt-1 bb:text-sm bb:text-gray-500" }, Ur = { class: "bb:ml-4 bb:shrink-0 bb:flex" }, Wr = { class: "bb:sr-only" };
-function Gr(e, t, o, c, l, f) {
+}, ei = ["role"], ti = { class: "bb:p-4" }, ni = { class: "bb:flex bb:items-start" }, ri = { class: "bb:shrink-0" }, ii = { class: "bb:ml-3 bb:w-0 bb:flex-1 bb:pt-0.5" }, ai = { class: "bb:text-sm bb:font-medium bb:text-gray-900" }, oi = { class: "bb:mt-1 bb:text-sm bb:text-gray-500" }, si = { class: "bb:ml-4 bb:shrink-0 bb:flex" }, ci = { class: "bb:sr-only" };
+function li(e, t, o, c, l, f) {
 	let p = m("warning"), h = m("dangerous"), _ = m("check"), v = m("close");
 	return d(), i("div", {
 		class: "bb-dashboard-ui bb:fixed bb:inset-0 bb:flex bb:items-end bb:justify-center bb:px-4 bb:py-6 bb:pointer-events-none bb:sm:p-6 bb:sm:items-start bb:sm:justify-end",
@@ -2263,14 +2367,14 @@ function Gr(e, t, o, c, l, f) {
 			"bb:bg-yellow-50": f.isWarning,
 			"bb:bg-gray-50": f.isConfirmation
 		}])
-	}, [a("div", Lr, [a("div", Rr, [
-		a("div", zr, [
+	}, [a("div", ti, [a("div", ni, [
+		a("div", ri, [
 			f.isWarning ? (d(), n(p, { key: 0 })) : r("", !0),
 			f.isDangerous ? (d(), n(h, { key: 1 })) : r("", !0),
 			f.isConfirmation ? (d(), n(_, { key: 2 })) : r("", !0)
 		]),
-		a("div", Br, [a("p", Vr, g(o.notificationHeading), 1), a("p", Hr, g(f.text), 1)]),
-		a("div", Ur, [a("button", {
+		a("div", ii, [a("p", ai, g(o.notificationHeading), 1), a("p", oi, g(f.text), 1)]),
+		a("div", si, [a("button", {
 			type: "button",
 			class: u(["bb:rounded-md bb:inline-flex bb:text-gray-400 bb:hover:text-gray-500 bb:focus:outline-hidden bb:focus:ring-2 bb:focus:ring-offset-2 bb:focus:ring-indigo-500", {
 				"bb:bg-red-50": f.isDangerous,
@@ -2278,9 +2382,108 @@ function Gr(e, t, o, c, l, f) {
 				"bb:bg-gray-50": f.isConfirmation
 			}]),
 			onClick: t[0] ||= S((t) => e.$emit("update:modelValue", ""), ["prevent"])
-		}, [a("span", Wr, g(e.texts.close), 1), s(v)], 2)])
-	])])], 2)) : r("", !0)], 8, Ir);
+		}, [a("span", ci, g(e.texts.close), 1), s(v)], 2)])
+	])])], 2)) : r("", !0)], 8, ei);
+}
+var ui = /*#__PURE__*/ A($r, [["render", li]]), di = {}, fi = {
+	class: "bb:h-5 bb:w-5",
+	xmlns: "http://www.w3.org/2000/svg",
+	fill: "none",
+	viewBox: "0 0 24 24",
+	stroke: "currentColor",
+	"stroke-width": "2",
+	"aria-hidden": "true"
+};
+function pi(e, t, n, r, o, s) {
+	return d(), i("svg", fi, [...t[0] ||= [a("path", {
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		d: "M15 12a3 3 0 11-6 0 3 3 0 016 0z"
+	}, null, -1), a("path", {
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		d: "M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"
+	}, null, -1)]]);
+}
+var mi = /*#__PURE__*/ A(di, [["render", pi]]), Q = 0, $ = null, hi = {
+	components: {
+		PopoverPanel: V,
+		Eye: mi
+	},
+	mixins: [W],
+	emits: ["update:modelValue"],
+	props: {
+		text: {
+			type: String,
+			required: !0
+		},
+		modelValue: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	data() {
+		return { holdsPageSelectionLock: !1 };
+	},
+	computed: {
+		normalizedText() {
+			return typeof this.text == "string" ? this.text : "";
+		},
+		isEmpty() {
+			return this.normalizedText === "";
+		}
+	},
+	beforeUnmount() {
+		this.unlockPageSelection();
+	},
+	methods: {
+		onPanelToggle(e) {
+			e ? this.lockPageSelection() : this.unlockPageSelection();
+		},
+		lockPageSelection() {
+			if (!this.holdsPageSelectionLock && (this.holdsPageSelectionLock = !0, Q += 1, Q === 1)) {
+				let e = document.documentElement.style;
+				$ = {
+					userSelect: e.userSelect,
+					webkitUserSelect: e.webkitUserSelect
+				}, e.userSelect = "none", e.webkitUserSelect = "none";
+			}
+		},
+		unlockPageSelection() {
+			this.holdsPageSelectionLock && (this.holdsPageSelectionLock = !1, --Q, Q === 0 && (Object.assign(document.documentElement.style, $), $ = null));
+		}
+	}
+}, gi = ["id", "popovertarget"], _i = { class: "bb:sr-only" };
+function vi(e, t, r, i, c, l) {
+	let u = m("eye"), f = m("popover-panel");
+	return d(), n(f, {
+		class: "bb-dashboard-ui bb:inline-flex",
+		"has-content": !l.isEmpty,
+		"model-value": r.modelValue,
+		align: "end",
+		"max-width": 384,
+		"panel-role": "region",
+		"panel-label": e.texts.fullText,
+		"panel-focusable": "",
+		"panel-class": "bb:p-3 bb:rounded-md bb:border bb:border-gray-200 bb:bg-white bb:shadow-lg bb:text-left bb:text-sm bb:leading-5 bb:text-gray-700 bb:whitespace-normal bb:break-words bb:overscroll-contain bb:select-text bb:focus:outline-hidden bb:focus-visible:ring-2 bb:focus-visible:ring-indigo-500",
+		"onUpdate:modelValue": t[0] ||= (t) => e.$emit("update:modelValue", t),
+		onToggle: l.onPanelToggle
+	}, {
+		trigger: b((t) => [a("button", {
+			type: "button",
+			id: t.id,
+			popovertarget: t.popovertarget,
+			class: "bb:relative bb:text-gray-400 bb:hover:text-gray-600 bb:rounded-md bb:focus:outline-hidden bb:focus-visible:ring-2 bb:focus-visible:ring-indigo-500"
+		}, [a("span", _i, g(e.texts.showText), 1), s(u)], 8, gi)]),
+		default: b(() => [o(g(l.normalizedText), 1)]),
+		_: 1
+	}, 8, [
+		"has-content",
+		"model-value",
+		"panel-label",
+		"onToggle"
+	]);
 }
-var Kr = /*#__PURE__*/ j(Fr, [["render", Gr]]);
+var yi = /*#__PURE__*/ A(hi, [["render", vi]]);
 //#endregion
-export { _n as ConfirmationModal, gr as DataTable, ve as Dot, Jt as DownloadLink, Mn as DropdownButtonWithAction, Bt as ErrorMessages, Ln as HamburgerMenu, br as NavigationMenuElement, Kr as NotificationMessage, Dr as PageCard, Ie as RussianMobileFilter, Ue as Search, ft as SelectDateInterval, At as SelectSingle, G as SmallBadge, he as dashboardUi };
+export { mn as ActionPill, In as ConfirmationModal, Pr as DataTable, j as Dot, Zn as DropdownButtonWithAction, Yt as ErrorMessages, nr as HamburgerMenu, G as InfoPill, Rr as NavigationMenuElement, ui as NotificationMessage, Gr as PageCard, Ge as RussianMobileFilter, Qe as Search, xt as SelectDateInterval, zt as SelectSingle, yi as TextPopover, ye as dashboardUi, Ce as downloadFile };