@ac-design/design-system 2.0.0 → 2.1.0

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

@@ -1,50 +1,50 @@
 import e from "./AcNavbarItem.js";
 import t from "./AcSkeleton.js";
-import { Fragment as n, Teleport as r, Transition as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, getCurrentInstance as p, mergeModels as m, mergeProps as h, nextTick as g, normalizeClass as _, normalizeStyle as ee, onBeforeUnmount as te, openBlock as v, ref as y, renderList as b, renderSlot as x, resolveDynamicComponent as S, toDisplayString as C, unref as w, useId as ne, useModel as re, watch as T, withCtx as E } from "vue";
-import { ArrowRight as ie, Bell as ae, BellOff as oe, CheckCheck as se, CircleCheck as ce, CircleX as le, Info as ue, LoaderCircle as de, TriangleAlert as fe } from "@lucide/vue";
+import { Fragment as n, Teleport as r, Transition as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, getCurrentInstance as p, mergeModels as m, mergeProps as h, nextTick as g, normalizeClass as _, normalizeStyle as ee, onBeforeUnmount as te, openBlock as v, ref as y, renderList as b, renderSlot as x, resolveDynamicComponent as S, toDisplayString as C, unref as w, useId as T, useModel as ne, watch as E, withCtx as D } from "vue";
+import { ArrowRight as re, Bell as ie, BellOff as ae } from "@lucide/vue";
 //#region src/lib/components/AcNotificationMenu.vue?vue&type=script&setup=true&lang.ts
