@burdenoff/microfe-bigconsole 2026.812.2 → 2026.827.1

package/dist/bigconsole/pages/DashboardsPage.js

@@ -7,19 +7,19 @@ import i from "../hooks/useDashboardOperations.js";
 import "../hooks/index.js";
 import { BIGCONSOLE_PERMISSIONS as a } from "../../constants/permissions.js";
 import o from "../components/dashboard/CreateDashboardDialog.js";
-import s from "../components/dashboard/ImportDashboardDialog.js";
-import { isNative as c, nativeConfirm as ee, nativeImpact as l, nativeNotify as u } from "../../utils/nativeBridge.js";
-import { memo as d, useCallback as f, useEffect as p, useState as m } from "react";
-import { AccessDenied as te, PermissionButton as h } from "@burdenoff/fe-libs/shared/components";
-import { usePermissions as ne } from "@burdenoff/fe-libs/shared/providers/shell";
-import { Calendar as g, ChevronLeft as re, ChevronRight as ie, Copy as _, FileText as v, Layers as y, LayoutDashboard as b, LayoutGrid as ae, List as oe, Pencil as x, Plus as S, Search as se, Trash2 as ce, Upload as le } from "lucide-react";
-import { useI18n as ue } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AuroraBackground as C, Badge as w, Button as T, CTAOverflowMenu as E, Card as D, CardContent as O, GlassCard as de, GradientText as k, IllustratedEmptyState as fe, Input as pe, PagePurpose as me, Spinner as A } from "@burdenoff/fe-libs/ui";
-import { jsx as j, jsxs as M } from "react/jsx-runtime";
+import { isNative as s, nativeConfirm as ee, nativeImpact as c, nativeNotify as l } from "../../utils/nativeBridge.js";
+import te from "../components/dashboard/ImportDashboardDialog.js";
+import { memo as u, useCallback as d, useEffect as ne, useState as f } from "react";
+import { AccessDenied as re, PermissionButton as p } from "@burdenoff/fe-libs/shared/components";
+import { usePermissions as ie } from "@burdenoff/fe-libs/shared/providers/shell";
+import { Calendar as m, ChevronLeft as ae, ChevronRight as oe, Copy as h, FileText as g, Layers as _, LayoutDashboard as v, LayoutGrid as se, List as ce, Pencil as le, Plus as ue, Search as de, Trash2 as fe, Upload as pe } from "lucide-react";
+import { useI18n as me } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AuroraBackground as y, Badge as b, Button as x, CTAOverflowMenu as S, Card as C, CardContent as w, GlassCard as he, GradientText as T, IllustratedEmptyState as ge, Input as _e, PagePurpose as ve, Spinner as E } from "@burdenoff/fe-libs/ui";
+import { jsx as D, jsxs as O } from "react/jsx-runtime";
 //#region src/bigconsole/pages/DashboardsPage.tsx
