@burdenoff/microfe-admin 2026.511.1

package/dist/admin/components/FormSheet.js

@@ -0,0 +1,111 @@
+import { cn as e } from "../utils/cn.js";
+import { Button as t } from "./ui.js";
+import * as n from "react";
+import { Loader2 as r, X as i } from "lucide-react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/admin/components/FormSheet.tsx
+var s = {
+	sm: "max-w-sm",
+	md: "max-w-md",
+	lg: "max-w-lg",
+	xl: "max-w-xl"
+};
+function c({ open: r, onClose: c, title: l, description: u, children: d, width: f = "md", footer: p }) {
+	return n.useEffect(() => {
+		let e = (e) => {
+			e.key === "Escape" && r && c();
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [r, c]), n.useEffect(() => (r ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
+		document.body.style.overflow = "";
+	}), [r]), r ? /* @__PURE__ */ o("div", {
+		className: "fixed inset-0 z-50",
+		children: [/* @__PURE__ */ a("div", {
+			className: "fixed inset-0 bg-black/50 transition-opacity",
+			onClick: c,
+			"aria-hidden": "true"
+		}), /* @__PURE__ */ o("div", {
+			className: e("fixed inset-y-0 right-0 flex w-full flex-col bg-background shadow-xl", "animate-in slide-in-from-right duration-300", s[f]),
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-labelledby": "sheet-title",
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "flex items-start justify-between border-b border-border px-6 py-4",
+					children: [/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h2", {
+						id: "sheet-title",
+						className: "text-lg font-semibold text-foreground",
+						children: l
+					}), u && /* @__PURE__ */ a("p", {
+						className: "mt-1 text-sm text-muted-foreground",
+						children: u
+					})] }), /* @__PURE__ */ a(t, {
+						variant: "ghost",
+						size: "icon",
+						onClick: c,
+						"aria-label": "Close",
+						children: /* @__PURE__ */ a(i, { className: "h-4 w-4" })
+					})]
+				}),
+				/* @__PURE__ */ a("div", {
+					className: "flex-1 overflow-y-auto px-6 py-4",
+					children: d
+				}),
+				p && /* @__PURE__ */ a("div", {
+					className: "border-t border-border px-6 py-4",
+					children: p
+				})
+			]
+		})]
+	}) : null;
+}
+function l({ submitLabel: e = "Save", cancelLabel: n = "Cancel", onCancel: i, isSubmitting: s = !1, disabled: c = !1, formId: l, onSubmit: u, submitVariant: d = "default" }) {
+	return /* @__PURE__ */ o("div", {
+		className: "flex items-center justify-end gap-3",
+		children: [/* @__PURE__ */ a(t, {
+			variant: "outline",
+			onClick: i,
+			disabled: s,
+			children: n
+		}), /* @__PURE__ */ o(t, {
+			type: l ? "submit" : "button",
+			form: l,
+			onClick: u,
+			disabled: c || s,
+			variant: d,
+			children: [s && /* @__PURE__ */ a(r, { className: "mr-2 h-4 w-4 animate-spin" }), e]
+		})]
+	});
+}
+function u({ title: t, description: n, children: r, className: i }) {
+	return /* @__PURE__ */ o("div", {
+		className: e("space-y-4", i),
+		children: [(t || n) && /* @__PURE__ */ o("div", {
+			className: "space-y-1",
+			children: [t && /* @__PURE__ */ a("h3", {
+				className: "text-sm font-medium text-foreground",
+				children: t
+			}), n && /* @__PURE__ */ a("p", {
+				className: "text-xs text-muted-foreground",
+				children: n
+			})]
+		}), /* @__PURE__ */ a("div", {
+			className: "space-y-4",
+			children: r
+		})]
+	});
+}
+function d({ children: t, cols: n = 2, className: r }) {
+	return /* @__PURE__ */ a("div", {
+		className: e("grid gap-4", {
+			2: "grid-cols-2",
+			3: "grid-cols-3",
+			4: "grid-cols-4"
+		}[n], r),
+		children: t
+	});
+}
+//#endregion
+export { d as FormRow, u as FormSection, c as FormSheet, l as FormSheetFooter };
+
+//# sourceMappingURL=FormSheet.js.map

