@wakastellar/ui 4.0.0 → 4.0.1

package/dist/blocks/dashboard/index.es.js

@@ -0,0 +1,273 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Button as t } from "../../components/button/index.es.js";
+import { Card as n, CardContent as r, CardDescription as i, CardHeader as a, CardTitle as o } from "../../components/card/index.es.js";
+import { DropdownMenu as s, DropdownMenuContent as c, DropdownMenuItem as l, DropdownMenuTrigger as u } from "../../components/dropdown-menu/index.es.js";
+import d, { WakaStatGroup as f } from "../../components/waka-stat/index.es.js";
+import * as p from "react";
+import { Activity as m, ArrowUpRight as h, Calendar as g, DollarSign as _, MoreHorizontal as v, RefreshCw as y, ShoppingCart as b, Users as x } from "lucide-react";
+import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
+//#region src/blocks/dashboard/index.tsx
+var T = p.createContext({});
+function E() {
+	return p.useContext(T);
+}
+function D({ title: n = "Tableau de bord", description: r, period: i, onPeriodChange: a, periods: o = [
+	{
+		value: "today",
+		label: "Aujourd'hui"
+	},
+	{
+		value: "week",
+		label: "Cette semaine"
+	},
+	{
+		value: "month",
+		label: "Ce mois"
+	},
+	{
+		value: "year",
+		label: "Cette année"
+	}
+], onRefresh: d, loading: f, quickActions: p }) {
+	return /* @__PURE__ */ w("div", {
+		className: "flex flex-col gap-4 md:flex-row md:items-center md:justify-between",
+		children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("h1", {
+			className: "text-2xl font-bold tracking-tight",
+			children: n
+		}), r && /* @__PURE__ */ C("p", {
+			className: "text-muted-foreground mt-1",
+			children: r
+		})] }), /* @__PURE__ */ w("div", {
+			className: "flex items-center gap-2 flex-wrap",
+			children: [
+				a && /* @__PURE__ */ w(s, { children: [/* @__PURE__ */ C(u, {
+					asChild: !0,
+					children: /* @__PURE__ */ w(t, {
+						variant: "outline",
+						size: "sm",
+						children: [/* @__PURE__ */ C(g, { className: "mr-2 h-4 w-4" }), o.find((e) => e.value === i)?.label || "Période"]
+					})
+				}), /* @__PURE__ */ C(c, {
+					align: "end",
+					children: o.map((t) => /* @__PURE__ */ C(l, {
+						onClick: () => a(t.value),
+						className: e(i === t.value && "bg-muted"),
+						children: t.label
+					}, t.value))
+				})] }),
+				d && /* @__PURE__ */ C(t, {
+					variant: "outline",
+					size: "sm",
+					onClick: d,
+					disabled: f,
+					children: /* @__PURE__ */ C(y, { className: e("h-4 w-4", f && "animate-spin") })
+				}),
+				p?.map((e) => {
+					let { LinkComponent: n } = E();
+					return /* @__PURE__ */ C(t, {
+						variant: e.variant || "default",
+						size: "sm",
+						onClick: e.onClick,
+						asChild: !!e.href,
+						children: e.href ? w(n || "a", {
+							href: e.href,
+							children: [e.icon && /* @__PURE__ */ C("span", {
+								className: "mr-2",
+								children: e.icon
+							}), e.label]
+						}) : /* @__PURE__ */ w(S, { children: [e.icon && /* @__PURE__ */ C("span", {
+							className: "mr-2",
+							children: e.icon
+						}), e.label] })
+					}, e.id);
+				})
+			]
+		})]
+	});
+}
+function O({ stats: e, layout: t = "grid", columns: n = 4, loading: r }) {
+	return /* @__PURE__ */ C(f, {
+		layout: t,
+		columns: n,
+		gap: "md",
+		children: e.map((e) => /* @__PURE__ */ C(d, {
+			label: e.label,
+			value: e.value,
+			trend: e.trend,
+			trendValue: e.trendValue,
+			trendText: e.trendText,
+			icon: e.icon,
+			color: e.color,
+			variant: "card",
+			loading: r
+		}, e.id))
+	});
+}
+function k({ config: e }) {
+	return /* @__PURE__ */ w(n, { children: [/* @__PURE__ */ w(a, {
+		className: "flex flex-row items-center justify-between pb-2",
+		children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C(o, {
+			className: "text-base",
+			children: e.title
+		}), e.description && /* @__PURE__ */ C(i, { children: e.description })] }), e.actions && e.actions.length > 0 && /* @__PURE__ */ w(s, { children: [/* @__PURE__ */ C(u, {
+			asChild: !0,
+			children: /* @__PURE__ */ C(t, {
+				variant: "ghost",
+				size: "icon",
+				className: "h-8 w-8",
+				children: /* @__PURE__ */ C(v, { className: "h-4 w-4" })
+			})
+		}), /* @__PURE__ */ C(c, {
+			align: "end",
+			children: e.actions.map((e, t) => /* @__PURE__ */ C(l, {
+				onClick: e.onClick,
+				children: e.label
+			}, t))
+		})] })]
+	}), /* @__PURE__ */ C(r, { children: e.chart })] });
+}
+function A({ config: e }) {
+	let { LinkComponent: s } = E();
+	return /* @__PURE__ */ w(n, { children: [/* @__PURE__ */ w(a, {
+		className: "flex flex-row items-center justify-between pb-2",
+		children: [/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C(o, {
+			className: "text-base",
+			children: e.title
+		}), e.description && /* @__PURE__ */ C(i, { children: e.description })] }), e.actions && e.actions.length > 0 && /* @__PURE__ */ C("div", {
+			className: "flex gap-2",
+			children: e.actions.map((e, n) => /* @__PURE__ */ C(t, {
+				variant: "outline",
+				size: "sm",
+				onClick: e.onClick,
+				asChild: !!e.href,
+				children: e.href ? w(s || "a", {
+					href: e.href,
+					children: [e.label, /* @__PURE__ */ C(h, { className: "ml-1 h-3 w-3" })]
+				}) : e.label
+			}, n))
+		})]
+	}), /* @__PURE__ */ C(r, { children: e.table })] });
+}
+function j({ activities: t }) {
+	let i = (e) => {
+		let t = typeof e == "string" ? new Date(e) : e, n = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), r = Math.floor(n / 6e4), i = Math.floor(r / 60), a = Math.floor(i / 24);
+		return r < 1 ? "À l'instant" : r < 60 ? `Il y a ${r} min` : i < 24 ? `Il y a ${i}h` : a < 7 ? `Il y a ${a}j` : t.toLocaleDateString("fr-FR");
+	}, s = {
+		info: "bg-blue-500",
+		success: "bg-green-500",
+		warning: "bg-yellow-500",
+		error: "bg-red-500"
+	};
+	return /* @__PURE__ */ w(n, { children: [/* @__PURE__ */ C(a, { children: /* @__PURE__ */ C(o, {
+		className: "text-base",
+		children: "Activité récente"
+	}) }), /* @__PURE__ */ C(r, { children: /* @__PURE__ */ C("div", {
+		className: "space-y-4",
+		children: t.map((t) => /* @__PURE__ */ w("div", {
+			className: "flex items-start gap-3",
+			children: [
+				/* @__PURE__ */ C("div", { className: e("h-2 w-2 rounded-full mt-2 flex-shrink-0", s[t.type || "info"]) }),
+				/* @__PURE__ */ w("div", {
+					className: "flex-1 min-w-0",
+					children: [/* @__PURE__ */ C("p", {
+						className: "text-sm font-medium",
+						children: t.title
+					}), t.description && /* @__PURE__ */ C("p", {
+						className: "text-xs text-muted-foreground truncate",
+						children: t.description
+					})]
+				}),
+				/* @__PURE__ */ C("span", {
+					className: "text-xs text-muted-foreground flex-shrink-0",
+					children: i(t.timestamp)
+				})
+			]
+		}, t.id))
+	}) })] });
+}
+function M({ title: t = "Tableau de bord", description: n, stats: r, charts: i, tables: a, activities: o, quickActions: s, showHeader: c = !0, onRefresh: l, loading: u = !1, period: d = "month", onPeriodChange: f, periods: m, statsLayout: h = "grid", statsColumns: g = 4, className: _, LinkComponent: v }) {
+	let y = p.useMemo(() => ({ LinkComponent: v }), [v]);
+	return /* @__PURE__ */ C(T.Provider, {
+		value: y,
+		children: /* @__PURE__ */ w("div", {
+			className: e("space-y-6", _),
+			children: [
+				c && /* @__PURE__ */ C(D, {
+					title: t,
+					description: n,
+					period: d,
+					onPeriodChange: f,
+					periods: m,
+					onRefresh: l,
+					loading: u,
+					quickActions: s
+				}),
+				r && r.length > 0 && /* @__PURE__ */ C(O, {
+					stats: r,
+					layout: h,
+					columns: g,
+					loading: u
+				}),
+				i && i.length > 0 && /* @__PURE__ */ C("div", {
+					className: "grid gap-6 md:grid-cols-2",
+					children: i.map((e) => /* @__PURE__ */ C(k, { config: e }, e.id))
+				}),
+				/* @__PURE__ */ w("div", {
+					className: "grid gap-6 lg:grid-cols-3",
+					children: [a && a.length > 0 && /* @__PURE__ */ C("div", {
+						className: e("space-y-6", o ? "lg:col-span-2" : "lg:col-span-3"),
+						children: a.map((e) => /* @__PURE__ */ C(A, { config: e }, e.id))
+					}), o && o.length > 0 && /* @__PURE__ */ C("div", {
+						className: e(!a || a.length === 0 ? "lg:col-span-3" : ""),
+						children: /* @__PURE__ */ C(j, { activities: o })
+					})]
+				})
+			]
+		})
+	});
+}
+var N = [
+	{
+		id: "revenue",
+		label: "Revenus",
+		value: "€45,231.89",
+		trend: "up",
+		trendValue: "+20.1%",
+		trendText: "vs mois dernier",
+		icon: /* @__PURE__ */ C(_, { className: "h-5 w-5" }),
+		color: "success"
+	},
+	{
+		id: "users",
+		label: "Utilisateurs",
+		value: "2,350",
+		trend: "up",
+		trendValue: "+180",
+		trendText: "cette semaine",
+		icon: /* @__PURE__ */ C(x, { className: "h-5 w-5" }),
+		color: "blue"
+	},
+	{
+		id: "orders",
+		label: "Commandes",
+		value: "12,234",
+		trend: "down",
+		trendValue: "-4.3%",
+		trendText: "vs mois dernier",
+		icon: /* @__PURE__ */ C(b, { className: "h-5 w-5" }),
+		color: "purple"
+	},
+	{
+		id: "performance",
+		label: "Performance",
+		value: "94.2%",
+		trend: "up",
+		trendValue: "+2.4%",
+		icon: /* @__PURE__ */ C(m, { className: "h-5 w-5" }),
+		color: "primary"
+	}
+];
+//#endregion
+export { M as default, N as defaultDashboardStats };