-var pe = {
+var oe = {
 	class: "inline-flex",
 	"data-ac-ds": "",
 	"data-testid": "ac-notification-menu"
-}, me = { class: "flex h-13 shrink-0 items-center gap-2 border-b border-border pr-2.5 pl-4" }, he = {
+}, se = { class: "flex shrink-0 items-center justify-between gap-2 border-b border-border p-3" }, ce = {
 	key: 0,
-	class: "inline-flex items-center justify-center rounded-full bg-primary/10 px-2 py-0.5 text-xs font-medium text-primary-strong tabular-nums"
-}, ge = {
+	class: "sr-only"
+}, le = {
 	key: 0,
-	class: "flex flex-col gap-4 px-4 py-4",
+	class: "flex flex-col gap-4 p-3",
 	"aria-busy": "true",
 	role: "status",
 	"aria-label": "Loading notifications"
-}, _e = {
+}, ue = {
 	key: 1,
 	class: "flex flex-col items-center gap-3 px-6 py-10 text-center"
-}, ve = {
+}, de = {
 	class: "inline-flex size-12 items-center justify-center rounded-14 bg-primary/10 text-primary-strong",
 	"aria-hidden": "true"
-}, ye = { class: "text-lg font-semibold text-heading" }, be = {
+}, fe = { class: "text-lg font-semibold text-heading" }, pe = {
 	key: 2,
 	role: "list",
 	class: "ac-scrollbar min-h-0 flex-1 divide-y divide-border",
 	"data-ac-ds": "",
 	"data-testid": "ac-notification-menu-list"
-}, xe = { class: "min-w-0 flex-1" }, Se = {
-	key: 0,
-	class: "mt-1 line-clamp-2 text-xs text-muted"
-}, Ce = { class: "mt-1 flex items-center gap-1.5 text-xs text-muted" }, we = {
+}, me = { class: "flex items-center gap-2" }, he = { class: "line-clamp-2 min-w-0 text-base font-medium text-heading" }, ge = {
 	key: 1,
+	class: "size-2 shrink-0 rounded-full bg-primary",
 	"aria-hidden": "true"
-}, Te = ["datetime", "title"], Ee = {
+}, _e = {
+	key: 2,
+	class: "sr-only"
+}, ve = {
 	key: 0,
-	class: "mt-2 size-2 shrink-0 rounded-full bg-primary",
-	"aria-hidden": "true"
-}, De = {
+	class: "mt-1 line-clamp-2 block text-xs text-muted"
+}, ye = { class: "mt-1 flex items-center gap-1.5 text-xs text-muted" }, be = {
 	key: 1,
-	class: "sr-only"
-}, Oe = {
+	"aria-hidden": "true"
+}, xe = ["datetime", "title"], Se = {
 	key: 3,
 	class: "shrink-0 border-t border-border p-1.5"
-}, ke = "[data-notification-item]", Ae = 6048e5, D = /*@__PURE__*/ f({
+}, Ce = "[data-notification-item]", we = 6048e5, O = /*@__PURE__*/ f({
 	__name: "AcNotificationMenu",
 	props: /*@__PURE__*/ m({
 		notifications: { default: () => [] },
@@ -72,7 +72,7 @@ var pe = {
 		"viewAll"
 	], ["update:open"]),
 	setup(f, { emit: m }) {
-		let D = f, O = re(f, "open"), k = m, je = {
+		let O = f, k = ne(f, "open"), A = m, Te = {
 			success: "success",
 			succeeded: "success",
 			completed: "success",
@@ -91,143 +91,123 @@ var pe = {
 			inprogress: "info",
 			progressing: "info",
 			info: "info"
-		}, A = {
-			success: {
-				icon: ce,
-				tile: "bg-success/10 text-success-strong",
-				text: "text-success-strong"
-			},
-			danger: {
-				icon: le,
-				tile: "bg-danger/10 text-danger-strong",
-				text: "text-danger-strong"
-			},
-			warning: {
-				icon: fe,
-				tile: "bg-warning/10 text-warning-strong",
-				text: "text-warning-strong"
-			},
-			info: {
-				icon: de,
-				tile: "bg-info/10 text-info-strong",
-				text: "text-info-strong"
-			},
-			neutral: {
-				icon: ue,
-				tile: "bg-surface-sunken text-muted",
-				text: "text-muted"
-			}
+		}, Ee = {
+			success: "text-success-strong",
+			danger: "text-danger-strong",
+			warning: "text-warning-strong",
+			info: "text-info-strong",
+			neutral: "text-muted"
 		}, j = new Intl.RelativeTimeFormat(void 0, {
 			numeric: "auto",
 			style: "narrow"
-		}), Me = new Intl.DateTimeFormat(void 0, {
+		}), De = new Intl.DateTimeFormat(void 0, {
 			dateStyle: "medium",
 			timeStyle: "short"
-		}), Ne = new Intl.DateTimeFormat(void 0, {
+		}), Oe = new Intl.DateTimeFormat(void 0, {
 			month: "short",
 			day: "numeric"
-		}), M = p()?.appContext.components.RouterLink, N = ne(), P = `${N}-panel`, F = `${N}-heading`, I = y(null), L = y(null), R = y({}), z = y(!0), B = y(Date.now()), V, H = a(() => D.unreadCount ?? D.notifications.filter((e) => !e.read).length), Pe = a(() => D.notifications.some((e) => !e.read)), Fe = a(() => !!(D.viewAllHref || D.viewAllTo));
-		function U(e) {
-			return e.type ? e.type : je[(e.status ?? "").toLowerCase().replace(/[^a-z]/g, "")] ?? "neutral";
+		}), M = p()?.appContext.components.RouterLink, N = T(), P = `${N}-panel`, F = `${N}-heading`, I = y(null), L = y(null), R = y({}), z = y(!0), B = y(Date.now()), V, H = a(() => O.unreadCount ?? O.notifications.filter((e) => !e.read).length), ke = a(() => O.notifications.some((e) => !e.read)), Ae = a(() => !!(O.viewAllHref || O.viewAllTo));
+		function je(e) {
+			return e.type ? e.type : Te[(e.status ?? "").toLowerCase().replace(/[^a-z]/g, "")] ?? "neutral";
 		}
-		function W(e) {
+		function U(e) {
 			return e instanceof Date ? e.getTime() : typeof e == "number" ? e < 1e11 ? e * 1e3 : e : new Date(e).getTime();
 		}
-		function Ie(e) {
-			let t = W(e);
+		function Me(e) {
+			let t = U(e);
 			if (Number.isNaN(t)) return "";
 			let n = t - B.value, r = Math.abs(n);
-			return r < 45e3 ? "Just now" : r >= Ae ? Ne.format(t) : r < 36e5 ? j.format(Math.round(n / 6e4), "minute") : r < 864e5 ? j.format(Math.round(n / 36e5), "hour") : j.format(Math.round(n / 864e5), "day");
+			return r < 45e3 ? "Just now" : r >= we ? Oe.format(t) : r < 36e5 ? j.format(Math.round(n / 6e4), "minute") : r < 864e5 ? j.format(Math.round(n / 36e5), "hour") : j.format(Math.round(n / 864e5), "day");
 		}
-		function Le(e) {
-			let t = W(e);
-			return Number.isNaN(t) ? "" : Me.format(t);
+		function Ne(e) {
+			let t = U(e);
+			return Number.isNaN(t) ? "" : De.format(t);
 		}
-		function Re(e) {
-			let t = W(e);
+		function Pe(e) {
+			let t = U(e);
 			return Number.isNaN(t) ? void 0 : new Date(t).toISOString();
 		}
-		function G(e, t) {
+		function W(e, t) {
 			return e && M ? M : e || t ? "a" : "button";
 		}
-		function K(e, t) {
-			let n = G(e, t);
+		function G(e, t) {
+			let n = W(e, t);
 			return n === M ? { to: e } : n === "a" ? { href: t || (typeof e == "string" ? e : void 0) } : { type: "button" };
 		}
-		function q() {
+		function K() {
 			return I.value?.$el ?? null;
 		}
-		function J() {
-			return [...L.value?.querySelectorAll(ke) ?? []];
+		function q() {
+			return [...L.value?.querySelectorAll(Ce) ?? []];
 		}
-		function Y(e) {
-			let t = J();
+		function J(e) {
+			let t = q();
 			t.length && t[(e + t.length) % t.length].focus();
 		}
-		function X() {
-			let e = q();
+		function Y() {
+			let e = K();
 			if (!e || !L.value) return;
-			let t = e.getBoundingClientRect(), { offsetWidth: n, offsetHeight: r } = L.value, i = window.innerHeight - t.bottom - 6 - 8, a = t.top - 6 - 8, o = i < r && a > i, s = D.align === "end" ? t.right - n : t.left;
+			let t = e.getBoundingClientRect(), { offsetWidth: n, offsetHeight: r } = L.value, i = window.innerHeight - t.bottom - 6 - 8, a = t.top - 6 - 8, o = i < r && a > i, s = O.align === "end" ? t.right - n : t.left;
 			z.value = !o, R.value = {
 				[o ? "bottom" : "top"]: `${o ? window.innerHeight - t.top + 6 : t.bottom + 6}px`,
 				left: `${Math.max(8, Math.min(s, window.innerWidth - n - 8))}px`,
 				maxHeight: `${Math.max(o ? a : i, 200)}px`
 			};
 		}
-		function Z(e = !0) {
-			O.value && (O.value = !1, e && q()?.focus());
+		function X(e = !0) {
+			k.value && (k.value = !1, e && K()?.focus());
 		}
-		function ze() {
-			O.value ? Z() : O.value = !0;
+		function Z() {
+			k.value ? X() : k.value = !0;
 		}
-		function Be(e) {
-			k("select", e), Z(!1);
+		function Fe(e) {
+			A("select", e), X(!1);
 		}
-		function Ve() {
-			k("viewAll"), Z(!1);
+		function Ie() {
+			A("viewAll"), X(!1);
 		}
-		function He(e) {
-			e.key !== "ArrowDown" || O.value || (e.preventDefault(), O.value = !0);
+		function Le(e) {
+			e.key !== "ArrowDown" || k.value || (e.preventDefault(), k.value = !0);
 		}
-		function Ue(e) {
-			let t = J(), n = t.indexOf(document.activeElement);
-			(e.key === "ArrowDown" || e.key === "ArrowUp") && t.length ? (e.preventDefault(), Y(n < 0 ? e.key === "ArrowDown" ? 0 : -1 : n + (e.key === "ArrowDown" ? 1 : -1))) : (e.key === "Home" || e.key === "End") && n >= 0 ? (e.preventDefault(), Y(e.key === "Home" ? 0 : -1)) : e.key === "Escape" ? (e.preventDefault(), Z()) : e.key === "Tab" && We(e);
+		function Re(e) {
+			let t = q(), n = t.indexOf(document.activeElement);
+			(e.key === "ArrowDown" || e.key === "ArrowUp") && t.length ? (e.preventDefault(), J(n < 0 ? e.key === "ArrowDown" ? 0 : -1 : n + (e.key === "ArrowDown" ? 1 : -1))) : (e.key === "Home" || e.key === "End") && n >= 0 ? (e.preventDefault(), J(e.key === "Home" ? 0 : -1)) : e.key === "Escape" ? (e.preventDefault(), X()) : e.key === "Tab" && ze(e);
 		}
-		function We(e) {
+		function ze(e) {
 			let t = [...L.value?.querySelectorAll("a[href], button:not([disabled])") ?? []], n = t[0], r = t[t.length - 1];
-			e.shiftKey && (document.activeElement === n || document.activeElement === L.value) ? (e.preventDefault(), Z()) : !e.shiftKey && (document.activeElement === r || !t.length) && Z();
+			e.shiftKey && (document.activeElement === n || document.activeElement === L.value) ? (e.preventDefault(), X()) : !e.shiftKey && (document.activeElement === r || !t.length) && X();
 		}
-		function Ge(e) {
+		function Be(e) {
 			let t = e.target;
-			q()?.contains(t) || L.value?.contains(t) || Z(!1);
+			K()?.contains(t) || L.value?.contains(t) || X(!1);
 		}
 		function Q(e) {
-			e?.target instanceof Node && L.value?.contains(e.target) || X();
+			e?.target instanceof Node && L.value?.contains(e.target) || Y();
 		}
 		function $(e) {
 			let t = e ? "addEventListener" : "removeEventListener";
-			document[t]("pointerdown", Ge, !0), window[t]("scroll", Q, !0), window[t]("resize", Q), clearInterval(V), e && (V = setInterval(() => B.value = Date.now(), 3e4));
+			document[t]("pointerdown", Be, !0), window[t]("scroll", Q, !0), window[t]("resize", Q), clearInterval(V), e && (V = setInterval(() => B.value = Date.now(), 3e4));
 		}
-		return T(O, async (e) => {
+		return E(k, async (e) => {
 			if ($(e), !e) return;
-			B.value = Date.now(), await g(), X();
-			let t = J()[0];
+			B.value = Date.now(), await g(), Y();
+			let t = q()[0];
 			t ? t.focus() : L.value?.focus();
-		}), T(() => [D.notifications.length, D.loading], () => O.value && g(X)), te(() => $(!1)), (a, p) => (v(), c("div", pe, [d(e, {
+		}), E(() => [O.notifications.length, O.loading], () => k.value && g(Y)), te(() => $(!1)), (a, p) => (v(), c("div", oe, [d(e, {
 			ref_key: "trigger",
 			ref: I,
 			label: f.label,
-			icon: w(ae),
+			icon: w(ie),
 			"icon-only": "",
 			badge: H.value,
 			"aria-haspopup": "dialog",
-			"aria-expanded": O.value,
-			"aria-controls": O.value ? P : void 0,
-			class: _(O.value && "bg-surface-sunken text-heading"),
+			"aria-expanded": k.value,
+			"aria-controls": k.value ? P : void 0,
+			class: _(k.value && "border-border bg-surface-sunken/50 text-heading"),
 			"data-ac-ds": "",
 			"data-testid": "ac-notification-menu-trigger",
-			onClick: ze,
-			onKeydown: He
+			onClick: Z,
+			onKeydown: Le
 		}, null, 8, [
 			"label",
 			"icon",
@@ -241,7 +221,7 @@ var pe = {
 			"leave-active-class": "transition duration-100 ease-in",
 			"leave-to-class": "opacity-0"
 		}, {
-			default: E(() => [O.value ? (v(), c("div", {
+			default: D(() => [k.value ? (v(), c("div", {
 				key: 0,
 				id: P,
 				ref_key: "panel",
@@ -249,88 +229,73 @@ var pe = {
 				role: "dialog",
 				tabindex: "-1",
 				"aria-labelledby": F,
-				class: _(["fixed z-[90] flex w-[calc(380px*var(--ac-scale))] max-w-[calc(100vw-16px)] flex-col overflow-hidden rounded-14 border border-border bg-surface shadow-lg outline-none", z.value ? "origin-top-right" : "origin-bottom-right"]),
+				class: _(["fixed z-[90] flex w-[calc(320px*var(--ac-scale))] max-w-[calc(100vw-16px)] flex-col overflow-hidden rounded-14 border border-border/80 bg-surface shadow-lg outline-none", z.value ? "origin-top-right" : "origin-bottom-right"]),
 				style: ee(R.value),
 				"data-ac-ds": "",
 				"data-testid": "ac-notification-menu-panel",
-				onKeydown: Ue
+				onKeydown: Re
 			}, [
-				l("div", me, [
-					l("h2", {
-						id: F,
-						class: "font-heading text-lg font-semibold tracking-tight text-heading"
-					}, C(f.label), 1),
-					H.value ? (v(), c("span", he, [u(C(H.value > 999 ? "999+" : H.value), 1), p[1] ||= l("span", { class: "sr-only" }, "\xA0unread", -1)])) : s("", !0),
-					Pe.value || H.value ? (v(), c("button", {
-						key: 1,
-						type: "button",
-						class: "ml-auto inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-8 px-2.5 text-xs font-medium text-muted transition-colors duration-200 hover:bg-surface-sunken hover:text-heading focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-						"data-ac-ds": "",
-						"data-testid": "ac-notification-menu-mark-all",
-						onClick: p[0] ||= (e) => k("markAllRead")
-					}, [d(w(se), {
-						class: "size-3.5",
-						"aria-hidden": "true"
-					}), p[2] ||= u(" Mark all as read ", -1)])) : s("", !0)
-				]),
-				f.loading ? (v(), c("div", ge, [(v(), c(n, null, b(3, (e) => l("div", {
+				l("div", se, [l("h2", {
+					id: F,
+					class: "font-heading text-base font-semibold text-heading"
+				}, C(f.label), 1), ke.value || H.value ? (v(), c("button", {
+					key: 0,
+					type: "button",
+					class: "cursor-pointer rounded-4 text-xs text-muted transition-colors duration-200 hover:text-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+					"data-ac-ds": "",
+					"data-testid": "ac-notification-menu-mark-all",
+					onClick: p[0] ||= (e) => A("markAllRead")
+				}, [p[1] ||= u(" Mark all as read", -1), H.value ? (v(), c("span", ce, " (" + C(H.value) + " unread)", 1)) : s("", !0)])) : s("", !0)]),
+				f.loading ? (v(), c("div", le, [(v(), c(n, null, b(3, (e) => d(t, {
 					key: e,
-					class: "flex gap-3"
-				}, [d(t, {
-					shape: "rect",
-					width: "28px",
-					height: "28px",
-					label: "",
-					class: "shrink-0"
-				}), d(t, {
 					shape: "text",
-					lines: 2,
+					lines: 3,
 					height: "10px",
-					label: "",
-					class: "flex-1"
-				})])), 64))])) : f.notifications.length ? (v(), c("ul", be, [(v(!0), c(n, null, b(f.notifications, (e) => (v(), c("li", { key: e.id }, [(v(), o(S(G(e.to, e.href)), h({ ref_for: !0 }, K(e.to, e.href), {
+					label: ""
+				})), 64))])) : f.notifications.length ? (v(), c("ul", pe, [(v(!0), c(n, null, b(f.notifications, (e) => (v(), c("li", { key: e.id }, [(v(), o(S(W(e.to, e.href)), h({ ref_for: !0 }, G(e.to, e.href), {
 					"data-notification-item": "",
-					class: ["relative flex w-full cursor-pointer gap-3 px-4 py-3 text-left no-underline outline-none transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset", e.read ? "hover:bg-surface-sunken/50 focus-visible:bg-surface-sunken/50" : "bg-primary/8 hover:bg-primary/12 focus-visible:bg-primary/12"],
+					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"],
 					"data-ac-ds": "",
 					"data-testid": "ac-notification-menu-item",
-					onClick: (t) => Be(e)
+					onClick: (t) => Fe(e)
 				}), {
-					default: E(() => [x(a.$slots, "item", { item: e }, () => [
-						l("span", {
-							class: _(["mt-0.5 inline-flex size-7 shrink-0 items-center justify-center rounded-8", A[U(e)].tile]),
-							"aria-hidden": "true"
-						}, [(v(), o(S(e.icon ?? A[U(e)].icon), { class: "size-4" }))], 2),
-						l("span", xe, [
-							l("span", { class: _(["line-clamp-2 text-base text-heading", !e.read && "font-medium"]) }, C(e.title || e.msg), 3),
-							e.title && e.msg ? (v(), c("span", Se, C(e.msg), 1)) : s("", !0),
-							l("span", Ce, [
-								e.status ? (v(), c("span", {
-									key: 0,
-									class: _(["font-medium", A[U(e)].text])
-								}, C(e.status), 3)) : s("", !0),
-								e.status ? (v(), c("span", we, "·")) : s("", !0),
-								l("time", {
-									datetime: Re(e.time),
-									title: Le(e.time)
-								}, C(Ie(e.time)), 9, Te)
-							])
+					default: D(() => [x(a.$slots, "item", { item: e }, () => [
+						l("span", me, [
+							e.icon ? (v(), o(S(e.icon), {
+								key: 0,
+								class: "size-4 shrink-0 text-muted",
+								"aria-hidden": "true"
+							})) : s("", !0),
+							l("span", he, C(e.title || e.msg), 1),
+							e.read ? s("", !0) : (v(), c("span", ge)),
+							e.read ? s("", !0) : (v(), c("span", _e, "(unread)"))
 						]),
-						e.read ? s("", !0) : (v(), c("span", Ee)),
-						e.read ? s("", !0) : (v(), c("span", De, "(unread)"))
+						e.title && e.msg ? (v(), c("span", ve, C(e.msg), 1)) : s("", !0),
+						l("span", ye, [
+							e.status ? (v(), c("span", {
+								key: 0,
+								class: _(["font-medium", Ee[je(e)]])
+							}, C(e.status), 3)) : s("", !0),
+							e.status ? (v(), c("span", be, "·")) : s("", !0),
+							l("time", {
+								datetime: Pe(e.time),
+								title: Ne(e.time)
+							}, C(Me(e.time)), 9, xe)
+						])
 					])]),
 					_: 2
-				}, 1040, ["class", "onClick"]))]))), 128))])) : (v(), c("div", _e, [x(a.$slots, "empty", {}, () => [
-					l("span", ve, [d(w(oe), { class: "size-6" })]),
-					l("p", ye, C(f.emptyText), 1),
-					p[3] ||= l("p", { class: "max-w-64 text-base text-muted" }, "Backups, upgrades and alerts from your clusters show up here.", -1)
+				}, 1040, ["class", "onClick"]))]))), 128))])) : (v(), c("div", ue, [x(a.$slots, "empty", {}, () => [
+					l("span", de, [d(w(ae), { class: "size-6" })]),
+					l("p", fe, C(f.emptyText), 1),
+					p[2] ||= l("p", { class: "max-w-64 text-base text-muted" }, "Backups, upgrades and alerts from your clusters show up here.", -1)
 				])])),
-				a.$slots.footer || Fe.value ? (v(), c("div", Oe, [x(a.$slots, "footer", { close: Z }, () => [(v(), o(S(G(f.viewAllTo, f.viewAllHref)), h(K(f.viewAllTo, f.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-accent-hover focus-visible:bg-accent-hover focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
+				a.$slots.footer || Ae.value ? (v(), c("div", Se, [x(a.$slots, "footer", { close: X }, () => [(v(), o(S(W(f.viewAllTo, f.viewAllHref)), h(G(f.viewAllTo, f.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",
-					onClick: Ve
+					onClick: Ie
 				}), {
-					default: E(() => [u(C(f.viewAllLabel) + " ", 1), d(w(ie), {
+					default: D(() => [u(C(f.viewAllLabel) + " ", 1), d(w(re), {
 						class: "size-3.5 transition-transform duration-200 group-hover/link:translate-x-0.5 motion-reduce:transition-none",
 						"aria-hidden": "true"
 					})]),
@@ -342,4 +307,4 @@ var pe = {
 	}
 });
 //#endregion
-export { D as default };
+export { O as default };

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

@@ -13,7 +13,7 @@ export interface Props {
     precision?: number;
     /** Unit shown after the value, e.g. `GiB`, `vCPU` or `%`. Also read out with the value. */
     unit?: string;
-    /** Shows the − and + buttons inside the field. Cloud `is-show-inc-dec`. */
+    /** Shows bordered − and + buttons on either side of the field. Off by default, like cloud-ui. Cloud `is-show-inc-dec`. */
     stepButtons?: boolean;
     /** Milliseconds a − / + press is held before it starts repeating. */
     holdDelay?: number;
@@ -29,7 +29,7 @@ export interface Props {
     errorMsg?: string;
     /** Help text between the label and the field. */
     hint?: string;
-    /** `small` 36px or `normal` 40px tall. */
+    /** `small` 36px or `normal` 42px tall, the same as `AcInput`; the step buttons match. */
     size?: "small" | "normal";
 }
 type __VLS_Props = Props;