package/dist/admin/components/FormSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormSheet.js","names":[],"sources":["../../../src/admin/components/FormSheet.tsx"],"sourcesContent":["import * as React from 'react';\nimport { X, Loader2 } from 'lucide-react';\nimport { cn } from '../utils/cn';\nimport { Button } from './ui';\n\n/**\n * FormSheet props\n */\nexport interface FormSheetProps {\n  /** Whether the sheet is open */\n  open: boolean;\n  /** Callback when the sheet should close */\n  onClose: () => void;\n  /** Title of the sheet */\n  title: string;\n  /** Optional description */\n  description?: string;\n  /** Form content */\n  children: React.ReactNode;\n  /** Width of the sheet */\n  width?: 'sm' | 'md' | 'lg' | 'xl';\n  /** Optional footer actions */\n  footer?: React.ReactNode;\n}\n\nconst widthClasses = {\n  sm: 'max-w-sm',\n  md: 'max-w-md',\n  lg: 'max-w-lg',\n  xl: 'max-w-xl',\n};\n\n/**\n * FormSheet - Slide-over panel for forms\n *\n * A side panel component for displaying forms that slides in from the right.\n * Includes backdrop overlay, header with close button, and optional footer.\n */\nexport function FormSheet({\n  open,\n  onClose,\n  title,\n  description,\n  children,\n  width = 'md',\n  footer,\n}: FormSheetProps) {\n  // Handle escape key\n  React.useEffect(() => {\n    const handleEscape = (e: KeyboardEvent) => {\n      if (e.key === 'Escape' && open) {\n        onClose();\n      }\n    };\n    document.addEventListener('keydown', handleEscape);\n    return () => document.removeEventListener('keydown', handleEscape);\n  }, [open, onClose]);\n\n  // Prevent body scroll when open\n  React.useEffect(() => {\n    if (open) {\n      document.body.style.overflow = 'hidden';\n    } else {\n      document.body.style.overflow = '';\n    }\n    return () => {\n      document.body.style.overflow = '';\n    };\n  }, [open]);\n\n  if (!open) return null;\n\n  return (\n    <div className=\"fixed inset-0 z-50\">\n      {/* Backdrop */}\n      <div\n        className=\"fixed inset-0 bg-black/50 transition-opacity\"\n        onClick={onClose}\n        aria-hidden=\"true\"\n      />\n\n      {/* Sheet */}\n      <div\n        className={cn(\n          'fixed inset-y-0 right-0 flex w-full flex-col bg-background shadow-xl',\n          'animate-in slide-in-from-right duration-300',\n          widthClasses[width]\n        )}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby=\"sheet-title\"\n      >\n        {/* Header */}\n        <div className=\"flex items-start justify-between border-b border-border px-6 py-4\">\n          <div>\n            <h2 id=\"sheet-title\" className=\"text-lg font-semibold text-foreground\">\n              {title}\n            </h2>\n            {description && <p className=\"mt-1 text-sm text-muted-foreground\">{description}</p>}\n          </div>\n          <Button variant=\"ghost\" size=\"icon\" onClick={onClose} aria-label=\"Close\">\n            <X className=\"h-4 w-4\" />\n          </Button>\n        </div>\n\n        {/* Content */}\n        <div className=\"flex-1 overflow-y-auto px-6 py-4\">{children}</div>\n\n        {/* Footer */}\n        {footer && <div className=\"border-t border-border px-6 py-4\">{footer}</div>}\n      </div>\n    </div>\n  );\n}\n\n/**\n * FormSheetFooter props\n */\nexport interface FormSheetFooterProps {\n  /** Primary action button text */\n  submitLabel?: string;\n  /** Cancel button text */\n  cancelLabel?: string;\n  /** Callback for cancel */\n  onCancel: () => void;\n  /** Whether form is submitting */\n  isSubmitting?: boolean;\n  /** Whether submit is disabled */\n  disabled?: boolean;\n  /** Form ID to connect submit button */\n  formId?: string;\n  /** Callback for submit (if not using form) */\n  onSubmit?: () => void;\n  /** Variant for submit button */\n  submitVariant?: 'default' | 'destructive';\n}\n\n/**\n * FormSheetFooter - Standard footer for FormSheet with cancel/submit buttons\n */\nexport function FormSheetFooter({\n  submitLabel = 'Save',\n  cancelLabel = 'Cancel',\n  onCancel,\n  isSubmitting = false,\n  disabled = false,\n  formId,\n  onSubmit,\n  submitVariant = 'default',\n}: FormSheetFooterProps) {\n  return (\n    <div className=\"flex items-center justify-end gap-3\">\n      <Button variant=\"outline\" onClick={onCancel} disabled={isSubmitting}>\n        {cancelLabel}\n      </Button>\n      <Button\n        type={formId ? 'submit' : 'button'}\n        form={formId}\n        onClick={onSubmit}\n        disabled={disabled || isSubmitting}\n        variant={submitVariant}\n      >\n        {isSubmitting && <Loader2 className=\"mr-2 h-4 w-4 animate-spin\" />}\n        {submitLabel}\n      </Button>\n    </div>\n  );\n}\n\n/**\n * FormSection - Group related form fields\n */\nexport interface FormSectionProps {\n  /** Section title */\n  title?: string;\n  /** Section description */\n  description?: string;\n  /** Form fields */\n  children: React.ReactNode;\n  /** Additional className */\n  className?: string;\n}\n\nexport function FormSection({ title, description, children, className }: FormSectionProps) {\n  return (\n    <div className={cn('space-y-4', className)}>\n      {(title || description) && (\n        <div className=\"space-y-1\">\n          {title && <h3 className=\"text-sm font-medium text-foreground\">{title}</h3>}\n          {description && <p className=\"text-xs text-muted-foreground\">{description}</p>}\n        </div>\n      )}\n      <div className=\"space-y-4\">{children}</div>\n    </div>\n  );\n}\n\n/**\n * FormRow - Horizontal row for form fields\n */\nexport interface FormRowProps {\n  /** Form fields */\n  children: React.ReactNode;\n  /** Number of columns */\n  cols?: 2 | 3 | 4;\n  /** Additional className */\n  className?: string;\n}\n\nexport function FormRow({ children, cols = 2, className }: FormRowProps) {\n  const colsClass = {\n    2: 'grid-cols-2',\n    3: 'grid-cols-3',\n    4: 'grid-cols-4',\n  };\n  return <div className={cn('grid gap-4', colsClass[cols], className)}>{children}</div>;\n}\n"],"mappings":";;;;;;AAyBA,IAAM,IAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAQD,SAAgB,EAAU,EACxB,SACA,YACA,UACA,gBACA,aACA,WAAQ,MACR,aACiB;AA0BjB,QAxBA,EAAM,gBAAgB;EACpB,IAAM,KAAgB,MAAqB;AACzC,GAAI,EAAE,QAAQ,YAAY,KACxB,GAAS;;AAIb,SADA,SAAS,iBAAiB,WAAW,EAAa,QACrC,SAAS,oBAAoB,WAAW,EAAa;IACjE,CAAC,GAAM,EAAQ,CAAC,EAGnB,EAAM,iBACA,IACF,SAAS,KAAK,MAAM,WAAW,WAE/B,SAAS,KAAK,MAAM,WAAW,UAEpB;AACX,WAAS,KAAK,MAAM,WAAW;KAEhC,CAAC,EAAK,CAAC,EAEL,IAGH,kBAAC,OAAD;EAAK,WAAU;YAAf,CAEE,kBAAC,OAAD;GACE,WAAU;GACV,SAAS;GACT,eAAY;GACZ,CAAA,EAGF,kBAAC,OAAD;GACE,WAAW,EACT,wEACA,+CACA,EAAa,GACd;GACD,MAAK;GACL,cAAW;GACX,mBAAgB;aARlB;IAWE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;MAAI,IAAG;MAAc,WAAU;gBAC5B;MACE,CAAA,EACJ,KAAe,kBAAC,KAAD;MAAG,WAAU;gBAAsC;MAAgB,CAAA,CAC/E,EAAA,CAAA,EACN,kBAAC,GAAD;MAAQ,SAAQ;MAAQ,MAAK;MAAO,SAAS;MAAS,cAAW;gBAC/D,kBAAC,GAAD,EAAG,WAAU,WAAY,CAAA;MAClB,CAAA,CACL;;IAGN,kBAAC,OAAD;KAAK,WAAU;KAAoC;KAAe,CAAA;IAGjE,KAAU,kBAAC,OAAD;KAAK,WAAU;eAAoC;KAAa,CAAA;IACvE;KACF;MAzCU;;AAsEpB,SAAgB,EAAgB,EAC9B,iBAAc,QACd,iBAAc,UACd,aACA,kBAAe,IACf,cAAW,IACX,WACA,aACA,mBAAgB,aACO;AACvB,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,GAAD;GAAQ,SAAQ;GAAU,SAAS;GAAU,UAAU;aACpD;GACM,CAAA,EACT,kBAAC,GAAD;GACE,MAAM,IAAS,WAAW;GAC1B,MAAM;GACN,SAAS;GACT,UAAU,KAAY;GACtB,SAAS;aALX,CAOG,KAAgB,kBAAC,GAAD,EAAS,WAAU,6BAA8B,CAAA,EACjE,EACM;KACL;;;AAkBV,SAAgB,EAAY,EAAE,UAAO,gBAAa,aAAU,gBAA+B;AACzF,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,aAAa,EAAU;YAA1C,EACI,KAAS,MACT,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,KAAS,kBAAC,MAAD;IAAI,WAAU;cAAuC;IAAW,CAAA,EACzE,KAAe,kBAAC,KAAD;IAAG,WAAU;cAAiC;IAAgB,CAAA,CAC1E;MAER,kBAAC,OAAD;GAAK,WAAU;GAAa;GAAe,CAAA,CACvC;;;AAgBV,SAAgB,EAAQ,EAAE,aAAU,UAAO,GAAG,gBAA2B;AAMvE,QAAO,kBAAC,OAAD;EAAK,WAAW,EAAG,cALR;GAChB,GAAG;GACH,GAAG;GACH,GAAG;GACJ,CACiD,IAAO,EAAU;EAAG;EAAe,CAAA"}

package/dist/admin/components/MetricCard.d.ts

@@ -0,0 +1,40 @@
+import { ReactNode } from 'react';
+
+export interface MetricCardProps {
+    /** Card title */
+    title: string;
+    /** Metric value (number or formatted string) */
+    value: number | string;
+    /** Change from previous period */
+    change?: number;
+    /** Type of change display */
+    changeType?: 'number' | 'percentage' | 'currency';
+    /** Trend direction */
+    trend?: 'up' | 'down' | 'neutral';
+    /** Whether change is positive or negative for styling */
+    changeIsPositive?: boolean;
+    /** Icon to display */
+    icon?: ReactNode;
+    /** Subtitle text */
+    subtitle?: string;
+    /** Link to navigate to on click */
+    linkTo?: string;
+    /** Priority indicator */
+    priority?: 'normal' | 'high' | 'critical';
+    /** Loading state */
+    loading?: boolean;
+    /** Additional class name */
+    className?: string;
+}
+/**
+ * Metric card component for dashboard
+ */
+export declare function MetricCard({ title, value, change, changeType, trend, changeIsPositive, icon, subtitle, linkTo, priority, loading, className, }: MetricCardProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Grid container for metric cards
+ */
+export declare function MetricsGrid({ children, className }: {
+    children: ReactNode;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MetricCard.d.ts.map

package/dist/admin/components/MetricCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../../src/admin/components/MetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,MAAM,WAAW,eAAe;IAC9B,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6BAA6B;IAC7B,UAAU,CAAC,EAAE,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAC;IAClD,sBAAsB;IACtB,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;IAClC,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,sBAAsB;IACtB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mCAAmC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAC;IAC1C,oBAAoB;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,MAAM,EACN,UAAqB,EACrB,KAAK,EACL,gBAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,OAAO,EACP,SAAS,GACV,EAAE,eAAe,2CA0EjB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,2CAM/F"}

package/dist/admin/components/MetricCard.js

@@ -0,0 +1,57 @@
+import { cn as e } from "../utils/cn.js";
+import { Badge as t, Card as n, CardContent as r, CardHeader as i, CardTitle as a, Skeleton as o } from "./ui.js";
+import { formatChange as s, formatCurrency as c, formatNumber as l } from "../utils/formatters.js";
+import { Minus as u, TrendingDown as d, TrendingUp as f } from "lucide-react";
+import { Link as p } from "react-router-dom";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/admin/components/MetricCard.tsx
+function g({ title: g, value: _, change: v, changeType: y = "number", trend: b, changeIsPositive: x, icon: S, subtitle: C, linkTo: w, priority: T, loading: E, className: D }) {
+	let O = x ?? b === "up", k = typeof _ == "number" ? y === "currency" ? c(_) : l(_) : _, A = v === void 0 ? null : s(v, y === "percentage"), j = b === "up" ? f : b === "down" ? d : u, M = /* @__PURE__ */ h(n, {
+		className: e("transition-shadow hover:shadow-md", T && {
+			normal: "",
+			high: "border-l-4 border-l-warning",
+			critical: "border-l-4 border-l-destructive"
+		}[T], D),
+		children: [/* @__PURE__ */ h(i, {
+			className: "flex flex-row items-center justify-between pb-2",
+			children: [/* @__PURE__ */ m(a, {
+				className: "text-sm font-medium text-muted-foreground",
+				children: g
+			}), S && /* @__PURE__ */ m("div", {
+				className: "text-muted-foreground",
+				children: S
+			})]
+		}), /* @__PURE__ */ m(r, { children: E ? /* @__PURE__ */ h("div", {
+			className: "space-y-2",
+			children: [/* @__PURE__ */ m(o, { className: "h-8 w-24" }), /* @__PURE__ */ m(o, { className: "h-4 w-16" })]
+		}) : /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("div", {
+			className: "flex items-baseline justify-between",
+			children: [/* @__PURE__ */ m("div", {
+				className: "text-3xl font-bold text-foreground",
+				children: k
+			}), A !== null && /* @__PURE__ */ h(t, {
+				variant: O ? "success" : "destructive",
+				className: "flex items-center gap-1",
+				children: [/* @__PURE__ */ m(j, { className: "h-3 w-3" }), A]
+			})]
+		}), C && /* @__PURE__ */ m("p", {
+			className: "mt-1 text-xs text-muted-foreground",
+			children: C
+		})] }) })]
+	});
+	return w ? /* @__PURE__ */ m(p, {
+		to: w,
+		className: "block",
+		children: M
+	}) : M;
+}
+function _({ children: t, className: n }) {
+	return /* @__PURE__ */ m("div", {
+		className: e("grid gap-4", "grid-cols-1 sm:grid-cols-2 xl:grid-cols-4", n),
+		children: t
+	});
+}
+//#endregion
+export { g as MetricCard, _ as MetricsGrid };
+
+//# sourceMappingURL=MetricCard.js.map

package/dist/admin/components/MetricCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricCard.js","names":[],"sources":["../../../src/admin/components/MetricCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { Link } from 'react-router-dom';\nimport { TrendingUp, TrendingDown, Minus } from 'lucide-react';\nimport { Card, CardHeader, CardTitle, CardContent, Badge, Skeleton } from './ui';\nimport { cn } from '../utils/cn';\nimport { formatNumber, formatCurrency, formatChange } from '../utils/formatters';\n\nexport interface MetricCardProps {\n  /** Card title */\n  title: string;\n  /** Metric value (number or formatted string) */\n  value: number | string;\n  /** Change from previous period */\n  change?: number;\n  /** Type of change display */\n  changeType?: 'number' | 'percentage' | 'currency';\n  /** Trend direction */\n  trend?: 'up' | 'down' | 'neutral';\n  /** Whether change is positive or negative for styling */\n  changeIsPositive?: boolean;\n  /** Icon to display */\n  icon?: ReactNode;\n  /** Subtitle text */\n  subtitle?: string;\n  /** Link to navigate to on click */\n  linkTo?: string;\n  /** Priority indicator */\n  priority?: 'normal' | 'high' | 'critical';\n  /** Loading state */\n  loading?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * Metric card component for dashboard\n */\nexport function MetricCard({\n  title,\n  value,\n  change,\n  changeType = 'number',\n  trend,\n  changeIsPositive,\n  icon,\n  subtitle,\n  linkTo,\n  priority,\n  loading,\n  className,\n}: MetricCardProps) {\n  // Determine if change is positive based on trend or explicit prop\n  const isPositive = changeIsPositive ?? trend === 'up';\n\n  // Format the value\n  const formattedValue =\n    typeof value === 'number'\n      ? changeType === 'currency'\n        ? formatCurrency(value)\n        : formatNumber(value)\n      : value;\n\n  // Format the change\n  const formattedChange =\n    change !== undefined ? formatChange(change, changeType === 'percentage') : null;\n\n  // Get trend icon\n  const TrendIcon = trend === 'up' ? TrendingUp : trend === 'down' ? TrendingDown : Minus;\n\n  // Priority border classes\n  const priorityClasses = {\n    normal: '',\n    high: 'border-l-4 border-l-warning',\n    critical: 'border-l-4 border-l-destructive',\n  };\n\n  const cardContent = (\n    <Card\n      className={cn(\n        'transition-shadow hover:shadow-md',\n        priority && priorityClasses[priority],\n        className\n      )}\n    >\n      <CardHeader className=\"flex flex-row items-center justify-between pb-2\">\n        <CardTitle className=\"text-sm font-medium text-muted-foreground\">{title}</CardTitle>\n        {icon && <div className=\"text-muted-foreground\">{icon}</div>}\n      </CardHeader>\n      <CardContent>\n        {loading ? (\n          <div className=\"space-y-2\">\n            <Skeleton className=\"h-8 w-24\" />\n            <Skeleton className=\"h-4 w-16\" />\n          </div>\n        ) : (\n          <div>\n            <div className=\"flex items-baseline justify-between\">\n              <div className=\"text-3xl font-bold text-foreground\">{formattedValue}</div>\n              {formattedChange !== null && (\n                <Badge\n                  variant={isPositive ? 'success' : 'destructive'}\n                  className=\"flex items-center gap-1\"\n                >\n                  <TrendIcon className=\"h-3 w-3\" />\n                  {formattedChange}\n                </Badge>\n              )}\n            </div>\n            {subtitle && <p className=\"mt-1 text-xs text-muted-foreground\">{subtitle}</p>}\n          </div>\n        )}\n      </CardContent>\n    </Card>\n  );\n\n  if (linkTo) {\n    return (\n      <Link to={linkTo} className=\"block\">\n        {cardContent}\n      </Link>\n    );\n  }\n\n  return cardContent;\n}\n\n/**\n * Grid container for metric cards\n */\nexport function MetricsGrid({ children, className }: { children: ReactNode; className?: string }) {\n  return (\n    <div className={cn('grid gap-4', 'grid-cols-1 sm:grid-cols-2 xl:grid-cols-4', className)}>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAqCA,SAAgB,EAAW,EACzB,UACA,UACA,WACA,gBAAa,UACb,UACA,qBACA,SACA,aACA,WACA,aACA,YACA,gBACkB;CAElB,IAAM,IAAa,KAAoB,MAAU,MAG3C,IACJ,OAAO,KAAU,WACb,MAAe,aACb,EAAe,EAAM,GACrB,EAAa,EAAM,GACrB,GAGA,IACJ,MAAW,KAAA,IAAgE,OAApD,EAAa,GAAQ,MAAe,aAAa,EAGpE,IAAY,MAAU,OAAO,IAAa,MAAU,SAAS,IAAe,GAS5E,IACJ,kBAAC,GAAD;EACE,WAAW,EACT,qCACA,KAVkB;GACtB,QAAQ;GACR,MAAM;GACN,UAAU;GACX,CAMiC,IAC5B,EACD;YALH,CAOE,kBAAC,GAAD;GAAY,WAAU;aAAtB,CACE,kBAAC,GAAD;IAAW,WAAU;cAA6C;IAAkB,CAAA,EACnF,KAAQ,kBAAC,OAAD;IAAK,WAAU;cAAyB;IAAW,CAAA,CACjD;MACb,kBAAC,GAAD,EAAA,UACG,IACC,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD,EAAU,WAAU,YAAa,CAAA,EACjC,kBAAC,GAAD,EAAU,WAAU,YAAa,CAAA,CAC7B;OAEN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAsC;IAAqB,CAAA,EACzE,MAAoB,QACnB,kBAAC,GAAD;IACE,SAAS,IAAa,YAAY;IAClC,WAAU;cAFZ,CAIE,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA,EAChC,EACK;MAEN;MACL,KAAY,kBAAC,KAAD;GAAG,WAAU;aAAsC;GAAa,CAAA,CACzE,EAAA,CAAA,EAEI,CAAA,CACT;;AAWT,QARI,IAEA,kBAAC,GAAD;EAAM,IAAI;EAAQ,WAAU;YACzB;EACI,CAAA,GAIJ;;AAMT,SAAgB,EAAY,EAAE,aAAU,gBAA0D;AAChG,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,cAAc,6CAA6C,EAAU;EACrF;EACG,CAAA"}

package/dist/admin/components/PageLayout.d.ts

@@ -0,0 +1,34 @@
+import { ReactNode } from 'react';
+
+interface PageLayoutProps {
+    /** Page title */
+    title: string;
+    /** Optional description */
+    description?: string;
+    /** Actions to display in the header (buttons, etc.) */
+    actions?: ReactNode;
+    /** Page content */
+    children: ReactNode;
+    /** Additional class names */
+    className?: string;
+}
+/**
+ * Standard page layout component with title, description, and content area
+ */
+export declare function PageLayout({ title, description, actions, children, className }: PageLayoutProps): import("react/jsx-runtime").JSX.Element;
+interface PageSectionProps {
+    /** Section title */
+    title?: string;
+    /** Optional description */
+    description?: string;
+    /** Section content */
+    children: ReactNode;
+    /** Additional class names */
+    className?: string;
+}
+/**
+ * Section within a page
+ */
+export declare function PageSection({ title, description, children, className }: PageSectionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=PageLayout.d.ts.map

package/dist/admin/components/PageLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.d.ts","sourceRoot":"","sources":["../../../src/admin/components/PageLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,UAAU,eAAe;IACvB,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uDAAuD;IACvD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,mBAAmB;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,eAAe,2CAsB/F;AAED,UAAU,gBAAgB;IACxB,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2BAA2B;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sBAAsB;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAYxF"}

package/dist/admin/components/PageLayout.js

@@ -0,0 +1,31 @@
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/admin/components/PageLayout.tsx
+function r({ title: r, description: i, actions: a, children: o, className: s }) {
+	return /* @__PURE__ */ n("div", {
+		className: e("flex h-full flex-col", s),
+		children: [/* @__PURE__ */ n("header", {
+			className: "flex flex-col gap-4 border-b border-border bg-background px-6 py-4 sm:flex-row sm:items-center sm:justify-between",
+			children: [/* @__PURE__ */ n("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ t("h1", {
+					className: "text-2xl font-bold tracking-tight text-foreground sm:text-3xl",
+					children: r
+				}), i && /* @__PURE__ */ t("p", {
+					className: "mt-1 text-sm text-muted-foreground sm:text-base",
+					children: i
+				})]
+			}), a && /* @__PURE__ */ t("div", {
+				className: "flex flex-shrink-0 flex-wrap items-center gap-2",
+				children: a
+			})]
+		}), /* @__PURE__ */ t("div", {
+			className: "flex-1 overflow-auto p-6",
+			children: o
+		})]
+	});
+}
+//#endregion
+export { r as PageLayout };
+
+//# sourceMappingURL=PageLayout.js.map