package/dist/blocks/dashboard-kpi/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../../components/badge/index.cjs.js`),r=require(`../../components/button/index.cjs.js`),i=require(`../../components/card/index.cjs.js`),a=require(`../../components/select/index.cjs.js`),o=require(`../../components/progress/index.cjs.js`);let s=require(`react`);s=e.__toESM(s);let c=require(`lucide-react`),l=require(`react/jsx-runtime`);var u={default:`text-foreground`,blue:`text-blue-500`,green:`text-green-500`,yellow:`text-yellow-500`,red:`text-red-500`,purple:`text-purple-500`},d={default:`bg-muted`,blue:`bg-blue-500/10`,green:`bg-green-500/10`,yellow:`bg-yellow-500/10`,red:`bg-red-500/10`,purple:`bg-purple-500/10`};function f({data:e,color:n=`blue`}){let r=Math.max(...e),i=Math.min(...e),a=r-i||1;return(0,l.jsx)(`svg`,{className:`w-16 h-8`,viewBox:`0 0 100 100`,preserveAspectRatio:`none`,children:(0,l.jsx)(`polyline`,{points:e.map((t,n)=>`${n/(e.length-1)*100},${100-(t-i)/a*100}`).join(` `),fill:`none`,stroke:`currentColor`,strokeWidth:`3`,className:t.cn(`opacity-60`,u[n]||u.blue)})})}function p({metric:e}){let n=e.icon,r=e.trend===`up`?`text-green-500`:e.trend===`down`?`text-red-500`:`text-muted-foreground`,a=e.trend===`up`?c.TrendingUp:e.trend===`down`?c.TrendingDown:null;return(0,l.jsxs)(i.Card,{className:`relative overflow-hidden`,children:[(0,l.jsxs)(i.CardHeader,{className:`flex flex-row items-center justify-between pb-2`,children:[(0,l.jsx)(i.CardTitle,{className:`text-sm font-medium text-muted-foreground`,children:e.label}),n&&(0,l.jsx)(`div`,{className:t.cn(`p-2 rounded-lg`,d[e.color||`default`]),children:(0,l.jsx)(`span`,{className:t.cn(`h-4 w-4`,u[e.color||`default`]),children:n})})]}),(0,l.jsxs)(i.CardContent,{children:[(0,l.jsxs)(`div`,{className:`flex items-end justify-between`,children:[(0,l.jsxs)(`div`,{children:[(0,l.jsx)(`div`,{className:`text-2xl font-bold`,children:e.value}),e.change!==void 0&&(0,l.jsxs)(`div`,{className:t.cn(`flex items-center gap-1 text-sm`,r),children:[a&&(0,l.jsx)(a,{className:`h-3 w-3`}),(0,l.jsxs)(`span`,{children:[e.change>0?`+`:``,e.change,`%`]}),e.changeLabel&&(0,l.jsx)(`span`,{className:`text-muted-foreground`,children:e.changeLabel})]})]}),e.sparkline&&(0,l.jsx)(f,{data:e.sparkline,color:e.color})]}),e.target!==void 0&&e.current!==void 0&&(0,l.jsxs)(`div`,{className:`mt-4`,children:[(0,l.jsxs)(`div`,{className:`flex justify-between text-xs text-muted-foreground mb-1`,children:[(0,l.jsx)(`span`,{children:`Progress`}),(0,l.jsxs)(`span`,{children:[Math.round(e.current/e.target*100),`%`]})]}),(0,l.jsx)(o.Progress,{value:e.current/e.target*100,className:`h-1.5`})]})]})]})}function m({goal:e}){let r=e.current/e.target*100,i=r>=100;return(0,l.jsxs)(`div`,{className:`flex items-center gap-4 p-4 rounded-lg border bg-card`,children:[(0,l.jsx)(`div`,{className:t.cn(`h-10 w-10 rounded-full flex items-center justify-center`,i?`bg-green-500/10 text-green-500`:`bg-muted text-muted-foreground`),children:(0,l.jsx)(c.Target,{className:`h-5 w-5`})}),(0,l.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,l.jsxs)(`div`,{className:`flex items-center justify-between mb-1`,children:[(0,l.jsx)(`span`,{className:`font-medium truncate`,children:e.label}),(0,l.jsxs)(`span`,{className:`text-sm text-muted-foreground`,children:[e.current,e.unit,` / `,e.target,e.unit]})]}),(0,l.jsx)(o.Progress,{value:Math.min(r,100),className:`h-2`})]}),i&&(0,l.jsx)(n.Badge,{variant:`default`,className:`bg-green-500`,children:`Complete`})]})}function h({title:e=`Dashboard`,description:o,metrics:s,periods:u=[{value:`7d`,label:`7 days`},{value:`30d`,label:`30 days`},{value:`90d`,label:`90 days`},{value:`12m`,label:`12 months`}],selectedPeriod:d=`30d`,onPeriodChange:f,onRefresh:h,onExport:g,chart:_,secondaryMetrics:v,goals:y,isLoading:b=!1,lastUpdated:x,className:S}){return(0,l.jsxs)(`div`,{className:t.cn(`space-y-6`,S),children:[(0,l.jsxs)(`div`,{className:`flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between`,children:[(0,l.jsxs)(`div`,{children:[(0,l.jsx)(`h1`,{className:`text-2xl font-bold tracking-tight`,children:e}),o&&(0,l.jsx)(`p`,{className:`text-muted-foreground`,children:o})]}),(0,l.jsxs)(`div`,{className:`flex items-center gap-2`,children:[u.length>0&&(0,l.jsxs)(a.Select,{value:d,onValueChange:f,children:[(0,l.jsxs)(a.SelectTrigger,{className:`w-[140px]`,children:[(0,l.jsx)(c.Calendar,{className:`h-4 w-4 mr-2`}),(0,l.jsx)(a.SelectValue,{})]}),(0,l.jsx)(a.SelectContent,{children:u.map(e=>(0,l.jsx)(a.SelectItem,{value:e.value,children:e.label},e.value))})]}),h&&(0,l.jsx)(r.Button,{variant:`outline`,size:`icon`,onClick:h,disabled:b,children:(0,l.jsx)(c.RefreshCw,{className:t.cn(`h-4 w-4`,b&&`animate-spin`)})}),g&&(0,l.jsx)(r.Button,{variant:`outline`,size:`icon`,onClick:g,children:(0,l.jsx)(c.Download,{className:`h-4 w-4`})})]})]}),x&&(0,l.jsxs)(`div`,{className:`flex items-center gap-2 text-sm text-muted-foreground`,children:[(0,l.jsx)(c.Clock,{className:`h-4 w-4`}),(0,l.jsxs)(`span`,{children:[`Last updated: `,typeof x==`string`?x:x.toLocaleString()]})]}),(0,l.jsx)(`div`,{className:`grid gap-4 md:grid-cols-2 lg:grid-cols-4`,children:s.slice(0,4).map(e=>(0,l.jsx)(p,{metric:e},e.id))}),_&&(0,l.jsxs)(i.Card,{children:[(0,l.jsxs)(i.CardHeader,{children:[(0,l.jsx)(i.CardTitle,{children:`Overview`}),(0,l.jsx)(i.CardDescription,{children:`Performance metrics over time`})]}),(0,l.jsx)(i.CardContent,{children:_})]}),v&&v.length>0&&(0,l.jsx)(`div`,{className:`grid gap-4 md:grid-cols-2 lg:grid-cols-3`,children:v.map(e=>(0,l.jsx)(i.Card,{children:(0,l.jsx)(i.CardContent,{className:`pt-6`,children:(0,l.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,l.jsxs)(`div`,{children:[(0,l.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.label}),(0,l.jsx)(`p`,{className:`text-xl font-bold`,children:e.value})]}),e.change!==void 0&&(0,l.jsxs)(n.Badge,{variant:e.trend===`up`?`default`:e.trend===`down`?`destructive`:`secondary`,className:`gap-1`,children:[e.trend===`up`?(0,l.jsx)(c.ArrowUpRight,{className:`h-3 w-3`}):e.trend===`down`?(0,l.jsx)(c.ArrowDownRight,{className:`h-3 w-3`}):null,e.change>0?`+`:``,e.change,`%`]})]})})},e.id))}),y&&y.length>0&&(0,l.jsxs)(i.Card,{children:[(0,l.jsxs)(i.CardHeader,{children:[(0,l.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,l.jsx)(c.Target,{className:`h-5 w-5`}),`Goals & Targets`]}),(0,l.jsx)(i.CardDescription,{children:`Track your progress towards key objectives`})]}),(0,l.jsx)(i.CardContent,{className:`space-y-4`,children:y.map(e=>(0,l.jsx)(m,{goal:e},e.id))})]})]})}var g=[{id:`revenue`,label:`Total Revenue`,value:`$45,231.89`,change:20.1,changeLabel:`from last month`,trend:`up`,icon:(0,l.jsx)(c.DollarSign,{className:`h-4 w-4`}),color:`green`,sparkline:[30,40,35,50,49,60,70,91,125]},{id:`subscriptions`,label:`Subscriptions`,value:`+2,350`,change:180.1,changeLabel:`from last month`,trend:`up`,icon:(0,l.jsx)(c.Users,{className:`h-4 w-4`}),color:`blue`,sparkline:[10,20,30,40,50,60,70,80,90]},{id:`sales`,label:`Sales`,value:`+12,234`,change:19,changeLabel:`from last month`,trend:`up`,icon:(0,l.jsx)(c.ShoppingCart,{className:`h-4 w-4`}),color:`purple`,sparkline:[65,59,80,81,56,55,70,80,95]},{id:`active`,label:`Active Now`,value:`+573`,change:-2.5,changeLabel:`from last hour`,trend:`down`,icon:(0,l.jsx)(c.Activity,{className:`h-4 w-4`}),color:`yellow`,sparkline:[100,90,85,88,70,65,60,58,55]}],_=[{id:`revenue-goal`,label:`Monthly Revenue Target`,current:45231,target:5e4,unit:`$`},{id:`users-goal`,label:`New User Signups`,current:2350,target:2e3,unit:``},{id:`conversion-goal`,label:`Conversion Rate`,current:3.2,target:5,unit:`%`}];exports.default=h,exports.defaultGoals=_,exports.defaultKPIMetrics=g;

package/dist/blocks/dashboard-kpi/index.es.js

@@ -0,0 +1,345 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Badge as t } from "../../components/badge/index.es.js";
+import { Button as n } from "../../components/button/index.es.js";
+import { Card as r, CardContent as i, CardDescription as a, CardHeader as o, CardTitle as s } from "../../components/card/index.es.js";
+import { Select as c, SelectContent as l, SelectItem as u, SelectTrigger as d, SelectValue as f } from "../../components/select/index.es.js";
+import { Progress as p } from "../../components/progress/index.es.js";
+import "react";
+import { Activity as m, ArrowDownRight as h, ArrowUpRight as g, Calendar as _, Clock as v, DollarSign as y, Download as b, RefreshCw as x, ShoppingCart as S, Target as C, TrendingDown as w, TrendingUp as T, Users as E } from "lucide-react";
+import { jsx as D, jsxs as O } from "react/jsx-runtime";
+//#region src/blocks/dashboard-kpi/index.tsx
+var k = {
+	default: "text-foreground",
+	blue: "text-blue-500",
+	green: "text-green-500",
+	yellow: "text-yellow-500",
+	red: "text-red-500",
+	purple: "text-purple-500"
+}, A = {
+	default: "bg-muted",
+	blue: "bg-blue-500/10",
+	green: "bg-green-500/10",
+	yellow: "bg-yellow-500/10",
+	red: "bg-red-500/10",
+	purple: "bg-purple-500/10"
+};
+function j({ data: t, color: n = "blue" }) {
+	let r = Math.max(...t), i = Math.min(...t), a = r - i || 1;
+	return /* @__PURE__ */ D("svg", {
+		className: "w-16 h-8",
+		viewBox: "0 0 100 100",
+		preserveAspectRatio: "none",
+		children: /* @__PURE__ */ D("polyline", {
+			points: t.map((e, n) => `${n / (t.length - 1) * 100},${100 - (e - i) / a * 100}`).join(" "),
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "3",
+			className: e("opacity-60", k[n] || k.blue)
+		})
+	});
+}
+function M({ metric: t }) {
+	let n = t.icon, a = t.trend === "up" ? "text-green-500" : t.trend === "down" ? "text-red-500" : "text-muted-foreground", c = t.trend === "up" ? T : t.trend === "down" ? w : null;
+	return /* @__PURE__ */ O(r, {
+		className: "relative overflow-hidden",
+		children: [/* @__PURE__ */ O(o, {
+			className: "flex flex-row items-center justify-between pb-2",
+			children: [/* @__PURE__ */ D(s, {
+				className: "text-sm font-medium text-muted-foreground",
+				children: t.label
+			}), n && /* @__PURE__ */ D("div", {
+				className: e("p-2 rounded-lg", A[t.color || "default"]),
+				children: /* @__PURE__ */ D("span", {
+					className: e("h-4 w-4", k[t.color || "default"]),
+					children: n
+				})
+			})]
+		}), /* @__PURE__ */ O(i, { children: [/* @__PURE__ */ O("div", {
+			className: "flex items-end justify-between",
+			children: [/* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("div", {
+				className: "text-2xl font-bold",
+				children: t.value
+			}), t.change !== void 0 && /* @__PURE__ */ O("div", {
+				className: e("flex items-center gap-1 text-sm", a),
+				children: [
+					c && /* @__PURE__ */ D(c, { className: "h-3 w-3" }),
+					/* @__PURE__ */ O("span", { children: [
+						t.change > 0 ? "+" : "",
+						t.change,
+						"%"
+					] }),
+					t.changeLabel && /* @__PURE__ */ D("span", {
+						className: "text-muted-foreground",
+						children: t.changeLabel
+					})
+				]
+			})] }), t.sparkline && /* @__PURE__ */ D(j, {
+				data: t.sparkline,
+				color: t.color
+			})]
+		}), t.target !== void 0 && t.current !== void 0 && /* @__PURE__ */ O("div", {
+			className: "mt-4",
+			children: [/* @__PURE__ */ O("div", {
+				className: "flex justify-between text-xs text-muted-foreground mb-1",
+				children: [/* @__PURE__ */ D("span", { children: "Progress" }), /* @__PURE__ */ O("span", { children: [Math.round(t.current / t.target * 100), "%"] })]
+			}), /* @__PURE__ */ D(p, {
+				value: t.current / t.target * 100,
+				className: "h-1.5"
+			})]
+		})] })]
+	});
+}
+function N({ goal: n }) {
+	let r = n.current / n.target * 100, i = r >= 100;
+	return /* @__PURE__ */ O("div", {
+		className: "flex items-center gap-4 p-4 rounded-lg border bg-card",
+		children: [
+			/* @__PURE__ */ D("div", {
+				className: e("h-10 w-10 rounded-full flex items-center justify-center", i ? "bg-green-500/10 text-green-500" : "bg-muted text-muted-foreground"),
+				children: /* @__PURE__ */ D(C, { className: "h-5 w-5" })
+			}),
+			/* @__PURE__ */ O("div", {
+				className: "flex-1 min-w-0",
+				children: [/* @__PURE__ */ O("div", {
+					className: "flex items-center justify-between mb-1",
+					children: [/* @__PURE__ */ D("span", {
+						className: "font-medium truncate",
+						children: n.label
+					}), /* @__PURE__ */ O("span", {
+						className: "text-sm text-muted-foreground",
+						children: [
+							n.current,
+							n.unit,
+							" / ",
+							n.target,
+							n.unit
+						]
+					})]
+				}), /* @__PURE__ */ D(p, {
+					value: Math.min(r, 100),
+					className: "h-2"
+				})]
+			}),
+			i && /* @__PURE__ */ D(t, {
+				variant: "default",
+				className: "bg-green-500",
+				children: "Complete"
+			})
+		]
+	});
+}
+function P({ title: p = "Dashboard", description: m, metrics: y, periods: S = [
+	{
+		value: "7d",
+		label: "7 days"
+	},
+	{
+		value: "30d",
+		label: "30 days"
+	},
+	{
+		value: "90d",
+		label: "90 days"
+	},
+	{
+		value: "12m",
+		label: "12 months"
+	}
+], selectedPeriod: w = "30d", onPeriodChange: T, onRefresh: E, onExport: k, chart: A, secondaryMetrics: j, goals: P, isLoading: F = !1, lastUpdated: I, className: L }) {
+	return /* @__PURE__ */ O("div", {
+		className: e("space-y-6", L),
+		children: [
+			/* @__PURE__ */ O("div", {
+				className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
+				children: [/* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("h1", {
+					className: "text-2xl font-bold tracking-tight",
+					children: p
+				}), m && /* @__PURE__ */ D("p", {
+					className: "text-muted-foreground",
+					children: m
+				})] }), /* @__PURE__ */ O("div", {
+					className: "flex items-center gap-2",
+					children: [
+						S.length > 0 && /* @__PURE__ */ O(c, {
+							value: w,
+							onValueChange: T,
+							children: [/* @__PURE__ */ O(d, {
+								className: "w-[140px]",
+								children: [/* @__PURE__ */ D(_, { className: "h-4 w-4 mr-2" }), /* @__PURE__ */ D(f, {})]
+							}), /* @__PURE__ */ D(l, { children: S.map((e) => /* @__PURE__ */ D(u, {
+								value: e.value,
+								children: e.label
+							}, e.value)) })]
+						}),
+						E && /* @__PURE__ */ D(n, {
+							variant: "outline",
+							size: "icon",
+							onClick: E,
+							disabled: F,
+							children: /* @__PURE__ */ D(x, { className: e("h-4 w-4", F && "animate-spin") })
+						}),
+						k && /* @__PURE__ */ D(n, {
+							variant: "outline",
+							size: "icon",
+							onClick: k,
+							children: /* @__PURE__ */ D(b, { className: "h-4 w-4" })
+						})
+					]
+				})]
+			}),
+			I && /* @__PURE__ */ O("div", {
+				className: "flex items-center gap-2 text-sm text-muted-foreground",
+				children: [/* @__PURE__ */ D(v, { className: "h-4 w-4" }), /* @__PURE__ */ O("span", { children: ["Last updated: ", typeof I == "string" ? I : I.toLocaleString()] })]
+			}),
+			/* @__PURE__ */ D("div", {
+				className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4",
+				children: y.slice(0, 4).map((e) => /* @__PURE__ */ D(M, { metric: e }, e.id))
+			}),
+			A && /* @__PURE__ */ O(r, { children: [/* @__PURE__ */ O(o, { children: [/* @__PURE__ */ D(s, { children: "Overview" }), /* @__PURE__ */ D(a, { children: "Performance metrics over time" })] }), /* @__PURE__ */ D(i, { children: A })] }),
+			j && j.length > 0 && /* @__PURE__ */ D("div", {
+				className: "grid gap-4 md:grid-cols-2 lg:grid-cols-3",
+				children: j.map((e) => /* @__PURE__ */ D(r, { children: /* @__PURE__ */ D(i, {
+					className: "pt-6",
+					children: /* @__PURE__ */ O("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("p", {
+							className: "text-sm text-muted-foreground",
+							children: e.label
+						}), /* @__PURE__ */ D("p", {
+							className: "text-xl font-bold",
+							children: e.value
+						})] }), e.change !== void 0 && /* @__PURE__ */ O(t, {
+							variant: e.trend === "up" ? "default" : e.trend === "down" ? "destructive" : "secondary",
+							className: "gap-1",
+							children: [
+								e.trend === "up" ? /* @__PURE__ */ D(g, { className: "h-3 w-3" }) : e.trend === "down" ? /* @__PURE__ */ D(h, { className: "h-3 w-3" }) : null,
+								e.change > 0 ? "+" : "",
+								e.change,
+								"%"
+							]
+						})]
+					})
+				}) }, e.id))
+			}),
+			P && P.length > 0 && /* @__PURE__ */ O(r, { children: [/* @__PURE__ */ O(o, { children: [/* @__PURE__ */ O(s, {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ D(C, { className: "h-5 w-5" }), "Goals & Targets"]
+			}), /* @__PURE__ */ D(a, { children: "Track your progress towards key objectives" })] }), /* @__PURE__ */ D(i, {
+				className: "space-y-4",
+				children: P.map((e) => /* @__PURE__ */ D(N, { goal: e }, e.id))
+			})] })
+		]
+	});
+}
+var F = [
+	{
+		id: "revenue",
+		label: "Total Revenue",
+		value: "$45,231.89",
+		change: 20.1,
+		changeLabel: "from last month",
+		trend: "up",
+		icon: /* @__PURE__ */ D(y, { className: "h-4 w-4" }),
+		color: "green",
+		sparkline: [
+			30,
+			40,
+			35,
+			50,
+			49,
+			60,
+			70,
+			91,
+			125
+		]
+	},
+	{
+		id: "subscriptions",
+		label: "Subscriptions",
+		value: "+2,350",
+		change: 180.1,
+		changeLabel: "from last month",
+		trend: "up",
+		icon: /* @__PURE__ */ D(E, { className: "h-4 w-4" }),
+		color: "blue",
+		sparkline: [
+			10,
+			20,
+			30,
+			40,
+			50,
+			60,
+			70,
+			80,
+			90
+		]
+	},
+	{
+		id: "sales",
+		label: "Sales",
+		value: "+12,234",
+		change: 19,
+		changeLabel: "from last month",
+		trend: "up",
+		icon: /* @__PURE__ */ D(S, { className: "h-4 w-4" }),
+		color: "purple",
+		sparkline: [
+			65,
+			59,
+			80,
+			81,
+			56,
+			55,
+			70,
+			80,
+			95
+		]
+	},
+	{
+		id: "active",
+		label: "Active Now",
+		value: "+573",
+		change: -2.5,
+		changeLabel: "from last hour",
+		trend: "down",
+		icon: /* @__PURE__ */ D(m, { className: "h-4 w-4" }),
+		color: "yellow",
+		sparkline: [
+			100,
+			90,
+			85,
+			88,
+			70,
+			65,
+			60,
+			58,
+			55
+		]
+	}
+], I = [
+	{
+		id: "revenue-goal",
+		label: "Monthly Revenue Target",
+		current: 45231,
+		target: 5e4,
+		unit: "$"
+	},
+	{
+		id: "users-goal",
+		label: "New User Signups",
+		current: 2350,
+		target: 2e3,
+		unit: ""
+	},
+	{
+		id: "conversion-goal",
+		label: "Conversion Rate",
+		current: 3.2,
+		target: 5,
+		unit: "%"
+	}
+];
+//#endregion
+export { P as default, I as defaultGoals, F as defaultKPIMetrics };

package/dist/blocks/database-admin/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../../components/badge/index.cjs.js`),r=require(`../../components/button/index.cjs.js`),i=require(`../../components/card/index.cjs.js`),a=require(`../../components/select/index.cjs.js`),o=require(`../../components/progress/index.cjs.js`),s=require(`../../components/scroll-area/index.cjs.js`),c=require(`../../components/tabs/index.cjs.js`),l=require(`../../components/textarea/index.cjs.js`);let u=require(`react`);u=e.__toESM(u);let d=require(`lucide-react`),f=require(`react/jsx-runtime`);var p={healthy:{color:`text-green-500`,bgColor:`bg-green-500`,label:`Healthy`},warning:{color:`text-yellow-500`,bgColor:`bg-yellow-500`,label:`Warning`},critical:{color:`text-red-500`,bgColor:`bg-red-500`,label:`Critical`},offline:{color:`text-gray-500`,bgColor:`bg-gray-500`,label:`Offline`}},m={active:{color:`text-green-500`,label:`Active`},idle:{color:`text-gray-500`,label:`Idle`},idle_in_transaction:{color:`text-yellow-500`,label:`Idle in Transaction`},waiting:{color:`text-orange-500`,label:`Waiting`}};function h(e){return e<1024?`${e} B`:e<1024*1024?`${(e/1024).toFixed(1)} KB`:e<1024*1024*1024?`${(e/(1024*1024)).toFixed(1)} MB`:`${(e/(1024*1024*1024)).toFixed(1)} GB`}function g(e){return e<60?`${e.toFixed(0)}s`:e<3600?`${Math.floor(e/60)}m ${Math.floor(e%60)}s`:`${Math.floor(e/3600)}h ${Math.floor(e%3600/60)}m`}function _(e){return e<1?`${(e*1e3).toFixed(0)}µs`:e<1e3?`${e.toFixed(2)}ms`:`${(e/1e3).toFixed(2)}s`}function v({metrics:e,status:r}){let a=p[r],s=e.connections.active/e.connections.max*100,c=e.storage.used/e.storage.total*100;return(0,f.jsxs)(`div`,{className:`grid grid-cols-4 gap-4`,children:[(0,f.jsx)(i.Card,{children:(0,f.jsxs)(i.CardContent,{className:`p-4`,children:[(0,f.jsxs)(`div`,{className:`flex items-center justify-between mb-2`,children:[(0,f.jsx)(d.Users,{className:`h-4 w-4 text-muted-foreground`}),(0,f.jsx)(`div`,{className:t.cn(`w-2 h-2 rounded-full`,a.bgColor)})]}),(0,f.jsx)(`div`,{className:`text-2xl font-bold`,children:e.connections.active}),(0,f.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Active Connections`}),(0,f.jsxs)(`div`,{className:`mt-2`,children:[(0,f.jsxs)(`div`,{className:`flex justify-between text-xs mb-1`,children:[(0,f.jsxs)(`span`,{children:[e.connections.idle,` idle`]}),(0,f.jsxs)(`span`,{children:[`max `,e.connections.max]})]}),(0,f.jsx)(o.Progress,{value:s,className:t.cn(`h-1.5`,s>80&&`[&>div]:bg-red-500`)})]})]})}),(0,f.jsx)(i.Card,{children:(0,f.jsxs)(i.CardContent,{className:`p-4`,children:[(0,f.jsxs)(`div`,{className:`flex items-center justify-between mb-2`,children:[(0,f.jsx)(d.Zap,{className:`h-4 w-4 text-muted-foreground`}),(0,f.jsxs)(n.Badge,{variant:`secondary`,className:`text-xs`,children:[e.transactions.perSecond,`/s`]})]}),(0,f.jsx)(`div`,{className:`text-2xl font-bold`,children:e.transactions.committed}),(0,f.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Transactions`}),(0,f.jsxs)(`div`,{className:`mt-2 text-xs text-muted-foreground`,children:[(0,f.jsx)(`span`,{className:`text-red-500`,children:e.transactions.rolledBack}),` rolled back`]})]})}),(0,f.jsx)(i.Card,{children:(0,f.jsxs)(i.CardContent,{className:`p-4`,children:[(0,f.jsx)(`div`,{className:`flex items-center justify-between mb-2`,children:(0,f.jsx)(d.Activity,{className:`h-4 w-4 text-muted-foreground`})}),(0,f.jsxs)(`div`,{className:t.cn(`text-2xl font-bold`,e.cache.hitRatio<90&&`text-yellow-500`,e.cache.hitRatio<80&&`text-red-500`),children:[e.cache.hitRatio.toFixed(1),`%`]}),(0,f.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Cache Hit Ratio`}),(0,f.jsxs)(`div`,{className:`mt-2 text-xs text-muted-foreground`,children:[`Buffer: `,e.cache.bufferHit,` • Disk: `,e.cache.diskRead]})]})}),(0,f.jsx)(i.Card,{children:(0,f.jsxs)(i.CardContent,{className:`p-4`,children:[(0,f.jsx)(`div`,{className:`flex items-center justify-between mb-2`,children:(0,f.jsx)(d.HardDrive,{className:`h-4 w-4 text-muted-foreground`})}),(0,f.jsx)(`div`,{className:`text-2xl font-bold`,children:h(e.storage.used)}),(0,f.jsx)(`div`,{className:`text-sm text-muted-foreground`,children:`Storage Used`}),(0,f.jsxs)(`div`,{className:`mt-2`,children:[(0,f.jsx)(o.Progress,{value:c,className:t.cn(`h-1.5`,c>80&&`[&>div]:bg-red-500`)}),(0,f.jsxs)(`div`,{className:`text-xs text-muted-foreground mt-1`,children:[`of `,h(e.storage.total)]})]})]})})]})}function y({connections:e,onKill:a}){return(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{className:`pb-2`,children:(0,f.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,f.jsxs)(i.CardTitle,{className:`text-base flex items-center gap-2`,children:[(0,f.jsx)(d.Users,{className:`h-4 w-4`}),`Active Connections`]}),(0,f.jsx)(n.Badge,{variant:`secondary`,children:e.length})]})}),(0,f.jsx)(i.CardContent,{children:(0,f.jsx)(s.ScrollArea,{className:`h-[300px]`,children:(0,f.jsx)(`div`,{className:`space-y-2`,children:e.map(e=>{let i=m[e.state];return(0,f.jsxs)(`div`,{className:t.cn(`flex items-center gap-3 p-2 rounded-lg border`,e.state===`idle_in_transaction`&&`border-yellow-500/30`,e.duration>60&&`bg-yellow-500/5`),children:[(0,f.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,f.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,f.jsx)(`span`,{className:`font-medium`,children:e.user}),(0,f.jsx)(n.Badge,{variant:`outline`,className:t.cn(`text-xs`,i.color),children:i.label}),(0,f.jsxs)(`span`,{className:`text-xs text-muted-foreground`,children:[`@ `,e.database]})]}),e.query&&(0,f.jsx)(`code`,{className:`text-xs text-muted-foreground block truncate mt-1`,children:e.query})]}),(0,f.jsxs)(`div`,{className:`text-right shrink-0`,children:[(0,f.jsx)(`div`,{className:t.cn(`text-sm font-medium`,e.duration>60&&`text-yellow-500`,e.duration>300&&`text-red-500`),children:g(e.duration)}),(0,f.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:e.client})]}),a&&e.state!==`idle`&&(0,f.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0 text-red-500`,onClick:()=>a(e),children:(0,f.jsx)(d.XCircle,{className:`h-4 w-4`})})]},e.id)})})})})]})}function b({backups:e,onRestore:t,onCreate:a}){return(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{className:`pb-2`,children:(0,f.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,f.jsxs)(i.CardTitle,{className:`text-base flex items-center gap-2`,children:[(0,f.jsx)(d.Download,{className:`h-4 w-4`}),`Backups`]}),a&&(0,f.jsxs)(r.Button,{size:`sm`,onClick:a,children:[(0,f.jsx)(d.Upload,{className:`h-4 w-4 mr-1`}),`Create Backup`]})]})}),(0,f.jsx)(i.CardContent,{children:(0,f.jsx)(s.ScrollArea,{className:`h-[200px]`,children:(0,f.jsx)(`div`,{className:`space-y-2`,children:e.map(e=>(0,f.jsxs)(`div`,{className:`flex items-center gap-3 p-2 rounded-lg border`,children:[e.status===`completed`?(0,f.jsx)(d.CheckCircle2,{className:`h-4 w-4 text-green-500 shrink-0`}):e.status===`failed`?(0,f.jsx)(d.XCircle,{className:`h-4 w-4 text-red-500 shrink-0`}):e.status===`running`?(0,f.jsx)(d.RefreshCw,{className:`h-4 w-4 text-blue-500 animate-spin shrink-0`}):(0,f.jsx)(d.Clock,{className:`h-4 w-4 text-muted-foreground shrink-0`}),(0,f.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,f.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,f.jsx)(`span`,{className:`font-medium`,children:e.name}),(0,f.jsx)(n.Badge,{variant:`outline`,className:`text-xs`,children:e.type})]}),(0,f.jsxs)(`div`,{className:`text-xs text-muted-foreground`,children:[e.startedAt.toLocaleString(),e.duration&&` • ${g(e.duration)}`]})]}),(0,f.jsx)(`div`,{className:`text-right shrink-0`,children:e.size&&(0,f.jsx)(`div`,{className:`text-sm font-medium`,children:h(e.size)})}),t&&e.status===`completed`&&(0,f.jsx)(r.Button,{variant:`ghost`,size:`sm`,onClick:()=>t(e),children:(0,f.jsx)(d.RotateCcw,{className:`h-4 w-4`})})]},e.id))})})})]})}function x({queries:e}){let[t,n]=u.useState(null),a=e=>{navigator.clipboard.writeText(e.query),n(e.id),setTimeout(()=>n(null),2e3)};return(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{className:`pb-2`,children:(0,f.jsxs)(i.CardTitle,{className:`text-base flex items-center gap-2`,children:[(0,f.jsx)(d.AlertTriangle,{className:`h-4 w-4 text-yellow-500`}),`Slow Queries`]})}),(0,f.jsx)(i.CardContent,{children:(0,f.jsx)(s.ScrollArea,{className:`h-[300px]`,children:(0,f.jsx)(`div`,{className:`space-y-2`,children:e.map(e=>(0,f.jsxs)(`div`,{className:`p-2 rounded-lg border bg-muted/30`,children:[(0,f.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,f.jsx)(`code`,{className:`text-xs font-mono line-clamp-2 flex-1`,children:e.query}),(0,f.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-6 w-6 p-0 shrink-0`,onClick:()=>a(e),children:t===e.id?(0,f.jsx)(d.CheckCircle2,{className:`h-3 w-3 text-green-500`}):(0,f.jsx)(d.Copy,{className:`h-3 w-3`})})]}),(0,f.jsxs)(`div`,{className:`flex items-center gap-4 mt-2 text-xs text-muted-foreground`,children:[(0,f.jsxs)(`span`,{children:[`Calls: `,(0,f.jsx)(`strong`,{children:e.calls})]}),(0,f.jsxs)(`span`,{children:[`Mean: `,(0,f.jsx)(`strong`,{className:`text-yellow-500`,children:_(e.meanTime)})]}),(0,f.jsxs)(`span`,{children:[`Max: `,(0,f.jsx)(`strong`,{className:`text-red-500`,children:_(e.maxTime)})]}),(0,f.jsxs)(`span`,{children:[`Total: `,(0,f.jsx)(`strong`,{children:_(e.totalTime)})]}),(0,f.jsxs)(`span`,{children:[`Rows: `,(0,f.jsx)(`strong`,{children:e.rows})]})]})]},e.id))})})})]})}function S({onExecute:e}){let[t,n]=u.useState(``),[o,s]=u.useState([]);return(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{className:`pb-2`,children:(0,f.jsxs)(i.CardTitle,{className:`text-base flex items-center gap-2`,children:[(0,f.jsx)(d.Terminal,{className:`h-4 w-4`}),`Query Editor`]})}),(0,f.jsxs)(i.CardContent,{className:`space-y-3`,children:[(0,f.jsx)(l.Textarea,{value:t,onChange:e=>n(e.target.value),placeholder:`SELECT * FROM users LIMIT 10;`,className:`font-mono text-sm min-h-[120px]`}),(0,f.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,f.jsx)(`div`,{className:`flex items-center gap-2`,children:o.length>0&&(0,f.jsxs)(a.Select,{onValueChange:e=>n(e),children:[(0,f.jsxs)(a.SelectTrigger,{className:`w-40`,children:[(0,f.jsx)(d.History,{className:`h-4 w-4 mr-2`}),`History`]}),(0,f.jsx)(a.SelectContent,{children:o.map((e,t)=>(0,f.jsx)(a.SelectItem,{value:e,children:(0,f.jsx)(`span`,{className:`truncate max-w-[300px]`,children:e})},t))})]})}),(0,f.jsxs)(r.Button,{onClick:()=>{t.trim()&&(e?.(t),s(e=>[t,...e.slice(0,9)]))},disabled:!t.trim(),children:[(0,f.jsx)(d.Play,{className:`h-4 w-4 mr-1`}),`Execute`]})]})]})]})}function C({instance:e,onExecuteQuery:a,onCreateBackup:o,onRestoreBackup:s,onKillConnection:l,onRefresh:u,className:m}){let h=p[e.status];return(0,f.jsxs)(`div`,{className:t.cn(`space-y-6`,m),children:[(0,f.jsx)(i.Card,{children:(0,f.jsx)(i.CardHeader,{children:(0,f.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,f.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,f.jsx)(d.Database,{className:`h-6 w-6`}),(0,f.jsxs)(`div`,{children:[(0,f.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,f.jsx)(i.CardTitle,{children:e.name}),(0,f.jsx)(n.Badge,{className:t.cn(`text-white`,h.bgColor),children:h.label}),(0,f.jsx)(n.Badge,{variant:`outline`,children:e.role})]}),(0,f.jsxs)(`p`,{className:`text-sm text-muted-foreground`,children:[e.type,` `,e.version,` • `,e.host,`:`,e.port]})]})]}),(0,f.jsxs)(`div`,{className:`flex items-center gap-2`,children:[e.metrics.replication&&(0,f.jsxs)(n.Badge,{variant:`outline`,className:t.cn(e.metrics.replication.lag>1e3?`text-red-500`:e.metrics.replication.lag>100?`text-yellow-500`:`text-green-500`),children:[`Replication: `,_(e.metrics.replication.lag),` lag`]}),u&&(0,f.jsx)(r.Button,{variant:`outline`,onClick:u,children:(0,f.jsx)(d.RefreshCw,{className:`h-4 w-4`})})]})]})})}),(0,f.jsx)(v,{metrics:e.metrics,status:e.status}),(0,f.jsxs)(c.Tabs,{defaultValue:`connections`,children:[(0,f.jsxs)(c.TabsList,{children:[(0,f.jsxs)(c.TabsTrigger,{value:`connections`,children:[(0,f.jsx)(d.Users,{className:`h-4 w-4 mr-1`}),`Connections`]}),(0,f.jsxs)(c.TabsTrigger,{value:`queries`,children:[(0,f.jsx)(d.Terminal,{className:`h-4 w-4 mr-1`}),`Query`]}),(0,f.jsxs)(c.TabsTrigger,{value:`slow`,children:[(0,f.jsx)(d.AlertTriangle,{className:`h-4 w-4 mr-1`}),`Slow Queries`]}),(0,f.jsxs)(c.TabsTrigger,{value:`backups`,children:[(0,f.jsx)(d.Download,{className:`h-4 w-4 mr-1`}),`Backups`]})]}),(0,f.jsx)(c.TabsContent,{value:`connections`,className:`mt-4`,children:(0,f.jsx)(y,{connections:e.connections,onKill:l})}),(0,f.jsx)(c.TabsContent,{value:`queries`,className:`mt-4`,children:(0,f.jsx)(S,{onExecute:a})}),(0,f.jsx)(c.TabsContent,{value:`slow`,className:`mt-4`,children:(0,f.jsx)(x,{queries:e.slowQueries})}),(0,f.jsx)(c.TabsContent,{value:`backups`,className:`mt-4`,children:(0,f.jsx)(b,{backups:e.backups,onRestore:s,onCreate:o})})]})]})}var w={id:`1`,name:`production-db`,type:`postgresql`,version:`15.4`,host:`db.example.com`,port:5432,status:`healthy`,role:`primary`,metrics:{connections:{active:45,idle:25,max:100},transactions:{committed:125e3,rolledBack:15,perSecond:250},cache:{hitRatio:98.5,bufferHit:15e3,diskRead:250},storage:{used:85*1024*1024*1024,total:200*1024*1024*1024,tablespace:75*1024*1024*1024,indexes:10*1024*1024*1024},replication:{lag:25,state:`streaming`,replicas:2}},connections:[{id:`1`,user:`api_user`,database:`production`,state:`active`,query:`SELECT * FROM users WHERE id = $1`,duration:.5,client:`192.168.1.10`},{id:`2`,user:`api_user`,database:`production`,state:`active`,query:`UPDATE orders SET status = $1 WHERE id = $2`,duration:1.2,client:`192.168.1.11`},{id:`3`,user:`analytics`,database:`production`,state:`idle_in_transaction`,query:`SELECT COUNT(*) FROM events WHERE...`,duration:125,client:`192.168.1.20`},{id:`4`,user:`admin`,database:`production`,state:`idle`,duration:300,client:`192.168.1.5`},{id:`5`,user:`api_user`,database:`production`,state:`active`,duration:.1,client:`192.168.1.12`}],backups:[{id:`1`,name:`daily-backup-20240110`,type:`full`,status:`completed`,size:45*1024*1024*1024,startedAt:new Date(Date.now()-4*36e5),completedAt:new Date(Date.now()-2*36e5),duration:7200},{id:`2`,name:`hourly-backup-20240110-12`,type:`incremental`,status:`completed`,size:250*1024*1024,startedAt:new Date(Date.now()-1*36e5),completedAt:new Date(Date.now()-50*6e4),duration:600},{id:`3`,name:`hourly-backup-20240110-13`,type:`incremental`,status:`running`,startedAt:new Date(Date.now()-5*6e4)},{id:`4`,name:`daily-backup-20240111`,type:`full`,status:`scheduled`,startedAt:new Date(Date.now()+8*36e5)}],slowQueries:[{id:`1`,query:`SELECT * FROM orders o JOIN order_items oi ON o.id = oi.order_id WHERE o.created_at > $1 AND o.status = $2`,calls:1250,totalTime:45e3,meanTime:36,maxTime:520,rows:15e3},{id:`2`,query:`SELECT u.*, COUNT(o.id) as order_count FROM users u LEFT JOIN orders o ON u.id = o.user_id GROUP BY u.id ORDER BY order_count DESC LIMIT 100`,calls:500,totalTime:85e3,meanTime:170,maxTime:1200,rows:100},{id:`3`,query:`UPDATE products SET view_count = view_count + 1 WHERE id = $1`,calls:5e4,totalTime:25e3,meanTime:.5,maxTime:15,rows:1},{id:`4`,query:`SELECT * FROM analytics_events WHERE event_type = $1 AND created_at BETWEEN $2 AND $3`,calls:250,totalTime:125e3,meanTime:500,maxTime:3500,rows:5e4}]};exports.DatabaseAdmin=C,exports.defaultDatabaseInstance=w;