@ac-design/design-system 2.3.0 → 2.4.1

package/dist/lib/components/AcKeyValueInput.vue_vue_type_script_setup_true_lang.js

@@ -1,39 +1,39 @@
 import e from "./AcButton.js";
 import t from "./AcInput.js";
 import n from "./AcSelect.js";
-import { Fragment as r, TransitionGroup as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeModels as f, nextTick as p, normalizeClass as m, openBlock as h, ref as g, renderList as ee, renderSlot as _, toDisplayString as v, unref as y, useId as b, useModel as te, watch as ne, withCtx as x, withKeys as S } from "vue";
-import { Plus as C, Trash as w } from "@lucide/vue";
+import { Fragment as r, TransitionGroup as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeModels as f, nextTick as p, normalizeClass as m, openBlock as h, ref as g, renderList as ee, renderSlot as te, toDisplayString as _, unref as v, useId as ne, useModel as re, watch as y, withCtx as b, withKeys as x } from "vue";
+import { Plus as ie, Trash as ae } from "@lucide/vue";
 //#region src/lib/components/AcKeyValueInput.vue?vue&type=script&setup=true&lang.ts
-var T = [
+var oe = [
 	"aria-labelledby",
 	"aria-label",
 	"aria-describedby"
-], re = {
+], se = {
 	key: 0,
 	class: "font-normal text-muted"
-}, ie = {
+}, ce = {
 	key: 1,
 	class: "text-danger",
 	"aria-hidden": "true"
-}, ae = {
+}, le = {
 	key: 2,
 	class: "mb-1.5 hidden grid-cols-[minmax(0,1fr)_auto] gap-x-4 sm:grid",
 	"aria-hidden": "true"
-}, oe = { key: 0 }, se = [
+}, ue = { key: 0 }, de = [
 	"data-row",
 	"onFocusin",
 	"onFocusout"
-], ce = [
+], fe = [
 	"aria-label",
 	"title",
 	"onClick"
-], E = {
+], pe = {
 	key: 4,
 	class: "text-base text-muted"
-}, D = {
+}, me = {
 	class: "sr-only",
 	"aria-live": "polite"
-}, O = /*@__PURE__*/ d({
+}, S = /*@__PURE__*/ d({
 	__name: "AcKeyValueInput",
 	props: /*@__PURE__*/ f({
 		label: { default: "" },
@@ -77,117 +77,142 @@ var T = [
 		readonly: {
 			type: Boolean,
 			default: !1
+		},
+		plain: {
+			type: Boolean,
+			default: !1
 		}
 	}, {
 		modelValue: { default: () => [] },
 		modelModifiers: {}
 	}),
 	emits: /*@__PURE__*/ f(["add", "remove"], ["update:modelValue"]),
-	setup(d, { expose: f, emit: O }) {
-		let k = d, A = te(d, "modelValue"), j = O, M = b(), N = `${M}-label`, P = `${M}-hint`, F = `${M}-msg`, I = g(null), L = 0, R = g([]), z = g(null), B = g(""), V = a(() => A.value ?? []), H = a(() => !!k.options?.length), U = a(() => !k.disabled && !k.readonly), W = a(() => k.max !== void 0 && V.value.length >= k.max), le = a(() => k.addLabel || "Add new"), ue = a(() => [k.hint && P, k.errorMsg && F].filter(Boolean).join(" ") || void 0), G = a(() => H.value ? "sm:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_256px]" : "sm:grid-cols-2"), de = a(() => k.size === "small" ? "size-[34px]" : "size-[38px]"), K = a(() => {
+	setup(d, { expose: f, emit: S }) {
+		let C = d, w = re(d, "modelValue"), T = S, E = ne(), D = `${E}-label`, O = `${E}-hint`, k = `${E}-msg`, A = g(null), j = 0, M = g([]), N = g(null), P = g(""), F = g([]), I = {}, L = a(() => !!w.value && !Array.isArray(w.value)), R = a(() => L.value ? F.value : w.value ?? []), z = a(() => !!C.options?.length), B = a(() => !C.disabled && !C.readonly), V = a(() => C.max !== void 0 && R.value.length >= C.max), he = a(() => C.addLabel || "Add new"), ge = a(() => [C.hint && O, C.errorMsg && k].filter(Boolean).join(" ") || void 0), H = a(() => C.plain ? z.value ? "grid-cols-[minmax(0,1fr)_minmax(0,1fr)_256px]" : "grid-cols-2" : z.value ? "sm:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_256px]" : "sm:grid-cols-2"), U = a(() => C.plain ? "[&>label:first-child]:sr-only" : "sm:[&>label:first-child]:sr-only"), _e = a(() => C.size === "small" ? "size-[34px]" : "size-[38px]"), W = a(() => {
 			let e = /* @__PURE__ */ new Set();
-			return V.value.map((t, n) => {
+			return R.value.map((t, n) => {
 				let r = {}, i = t.key.trim();
 				if (i) {
-					let a = H.value ? `${i}\u0000${t.option ?? ""}` : i;
-					!k.allowDuplicateKeys && e.has(a) && (r.key = H.value && t.option ? `“${i}” with ${q(t.option)} is already used.` : `“${i}” is already used. Keys must be unique.`), e.add(a), r.key ||= k.validateKey?.(t.key, n, V.value) || void 0;
-				} else t.value && z.value !== R.value[n] && (r.key = `Enter a key, or remove this ${k.itemName}.`);
-				return (i || t.value) && (r.value = k.validateValue?.(t.value, t.key, n, V.value) || void 0), r;
+					let a = z.value ? `${i}\u0000${t.option ?? ""}` : i;
+					!C.allowDuplicateKeys && e.has(a) && (r.key = z.value && t.option ? `“${i}” with ${G(t.option)} is already used.` : `“${i}” is already used. Keys must be unique.`), e.add(a), r.key ||= C.validateKey?.(t.key, n, R.value) || void 0;
+				} else t.value && N.value !== M.value[n] && (r.key = `Enter a key, or remove this ${C.itemName}.`);
+				return (i || t.value) && (r.value = C.validateValue?.(t.value, t.key, n, R.value) || void 0), r;
 			});
-		}), fe = a(() => K.value.some((e) => e.key || e.value));
-		function q(e) {
-			return k.options?.find((t) => t.value === e)?.label ?? e;
+		}), ve = a(() => W.value.some((e) => e.key || e.value));
+		function G(e) {
+			return C.options?.find((t) => t.value === e)?.label ?? e;
 		}
-		function J(e) {
-			let t = V.value[e]?.key.trim();
-			return t ? `${k.itemName} ${t}` : `${k.itemName} ${e + 1}`;
+		function K(e) {
+			let t = R.value[e]?.key.trim();
+			return t ? `${C.itemName} ${t}` : `${C.itemName} ${e + 1}`;
 		}
-		function Y(e) {
+		function q(e) {
 			return e.charAt(0).toUpperCase() + e.slice(1);
 		}
-		function X(e) {
-			B.value = "", p(() => B.value = e);
+		function J(e) {
+			P.value = "", p(() => P.value = e);
 		}
-		function Z(e, t) {
+		function Y(e, t) {
 			p(() => {
-				([...I.value?.querySelectorAll(`[data-row="${e}"]`) ?? []].at(-1)?.querySelector(t === "remove" ? "[data-action='remove']" : `[data-cell="${t}"]`) ?? I.value?.querySelector("[data-action='add']"))?.focus();
+				([...A.value?.querySelectorAll(`[data-row="${e}"]`) ?? []].at(-1)?.querySelector(t === "remove" ? "[data-action='remove']" : `[data-cell="${t}"]`) ?? A.value?.querySelector("[data-action='add']"))?.focus();
 			});
 		}
+		function X(e) {
+			let t = {};
+			for (let n of e) n.key && (t[n.key] = n.value);
+			return t;
+		}
+		function ye(e, t) {
+			let n = Object.keys(e);
+			return n.length === Object.keys(t).length && n.every((n) => n in t && e[n] === t[n]);
+		}
+		function Z(e) {
+			if (!L.value) {
+				w.value = e;
+				return;
+			}
+			F.value = e, I = X(e), w.value = I;
+		}
 		function Q(e, t) {
-			A.value = V.value.map((n, r) => r === e ? {
+			Z(R.value.map((n, r) => r === e ? {
 				...n,
 				...t
-			} : n);
+			} : n));
 		}
 		function $() {
-			if (!U.value || W.value) return;
+			if (!B.value || V.value) return;
 			let e = {
 				key: "",
 				value: ""
 			};
-			H.value && (e.option = k.defaultOption ?? k.options[0].value), R.value = [...R.value, L++], A.value = [...V.value, e];
-			let t = V.value.length;
-			j("add", t), X(`${Y(k.itemName)} ${t + 1} added.`), Z(t, "key");
+			z.value && (e.option = C.defaultOption ?? C.options[0].value), M.value = [...M.value, j++], Z([...R.value, e]);
+			let t = R.value.length;
+			T("add", t), J(`${q(C.itemName)} ${t + 1} added.`), Y(t, "key");
 		}
-		function pe(e) {
-			if (!U.value) return;
-			let t = V.value[e];
+		function be(e) {
+			if (!B.value) return;
+			let t = R.value[e];
 			if (!t) return;
-			let n = J(e);
-			R.value = R.value.filter((t, n) => n !== e), A.value = V.value.filter((t, n) => n !== e), j("remove", t, e), X(`${Y(n)} removed.`);
-			let r = V.value.length;
-			r ? Z(Math.min(e, r - 1), "remove") : p(() => I.value?.querySelector("[data-action='add']")?.focus());
+			let n = K(e);
+			M.value = M.value.filter((t, n) => n !== e), Z(R.value.filter((t, n) => n !== e)), T("remove", t, e), J(`${q(n)} removed.`);
+			let r = R.value.length;
+			r ? Y(Math.min(e, r - 1), "remove") : p(() => A.value?.querySelector("[data-action='add']")?.focus());
 		}
-		function me(e, t) {
-			e.isComposing || (e.preventDefault(), Z(t, "value"));
+		function xe(e, t) {
+			e.isComposing || (e.preventDefault(), Y(t, "value"));
 		}
-		function he(e, t) {
-			e.isComposing || (e.preventDefault(), t < V.value.length - 1 ? Z(t + 1, "key") : W.value || $());
+		function Se(e, t) {
+			e.isComposing || (e.preventDefault(), t < R.value.length - 1 ? Y(t + 1, "key") : V.value || $());
 		}
-		function ge(e, t) {
+		function Ce(e, t) {
 			let n = e.currentTarget, r = e.relatedTarget;
-			r && (n.contains(r) || r instanceof Element && r.closest("[data-testid='ac-select-panel']")) || z.value === t && (z.value = null);
+			r && (n.contains(r) || r instanceof Element && r.closest("[data-testid='ac-select-panel']")) || N.value === t && (N.value = null);
 		}
-		return ne(() => V.value.length, (e) => {
-			R.value.length !== e && (R.value = Array.from({ length: e }, () => L++));
+		return y(w, (e) => {
+			!e || Array.isArray(e) || ye(e, I) || (F.value = Object.entries(e).map(([e, t]) => ({
+				key: e,
+				value: String(t)
+			})), I = X(F.value));
+		}, { immediate: !0 }), y(() => R.value.length, (e) => {
+			M.value.length !== e && (M.value = Array.from({ length: e }, () => j++));
 		}, { immediate: !0 }), f({
 			add: $,
-			focus: () => Z(0, "key"),
-			hasErrors: () => fe.value
+			focus: () => Y(0, "key"),
+			hasErrors: () => ve.value
 		}), (a, f) => (h(), c("div", {
 			ref_key: "root",
-			ref: I,
+			ref: A,
 			role: "group",
-			"aria-labelledby": d.label ? N : void 0,
-			"aria-label": d.label ? void 0 : `${Y(d.itemName)}s`,
-			"aria-describedby": ue.value,
+			"aria-labelledby": d.label ? D : void 0,
+			"aria-label": d.label ? void 0 : `${q(d.itemName)}s`,
+			"aria-describedby": ge.value,
 			class: m(d.disabled && "opacity-50"),
 			"data-ac-ds": "",
 			"data-testid": "ac-key-value-input"
 		}, [
 			d.label ? (h(), c("div", {
 				key: 0,
-				id: N,
+				id: D,
 				class: "mb-2 flex items-center gap-1 text-base font-medium text-heading"
 			}, [
-				l("span", null, v(d.label), 1),
-				d.readonly ? (h(), c("span", re, "(read only)")) : s("", !0),
-				d.required ? (h(), c("span", ie, "*")) : s("", !0)
+				l("span", null, _(d.label), 1),
+				d.readonly ? (h(), c("span", se, "(read only)")) : s("", !0),
+				d.required ? (h(), c("span", ce, "*")) : s("", !0)
 			])) : s("", !0),
 			d.hint ? (h(), c("p", {
 				key: 1,
-				id: P,
+				id: O,
 				class: "mb-2 text-base text-muted"
-			}, v(d.hint), 1)) : s("", !0),
-			V.value.length ? (h(), c("div", ae, [l("div", { class: m(["grid gap-x-4 text-base font-medium text-muted", G.value]) }, [
-				l("span", null, v(d.keyLabel), 1),
-				l("span", null, v(d.valueLabel), 1),
-				H.value ? (h(), c("span", oe, v(d.optionLabel), 1)) : s("", !0)
-			], 2), U.value ? (h(), c("span", {
+			}, _(d.hint), 1)) : s("", !0),
+			R.value.length && !d.plain ? (h(), c("div", le, [l("div", { class: m(["grid gap-x-4 text-base font-medium text-muted", H.value]) }, [
+				l("span", null, _(d.keyLabel), 1),
+				l("span", null, _(d.valueLabel), 1),
+				z.value ? (h(), c("span", ue, _(d.optionLabel), 1)) : s("", !0)
+			], 2), B.value ? (h(), c("span", {
 				key: 0,
 				class: m(d.size === "small" ? "w-[34px]" : "w-[38px]")
 			}, null, 2)) : s("", !0)])) : s("", !0),
-			V.value.length || U.value ? (h(), o(i, {
+			R.value.length || B.value ? (h(), o(i, {
 				key: 3,
 				tag: "div",
 				class: "relative space-y-4",
@@ -197,13 +222,13 @@ var T = [
 				"leave-to-class": "translate-x-5 opacity-0",
 				"move-class": "transition-transform duration-300 ease-out motion-reduce:transition-none"
 			}, {
-				default: x(() => [(h(!0), c(r, null, ee(V.value, (e, r) => (h(), c("div", {
-					key: R.value[r] ?? r,
+				default: b(() => [(h(!0), c(r, null, ee(R.value, (e, r) => (h(), c("div", {
+					key: M.value[r] ?? r,
 					"data-row": r,
-					class: "grid grid-cols-[minmax(0,1fr)_auto] items-start gap-x-4 max-sm:rounded-10 max-sm:border max-sm:border-border max-sm:bg-surface max-sm:p-3",
-					onFocusin: (e) => z.value = R.value[r] ?? null,
-					onFocusout: (e) => ge(e, R.value[r] ?? -1)
-				}, [l("div", { class: m(["grid items-start gap-x-4 gap-y-3 [&_div:has(>input)]:rounded-8 [&_input]:rounded-8 [&_input]:font-medium", G.value]) }, [
+					class: m(["grid grid-cols-[minmax(0,1fr)_auto] items-start gap-x-4", !d.plain && "max-sm:rounded-10 max-sm:border max-sm:border-border max-sm:bg-surface max-sm:p-3"]),
+					onFocusin: (e) => N.value = M.value[r] ?? null,
+					onFocusout: (e) => Ce(e, M.value[r] ?? -1)
+				}, [l("div", { class: m(["grid items-start gap-x-4 gap-y-3 [&_div:has(>input)]:rounded-8 [&_input]:rounded-8 [&_input]:font-medium", [H.value, d.plain && "[&_input]:pr-3 [&_input]:pl-3"]]) }, [
 					u(t, {
 						"data-cell": "key",
 						"model-value": e.key,
@@ -212,12 +237,12 @@ var T = [
 						size: d.size,
 						disabled: d.disabled,
 						readonly: d.readonly,
-						"error-msg": K.value[r]?.key,
+						"error-msg": W.value[r]?.key,
 						autocomplete: "off",
 						spellcheck: "false",
-						class: m(["sm:[&>label:first-child]:sr-only", d.mono && "[&_input]:font-mono"]),
+						class: m([U.value, d.mono && "[&_input]:font-mono"]),
 						"onUpdate:modelValue": (e) => Q(r, { key: String(e) }),
-						onKeydown: S((e) => me(e, r), ["enter"])
+						onKeydown: x((e) => xe(e, r), ["enter"])
 					}, null, 8, [
 						"model-value",
 						"label",
@@ -238,12 +263,12 @@ var T = [
 						size: d.size,
 						disabled: d.disabled,
 						readonly: d.readonly,
-						"error-msg": K.value[r]?.value,
+						"error-msg": W.value[r]?.value,
 						autocomplete: "off",
 						spellcheck: "false",
-						class: "sm:[&>label:first-child]:sr-only",
+						class: m(U.value),
 						"onUpdate:modelValue": (e) => Q(r, { value: String(e) }),
-						onKeydown: S((e) => he(e, r), ["enter"])
+						onKeydown: x((e) => Se(e, r), ["enter"])
 					}, null, 8, [
 						"model-value",
 						"label",
@@ -252,22 +277,24 @@ var T = [
 						"disabled",
 						"readonly",
 						"error-msg",
+						"class",
 						"onUpdate:modelValue",
 						"onKeydown"
 					]),
-					H.value && d.readonly ? (h(), o(t, {
+					z.value && d.readonly ? (h(), o(t, {
 						key: 0,
 						"data-cell": "option",
-						"model-value": e.option ? q(e.option) : "",
+						"model-value": e.option ? G(e.option) : "",
 						label: `${d.optionLabel} ${r + 1}`,
 						size: d.size,
 						readonly: "",
-						class: "sm:[&>label:first-child]:sr-only"
+						class: m(U.value)
 					}, null, 8, [
 						"model-value",
 						"label",
-						"size"
-					])) : H.value ? (h(), o(n, {
+						"size",
+						"class"
+					])) : z.value ? (h(), o(n, {
 						key: 1,
 						"data-cell": "option",
 						"model-value": e.option ?? null,
@@ -275,7 +302,7 @@ var T = [
 						label: `${d.optionLabel} ${r + 1}`,
 						size: d.size,
 						disabled: d.disabled,
-						class: "sm:[&>div:first-child]:sr-only",
+						class: m(d.plain ? "[&>div:first-child]:sr-only" : "sm:[&>div:first-child]:sr-only"),
 						"onUpdate:modelValue": (e) => Q(r, { option: e ?? void 0 })
 					}, null, 8, [
 						"model-value",
@@ -283,36 +310,37 @@ var T = [
 						"label",
 						"size",
 						"disabled",
+						"class",
 						"onUpdate:modelValue"
 					])) : s("", !0)
-				], 2), U.value ? (h(), c("button", {
+				], 2), B.value ? (h(), c("button", {
 					key: 0,
 					type: "button",
 					"data-action": "remove",
-					class: m(["inline-flex shrink-0 cursor-pointer items-center justify-center rounded-8 bg-danger/5 text-danger/60 transition-all duration-200 hover:bg-danger/10 hover:text-danger focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none max-sm:mt-7", de.value]),
-					"aria-label": `Remove ${J(r)}`,
+					class: m(["inline-flex shrink-0 cursor-pointer items-center justify-center rounded-8 bg-danger/5 text-danger/60 transition-all duration-200 hover:bg-danger/10 hover:text-danger focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none", [_e.value, !d.plain && "max-sm:mt-7"]]),
+					"aria-label": `Remove ${K(r)}`,
 					title: `Remove ${d.itemName}`,
-					onClick: (e) => pe(r)
-				}, [u(y(w), {
+					onClick: (e) => be(r)
+				}, [u(v(ae), {
 					class: "size-[18px]",
 					"aria-hidden": "true"
-				})], 10, ce)) : s("", !0)], 40, se))), 128))]),
+				})], 10, fe)) : s("", !0)], 42, de))), 128))]),
 				_: 1
-			})) : (h(), c("p", E, "No " + v(d.itemName) + "s.", 1)),
-			_(a.$slots, "footer"),
-			U.value ? (h(), c("div", {
+			})) : (h(), c("p", pe, "No " + _(d.itemName) + "s.", 1)),
+			te(a.$slots, "footer"),
+			B.value ? (h(), c("div", {
 				key: 5,
-				class: m(["flex items-center gap-3", V.value.length || a.$slots.footer ? "mt-2" : ""])
+				class: m(["flex items-center gap-3", R.value.length || a.$slots.footer ? "mt-2" : ""])
 			}, [u(e, {
 				"data-action": "add",
-				title: le.value,
+				title: he.value,
 				"aria-label": d.addLabel ? void 0 : `Add new ${d.itemName}`,
 				size: "small",
 				variant: "light",
-				disabled: W.value,
+				disabled: V.value,
 				onClick: $
 			}, {
-				icon: x(() => [u(y(C), { "aria-hidden": "true" })]),
+				icon: b(() => [u(v(ie), { "aria-hidden": "true" })]),
 				_: 1
 			}, 8, [
 				"title",
@@ -320,17 +348,17 @@ var T = [
 				"disabled"
 			]), d.max === void 0 ? s("", !0) : (h(), c("span", {
 				key: 0,
-				class: m(["text-xs text-muted tabular-nums", W.value && "font-medium text-heading"])
-			}, v(V.value.length) + " of " + v(d.max), 3))], 2)) : s("", !0),
+				class: m(["text-xs text-muted tabular-nums", V.value && "font-medium text-heading"])
+			}, _(R.value.length) + " of " + _(d.max), 3))], 2)) : s("", !0),
 			d.errorMsg ? (h(), c("p", {
 				key: 6,
-				id: F,
+				id: k,
 				class: "mt-1 text-base text-danger-strong",
 				role: "alert"
-			}, v(d.errorMsg), 1)) : s("", !0),
-			l("p", D, v(B.value), 1)
-		], 10, T));
+			}, _(d.errorMsg), 1)) : s("", !0),
+			l("p", me, _(P.value), 1)
+		], 10, oe));
 	}
 });
 //#endregion
-export { O as default };
+export { S as default };

package/dist/lib/components/AcLineChart.vue.d.ts

@@ -19,9 +19,9 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, i
     description: string;
     height: number;
     points: boolean | "auto";
-    loading: boolean;
     animation: boolean;
     tooltip: boolean;
+    loading: boolean;
     emptyText: string;
     lineWidth: number;
     renderer: "canvas" | "svg";

package/dist/lib/components/AcMapChart.vue.d.ts

@@ -107,10 +107,10 @@ declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, i
     title: string;
     description: string;
     height: number;
-    loading: boolean;
     animation: boolean;
-    pulse: boolean | string[];
     tooltip: boolean;
+    loading: boolean;
+    pulse: boolean | string[];
     emptyText: string;
     labels: boolean;
     valueLabel: string;

package/dist/lib/components/AcModal.vue.d.ts

@@ -5,7 +5,7 @@ export interface Props {
     description?: string;
     /** Width: `xsmall` 384px, `small` 448px, `normal` 576px, `medium` 800px, `large` 1000px, `xlarge` 1152px, `full` viewport minus 64px. */
     size?: "xsmall" | "small" | "normal" | "medium" | "large" | "xlarge" | "full";
-    /** `framed` has a header and footer bar and a close button; `plain` is one padded card (title, body, buttons) on a lighter backdrop, as cloud-ui's confirm dialogs. */
+    /** `framed` has a header and footer bar and a close button; `plain` is one padded card (title, body, buttons), as cloud-ui's confirm dialogs. */
     variant?: "framed" | "plain";
     /** Shows the close button and allows Escape to close. Turn off while a required action runs. */
     closable?: boolean;
@@ -49,11 +49,11 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
     title: string;
     description: string;
     size: "xsmall" | "small" | "normal" | "medium" | "large" | "xlarge" | "full";
+    maxWidth: "xsm" | "sm" | "md" | "lg" | "xl" | "xxl";
     bodyClass: string;
     closable: boolean;
     closeOnOutsideClick: boolean;
     hideFooter: boolean;
-    maxWidth: "xsm" | "sm" | "md" | "lg" | "xl" | "xxl";
     showCloseButton: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/lib/components/AcModal.vue_vue_type_script_setup_true_lang.js

@@ -84,8 +84,8 @@ var w = [
 				let e = window.innerWidth - document.documentElement.clientWidth;
 				t.style.overflow = "hidden";
 				let n = getComputedStyle(document.documentElement).scrollbarGutter.includes("stable");
-				e > 0 && !n && (t.style.paddingRight = `${e}px`);
-			} else !e && n <= 0 && (t.style.overflow = "", t.style.paddingRight = "");
+				e > 0 && !n && (t.style.paddingRight = `${e}px`), n && t.getBoundingClientRect().height >= window.innerHeight && (document.documentElement.style.backgroundColor = `color-mix(in srgb, ${getComputedStyle(t).backgroundColor} 50%, black)`);
+			} else !e && n <= 0 && (t.style.overflow = "", t.style.paddingRight = "", document.documentElement.style.backgroundColor = "");
 		}
 		return b(V, async (e, t) => {
 			if (e) {
@@ -103,7 +103,7 @@ var w = [
 		}, {
 			default: x(() => [V.value ? (p(), a("div", {
 				key: 0,
-				class: d(["fixed inset-0 z-[80] overflow-y-auto", c.variant === "plain" ? "bg-black/50" : "bg-black/80"]),
+				class: "fixed inset-0 z-[80] overflow-y-auto bg-black/50",
 				"data-ac-ds": "",
 				"data-testid": "ac-modal",
 				onKeydown: Z,
@@ -160,7 +160,7 @@ var w = [
 					class: d(["ac-scrollbar min-h-0 flex-1 p-6", c.bodyClass])
 				}, [h(l.$slots, "default")], 2),
 				!c.hideFooter && (l.$slots.footer || l.$slots["footer-left"]) ? (p(), a("footer", I, [o("div", L, [h(l.$slots, "footer-left")]), o("div", R, [h(l.$slots, "footer")])])) : i("", !0)
-			], 64))], 10, w)], 32)], 34)) : i("", !0)]),
+			], 64))], 10, w)], 32)], 32)) : i("", !0)]),
 			_: 3
 		})]));
 	}