-var N = "bf-bigconsole-dashboards-view", P = 12, F = 7;
-function he(e, t) {
-	if (t <= F) return Array.from({ length: t }, (e, t) => t + 1);
+var k = "bf-bigconsole-dashboards-view", A = 12, j = 7;
+function ye(e, t) {
+	if (t <= j) return Array.from({ length: t }, (e, t) => t + 1);
 	let n = new Set([
 		1,
 		t,
@@ -31,12 +31,12 @@ function he(e, t) {
 		t > 0 && e - r[t - 1] > 1 && i.push(null), i.push(e);
 	}), i;
 }
-var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onCreate: i, onImport: a, canCreate: o, canImport: s }) {
-	return /* @__PURE__ */ M("div", {
+var be = u(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onCreate: i, onImport: a, canCreate: o, canImport: s }) {
+	return /* @__PURE__ */ O("div", {
 		className: "relative overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]",
-		children: [/* @__PURE__ */ j(C, { intensity: "subtle" }), /* @__PURE__ */ j("div", {
+		children: [/* @__PURE__ */ D(y, { intensity: "subtle" }), /* @__PURE__ */ D("div", {
 			style: { padding: "var(--space-pagePadding)" },
-			children: /* @__PURE__ */ M("div", {
+			children: /* @__PURE__ */ O("div", {
 				style: {
 					display: "flex",
 					alignItems: "center",
@@ -44,14 +44,14 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 					flexWrap: "wrap",
 					gap: "var(--space-formGap)"
 				},
-				children: [/* @__PURE__ */ M("div", {
+				children: [/* @__PURE__ */ O("div", {
 					style: {
 						display: "flex",
 						alignItems: "center",
 						gap: "var(--space-formGap)",
 						minWidth: 0
 					},
-					children: [/* @__PURE__ */ j("div", {
+					children: [/* @__PURE__ */ D("div", {
 						style: {
 							display: "flex",
 							height: "var(--size-controlHeight-lg)",
@@ -62,22 +62,22 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 							borderRadius: "var(--radius-card)",
 							backgroundColor: "var(--color-action-primary-bg)"
 						},
-						children: /* @__PURE__ */ j(b, { style: {
+						children: /* @__PURE__ */ D(v, { style: {
 							height: "var(--size-icon-lg)",
 							width: "var(--size-icon-lg)",
 							color: "var(--color-action-primary-text)"
 						} })
-					}), /* @__PURE__ */ M("div", {
+					}), /* @__PURE__ */ O("div", {
 						style: { minWidth: 0 },
-						children: [/* @__PURE__ */ j("h1", {
+						children: [/* @__PURE__ */ D("h1", {
 							style: {
 								fontSize: "var(--font-size-heading-h4)",
 								fontWeight: "var(--font-weight-bold)",
 								margin: 0,
 								color: "var(--color-text-primary)"
 							},
-							children: /* @__PURE__ */ j(k, { children: e })
-						}), /* @__PURE__ */ j("p", {
+							children: /* @__PURE__ */ D(T, { children: e })
+						}), /* @__PURE__ */ D("p", {
 							style: {
 								fontSize: "var(--font-size-body-sm)",
 								color: "var(--color-text-secondary)",
@@ -86,12 +86,12 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 							children: t
 						})]
 					})]
-				}), /* @__PURE__ */ j(E, {
+				}), /* @__PURE__ */ D(S, {
 					primary: {
 						label: n,
 						onSelect: i,
 						disabled: !o,
-						icon: /* @__PURE__ */ j(S, { style: {
+						icon: /* @__PURE__ */ D(ue, { style: {
 							marginRight: "var(--space-iconGap)",
 							height: "var(--size-icon-sm)",
 							width: "var(--size-icon-sm)"
@@ -101,7 +101,7 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 						label: r,
 						onSelect: a,
 						disabled: !s,
-						icon: /* @__PURE__ */ j(le, { style: {
+						icon: /* @__PURE__ */ D(pe, { style: {
 							height: "var(--size-icon-sm)",
 							width: "var(--size-icon-sm)"
 						} })
@@ -110,188 +110,227 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 			})
 		})]
 	});
-}), I = d(function() {
-	let d = n(), { t: C } = ue(), E = f((e, t) => {
-		let n = C(e);
+}), M = {
+	PUBLISHED: "var(--color-status-success-bg)",
+	DRAFT: "var(--color-text-muted)",
+	ARCHIVED: "var(--color-status-warning-bg)"
+}, N = u(function({ status: e, label: t }) {
+	return /* @__PURE__ */ O("span", {
+		"data-testid": "dashboard-status",
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: "var(--space-iconGap)",
+			padding: "2px 8px",
+			borderRadius: "var(--radius-pill)",
+			backgroundColor: "var(--color-bg-sunken)",
+			border: "1px solid var(--color-border-subtle)",
+			fontSize: "10px",
+			fontWeight: "var(--font-weight-semibold)",
+			textTransform: "uppercase",
+			letterSpacing: "0.02em",
+			color: "var(--color-text-secondary)",
+			whiteSpace: "nowrap"
+		},
+		children: [/* @__PURE__ */ D("span", {
+			"aria-hidden": "true",
+			style: {
+				width: 6,
+				height: 6,
+				borderRadius: "50%",
+				backgroundColor: M[e],
+				flexShrink: 0
+			}
+		}), t]
+	});
+}), P = u(function() {
+	let u = n(), { t: y } = me(), S = d((e, t) => {
+		let n = y(e);
 		return n === e ? t : n;
-	}, [C]), [k, F] = m(""), [I, L] = m(1), [_e, R] = m(!1), [z, B] = m(!1), [ve, V] = m(!1), [H, ye] = m(() => {
+	}, [y]), [T, j] = f(""), [M, P] = f(1), [xe, F] = f(!1), [I, L] = f(!1), [Se, R] = f(!1), [z, Ce] = f(() => {
 		try {
-			return window.localStorage.getItem(N) === "list" ? "list" : "grid";
+			return window.localStorage.getItem(k) === "list" ? "list" : "grid";
 		} catch {
 			return "grid";
 		}
-	}), U = f((e) => {
-		ye(e);
+	}), B = d((e) => {
+		Ce(e);
 		try {
-			window.localStorage.setItem(N, e);
+			window.localStorage.setItem(k, e);
 		} catch {}
-	}, []), { loading: W, error: be, dashboards: G, createDashboard: K, deleteDashboard: q, cloneDashboard: J, refetch: Y } = i(), { hasPermission: X, isLoading: xe } = ne(), Se = X(a.DASHBOARD_READ), Ce = X(a.DASHBOARD_CREATE), we = X(a.DASHBOARD_IMPORT), Z = G.filter((e) => e.name.toLowerCase().includes(k.toLowerCase()) || e.description?.toLowerCase().includes(k.toLowerCase())), Q = Math.max(1, Math.ceil(Z.length / P)), Te = (I - 1) * P, Ee = Z.slice(Te, Te + P);
-	p(() => {
-		L(1);
-	}, [k, H]), p(() => {
-		I > Q && L(Q);
-	}, [I, Q]);
-	let De = f(() => {
-		L((e) => Math.max(1, e - 1));
-	}, []), Oe = f(() => {
-		L((e) => Math.min(Q, e + 1));
-	}, [Q]), ke = f((e) => {
-		L(e);
-	}, []), Ae = f(() => {
-		R(!0);
-	}, []), je = f(({ dashboardId: e }) => {
-		Y(), d(`/dashboards/${e}`);
-	}, [Y, d]), Me = f(() => {
-		z || R(!1);
-	}, [z]), Ne = f(async (e) => {
-		B(!0);
+	}, []), { loading: V, error: H, dashboards: we, createDashboard: U, deleteDashboard: W, cloneDashboard: G, refetch: K } = i(), { hasPermission: q, isLoading: Te } = ie(), Ee = q(a.DASHBOARD_READ), De = q(a.DASHBOARD_CREATE), Oe = q(a.DASHBOARD_IMPORT), J = we.filter((e) => e.name.toLowerCase().includes(T.toLowerCase()) || e.description?.toLowerCase().includes(T.toLowerCase())), Y = Math.max(1, Math.ceil(J.length / A)), X = (M - 1) * A, Z = J.slice(X, X + A);
+	ne(() => {
+		P(1);
+	}, [T, z]), ne(() => {
+		M > Y && P(Y);
+	}, [M, Y]);
+	let ke = d(() => {
+		P((e) => Math.max(1, e - 1));
+	}, []), Ae = d(() => {
+		P((e) => Math.min(Y, e + 1));
+	}, [Y]), je = d((e) => {
+		P(e);
+	}, []), Me = d(() => {
+		F(!0);
+	}, []), Ne = d(({ dashboardId: e }) => {
+		K(), u(`/dashboards/${e}`);
+	}, [K, u]), Pe = d(() => {
+		I || F(!1);
+	}, [I]), Fe = d(async (e) => {
+		L(!0);
 		try {
-			let t = await K({
+			let t = await U({
 				name: e.name,
 				description: e.description,
 				category: e.category,
 				tags: e.tags
 			});
-			t && (R(!1), d(`/dashboards/${t.id}/builder`));
+			t && (F(!1), u(`/dashboards/${t.id}/builder`));
 		} catch (e) {
 			if (r(e, "project")) {
-				R(!1);
+				F(!1);
 				return;
 			}
-			throw console.error("Failed to create dashboard:", e), c() && u("error"), e;
+			throw console.error("Failed to create dashboard:", e), s() && l("error"), e;
 		} finally {
-			B(!1);
+			L(!1);
 		}
-	}, [K, d]), Pe = f((e) => {
-		d(`/dashboards/${e}`);
-	}, [d]), $ = f((e, t) => {
-		t.stopPropagation(), d(`/dashboards/${e}/builder`);
-	}, [d]), Fe = f(async (e, t) => {
+	}, [U, u]), Q = d((e) => {
+		u(`/dashboards/${e}`);
+	}, [u]), Ie = d((e, t) => {
+		t.stopPropagation(), u(`/dashboards/${e}/builder`);
+	}, [u]), Le = d(async (e, t) => {
 		t.stopPropagation();
-		let n = E("bigconsole.dashboards.confirmDelete", "Are you sure you want to delete this dashboard?"), r = await ee({
+		let n = S("bigconsole.dashboards.confirmDelete", "Are you sure you want to delete this dashboard?"), r = await ee({
 			title: "Delete dashboard?",
 			message: n,
 			okButtonTitle: "Delete",
 			cancelButtonTitle: "Cancel"
 		});
 		if (r === null ? window.confirm(n) : r) {
-			l("medium");
+			c("medium");
 			try {
-				await q(e), c() && u("success");
+				await W(e), s() && l("success");
 			} catch (e) {
-				throw c() && u("error"), e;
+				throw s() && l("error"), e;
 			}
 		}
-	}, [q, E]), Ie = f(async (e, t, n) => {
+	}, [W, S]), Re = d(async (e, t, n) => {
 		n.stopPropagation();
-		let i = C("bigconsole.dashboards.clone.defaultSuffix", "{{sourceName}} (Copy)", { sourceName: t }), a = window.prompt(E("bigconsole.dashboards.clone.namePrompt", "Name for the cloned dashboard:"), i);
+		let i = y("bigconsole.dashboards.clone.defaultSuffix", "{{sourceName}} (Copy)", { sourceName: t }), a = window.prompt(S("bigconsole.dashboards.clone.namePrompt", "Name for the cloned dashboard:"), i);
 		if (!(!a || !a.trim())) {
-			l("medium");
+			c("medium");
 			try {
-				let t = await J(e, a.trim());
-				t && (c() && u("success"), d(`/dashboards/${t.id}`));
+				let t = await G(e, a.trim());
+				t && (s() && l("success"), u(`/dashboards/${t.id}`));
 			} catch (e) {
 				if (r(e, "project")) return;
-				throw c() && u("error"), e;
+				throw s() && l("error"), e;
 			}
 		}
 	}, [
-		J,
-		d,
-		E,
-		C
-	]), Le = f(() => {
-		V(!0);
-	}, []), Re = f(() => {
-		V(!1);
-	}, []), ze = f((e, t) => {
-		Y();
-	}, [Y]), Be = (e) => {
+		G,
+		u,
+		S,
+		y
+	]), ze = d(() => {
+		R(!0);
+	}, []), Be = d(() => {
+		R(!1);
+	}, []), Ve = d((e, t) => {
+		K();
+	}, [K]), He = (e) => {
 		let t = new Date(e), n = /* @__PURE__ */ new Date(), r = n.getTime() - t.getTime(), i = Math.floor(r / 6e4), a = Math.floor(r / 36e5), o = Math.floor(r / 864e5);
-		return i < 1 ? E("bigconsole.dashboards.time.justNow", "Just now") : i < 60 ? `${i}${E("bigconsole.dashboards.time.minutesAgoSuffix", "m ago")}` : a < 24 ? `${a}${E("bigconsole.dashboards.time.hoursAgoSuffix", "h ago")}` : o < 7 ? `${o}${E("bigconsole.dashboards.time.daysAgoSuffix", "d ago")}` : new Intl.DateTimeFormat("en-US", {
+		return i < 1 ? S("bigconsole.dashboards.time.justNow", "Just now") : i < 60 ? `${i}${S("bigconsole.dashboards.time.minutesAgoSuffix", "m ago")}` : a < 24 ? `${a}${S("bigconsole.dashboards.time.hoursAgoSuffix", "h ago")}` : o < 7 ? `${o}${S("bigconsole.dashboards.time.daysAgoSuffix", "d ago")}` : new Intl.DateTimeFormat("en-US", {
 			month: "short",
 			day: "numeric",
 			year: t.getFullYear() === n.getFullYear() ? void 0 : "numeric"
 		}).format(t);
-	}, Ve = (e) => e.widgetCount ?? 0, He = (e) => e.pageCount || 0, Ue = /* @__PURE__ */ j(ge, {
-		title: E("bigconsole.dashboards.title", "Dashboards"),
-		subtitle: E("bigconsole.dashboards.subtitle", "Create and manage your analytics dashboards"),
-		createLabel: E("bigconsole.dashboards.actions.create", "Create Dashboard"),
-		importLabel: E("bigconsole.dashboards.actions.import", "Import"),
-		onCreate: Ae,
-		onImport: Le,
-		canCreate: Ce,
-		canImport: we
+	}, Ue = d((e) => {
+		switch (e) {
+			case "PUBLISHED": return S("bigconsole.dashboards.status.published", "Published");
+			case "ARCHIVED": return S("bigconsole.dashboards.status.archived", "Archived");
+			default: return S("bigconsole.dashboards.status.draft", "Draft");
+		}
+	}, [S]), We = (e) => e.widgetCount ?? 0, Ge = (e) => e.pageCount || 0, Ke = /* @__PURE__ */ D(be, {
+		title: S("bigconsole.dashboards.title", "Dashboards"),
+		subtitle: S("bigconsole.dashboards.subtitle", "Create and manage your analytics dashboards"),
+		createLabel: S("bigconsole.dashboards.actions.create", "Create Dashboard"),
+		importLabel: S("bigconsole.dashboards.actions.import", "Import"),
+		onCreate: Me,
+		onImport: ze,
+		canCreate: De,
+		canImport: Oe
 	});
-	if (xe) return /* @__PURE__ */ j("div", {
+	if (Te) return /* @__PURE__ */ D("div", {
 		style: {
 			display: "flex",
 			alignItems: "center",
 			justifyContent: "center",
 			padding: "80px 0"
 		},
-		children: /* @__PURE__ */ j(A, { style: {
+		children: /* @__PURE__ */ D(E, { style: {
 			height: "var(--size-icon-xl)",
 			width: "var(--size-icon-xl)"
 		} })
 	});
-	if (!Se) return /* @__PURE__ */ j(te, {
+	if (!Ee) return /* @__PURE__ */ D(re, {
 		title: "Access Denied",
 		description: "You don't have permission to view dashboards."
 	});
-	if (be) return /* @__PURE__ */ M("div", {
+	if (H) return /* @__PURE__ */ O("div", {
 		style: {
 			minHeight: "100vh",
 			backgroundColor: "var(--color-bg-canvas)"
 		},
-		children: [Ue, /* @__PURE__ */ j("div", {
+		children: [Ke, /* @__PURE__ */ D("div", {
 			style: { padding: "var(--space-pagePadding)" },
-			children: /* @__PURE__ */ j(e, {
+			children: /* @__PURE__ */ D(e, {
 				headingLevel: 2,
 				tone: "danger",
-				title: E("bigconsole.dashboards.error.title", "Error loading dashboards"),
-				description: be.message,
+				title: S("bigconsole.dashboards.error.title", "Error loading dashboards"),
+				description: H.message,
 				"data-testid": "dashboards-error",
-				actions: /* @__PURE__ */ j(T, {
+				actions: /* @__PURE__ */ D(x, {
 					size: "sm",
-					onClick: () => Y(),
-					children: E("bigconsole.dashboards.error.retry", "Retry")
+					onClick: () => K(),
+					children: S("bigconsole.dashboards.error.retry", "Retry")
 				})
 			})
 		})]
 	});
-	let We = Z.length;
-	return /* @__PURE__ */ M("div", {
+	let $ = J.length;
+	return /* @__PURE__ */ O("div", {
 		style: {
 			minHeight: "100vh",
 			backgroundColor: "var(--color-bg-canvas)"
 		},
 		children: [
-			Ue,
-			/* @__PURE__ */ j("div", {
+			Ke,
+			/* @__PURE__ */ D("div", {
 				style: { padding: "var(--space-pagePadding)" },
-				children: /* @__PURE__ */ M(t, { children: [/* @__PURE__ */ j(e, {
+				children: /* @__PURE__ */ O(t, { children: [/* @__PURE__ */ D(e, {
 					emphasis: "muted",
 					padding: "compact",
-					"aria-label": E("bigconsole.dashboards.about", "About dashboards"),
-					children: /* @__PURE__ */ j(me, {
+					"aria-label": S("bigconsole.dashboards.about", "About dashboards"),
+					children: /* @__PURE__ */ D(ve, {
 						className: "max-w-[80ch]",
 						children: "Dashboards are live, shareable views built from widgets that query your data sinks — charts, tables, metrics, and drill-downs in one place. Compose a board to monitor a system, share KPIs with your team, or explore data interactively."
 					})
-				}), /* @__PURE__ */ M(e, {
+				}), /* @__PURE__ */ O(e, {
 					headingLevel: 2,
 					emphasis: "primary",
 					"data-testid": "dashboards-results",
-					title: E("bigconsole.dashboards.results.title", "Your dashboards"),
-					description: E("bigconsole.dashboards.results.description", "Open a board to view it, or use the card actions to edit, duplicate or delete."),
-					meta: /* @__PURE__ */ j(w, {
+					title: S("bigconsole.dashboards.results.title", "Your dashboards"),
+					description: S("bigconsole.dashboards.results.description", "Open a board to view it, or use the card actions to edit, duplicate or delete."),
+					meta: /* @__PURE__ */ D(b, {
 						variant: "secondary",
-						"aria-label": E("bigconsole.dashboards.results.count", `${We} dashboards`),
-						children: We
+						"aria-label": S("bigconsole.dashboards.results.count", `${$} dashboards`),
+						children: $
 					}),
-					actions: /* @__PURE__ */ M("div", {
+					actions: /* @__PURE__ */ O("div", {
 						role: "group",
-						"aria-label": E("bigconsole.dashboards.view.label", "Result layout"),
+						"aria-label": S("bigconsole.dashboards.view.label", "Result layout"),
 						style: {
 							display: "flex",
 							alignItems: "center",
@@ -300,37 +339,37 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 							borderRadius: "var(--radius-button)",
 							backgroundColor: "var(--color-bg-sunken)"
 						},
-						children: [/* @__PURE__ */ j(T, {
-							variant: H === "grid" ? "default" : "ghost",
+						children: [/* @__PURE__ */ D(x, {
+							variant: z === "grid" ? "default" : "ghost",
 							size: "sm",
-							onClick: () => U("grid"),
-							"aria-label": E("bigconsole.dashboards.view.grid", "Grid view"),
-							"aria-pressed": H === "grid",
-							title: E("bigconsole.dashboards.view.grid", "Grid view"),
+							onClick: () => B("grid"),
+							"aria-label": S("bigconsole.dashboards.view.grid", "Grid view"),
+							"aria-pressed": z === "grid",
+							title: S("bigconsole.dashboards.view.grid", "Grid view"),
 							style: {
 								height: "var(--size-controlHeight-md)",
 								width: "var(--size-controlHeight-md)",
 								padding: 0,
 								borderRadius: "var(--radius-button)"
 							},
-							children: /* @__PURE__ */ j(ae, { style: {
+							children: /* @__PURE__ */ D(se, { style: {
 								height: "var(--size-icon-sm)",
 								width: "var(--size-icon-sm)"
 							} })
-						}), /* @__PURE__ */ j(T, {
-							variant: H === "list" ? "default" : "ghost",
+						}), /* @__PURE__ */ D(x, {
+							variant: z === "list" ? "default" : "ghost",
 							size: "sm",
-							onClick: () => U("list"),
-							"aria-label": E("bigconsole.dashboards.view.list", "List view"),
-							"aria-pressed": H === "list",
-							title: E("bigconsole.dashboards.view.list", "List view"),
+							onClick: () => B("list"),
+							"aria-label": S("bigconsole.dashboards.view.list", "List view"),
+							"aria-pressed": z === "list",
+							title: S("bigconsole.dashboards.view.list", "List view"),
 							style: {
 								height: "var(--size-controlHeight-md)",
 								width: "var(--size-controlHeight-md)",
 								padding: 0,
 								borderRadius: "var(--radius-button)"
 							},
-							children: /* @__PURE__ */ j(oe, { style: {
+							children: /* @__PURE__ */ D(ce, { style: {
 								height: "var(--size-icon-sm)",
 								width: "var(--size-icon-sm)"
 							} })
@@ -338,13 +377,13 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 					}),
 					bodyClassName: "flex flex-col gap-form-gap",
 					children: [
-						/* @__PURE__ */ M("div", {
+						/* @__PURE__ */ O("div", {
 							style: {
 								position: "relative",
 								width: "100%",
 								maxWidth: "420px"
 							},
-							children: [/* @__PURE__ */ j(se, {
+							children: [/* @__PURE__ */ D(de, {
 								"aria-hidden": "true",
 								style: {
 									position: "absolute",
@@ -355,61 +394,61 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 									width: "var(--size-icon-sm)",
 									color: "var(--color-text-muted)"
 								}
-							}), /* @__PURE__ */ j(pe, {
+							}), /* @__PURE__ */ D(_e, {
 								type: "search",
-								"aria-label": E("bigconsole.dashboards.search.placeholder", "Search dashboards..."),
-								placeholder: E("bigconsole.dashboards.search.placeholder", "Search dashboards..."),
-								value: k,
-								onChange: (e) => F(e.target.value),
+								"aria-label": S("bigconsole.dashboards.search.placeholder", "Search dashboards..."),
+								placeholder: S("bigconsole.dashboards.search.placeholder", "Search dashboards..."),
+								value: T,
+								onChange: (e) => j(e.target.value),
 								style: {
 									paddingLeft: "var(--size-controlHeight-md)",
 									height: "var(--size-controlHeight-md)"
 								}
 							})]
 						}),
-						W && G.length === 0 && /* @__PURE__ */ j("div", {
+						V && we.length === 0 && /* @__PURE__ */ D("div", {
 							style: {
 								display: "flex",
 								alignItems: "center",
 								justifyContent: "center",
 								padding: "80px 0"
 							},
-							children: /* @__PURE__ */ M("div", {
+							children: /* @__PURE__ */ O("div", {
 								style: { textAlign: "center" },
-								children: [/* @__PURE__ */ j(A, { style: {
+								children: [/* @__PURE__ */ D(E, { style: {
 									height: "var(--size-icon-xl)",
 									width: "var(--size-icon-xl)",
 									margin: "0 auto var(--space-formGap)"
-								} }), /* @__PURE__ */ j("p", {
+								} }), /* @__PURE__ */ D("p", {
 									style: {
 										fontSize: "var(--font-size-body-sm)",
 										color: "var(--color-text-muted)"
 									},
-									children: E("bigconsole.dashboards.loading", "Loading dashboards...")
+									children: S("bigconsole.dashboards.loading", "Loading dashboards...")
 								})]
 							})
 						}),
-						!W && H === "grid" && Z.length > 0 && /* @__PURE__ */ j("div", {
+						!V && z === "grid" && J.length > 0 && /* @__PURE__ */ D("div", {
 							style: {
 								display: "grid",
 								gridTemplateColumns: "repeat(auto-fill, minmax(min(320px, 100%), 1fr))",
 								gap: "var(--space-formGap)"
 							},
-							children: Ee.map((e) => /* @__PURE__ */ j(D, {
-								onClick: () => Pe(e.id),
+							children: Z.map((e) => /* @__PURE__ */ D(C, {
+								onClick: () => Q(e.id),
 								style: { cursor: "pointer" },
 								className: "motion-safe:transition-[box-shadow,border-color] hover:border-[var(--color-border-hover)] hover:shadow-[var(--shadow-elevation-2)]",
-								children: /* @__PURE__ */ M(O, {
+								children: /* @__PURE__ */ O(w, {
 									style: { padding: "var(--space-cardPadding)" },
 									children: [
-										/* @__PURE__ */ M("div", {
+										/* @__PURE__ */ O("div", {
 											style: {
 												display: "flex",
 												alignItems: "center",
 												gap: "var(--space-controlGap)",
 												marginBottom: "var(--space-formGap)"
 											},
-											children: [/* @__PURE__ */ j("div", {
+											children: [/* @__PURE__ */ D("div", {
 												style: {
 													display: "flex",
 													height: "var(--size-controlHeight-lg)",
@@ -420,7 +459,7 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 													borderRadius: "var(--radius-button)",
 													backgroundColor: "var(--color-bg-accentSubtle)"
 												},
-												children: /* @__PURE__ */ j(b, {
+												children: /* @__PURE__ */ D(v, {
 													"aria-hidden": "true",
 													style: {
 														height: "var(--size-icon-md)",
@@ -428,12 +467,12 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 														color: "var(--color-action-primary-bg)"
 													}
 												})
-											}), /* @__PURE__ */ M("div", {
+											}), /* @__PURE__ */ O("div", {
 												style: {
 													flex: 1,
 													minWidth: 0
 												},
-												children: [/* @__PURE__ */ j("h3", {
+												children: [/* @__PURE__ */ D("h3", {
 													style: {
 														fontWeight: "var(--font-weight-bold)",
 														fontSize: "var(--font-size-body-md)",
@@ -444,19 +483,30 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 														whiteSpace: "nowrap"
 													},
 													children: e.name
-												}), e.category && /* @__PURE__ */ j(w, {
-													variant: "secondary",
+												}), /* @__PURE__ */ O("div", {
 													style: {
-														marginTop: "var(--space-controlGap)",
-														fontSize: "10px",
-														fontWeight: "var(--font-weight-semibold)",
-														textTransform: "uppercase"
+														display: "flex",
+														alignItems: "center",
+														gap: "var(--space-controlGap)",
+														flexWrap: "wrap",
+														marginTop: "var(--space-controlGap)"
 													},
-													children: e.category
+													children: [e.category && /* @__PURE__ */ D(b, {
+														variant: "secondary",
+														style: {
+															fontSize: "10px",
+															fontWeight: "var(--font-weight-semibold)",
+															textTransform: "uppercase"
+														},
+														children: e.category
+													}), e.status && /* @__PURE__ */ D(N, {
+														status: e.status,
+														label: Ue(e.status)
+													})]
 												})]
 											})]
 										}),
-										/* @__PURE__ */ j("p", {
+										/* @__PURE__ */ D("p", {
 											style: {
 												fontSize: "var(--font-size-body-sm)",
 												lineHeight: "var(--font-lineHeight-normal)",
@@ -468,9 +518,9 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 												WebkitBoxOrient: "vertical",
 												overflow: "hidden"
 											},
-											children: e.description || E("bigconsole.dashboards.card.noDescription", "No description provided")
+											children: e.description || S("bigconsole.dashboards.card.noDescription", "No description provided")
 										}),
-										/* @__PURE__ */ M("div", {
+										/* @__PURE__ */ O("div", {
 											style: {
 												display: "flex",
 												alignItems: "center",
@@ -481,72 +531,72 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 												borderRadius: "var(--radius-button)"
 											},
 											children: [
-												/* @__PURE__ */ M("div", {
+												/* @__PURE__ */ O("div", {
 													style: {
 														display: "flex",
 														alignItems: "center",
 														gap: "var(--space-iconGap)"
 													},
 													children: [
-														/* @__PURE__ */ j(y, { style: {
+														/* @__PURE__ */ D(_, { style: {
 															height: "var(--size-icon-sm)",
 															width: "var(--size-icon-sm)",
 															color: "var(--color-action-primary-bg)"
 														} }),
-														/* @__PURE__ */ j("span", {
+														/* @__PURE__ */ D("span", {
 															style: {
 																fontSize: "var(--font-size-body-sm)",
 																fontWeight: "var(--font-weight-semibold)",
 																color: "var(--color-text-primary)"
 															},
-															children: He(e)
+															children: Ge(e)
 														}),
-														/* @__PURE__ */ j("span", {
+														/* @__PURE__ */ D("span", {
 															style: {
 																fontSize: "var(--font-size-body-sm)",
 																color: "var(--color-text-muted)"
 															},
-															children: E("bigconsole.dashboards.card.pages", "pages")
+															children: S("bigconsole.dashboards.card.pages", "pages")
 														})
 													]
 												}),
-												/* @__PURE__ */ j("div", { style: {
+												/* @__PURE__ */ D("div", { style: {
 													width: "1px",
 													height: "var(--size-icon-sm)",
 													backgroundColor: "var(--color-border-subtle)"
 												} }),
-												/* @__PURE__ */ M("div", {
+												/* @__PURE__ */ O("div", {
 													style: {
 														display: "flex",
 														alignItems: "center",
 														gap: "var(--space-iconGap)"
 													},
 													children: [
-														/* @__PURE__ */ j(v, { style: {
+														/* @__PURE__ */ D(g, { style: {
 															height: "var(--size-icon-sm)",
 															width: "var(--size-icon-sm)",
 															color: "var(--color-action-primary-bg)"
 														} }),
-														/* @__PURE__ */ j("span", {
+														/* @__PURE__ */ D("span", {
 															style: {
 																fontSize: "var(--font-size-body-sm)",
 																fontWeight: "var(--font-weight-semibold)",
 																color: "var(--color-text-primary)"
 															},
-															children: Ve(e)
+															children: We(e)
 														}),
-														/* @__PURE__ */ j("span", {
+														/* @__PURE__ */ D("span", {
 															style: {
 																fontSize: "var(--font-size-body-sm)",
 																color: "var(--color-text-muted)"
 															},
-															children: E("bigconsole.dashboards.card.widgets", "widgets")
+															children: S("bigconsole.dashboards.card.widgets", "widgets")
 														})
 													]
 												})
 											]
 										}),
-										/* @__PURE__ */ M("div", {
+										/* @__PURE__ */ O("div", {
 											style: {
 												display: "flex",
 												alignItems: "center",
@@ -556,78 +606,78 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 												paddingTop: "var(--space-controlGap)",
 												borderTop: "1px solid var(--color-border-subtle)"
 											},
-											children: [/* @__PURE__ */ M("div", {
+											children: [/* @__PURE__ */ O("div", {
 												style: {
 													display: "flex",
 													alignItems: "center",
 													gap: "var(--space-iconGap)"
 												},
-												children: [/* @__PURE__ */ j(g, { style: {
+												children: [/* @__PURE__ */ D(m, { style: {
 													height: "var(--size-icon-sm)",
 													width: "var(--size-icon-sm)",
 													color: "var(--color-text-muted)"
-												} }), /* @__PURE__ */ j("span", {
+												} }), /* @__PURE__ */ D("span", {
 													style: {
 														fontSize: "var(--font-size-body-sm)",
 														fontWeight: "var(--font-weight-medium)",
 														color: "var(--color-text-muted)"
 													},
-													children: Be(e.updatedAt)
+													children: He(e.updatedAt)
 												})]
-											}), /* @__PURE__ */ M("div", {
+											}), /* @__PURE__ */ O("div", {
 												style: {
 													display: "flex",
 													alignItems: "center",
 													gap: "var(--space-controlGap)"
 												},
 												children: [
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_UPDATE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => $(e.id, t),
+															onClick: (t) => Ie(e.id, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
 																padding: 0,
 																borderRadius: "var(--radius-button)"
 															},
-															title: E("bigconsole.dashboards.actions.editTitle", "Edit Dashboard"),
-															children: /* @__PURE__ */ j(x, { style: {
+															title: S("bigconsole.dashboards.actions.editTitle", "Edit Dashboard"),
+															children: /* @__PURE__ */ D(le, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
 														})
 													}),
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_CREATE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => Ie(e.id, e.name, t),
+															onClick: (t) => Re(e.id, e.name, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
 																padding: 0,
 																borderRadius: "var(--radius-button)"
 															},
-															title: E("bigconsole.dashboards.actions.cloneTitle", "Clone Dashboard"),
-															children: /* @__PURE__ */ j(_, { style: {
+															title: S("bigconsole.dashboards.actions.cloneTitle", "Clone Dashboard"),
+															children: /* @__PURE__ */ D(h, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
 														})
 													}),
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_DELETE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => Fe(e.id, t),
+															onClick: (t) => Le(e.id, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
@@ -635,8 +685,8 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 																borderRadius: "var(--radius-button)"
 															},
 															className: "hover:text-status-error-text hover:bg-status-error-bg/10",
-															title: E("bigconsole.dashboards.actions.deleteTitle", "Delete Dashboard"),
-															children: /* @__PURE__ */ j(ce, { style: {
+															title: S("bigconsole.dashboards.actions.deleteTitle", "Delete Dashboard"),
+															children: /* @__PURE__ */ D(fe, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
@@ -649,19 +699,19 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 								})
 							}, e.id))
 						}),
-						!W && H === "list" && Z.length > 0 && /* @__PURE__ */ j("div", {
+						!V && z === "list" && J.length > 0 && /* @__PURE__ */ D("div", {
 							style: {
 								display: "flex",
 								flexDirection: "column",
 								gap: "var(--space-controlGap)"
 							},
-							children: Ee.map((e) => /* @__PURE__ */ j(D, {
-								onClick: () => Pe(e.id),
+							children: Z.map((e) => /* @__PURE__ */ D(C, {
+								onClick: () => Q(e.id),
 								style: { cursor: "pointer" },
 								className: "motion-safe:transition-[box-shadow,border-color] hover:border-[var(--color-border-hover)] hover:shadow-[var(--shadow-elevation-2)]",
-								children: /* @__PURE__ */ j(O, {
+								children: /* @__PURE__ */ D(w, {
 									style: { padding: "var(--space-cardPadding)" },
-									children: /* @__PURE__ */ M("div", {
+									children: /* @__PURE__ */ O("div", {
 										style: {
 											display: "flex",
 											alignItems: "center",
@@ -669,7 +719,7 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 											flexWrap: "wrap"
 										},
 										children: [
-											/* @__PURE__ */ j("div", {
+											/* @__PURE__ */ D("div", {
 												style: {
 													display: "flex",
 													height: "var(--size-controlHeight-lg)",
@@ -680,7 +730,7 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 													borderRadius: "var(--radius-button)",
 													backgroundColor: "var(--color-bg-accentSubtle)"
 												},
-												children: /* @__PURE__ */ j(b, {
+												children: /* @__PURE__ */ D(v, {
 													"aria-hidden": "true",
 													style: {
 														height: "var(--size-icon-md)",
@@ -689,40 +739,47 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 													}
 												})
 											}),
-											/* @__PURE__ */ M("div", {
+											/* @__PURE__ */ O("div", {
 												style: {
 													flex: "1 1 12rem",
 													minWidth: 0
 												},
-												children: [/* @__PURE__ */ M("div", {
+												children: [/* @__PURE__ */ O("div", {
 													style: {
 														display: "flex",
 														alignItems: "center",
 														gap: "var(--space-controlGap)",
 														flexWrap: "wrap"
 													},
-													children: [/* @__PURE__ */ j("h3", {
-														style: {
-															fontWeight: "var(--font-weight-bold)",
-															fontSize: "var(--font-size-body-md)",
-															margin: 0,
-															color: "var(--color-text-primary)",
-															overflow: "hidden",
-															textOverflow: "ellipsis",
-															whiteSpace: "nowrap",
-															maxWidth: "100%"
-														},
-														children: e.name
-													}), e.category && /* @__PURE__ */ j(w, {
-														variant: "secondary",
-														style: {
-															fontSize: "10px",
-															fontWeight: "var(--font-weight-semibold)",
-															textTransform: "uppercase"
-														},
-														children: e.category
-													})]
-												}), /* @__PURE__ */ j("p", {
+													children: [
+														/* @__PURE__ */ D("h3", {
+															style: {
+																fontWeight: "var(--font-weight-bold)",
+																fontSize: "var(--font-size-body-md)",
+																margin: 0,
+																color: "var(--color-text-primary)",
+																overflow: "hidden",
+																textOverflow: "ellipsis",
+																whiteSpace: "nowrap",
+																maxWidth: "100%"
+															},
+															children: e.name
+														}),
+														e.category && /* @__PURE__ */ D(b, {
+															variant: "secondary",
+															style: {
+																fontSize: "10px",
+																fontWeight: "var(--font-weight-semibold)",
+																textTransform: "uppercase"
+															},
+															children: e.category
+														}),
+														e.status && /* @__PURE__ */ D(N, {
+															status: e.status,
+															label: Ue(e.status)
+														})
+													]
+												}), /* @__PURE__ */ D("p", {
 													style: {
 														fontSize: "var(--font-size-body-sm)",
 														lineHeight: "var(--font-lineHeight-normal)",
@@ -732,10 +789,10 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 														textOverflow: "ellipsis",
 														whiteSpace: "nowrap"
 													},
-													children: e.description || E("bigconsole.dashboards.card.noDescription", "No description provided")
+													children: e.description || S("bigconsole.dashboards.card.noDescription", "No description provided")
 												})]
 											}),
-											/* @__PURE__ */ M("div", {
+											/* @__PURE__ */ O("div", {
 												style: {
 													display: "flex",
 													alignItems: "center",
@@ -743,139 +800,139 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 													flexWrap: "wrap"
 												},
 												children: [
-													/* @__PURE__ */ M("div", {
+													/* @__PURE__ */ O("div", {
 														style: {
 															display: "flex",
 															alignItems: "center",
 															gap: "var(--space-iconGap)"
 														},
 														children: [
-															/* @__PURE__ */ j(y, { style: {
+															/* @__PURE__ */ D(_, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)",
 																color: "var(--color-action-primary-bg)"
 															} }),
-															/* @__PURE__ */ j("span", {
+															/* @__PURE__ */ D("span", {
 																style: {
 																	fontSize: "var(--font-size-body-sm)",
 																	fontWeight: "var(--font-weight-semibold)",
 																	color: "var(--color-text-primary)"
 																},
-																children: He(e)
+																children: Ge(e)
 															}),
-															/* @__PURE__ */ j("span", {
+															/* @__PURE__ */ D("span", {
 																style: {
 																	fontSize: "var(--font-size-body-sm)",
 																	color: "var(--color-text-muted)"
 																},
-																children: E("bigconsole.dashboards.card.pages", "pages")
+																children: S("bigconsole.dashboards.card.pages", "pages")
 															})
 														]
 													}),
-													/* @__PURE__ */ M("div", {
+													/* @__PURE__ */ O("div", {
 														style: {
 															display: "flex",
 															alignItems: "center",
 															gap: "var(--space-iconGap)"
 														},
 														children: [
-															/* @__PURE__ */ j(v, { style: {
+															/* @__PURE__ */ D(g, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)",
 																color: "var(--color-action-primary-bg)"
 															} }),
-															/* @__PURE__ */ j("span", {
+															/* @__PURE__ */ D("span", {
 																style: {
 																	fontSize: "var(--font-size-body-sm)",
 																	fontWeight: "var(--font-weight-semibold)",
 																	color: "var(--color-text-primary)"
 																},
-																children: Ve(e)
+																children: We(e)
 															}),
-															/* @__PURE__ */ j("span", {
+															/* @__PURE__ */ D("span", {
 																style: {
 																	fontSize: "var(--font-size-body-sm)",
 																	color: "var(--color-text-muted)"
 																},
-																children: E("bigconsole.dashboards.card.widgets", "widgets")
+																children: S("bigconsole.dashboards.card.widgets", "widgets")
 															})
 														]
 													}),
-													/* @__PURE__ */ M("div", {
+													/* @__PURE__ */ O("div", {
 														style: {
 															display: "flex",
 															alignItems: "center",
 															gap: "var(--space-iconGap)"
 														},
-														children: [/* @__PURE__ */ j(g, { style: {
+														children: [/* @__PURE__ */ D(m, { style: {
 															height: "var(--size-icon-sm)",
 															width: "var(--size-icon-sm)",
 															color: "var(--color-text-muted)"
-														} }), /* @__PURE__ */ j("span", {
+														} }), /* @__PURE__ */ D("span", {
 															style: {
 																fontSize: "var(--font-size-body-sm)",
 																fontWeight: "var(--font-weight-medium)",
 																color: "var(--color-text-muted)"
 															},
-															children: Be(e.updatedAt)
+															children: He(e.updatedAt)
 														})]
 													})
 												]
 											}),
-											/* @__PURE__ */ M("div", {
+											/* @__PURE__ */ O("div", {
 												style: {
 													display: "flex",
 													alignItems: "center",
 													gap: "var(--space-controlGap)"
 												},
 												children: [
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_UPDATE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => $(e.id, t),
+															onClick: (t) => Ie(e.id, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
 																padding: 0,
 																borderRadius: "var(--radius-button)"
 															},
-															title: E("bigconsole.dashboards.actions.editTitle", "Edit Dashboard"),
-															children: /* @__PURE__ */ j(x, { style: {
+															title: S("bigconsole.dashboards.actions.editTitle", "Edit Dashboard"),
+															children: /* @__PURE__ */ D(le, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
 														})
 													}),
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_CREATE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => Ie(e.id, e.name, t),
+															onClick: (t) => Re(e.id, e.name, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
 																padding: 0,
 																borderRadius: "var(--radius-button)"
 															},
-															title: E("bigconsole.dashboards.actions.cloneTitle", "Clone Dashboard"),
-															children: /* @__PURE__ */ j(_, { style: {
+															title: S("bigconsole.dashboards.actions.cloneTitle", "Clone Dashboard"),
+															children: /* @__PURE__ */ D(h, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
 														})
 													}),
-													/* @__PURE__ */ j(h, {
+													/* @__PURE__ */ D(p, {
 														permission: a.DASHBOARD_DELETE,
 														deniedBehavior: "hide",
-														children: /* @__PURE__ */ j(T, {
+														children: /* @__PURE__ */ D(x, {
 															variant: "ghost",
 															size: "sm",
-															onClick: (t) => Fe(e.id, t),
+															onClick: (t) => Le(e.id, t),
 															style: {
 																height: "var(--size-controlHeight-md)",
 																width: "var(--size-controlHeight-md)",
@@ -883,8 +940,8 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 																borderRadius: "var(--radius-button)"
 															},
 															className: "hover:text-status-error-text hover:bg-status-error-bg/10",
-															title: E("bigconsole.dashboards.actions.deleteTitle", "Delete Dashboard"),
-															children: /* @__PURE__ */ j(ce, { style: {
+															title: S("bigconsole.dashboards.actions.deleteTitle", "Delete Dashboard"),
+															children: /* @__PURE__ */ D(fe, { style: {
 																height: "var(--size-icon-sm)",
 																width: "var(--size-icon-sm)"
 															} })
@@ -897,43 +954,56 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 								})
 							}, e.id))
 						}),
-						!W && Z.length > P && /* @__PURE__ */ M("nav", {
-							"aria-label": E("bigconsole.dashboards.pagination.label", "Dashboard pages"),
+						!V && J.length > 0 && /* @__PURE__ */ D("p", {
+							"data-testid": "dashboards-range",
+							style: {
+								margin: 0,
+								fontSize: "var(--font-size-body-sm)",
+								color: "var(--color-text-muted)"
+							},
+							children: y("bigconsole.dashboards.pagination.range", "Showing {{from}}–{{to}} of {{total}} dashboards", {
+								from: X + 1,
+								to: X + Z.length,
+								total: J.length
+							})
+						}),
+						!V && J.length > A && /* @__PURE__ */ O("nav", {
+							"aria-label": S("bigconsole.dashboards.pagination.label", "Dashboard pages"),
 							className: "flex flex-wrap items-center justify-center gap-control-gap border-t border-[var(--color-border-subtle)] pt-control-gap",
 							children: [
-								/* @__PURE__ */ M(T, {
+								/* @__PURE__ */ O(x, {
 									variant: "outline",
 									size: "sm",
-									onClick: De,
-									disabled: I <= 1,
-									"aria-label": E("bigconsole.dashboards.pagination.previous", "Previous"),
+									onClick: ke,
+									disabled: M <= 1,
+									"aria-label": S("bigconsole.dashboards.pagination.previous", "Previous"),
 									style: { minHeight: "var(--size-controlHeight-md)" },
-									children: [/* @__PURE__ */ j(re, { style: {
+									children: [/* @__PURE__ */ D(ae, { style: {
 										marginRight: "var(--space-iconGap)",
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)"
-									} }), E("bigconsole.dashboards.pagination.previous", "Previous")]
+									} }), S("bigconsole.dashboards.pagination.previous", "Previous")]
 								}),
-								/* @__PURE__ */ j("div", {
+								/* @__PURE__ */ D("div", {
 									style: {
 										display: "flex",
 										alignItems: "center",
 										gap: "var(--space-iconGap)",
 										flexWrap: "wrap"
 									},
-									children: he(I, Q).map((e, t) => e === null ? /* @__PURE__ */ j("span", {
+									children: ye(M, Y).map((e, t) => e === null ? /* @__PURE__ */ D("span", {
 										"aria-hidden": "true",
 										style: {
 											color: "var(--color-text-muted)",
 											padding: "0 var(--space-iconGap)"
 										},
 										children: "…"
-									}, `gap-${t}`) : /* @__PURE__ */ j(T, {
-										variant: e === I ? "default" : "ghost",
+									}, `gap-${t}`) : /* @__PURE__ */ D(x, {
+										variant: e === M ? "default" : "ghost",
 										size: "sm",
-										onClick: () => ke(e),
-										"aria-current": e === I ? "page" : void 0,
-										"aria-label": E("bigconsole.dashboards.pagination.page", `Page ${e}`),
+										onClick: () => je(e),
+										"aria-current": e === M ? "page" : void 0,
+										"aria-label": S("bigconsole.dashboards.pagination.page", `Page ${e}`),
 										style: {
 											minWidth: "var(--size-controlHeight-md)",
 											height: "var(--size-controlHeight-md)",
@@ -943,67 +1013,67 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 										children: e
 									}, e))
 								}),
-								/* @__PURE__ */ M(T, {
+								/* @__PURE__ */ O(x, {
 									variant: "outline",
 									size: "sm",
-									onClick: Oe,
-									disabled: I >= Q,
-									"aria-label": E("bigconsole.dashboards.pagination.next", "Next"),
+									onClick: Ae,
+									disabled: M >= Y,
+									"aria-label": S("bigconsole.dashboards.pagination.next", "Next"),
 									style: { minHeight: "var(--size-controlHeight-md)" },
-									children: [E("bigconsole.dashboards.pagination.next", "Next"), /* @__PURE__ */ j(ie, { style: {
+									children: [S("bigconsole.dashboards.pagination.next", "Next"), /* @__PURE__ */ D(oe, { style: {
 										marginLeft: "var(--space-iconGap)",
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)"
 									} })]
 								}),
-								/* @__PURE__ */ j("span", {
+								/* @__PURE__ */ D("span", {
 									style: {
 										fontSize: "var(--font-size-body-sm)",
 										color: "var(--color-text-muted)"
 									},
-									children: C("bigconsole.dashboards.pagination.pageOf", "Page {{currentPage}} of {{totalPages}}", {
-										currentPage: I,
-										totalPages: Q
+									children: y("bigconsole.dashboards.pagination.pageOf", "Page {{currentPage}} of {{totalPages}}", {
+										currentPage: M,
+										totalPages: Y
 									})
 								})
 							]
 						}),
-						!W && Z.length === 0 && /* @__PURE__ */ j(de, {
+						!V && J.length === 0 && /* @__PURE__ */ D(he, {
 							treatment: "insight",
 							className: "border-[var(--color-border-seam)]",
-							children: /* @__PURE__ */ j(fe, {
-								illustration: k ? "empty-search" : "empty-data",
-								title: k ? E("bigconsole.dashboards.empty.filteredTitle", "No dashboards found") : E("bigconsole.dashboards.empty.title", "No dashboards yet"),
-								description: k ? E("bigconsole.dashboards.empty.filteredDescription", "Try adjusting your search terms") : E("bigconsole.dashboards.empty.description", "Get started by creating your first dashboard to visualize your data"),
-								action: k ? void 0 : /* @__PURE__ */ M("div", {
+							children: /* @__PURE__ */ D(ge, {
+								illustration: T ? "empty-search" : "empty-data",
+								title: T ? S("bigconsole.dashboards.empty.filteredTitle", "No dashboards found") : S("bigconsole.dashboards.empty.title", "No dashboards yet"),
+								description: T ? S("bigconsole.dashboards.empty.filteredDescription", "Try adjusting your search terms") : S("bigconsole.dashboards.empty.description", "Get started by creating your first dashboard to visualize your data"),
+								action: T ? void 0 : /* @__PURE__ */ O("div", {
 									style: {
 										display: "flex",
 										gap: "var(--space-controlGap)",
 										flexWrap: "wrap",
 										justifyContent: "center"
 									},
-									children: [/* @__PURE__ */ j(h, {
+									children: [/* @__PURE__ */ D(p, {
 										permission: a.DASHBOARD_CREATE,
 										deniedBehavior: "hide",
-										children: /* @__PURE__ */ M(T, {
-											onClick: Ae,
-											children: [/* @__PURE__ */ j(S, { style: {
+										children: /* @__PURE__ */ O(x, {
+											onClick: Me,
+											children: [/* @__PURE__ */ D(ue, { style: {
 												marginRight: "var(--space-iconGap)",
 												height: "var(--size-icon-sm)",
 												width: "var(--size-icon-sm)"
-											} }), E("bigconsole.dashboards.actions.create", "Create Dashboard")]
+											} }), S("bigconsole.dashboards.actions.create", "Create Dashboard")]
 										})
-									}), /* @__PURE__ */ j(h, {
+									}), /* @__PURE__ */ D(p, {
 										permission: a.DASHBOARD_IMPORT,
 										deniedBehavior: "hide",
-										children: /* @__PURE__ */ M(T, {
+										children: /* @__PURE__ */ O(x, {
 											variant: "outline",
-											onClick: Le,
-											children: [/* @__PURE__ */ j(le, { style: {
+											onClick: ze,
+											children: [/* @__PURE__ */ D(pe, { style: {
 												marginRight: "var(--space-iconGap)",
 												height: "var(--size-icon-sm)",
 												width: "var(--size-icon-sm)"
-											} }), E("bigconsole.dashboards.actions.importDashboard", "Import Dashboard")]
+											} }), S("bigconsole.dashboards.actions.importDashboard", "Import Dashboard")]
 										})
 									})]
 								})
@@ -1012,22 +1082,22 @@ var ge = d(function({ title: e, subtitle: t, createLabel: n, importLabel: r, onC
 					]
 				})] })
 			}),
-			/* @__PURE__ */ j(o, {
-				isOpen: _e,
-				isCreating: z,
-				onClose: Me,
-				onCreate: Ne,
-				onTemplateInstalled: je
+			/* @__PURE__ */ D(o, {
+				isOpen: xe,
+				isCreating: I,
+				onClose: Pe,
+				onCreate: Fe,
+				onTemplateInstalled: Ne
 			}),
-			/* @__PURE__ */ j(s, {
-				isOpen: ve,
-				onClose: Re,
-				onSuccess: ze
+			/* @__PURE__ */ D(te, {
+				isOpen: Se,
+				onClose: Be,
+				onSuccess: Ve
 			})
 		]
 	});
 });
 //#endregion
-export { I as DashboardsPage, I as default };
+export { P as DashboardsPage, P as default };
 
 //# sourceMappingURL=DashboardsPage.js.map