package/dist/admin/components/PageLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLayout.js","names":[],"sources":["../../../src/admin/components/PageLayout.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { cn } from '../utils/cn';\n\ninterface PageLayoutProps {\n  /** Page title */\n  title: string;\n  /** Optional description */\n  description?: string;\n  /** Actions to display in the header (buttons, etc.) */\n  actions?: ReactNode;\n  /** Page content */\n  children: ReactNode;\n  /** Additional class names */\n  className?: string;\n}\n\n/**\n * Standard page layout component with title, description, and content area\n */\nexport function PageLayout({ title, description, actions, children, className }: PageLayoutProps) {\n  return (\n    <div className={cn('flex h-full flex-col', className)}>\n      {/* Page Header */}\n      <header className=\"flex flex-col gap-4 border-b border-border bg-background px-6 py-4 sm:flex-row sm:items-center sm:justify-between\">\n        <div className=\"min-w-0 flex-1\">\n          <h1 className=\"text-2xl font-bold tracking-tight text-foreground sm:text-3xl\">{title}</h1>\n          {description && (\n            <p className=\"mt-1 text-sm text-muted-foreground sm:text-base\">{description}</p>\n          )}\n        </div>\n        {actions && (\n          <div className=\"flex flex-shrink-0 flex-wrap items-center gap-2\">{actions}</div>\n        )}\n      </header>\n\n      {/* Page Content — must not use a <main> landmark here because the\n          host shell (AppShellLayout) already renders one; nesting <main>\n          elements is invalid HTML and an a11y violation. */}\n      <div className=\"flex-1 overflow-auto p-6\">{children}</div>\n    </div>\n  );\n}\n\ninterface PageSectionProps {\n  /** Section title */\n  title?: string;\n  /** Optional description */\n  description?: string;\n  /** Section content */\n  children: ReactNode;\n  /** Additional class names */\n  className?: string;\n}\n\n/**\n * Section within a page\n */\nexport function PageSection({ title, description, children, className }: PageSectionProps) {\n  return (\n    <section className={cn('space-y-4', className)}>\n      {(title || description) && (\n        <div>\n          {title && <h2 className=\"text-lg font-semibold text-foreground\">{title}</h2>}\n          {description && <p className=\"text-sm text-muted-foreground\">{description}</p>}\n        </div>\n      )}\n      {children}\n    </section>\n  );\n}\n"],"mappings":";;;AAmBA,SAAgB,EAAW,EAAE,UAAO,gBAAa,YAAS,aAAU,gBAA8B;AAChG,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,wBAAwB,EAAU;YAArD,CAEE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAAiE;KAAW,CAAA,EACzF,KACC,kBAAC,KAAD;KAAG,WAAU;eAAmD;KAAgB,CAAA,CAE9E;OACL,KACC,kBAAC,OAAD;IAAK,WAAU;cAAmD;IAAc,CAAA,CAE3E;MAKT,kBAAC,OAAD;GAAK,WAAU;GAA4B;GAAe,CAAA,CACtD"}