package/dist/lib/components/AcNotificationMenu.vue.d.ts

@@ -71,8 +71,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
     onViewAll?: (() => any) | undefined;
 }>, {
     label: string;
-    loading: boolean;
     align: "start" | "end";
+    loading: boolean;
     emptyText: string;
     notifications: NotificationItem[];
     unreadCount: number;

package/dist/lib/components/AcNotificationMenu.vue_vue_type_script_setup_true_lang.js

@@ -1,5 +1,5 @@
-import e from "./AcNavbarItem.js";
-import { fixedFrame as t } from "./fixedFrame.js";
+import { fixedFrame as e } from "./fixedFrame.js";
+import t from "./AcNavbarItem.js";
 import n from "./AcSkeleton.js";
 import { Fragment as r, Teleport as i, Transition as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, getCurrentInstance as m, mergeModels as h, mergeProps as g, nextTick as _, normalizeClass as v, normalizeStyle as ee, onBeforeUnmount as te, openBlock as y, ref as b, renderList as x, renderSlot as S, resolveDynamicComponent as C, toDisplayString as w, unref as T, useId as ne, useModel as re, watch as E, withCtx as D } from "vue";
 import { ArrowRight as ie, Bell as ae, BellOff as oe } from "@lucide/vue";
@@ -146,9 +146,9 @@ var se = {
 			t.length && t[(e + t.length) % t.length].focus();
 		}
 		function Y() {
-			let e = K();
-			if (!e || !L.value) return;
-			let n = e.getBoundingClientRect(), r = t(), { offsetWidth: i, offsetHeight: a } = L.value, o = r.bottom - n.bottom - 6 - 8, s = n.top - r.top - 6 - 8, c = o < a && s > o, l = (O.align === "end" ? n.right - i : n.left) - r.left;
+			let t = K();
+			if (!t || !L.value) return;
+			let n = t.getBoundingClientRect(), r = e(), { offsetWidth: i, offsetHeight: a } = L.value, o = r.bottom - n.bottom - 6 - 8, s = n.top - r.top - 6 - 8, c = o < a && s > o, l = (O.align === "end" ? n.right - i : n.left) - r.left;
 			z.value = !c, R.value = {
 				[c ? "bottom" : "top"]: `${c ? r.bottom - n.top + 6 : n.bottom + 6 - r.top}px`,
 				left: `${Math.max(8, Math.min(l, r.width - i - 8))}px`,
@@ -194,7 +194,7 @@ var se = {
 			B.value = Date.now(), await _(), Y();
 			let t = q()[0];
 			t ? t.focus() : L.value?.focus();
-		}), E(() => [O.notifications.length, O.loading], () => k.value && _(Y)), te(() => $(!1)), (t, o) => (y(), l("div", se, [f(e, {
+		}), E(() => [O.notifications.length, O.loading], () => k.value && _(Y)), te(() => $(!1)), (e, o) => (y(), l("div", se, [f(t, {
 			ref_key: "trigger",
 			ref: I,
 			label: p.label,
@@ -253,44 +253,44 @@ var se = {
 					lines: 3,
 					height: "10px",
 					label: ""
-				})), 64))])) : p.notifications.length ? (y(), l("ul", me, [(y(!0), l(r, null, x(p.notifications, (e) => (y(), l("li", { key: e.id }, [(y(), s(C(W(e.to, e.href)), g({ ref_for: !0 }, G(e.to, e.href), {
+				})), 64))])) : p.notifications.length ? (y(), l("ul", me, [(y(!0), l(r, null, x(p.notifications, (t) => (y(), l("li", { key: t.id }, [(y(), s(C(W(t.to, t.href)), g({ ref_for: !0 }, G(t.to, t.href), {
 					"data-notification-item": "",
-					class: ["relative block w-full cursor-pointer p-3 text-left no-underline outline-none transition-colors duration-200 hover:bg-surface-sunken focus-visible:bg-surface-sunken focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset", !e.read && "bg-primary/8"],
+					class: ["relative block w-full cursor-pointer p-3 text-left no-underline outline-none transition-colors duration-200 hover:bg-surface-sunken focus-visible:bg-surface-sunken focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset", !t.read && "bg-primary/8"],
 					"data-ac-ds": "",
 					"data-testid": "ac-notification-menu-item",
-					onClick: (t) => Le(e)
+					onClick: (e) => Le(t)
 				}), {
-					default: D(() => [S(t.$slots, "item", { item: e }, () => [
+					default: D(() => [S(e.$slots, "item", { item: t }, () => [
 						u("span", he, [
-							e.icon ? (y(), s(C(e.icon), {
+							t.icon ? (y(), s(C(t.icon), {
 								key: 0,
 								class: "size-4 shrink-0 text-muted",
 								"aria-hidden": "true"
 							})) : c("", !0),
-							u("span", ge, w(e.title || e.msg), 1),
-							e.read ? c("", !0) : (y(), l("span", _e)),
-							e.read ? c("", !0) : (y(), l("span", ve, "(unread)"))
+							u("span", ge, w(t.title || t.msg), 1),
+							t.read ? c("", !0) : (y(), l("span", _e)),
+							t.read ? c("", !0) : (y(), l("span", ve, "(unread)"))
 						]),
-						e.title && e.msg ? (y(), l("span", ye, w(e.msg), 1)) : c("", !0),
+						t.title && t.msg ? (y(), l("span", ye, w(t.msg), 1)) : c("", !0),
 						u("span", be, [
-							e.status ? (y(), l("span", {
+							t.status ? (y(), l("span", {
 								key: 0,
-								class: v(["font-medium", De[Me(e)]])
-							}, w(e.status), 3)) : c("", !0),
-							e.status ? (y(), l("span", xe, "·")) : c("", !0),
+								class: v(["font-medium", De[Me(t)]])
+							}, w(t.status), 3)) : c("", !0),
+							t.status ? (y(), l("span", xe, "·")) : c("", !0),
 							u("time", {
-								datetime: Fe(e.time),
-								title: Pe(e.time)
-							}, w(Ne(e.time)), 9, Se)
+								datetime: Fe(t.time),
+								title: Pe(t.time)
+							}, w(Ne(t.time)), 9, Se)
 						])
 					])]),
 					_: 2
-				}, 1040, ["class", "onClick"]))]))), 128))])) : (y(), l("div", de, [S(t.$slots, "empty", {}, () => [
+				}, 1040, ["class", "onClick"]))]))), 128))])) : (y(), l("div", de, [S(e.$slots, "empty", {}, () => [
 					u("span", fe, [f(T(oe), { class: "size-6" })]),
 					u("p", pe, w(p.emptyText), 1),
 					o[2] ||= u("p", { class: "max-w-64 text-base text-muted" }, "Backups, upgrades and alerts from your clusters show up here.", -1)
 				])])),
-				t.$slots.footer || je.value ? (y(), l("div", Ce, [S(t.$slots, "footer", { close: X }, () => [(y(), s(C(W(p.viewAllTo, p.viewAllHref)), g(G(p.viewAllTo, p.viewAllHref), {
+				e.$slots.footer || je.value ? (y(), l("div", Ce, [S(e.$slots, "footer", { close: X }, () => [(y(), s(C(W(p.viewAllTo, p.viewAllHref)), g(G(p.viewAllTo, p.viewAllHref), {
 					class: "group/link flex h-9 w-full cursor-pointer items-center justify-center gap-1.5 rounded-8 text-base font-semibold text-primary-strong no-underline outline-none transition-colors duration-200 hover:bg-surface-sunken focus-visible:bg-surface-sunken focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
 					"data-ac-ds": "",
 					"data-testid": "ac-notification-menu-view-all",