package/dist/admin/components/PermissionGuard.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from 'react';
+
+interface PermissionGuardProps {
+    allowed: boolean;
+    isLoading: boolean;
+    pageTitle: string;
+    denyMessage?: string;
+    children: ReactNode;
+}
+export declare const PermissionGuard: FC<PermissionGuardProps>;
+export {};
+//# sourceMappingURL=PermissionGuard.d.ts.map

package/dist/admin/components/PermissionGuard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionGuard.d.ts","sourceRoot":"","sources":["../../../src/admin/components/PermissionGuard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI3C,UAAU,oBAAoB;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAoBpD,CAAC"}

package/dist/admin/components/PermissionGuard.js

@@ -0,0 +1,18 @@
+import { PageLayout as e } from "./PageLayout.js";
+import { AccessDenied as t } from "./AccessDenied.js";
+import { Fragment as n, jsx as r } from "react/jsx-runtime";
+//#region src/admin/components/PermissionGuard.tsx
+var i = ({ allowed: i, isLoading: a, pageTitle: o, denyMessage: s, children: c }) => a ? /* @__PURE__ */ r(e, {
+	title: o,
+	children: /* @__PURE__ */ r("div", {
+		className: "text-center py-16 text-muted-foreground",
+		children: "Loading permissions..."
+	})
+}) : i ? /* @__PURE__ */ r(n, { children: c }) : /* @__PURE__ */ r(e, {
+	title: o,
+	children: /* @__PURE__ */ r(t, { message: s })
+});
+//#endregion
+export { i as PermissionGuard };
+
+//# sourceMappingURL=PermissionGuard.js.map

package/dist/admin/components/PermissionGuard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionGuard.js","names":[],"sources":["../../../src/admin/components/PermissionGuard.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { PageLayout } from './PageLayout';\nimport { AccessDenied } from './AccessDenied';\n\ninterface PermissionGuardProps {\n  allowed: boolean;\n  isLoading: boolean;\n  pageTitle: string;\n  denyMessage?: string;\n  children: ReactNode;\n}\n\nexport const PermissionGuard: FC<PermissionGuardProps> = ({\n  allowed,\n  isLoading,\n  pageTitle,\n  denyMessage,\n  children,\n}) => {\n  if (isLoading)\n    return (\n      <PageLayout title={pageTitle}>\n        <div className=\"text-center py-16 text-muted-foreground\">Loading permissions...</div>\n      </PageLayout>\n    );\n  if (!allowed)\n    return (\n      <PageLayout title={pageTitle}>\n        <AccessDenied message={denyMessage} />\n      </PageLayout>\n    );\n  return <>{children}</>;\n};\n"],"mappings":";;;;AAYA,IAAa,KAA6C,EACxD,YACA,cACA,cACA,gBACA,kBAEI,IAEA,kBAAC,GAAD;CAAY,OAAO;WACjB,kBAAC,OAAD;EAAK,WAAU;YAA0C;EAA4B,CAAA;CAC1E,CAAA,GAEZ,IAME,kBAAA,GAAA,EAAG,aAAY,CAAA,GAJlB,kBAAC,GAAD;CAAY,OAAO;WACjB,kBAAC,GAAD,EAAc,SAAS,GAAe,CAAA;CAC3B,CAAA"}

package/dist/admin/components/RowActions.d.ts

@@ -0,0 +1,41 @@
+import { ReactNode } from 'react';
+
+export interface RowAction {
+    /** Unique key for the action */
+    key: string;
+    /** Display label */
+    label: string;
+    /** Icon component */
+    icon?: ReactNode;
+    /** Action handler */
+    onClick: () => void;
+    /** Whether this is a destructive action */
+    destructive?: boolean;
+    /** Whether the action is disabled */
+    disabled?: boolean;
+    /** Separator before this item */
+    separator?: boolean;
+}
+export interface RowActionsProps {
+    /** Actions to display */
+    actions: RowAction[];
+    /** Accessibility label */
+    ariaLabel?: string;
+    /** Stop event propagation on click */
+    stopPropagation?: boolean;
+}
+/**
+ * RowActions - Dropdown menu for table row actions
+ */
+export declare function RowActions({ actions, ariaLabel, stopPropagation, }: RowActionsProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Create common row actions
+ */
+export declare function createRowActions(config: {
+    onView?: () => void;
+    onEdit?: () => void;
+    onDuplicate?: () => void;
+    onOpenExternal?: () => void;
+    onDelete?: () => void;
+}): RowAction[];
+//# sourceMappingURL=RowActions.d.ts.map

package/dist/admin/components/RowActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowActions.d.ts","sourceRoot":"","sources":["../../../src/admin/components/RowActions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASpE,MAAM,WAAW,SAAS;IACxB,gCAAgC;IAChC,GAAG,EAAE,MAAM,CAAC;IACZ,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,qBAAqB;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,qBAAqB;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iCAAiC;IACjC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B,yBAAyB;IACzB,OAAO,EAAE,SAAS,EAAE,CAAC;IACrB,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAMD;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,SAAyB,EACzB,eAAsB,GACvB,EAAE,eAAe,2CAqGjB;AAMD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE;IACvC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,GAAG,SAAS,EAAE,CAmDd"}

package/dist/admin/components/RowActions.js

@@ -0,0 +1,93 @@
+import { cn as e } from "../utils/cn.js";
+import { Button as t } from "./ui.js";
+import { useEffect as n, useRef as r, useState as i } from "react";
+import { Copy as a, ExternalLink as o, Eye as s, MoreHorizontal as c, Pencil as l, Trash2 as u } from "lucide-react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/admin/components/RowActions.tsx
+function p({ actions: a, ariaLabel: o = "Row actions", stopPropagation: s = !0 }) {
+	let [l, u] = i(!1), p = r(null), m = r(null);
+	n(() => {
+		if (!l) return;
+		let e = (e) => {
+			p.current && !p.current.contains(e.target) && u(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, [l]), n(() => {
+		if (!l) return;
+		let e = (e) => {
+			e.key === "Escape" && u(!1);
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [l]);
+	let h = (e) => {
+		s && e.stopPropagation(), u(!l);
+	}, g = (e, t) => {
+		s && t.stopPropagation(), e.disabled || (u(!1), e.onClick());
+	};
+	return /* @__PURE__ */ f("div", {
+		ref: p,
+		className: "relative",
+		children: [/* @__PURE__ */ d(t, {
+			variant: "ghost",
+			size: "icon",
+			onClick: h,
+			"aria-label": o,
+			"aria-haspopup": "true",
+			"aria-expanded": l,
+			className: "h-8 w-8",
+			children: /* @__PURE__ */ d(c, { className: "h-4 w-4" })
+		}), l && /* @__PURE__ */ d("div", {
+			ref: m,
+			className: e("absolute right-0 top-full z-50 mt-1 min-w-[160px] rounded-md border border-border bg-popover p-1 shadow-lg", "animate-in fade-in-0 zoom-in-95 duration-100"),
+			role: "menu",
+			children: a.map((t, n) => /* @__PURE__ */ f("div", { children: [t.separator && n > 0 && /* @__PURE__ */ d("div", {
+				className: "my-1 h-px bg-border",
+				role: "separator"
+			}), /* @__PURE__ */ f("button", {
+				role: "menuitem",
+				onClick: (e) => g(t, e),
+				disabled: t.disabled,
+				className: e("flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors", "focus:bg-accent focus:outline-none", t.disabled ? "cursor-not-allowed opacity-50" : t.destructive ? "text-destructive hover:bg-destructive/10 focus:bg-destructive/10" : "text-foreground hover:bg-accent"),
+				children: [t.icon && /* @__PURE__ */ d("span", {
+					className: "h-4 w-4",
+					children: t.icon
+				}), t.label]
+			})] }, t.key))
+		})]
+	});
+}
+function m(e) {
+	let t = [];
+	return e.onView && t.push({
+		key: "view",
+		label: "View",
+		icon: /* @__PURE__ */ d(s, { className: "h-4 w-4" }),
+		onClick: e.onView
+	}), e.onEdit && t.push({
+		key: "edit",
+		label: "Edit",
+		icon: /* @__PURE__ */ d(l, { className: "h-4 w-4" }),
+		onClick: e.onEdit
+	}), e.onDuplicate && t.push({
+		key: "duplicate",
+		label: "Duplicate",
+		icon: /* @__PURE__ */ d(a, { className: "h-4 w-4" }),
+		onClick: e.onDuplicate
+	}), e.onOpenExternal && t.push({
+		key: "open-external",
+		label: "Open in new tab",
+		icon: /* @__PURE__ */ d(o, { className: "h-4 w-4" }),
+		onClick: e.onOpenExternal
+	}), e.onDelete && t.push({
+		key: "delete",
+		label: "Delete",
+		icon: /* @__PURE__ */ d(u, { className: "h-4 w-4" }),
+		onClick: e.onDelete,
+		destructive: !0,
+		separator: t.length > 0
+	}), t;
+}
+//#endregion
+export { p as RowActions, m as createRowActions };
+
+//# sourceMappingURL=RowActions.js.map

package/dist/admin/components/RowActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowActions.js","names":[],"sources":["../../../src/admin/components/RowActions.tsx"],"sourcesContent":["import { useState, useRef, useEffect, type ReactNode } from 'react';\nimport { MoreHorizontal, Pencil, Trash2, Eye, Copy, ExternalLink } from 'lucide-react';\nimport { Button } from './ui';\nimport { cn } from '../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface RowAction {\n  /** Unique key for the action */\n  key: string;\n  /** Display label */\n  label: string;\n  /** Icon component */\n  icon?: ReactNode;\n  /** Action handler */\n  onClick: () => void;\n  /** Whether this is a destructive action */\n  destructive?: boolean;\n  /** Whether the action is disabled */\n  disabled?: boolean;\n  /** Separator before this item */\n  separator?: boolean;\n}\n\nexport interface RowActionsProps {\n  /** Actions to display */\n  actions: RowAction[];\n  /** Accessibility label */\n  ariaLabel?: string;\n  /** Stop event propagation on click */\n  stopPropagation?: boolean;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\n/**\n * RowActions - Dropdown menu for table row actions\n */\nexport function RowActions({\n  actions,\n  ariaLabel = 'Row actions',\n  stopPropagation = true,\n}: RowActionsProps) {\n  const [open, setOpen] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const menuRef = useRef<HTMLDivElement>(null);\n\n  // Close on click outside\n  useEffect(() => {\n    if (!open) return;\n\n    const handleClickOutside = (e: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {\n        setOpen(false);\n      }\n    };\n\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, [open]);\n\n  // Close on escape\n  useEffect(() => {\n    if (!open) return;\n\n    const handleEscape = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        setOpen(false);\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n    return () => document.removeEventListener('keydown', handleEscape);\n  }, [open]);\n\n  const handleTriggerClick = (e: React.MouseEvent) => {\n    if (stopPropagation) {\n      e.stopPropagation();\n    }\n    setOpen(!open);\n  };\n\n  const handleActionClick = (action: RowAction, e: React.MouseEvent) => {\n    if (stopPropagation) {\n      e.stopPropagation();\n    }\n    if (!action.disabled) {\n      setOpen(false);\n      action.onClick();\n    }\n  };\n\n  return (\n    <div ref={containerRef} className=\"relative\">\n      <Button\n        variant=\"ghost\"\n        size=\"icon\"\n        onClick={handleTriggerClick}\n        aria-label={ariaLabel}\n        aria-haspopup=\"true\"\n        aria-expanded={open}\n        className=\"h-8 w-8\"\n      >\n        <MoreHorizontal className=\"h-4 w-4\" />\n      </Button>\n\n      {open && (\n        <div\n          ref={menuRef}\n          className={cn(\n            'absolute right-0 top-full z-50 mt-1 min-w-[160px] rounded-md border border-border bg-popover p-1 shadow-lg',\n            'animate-in fade-in-0 zoom-in-95 duration-100'\n          )}\n          role=\"menu\"\n        >\n          {actions.map((action, index) => (\n            <div key={action.key}>\n              {action.separator && index > 0 && (\n                <div className=\"my-1 h-px bg-border\" role=\"separator\" />\n              )}\n              <button\n                role=\"menuitem\"\n                onClick={(e) => handleActionClick(action, e)}\n                disabled={action.disabled}\n                className={cn(\n                  'flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors',\n                  'focus:bg-accent focus:outline-none',\n                  action.disabled\n                    ? 'cursor-not-allowed opacity-50'\n                    : action.destructive\n                      ? 'text-destructive hover:bg-destructive/10 focus:bg-destructive/10'\n                      : 'text-foreground hover:bg-accent'\n                )}\n              >\n                {action.icon && <span className=\"h-4 w-4\">{action.icon}</span>}\n                {action.label}\n              </button>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\n// ============================================================================\n// Pre-built Action Helpers\n// ============================================================================\n\n/**\n * Create common row actions\n */\nexport function createRowActions(config: {\n  onView?: () => void;\n  onEdit?: () => void;\n  onDuplicate?: () => void;\n  onOpenExternal?: () => void;\n  onDelete?: () => void;\n}): RowAction[] {\n  const actions: RowAction[] = [];\n\n  if (config.onView) {\n    actions.push({\n      key: 'view',\n      label: 'View',\n      icon: <Eye className=\"h-4 w-4\" />,\n      onClick: config.onView,\n    });\n  }\n\n  if (config.onEdit) {\n    actions.push({\n      key: 'edit',\n      label: 'Edit',\n      icon: <Pencil className=\"h-4 w-4\" />,\n      onClick: config.onEdit,\n    });\n  }\n\n  if (config.onDuplicate) {\n    actions.push({\n      key: 'duplicate',\n      label: 'Duplicate',\n      icon: <Copy className=\"h-4 w-4\" />,\n      onClick: config.onDuplicate,\n    });\n  }\n\n  if (config.onOpenExternal) {\n    actions.push({\n      key: 'open-external',\n      label: 'Open in new tab',\n      icon: <ExternalLink className=\"h-4 w-4\" />,\n      onClick: config.onOpenExternal,\n    });\n  }\n\n  if (config.onDelete) {\n    actions.push({\n      key: 'delete',\n      label: 'Delete',\n      icon: <Trash2 className=\"h-4 w-4\" />,\n      onClick: config.onDelete,\n      destructive: true,\n      separator: actions.length > 0,\n    });\n  }\n\n  return actions;\n}\n"],"mappings":";;;;;;AA0CA,SAAgB,EAAW,EACzB,YACA,eAAY,eACZ,qBAAkB,MACA;CAClB,IAAM,CAAC,GAAM,KAAW,EAAS,GAAM,EACjC,IAAe,EAAuB,KAAK,EAC3C,IAAU,EAAuB,KAAK;AAiB5C,CAdA,QAAgB;AACd,MAAI,CAAC,EAAM;EAEX,IAAM,KAAsB,MAAkB;AAC5C,GAAI,EAAa,WAAW,CAAC,EAAa,QAAQ,SAAS,EAAE,OAAe,IAC1E,EAAQ,GAAM;;AAKlB,SADA,SAAS,iBAAiB,aAAa,EAAmB,QAC7C,SAAS,oBAAoB,aAAa,EAAmB;IACzE,CAAC,EAAK,CAAC,EAGV,QAAgB;AACd,MAAI,CAAC,EAAM;EAEX,IAAM,KAAgB,MAAqB;AACzC,GAAI,EAAE,QAAQ,YACZ,EAAQ,GAAM;;AAKlB,SADA,SAAS,iBAAiB,WAAW,EAAa,QACrC,SAAS,oBAAoB,WAAW,EAAa;IACjE,CAAC,EAAK,CAAC;CAEV,IAAM,KAAsB,MAAwB;AAIlD,EAHI,KACF,EAAE,iBAAiB,EAErB,EAAQ,CAAC,EAAK;IAGV,KAAqB,GAAmB,MAAwB;AAIpE,EAHI,KACF,EAAE,iBAAiB,EAEhB,EAAO,aACV,EAAQ,GAAM,EACd,EAAO,SAAS;;AAIpB,QACE,kBAAC,OAAD;EAAK,KAAK;EAAc,WAAU;YAAlC,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,SAAS;GACT,cAAY;GACZ,iBAAc;GACd,iBAAe;GACf,WAAU;aAEV,kBAAC,GAAD,EAAgB,WAAU,WAAY,CAAA;GAC/B,CAAA,EAER,KACC,kBAAC,OAAD;GACE,KAAK;GACL,WAAW,EACT,8GACA,+CACD;GACD,MAAK;aAEJ,EAAQ,KAAK,GAAQ,MACpB,kBAAC,OAAD,EAAA,UAAA,CACG,EAAO,aAAa,IAAQ,KAC3B,kBAAC,OAAD;IAAK,WAAU;IAAsB,MAAK;IAAc,CAAA,EAE1D,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,MAAM,EAAkB,GAAQ,EAAE;IAC5C,UAAU,EAAO;IACjB,WAAW,EACT,mFACA,sCACA,EAAO,WACH,kCACA,EAAO,cACL,qEACA,kCACP;cAZH,CAcG,EAAO,QAAQ,kBAAC,QAAD;KAAM,WAAU;eAAW,EAAO;KAAY,CAAA,EAC7D,EAAO,MACD;MACL,EAAA,EArBI,EAAO,IAqBX,CACN;GACE,CAAA,CAEJ;;;AAWV,SAAgB,EAAiB,GAMjB;CACd,IAAM,IAAuB,EAAE;AAiD/B,QA/CI,EAAO,UACT,EAAQ,KAAK;EACX,KAAK;EACL,OAAO;EACP,MAAM,kBAAC,GAAD,EAAK,WAAU,WAAY,CAAA;EACjC,SAAS,EAAO;EACjB,CAAC,EAGA,EAAO,UACT,EAAQ,KAAK;EACX,KAAK;EACL,OAAO;EACP,MAAM,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA;EACpC,SAAS,EAAO;EACjB,CAAC,EAGA,EAAO,eACT,EAAQ,KAAK;EACX,KAAK;EACL,OAAO;EACP,MAAM,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA;EAClC,SAAS,EAAO;EACjB,CAAC,EAGA,EAAO,kBACT,EAAQ,KAAK;EACX,KAAK;EACL,OAAO;EACP,MAAM,kBAAC,GAAD,EAAc,WAAU,WAAY,CAAA;EAC1C,SAAS,EAAO;EACjB,CAAC,EAGA,EAAO,YACT,EAAQ,KAAK;EACX,KAAK;EACL,OAAO;EACP,MAAM,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA;EACpC,SAAS,EAAO;EAChB,aAAa;EACb,WAAW,EAAQ,SAAS;EAC7B,CAAC,EAGG"}

package/dist/admin/components/StatusBadge.d.ts

@@ -0,0 +1,35 @@
+import { TenantStatus, UserStatus, SubscriptionStatus, TicketStatus, TicketPriority, HealthStatus, DeploymentStatus } from '../types';
+
+interface StatusBadgeProps {
+    className?: string;
+}
+interface TenantStatusBadgeProps extends StatusBadgeProps {
+    status: TenantStatus;
+}
+export declare function TenantStatusBadge({ status, className }: TenantStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface UserStatusBadgeProps extends StatusBadgeProps {
+    status: UserStatus;
+}
+export declare function UserStatusBadge({ status, className }: UserStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface SubscriptionStatusBadgeProps extends StatusBadgeProps {
+    status: SubscriptionStatus;
+}
+export declare function SubscriptionStatusBadge({ status, className }: SubscriptionStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface TicketStatusBadgeProps extends StatusBadgeProps {
+    status: TicketStatus;
+}
+export declare function TicketStatusBadge({ status, className }: TicketStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface TicketPriorityBadgeProps extends StatusBadgeProps {
+    priority: TicketPriority;
+}
+export declare function TicketPriorityBadge({ priority, className }: TicketPriorityBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface HealthStatusBadgeProps extends StatusBadgeProps {
+    status: HealthStatus;
+}
+export declare function HealthStatusBadge({ status, className }: HealthStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+interface DeploymentStatusBadgeProps extends StatusBadgeProps {
+    status: DeploymentStatus;
+}
+export declare function DeploymentStatusBadge({ status, className }: DeploymentStatusBadgeProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=StatusBadge.d.ts.map

package/dist/admin/components/StatusBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.d.ts","sourceRoot":"","sources":["../../../src/admin/components/StatusBadge.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,kBAAkB,EAClB,YAAY,EACZ,cAAc,EACd,YAAY,EACZ,gBAAgB,EACjB,MAAM,UAAU,CAAC;AAElB,UAAU,gBAAgB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,sBAAuB,SAAQ,gBAAgB;IACvD,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,sBAAsB,2CAO9E;AAED,UAAU,oBAAqB,SAAQ,gBAAgB;IACrD,MAAM,EAAE,UAAU,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,oBAAoB,2CAO1E;AAED,UAAU,4BAA6B,SAAQ,gBAAgB;IAC7D,MAAM,EAAE,kBAAkB,CAAC;CAC5B;AAED,wBAAgB,uBAAuB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,4BAA4B,2CAO1F;AAED,UAAU,sBAAuB,SAAQ,gBAAgB;IACvD,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,sBAAsB,2CAO9E;AAED,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,QAAQ,EAAE,cAAc,CAAC;CAC1B;AAED,wBAAgB,mBAAmB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,wBAAwB,2CAOpF;AAED,UAAU,sBAAuB,SAAQ,gBAAgB;IACvD,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,wBAAgB,iBAAiB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,sBAAsB,2CAO9E;AAED,UAAU,0BAA2B,SAAQ,gBAAgB;IAC3D,MAAM,EAAE,gBAAgB,CAAC;CAC1B;AAED,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,0BAA0B,2CAOtF"}

package/dist/admin/components/StatusBadge.js

@@ -0,0 +1,41 @@
+import { cn as e } from "../utils/cn.js";
+import { Badge as t } from "./ui.js";
+import { DEPLOYMENT_STATUS_CONFIG as n, HEALTH_STATUS_CONFIG as r, TENANT_STATUS_CONFIG as i, USER_STATUS_CONFIG as a } from "../constants/index.js";
+import { jsx as o } from "react/jsx-runtime";
+//#region src/admin/components/StatusBadge.tsx
+function s({ status: n, className: r }) {
+	let a = i[n];
+	return /* @__PURE__ */ o(t, {
+		className: e(a.color, r),
+		variant: "outline",
+		children: a.label
+	});
+}
+function c({ status: n, className: r }) {
+	let i = a[n];
+	return /* @__PURE__ */ o(t, {
+		className: e(i.color, r),
+		variant: "outline",
+		children: i.label
+	});
+}
+function l({ status: n, className: i }) {
+	let a = r[n];
+	return /* @__PURE__ */ o(t, {
+		className: e(a.color, i),
+		variant: "outline",
+		children: a.label
+	});
+}
+function u({ status: r, className: i }) {
+	let a = n[r];
+	return /* @__PURE__ */ o(t, {
+		className: e(a.color, i),
+		variant: "outline",
+		children: a.label
+	});
+}
+//#endregion
+export { u as DeploymentStatusBadge, l as HealthStatusBadge, s as TenantStatusBadge, c as UserStatusBadge };
+
+//# sourceMappingURL=StatusBadge.js.map

package/dist/admin/components/StatusBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.js","names":[],"sources":["../../../src/admin/components/StatusBadge.tsx"],"sourcesContent":["import { Badge } from './ui';\nimport { cn } from '../utils/cn';\nimport {\n  TENANT_STATUS_CONFIG,\n  USER_STATUS_CONFIG,\n  SUBSCRIPTION_STATUS_CONFIG,\n  TICKET_STATUS_CONFIG,\n  TICKET_PRIORITY_CONFIG,\n  HEALTH_STATUS_CONFIG,\n  DEPLOYMENT_STATUS_CONFIG,\n} from '../constants';\nimport type {\n  TenantStatus,\n  UserStatus,\n  SubscriptionStatus,\n  TicketStatus,\n  TicketPriority,\n  HealthStatus,\n  DeploymentStatus,\n} from '../types';\n\ninterface StatusBadgeProps {\n  className?: string;\n}\n\ninterface TenantStatusBadgeProps extends StatusBadgeProps {\n  status: TenantStatus;\n}\n\nexport function TenantStatusBadge({ status, className }: TenantStatusBadgeProps) {\n  const config = TENANT_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface UserStatusBadgeProps extends StatusBadgeProps {\n  status: UserStatus;\n}\n\nexport function UserStatusBadge({ status, className }: UserStatusBadgeProps) {\n  const config = USER_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface SubscriptionStatusBadgeProps extends StatusBadgeProps {\n  status: SubscriptionStatus;\n}\n\nexport function SubscriptionStatusBadge({ status, className }: SubscriptionStatusBadgeProps) {\n  const config = SUBSCRIPTION_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface TicketStatusBadgeProps extends StatusBadgeProps {\n  status: TicketStatus;\n}\n\nexport function TicketStatusBadge({ status, className }: TicketStatusBadgeProps) {\n  const config = TICKET_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface TicketPriorityBadgeProps extends StatusBadgeProps {\n  priority: TicketPriority;\n}\n\nexport function TicketPriorityBadge({ priority, className }: TicketPriorityBadgeProps) {\n  const config = TICKET_PRIORITY_CONFIG[priority];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface HealthStatusBadgeProps extends StatusBadgeProps {\n  status: HealthStatus;\n}\n\nexport function HealthStatusBadge({ status, className }: HealthStatusBadgeProps) {\n  const config = HEALTH_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n\ninterface DeploymentStatusBadgeProps extends StatusBadgeProps {\n  status: DeploymentStatus;\n}\n\nexport function DeploymentStatusBadge({ status, className }: DeploymentStatusBadgeProps) {\n  const config = DEPLOYMENT_STATUS_CONFIG[status];\n  return (\n    <Badge className={cn(config.color, className)} variant=\"outline\">\n      {config.label}\n    </Badge>\n  );\n}\n"],"mappings":";;;;;AA6BA,SAAgB,EAAkB,EAAE,WAAQ,gBAAqC;CAC/E,IAAM,IAAS,EAAqB;AACpC,QACE,kBAAC,GAAD;EAAO,WAAW,EAAG,EAAO,OAAO,EAAU;EAAE,SAAQ;YACpD,EAAO;EACF,CAAA;;AAQZ,SAAgB,EAAgB,EAAE,WAAQ,gBAAmC;CAC3E,IAAM,IAAS,EAAmB;AAClC,QACE,kBAAC,GAAD;EAAO,WAAW,EAAG,EAAO,OAAO,EAAU;EAAE,SAAQ;YACpD,EAAO;EACF,CAAA;;AA+CZ,SAAgB,EAAkB,EAAE,WAAQ,gBAAqC;CAC/E,IAAM,IAAS,EAAqB;AACpC,QACE,kBAAC,GAAD;EAAO,WAAW,EAAG,EAAO,OAAO,EAAU;EAAE,SAAQ;YACpD,EAAO;EACF,CAAA;;AAQZ,SAAgB,EAAsB,EAAE,WAAQ,gBAAyC;CACvF,IAAM,IAAS,EAAyB;AACxC,QACE,kBAAC,GAAD;EAAO,WAAW,EAAG,EAAO,OAAO,EAAU;EAAE,SAAQ;YACpD,EAAO;EACF,CAAA"}