@burdenoff/microfe-devportal 2026.510.110

package/dist/devportal/components/PermissionGuard.js

@@ -0,0 +1,36 @@
+import { PageLoadingState as e } from "./LoadingState.js";
+import { AccessDenied as t } from "@burdenoff/fe-libs/shared/components";
+import { useI18n as n } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { usePermissions as r } from "@burdenoff/fe-libs/shared/providers/shell";
+import { Fragment as i, jsx as a } from "react/jsx-runtime";
+import { useAuth as o } from "@burdenoff/fe-libs/shared/providers/shell/AuthProvider";
+//#region src/devportal/components/PermissionGuard.tsx
+var s = ({ permission: s, children: c }) => {
+	let l = null, u = !1, d = !1, f = !1;
+	try {
+		let e = r();
+		l = e.hasPermission, u = e.isLoading, d = e.permissions?.permissions?.some((e) => e.resourceType === "rbac" && e.level === "ADMIN") ?? !1;
+	} catch {
+		l = null, u = !1, d = !1;
+	}
+	try {
+		f = o().isAuthenticated;
+	} catch {
+		f = !1;
+	}
+	let p = typeof window < "u" && (window.location.hostname === "localhost" || window.location.hostname.endsWith(".local.burdenoff.com")) && f, { t: m } = n(), h = (e, t) => {
+		let n = m(e);
+		return n === e ? t : n;
+	};
+	return u ? /* @__PURE__ */ a("div", {
+		className: "flex min-h-screen items-center justify-center bg-bg-canvas",
+		children: /* @__PURE__ */ a(e, {})
+	}) : l && !l(s) && !d && !p ? /* @__PURE__ */ a(t, {
+		title: h("devportal.accessDenied", "Access Denied"),
+		description: h("devportal.noPermissionView", "You don't have permission to view this page.")
+	}) : /* @__PURE__ */ a(i, { children: c });
+};
+//#endregion
+export { s as PermissionGuard };
+
+//# sourceMappingURL=PermissionGuard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionGuard.js","names":[],"sources":["../../../src/devportal/components/PermissionGuard.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport { usePermissions } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { useAuth } from \"@burdenoff/fe-libs/shared/providers/shell/AuthProvider\";\nimport { AccessDenied } from \"@burdenoff/fe-libs/shared/components\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { PageLoadingState } from \"./LoadingState\";\nimport type { DevportalPermission } from \"../constants/permissions\";\n\ninterface PermissionGuardProps {\n  permission: DevportalPermission;\n  children: ReactNode;\n}\n\n/**\n * Wraps page content with a permission check.\n * Shows a loading state while permissions resolve, then either\n * renders children (if permitted) or an AccessDenied screen.\n */\nexport const PermissionGuard: FC<PermissionGuardProps> = ({\n  permission,\n  children,\n}) => {\n  let hasPermission: ((permission: DevportalPermission) => boolean) | null =\n    null;\n  let isLoading = false;\n  let isRbacAdmin = false;\n  let isAuthenticated = false;\n\n  try {\n    const permissions = usePermissions();\n    hasPermission = permissions.hasPermission as (\n      permission: DevportalPermission,\n    ) => boolean;\n    isLoading = permissions.isLoading;\n    isRbacAdmin =\n      permissions.permissions?.permissions?.some(\n        (entry) => entry.resourceType === \"rbac\" && entry.level === \"ADMIN\",\n      ) ?? false;\n  } catch {\n    // Standalone/dev mode intentionally allows rendering without shell RBAC context.\n    hasPermission = null;\n    isLoading = false;\n    isRbacAdmin = false;\n  }\n\n  try {\n    const auth = useAuth();\n    isAuthenticated = auth.isAuthenticated;\n  } catch {\n    isAuthenticated = false;\n  }\n\n  const isLocalShellDev =\n    typeof window !== \"undefined\" &&\n    (window.location.hostname === \"localhost\" ||\n      window.location.hostname.endsWith(\".local.burdenoff.com\"));\n\n  const allowLocalShellBypass = isLocalShellDev && isAuthenticated;\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n\n  if (isLoading) {\n    return (\n      <div className=\"flex min-h-screen items-center justify-center bg-bg-canvas\">\n        <PageLoadingState />\n      </div>\n    );\n  }\n\n  if (\n    hasPermission &&\n    !hasPermission(permission) &&\n    !isRbacAdmin &&\n    !allowLocalShellBypass\n  ) {\n    return (\n      <AccessDenied\n        title={tr(\"devportal.accessDenied\", \"Access Denied\")}\n        description={tr(\n          \"devportal.noPermissionView\",\n          \"You don't have permission to view this page.\",\n        )}\n      />\n    );\n  }\n\n  return <>{children}</>;\n};\n"],"mappings":";;;;;;;AAkBA,IAAa,KAA6C,EACxD,eACA,kBACI;CACJ,IAAI,IACF,MACE,IAAY,IACZ,IAAc,IACd,IAAkB;AAEtB,KAAI;EACF,IAAM,IAAc,GAAgB;AAKpC,EAJA,IAAgB,EAAY,eAG5B,IAAY,EAAY,WACxB,IACE,EAAY,aAAa,aAAa,MACnC,MAAU,EAAM,iBAAiB,UAAU,EAAM,UAAU,QAC7D,IAAI;SACD;AAIN,EAFA,IAAgB,MAChB,IAAY,IACZ,IAAc;;AAGhB,KAAI;AAEF,MADa,GAAS,CACC;SACjB;AACN,MAAkB;;CAQpB,IAAM,IAJJ,OAAO,SAAW,QACjB,OAAO,SAAS,aAAa,eAC5B,OAAO,SAAS,SAAS,SAAS,uBAAuB,KAEZ,GAC3C,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;;AA4BpC,QAzBI,IAEA,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD,EAAoB,CAAA;EAChB,CAAA,GAKR,KACA,CAAC,EAAc,EAAW,IAC1B,CAAC,KACD,CAAC,IAGC,kBAAC,GAAD;EACE,OAAO,EAAG,0BAA0B,gBAAgB;EACpD,aAAa,EACX,8BACA,+CACD;EACD,CAAA,GAIC,kBAAA,GAAA,EAAG,aAAY,CAAA"}

package/dist/devportal/components/SecretDisplay.d.ts

@@ -0,0 +1,32 @@
+import { FC } from 'react';
+
+export interface SecretDisplayProps {
+    value: string;
+    label?: string;
+    className?: string;
+    showCopy?: boolean;
+    defaultHidden?: boolean;
+    /** Alias for defaultHidden=false - shows the secret by default */
+    visible?: boolean;
+}
+/**
+ * Component for displaying secrets with show/hide and copy functionality
+ */
+export declare const SecretDisplay: FC<SecretDisplayProps>;
+/**
+ * Compact inline secret display
+ */
+export declare const InlineSecret: FC<{
+    value: string;
+    className?: string;
+}>;
+/**
+ * New secret alert - shown once when a new secret is generated
+ */
+export declare const NewSecretAlert: FC<{
+    title: string;
+    secret: string;
+    description?: string;
+    onDismiss?: () => void;
+}>;
+//# sourceMappingURL=SecretDisplay.d.ts.map

package/dist/devportal/components/SecretDisplay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SecretDisplay.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/SecretDisplay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAY,MAAM,OAAO,CAAC;AAU1C,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kEAAkE;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAyEhD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CA2CA,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CA0DA,CAAC"}

package/dist/devportal/components/SecretDisplay.js

@@ -0,0 +1,119 @@
+import { cn as e } from "../utils/cn.js";
+import { nativeCopyText as t, nativeImpact as n, nativeNotify as r } from "../../utils/nativeBridge.js";
+import { useState as i } from "react";
+import { useI18n as a } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { Check as o, Copy as s, Eye as c, EyeOff as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/devportal/components/SecretDisplay.tsx
+var f = ({ value: f, label: p, className: m, showCopy: h = !0, defaultHidden: g = !0, visible: _ }) => {
+	let { t: v } = a(), y = (e, t) => {
+		let n = v(e);
+		return n === e ? t : n;
+	}, [b, x] = i(_ === void 0 ? !g : _), [S, C] = i(!1), w = async () => {
+		n("light"), await t(f) ? (C(!0), r("success"), setTimeout(() => C(!1), 2e3)) : r("error");
+	}, T = "•".repeat(Math.min(f.length, 40));
+	return /* @__PURE__ */ d("div", {
+		className: e("space-y-1", m),
+		children: [p && /* @__PURE__ */ u("label", {
+			className: "text-sm font-medium text-muted-foreground",
+			children: p
+		}), /* @__PURE__ */ d("div", {
+			className: "flex items-center gap-2",
+			children: [
+				/* @__PURE__ */ u("code", {
+					className: "flex-1 rounded-md bg-muted px-3 py-2 font-mono text-sm break-all",
+					children: b ? f : T
+				}),
+				/* @__PURE__ */ u("button", {
+					type: "button",
+					onClick: () => x(!b),
+					className: "rounded-md p-2 hover:bg-muted transition-colors",
+					title: b ? y("devportal.hide", "Hide") : y("devportal.show", "Show"),
+					children: u(b ? l : c, { size: 16 })
+				}),
+				h && /* @__PURE__ */ u("button", {
+					type: "button",
+					onClick: w,
+					className: "rounded-md p-2 hover:bg-muted transition-colors",
+					title: y("devportal.copyToClipboard", "Copy to clipboard"),
+					children: S ? /* @__PURE__ */ u(o, {
+						size: 16,
+						className: "text-status-success-text"
+					}) : /* @__PURE__ */ u(s, { size: 16 })
+				})
+			]
+		})]
+	});
+}, p = ({ title: e, secret: t, description: n, onDismiss: r }) => {
+	let { t: i } = a();
+	return /* @__PURE__ */ u("div", {
+		className: "rounded-lg border border-border-subtle bg-status-warning-bg-subtle p-4",
+		children: /* @__PURE__ */ d("div", {
+			className: "flex items-start gap-3",
+			children: [
+				/* @__PURE__ */ u("div", {
+					className: "flex-shrink-0",
+					children: /* @__PURE__ */ u("svg", {
+						className: "h-5 w-5 text-status-warning-text",
+						viewBox: "0 0 20 20",
+						fill: "currentColor",
+						children: /* @__PURE__ */ u("path", {
+							fillRule: "evenodd",
+							d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",
+							clipRule: "evenodd"
+						})
+					})
+				}),
+				/* @__PURE__ */ d("div", {
+					className: "flex-1",
+					children: [
+						/* @__PURE__ */ u("h4", {
+							className: "font-medium text-status-warning-text",
+							children: e
+						}),
+						n && /* @__PURE__ */ u("p", {
+							className: "mt-1 text-sm text-status-warning-text",
+							children: n
+						}),
+						/* @__PURE__ */ u("div", {
+							className: "mt-3",
+							children: /* @__PURE__ */ u(f, {
+								value: t,
+								defaultHidden: !1
+							})
+						}),
+						/* @__PURE__ */ u("p", {
+							className: "mt-2 text-xs text-status-warning-text",
+							children: ((e, t) => {
+								let n = i(e);
+								return n === e ? t : n;
+							})("devportal.copySecretNow", "Make sure to copy this secret now. You won't be able to see it again!")
+						})
+					]
+				}),
+				r && /* @__PURE__ */ d("button", {
+					type: "button",
+					onClick: r,
+					className: "text-status-warning-text hover:text-status-warning-text",
+					children: [/* @__PURE__ */ u("span", {
+						className: "sr-only",
+						children: "Dismiss"
+					}), /* @__PURE__ */ u("svg", {
+						className: "h-5 w-5",
+						viewBox: "0 0 20 20",
+						fill: "currentColor",
+						children: /* @__PURE__ */ u("path", {
+							fillRule: "evenodd",
+							d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+							clipRule: "evenodd"
+						})
+					})]
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { p as NewSecretAlert, f as SecretDisplay };
+
+//# sourceMappingURL=SecretDisplay.js.map

package/dist/devportal/components/SecretDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SecretDisplay.js","names":[],"sources":["../../../src/devportal/components/SecretDisplay.tsx"],"sourcesContent":["import { type FC, useState } from \"react\";\nimport { Eye, EyeOff, Copy, Check } from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { cn } from \"../utils/cn\";\nimport {\n  nativeCopyText,\n  nativeImpact,\n  nativeNotify,\n} from \"../../utils/nativeBridge\";\n\nexport interface SecretDisplayProps {\n  value: string;\n  label?: string;\n  className?: string;\n  showCopy?: boolean;\n  defaultHidden?: boolean;\n  /** Alias for defaultHidden=false - shows the secret by default */\n  visible?: boolean;\n}\n\n/**\n * Component for displaying secrets with show/hide and copy functionality\n */\nexport const SecretDisplay: FC<SecretDisplayProps> = ({\n  value,\n  label,\n  className,\n  showCopy = true,\n  defaultHidden = true,\n  visible,\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n  // If visible is explicitly set, use it; otherwise use defaultHidden\n  const [isVisible, setIsVisible] = useState(\n    visible !== undefined ? visible : !defaultHidden,\n  );\n  const [copied, setCopied] = useState(false);\n\n  const handleCopy = async () => {\n    void nativeImpact(\"light\");\n    const ok = await nativeCopyText(value);\n    if (ok) {\n      setCopied(true);\n      void nativeNotify(\"success\");\n      setTimeout(() => setCopied(false), 2000);\n    } else {\n      void nativeNotify(\"error\");\n    }\n  };\n\n  const maskedValue = \"•\".repeat(Math.min(value.length, 40));\n\n  return (\n    <div className={cn(\"space-y-1\", className)}>\n      {label && (\n        <label className=\"text-sm font-medium text-muted-foreground\">\n          {label}\n        </label>\n      )}\n      <div className=\"flex items-center gap-2\">\n        <code className=\"flex-1 rounded-md bg-muted px-3 py-2 font-mono text-sm break-all\">\n          {isVisible ? value : maskedValue}\n        </code>\n        <button\n          type=\"button\"\n          onClick={() => setIsVisible(!isVisible)}\n          className=\"rounded-md p-2 hover:bg-muted transition-colors\"\n          title={\n            isVisible\n              ? tr(\"devportal.hide\", \"Hide\")\n              : tr(\"devportal.show\", \"Show\")\n          }\n        >\n          {isVisible ? <EyeOff size={16} /> : <Eye size={16} />}\n        </button>\n        {showCopy && (\n          <button\n            type=\"button\"\n            onClick={handleCopy}\n            className=\"rounded-md p-2 hover:bg-muted transition-colors\"\n            title={tr(\"devportal.copyToClipboard\", \"Copy to clipboard\")}\n          >\n            {copied ? (\n              <Check size={16} className=\"text-status-success-text\" />\n            ) : (\n              <Copy size={16} />\n            )}\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n\n/**\n * Compact inline secret display\n */\nexport const InlineSecret: FC<{\n  value: string;\n  className?: string;\n}> = ({ value, className }) => {\n  const [isVisible, setIsVisible] = useState(false);\n  const [copied, setCopied] = useState(false);\n\n  const handleCopy = async () => {\n    void nativeImpact(\"light\");\n    const ok = await nativeCopyText(value);\n    if (ok) {\n      setCopied(true);\n      void nativeNotify(\"success\");\n      setTimeout(() => setCopied(false), 2000);\n    } else {\n      void nativeNotify(\"error\");\n    }\n  };\n\n  const maskedValue = value.substring(0, 8) + \"•\".repeat(20);\n\n  return (\n    <span className={cn(\"inline-flex items-center gap-1\", className)}>\n      <code className=\"font-mono text-sm\">\n        {isVisible ? value : maskedValue}\n      </code>\n      <button\n        type=\"button\"\n        onClick={() => setIsVisible(!isVisible)}\n        className=\"p-1 hover:bg-muted rounded\"\n      >\n        {isVisible ? <EyeOff size={12} /> : <Eye size={12} />}\n      </button>\n      <button\n        type=\"button\"\n        onClick={handleCopy}\n        className=\"p-1 hover:bg-muted rounded\"\n      >\n        {copied ? (\n          <Check size={12} className=\"text-status-success-text\" />\n        ) : (\n          <Copy size={12} />\n        )}\n      </button>\n    </span>\n  );\n};\n\n/**\n * New secret alert - shown once when a new secret is generated\n */\nexport const NewSecretAlert: FC<{\n  title: string;\n  secret: string;\n  description?: string;\n  onDismiss?: () => void;\n}> = ({ title, secret, description, onDismiss }) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n  return (\n    <div className=\"rounded-lg border border-border-subtle bg-status-warning-bg-subtle p-4\">\n      <div className=\"flex items-start gap-3\">\n        <div className=\"flex-shrink-0\">\n          <svg\n            className=\"h-5 w-5 text-status-warning-text\"\n            viewBox=\"0 0 20 20\"\n            fill=\"currentColor\"\n          >\n            <path\n              fillRule=\"evenodd\"\n              d=\"M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z\"\n              clipRule=\"evenodd\"\n            />\n          </svg>\n        </div>\n        <div className=\"flex-1\">\n          <h4 className=\"font-medium text-status-warning-text\">{title}</h4>\n          {description && (\n            <p className=\"mt-1 text-sm text-status-warning-text\">\n              {description}\n            </p>\n          )}\n          <div className=\"mt-3\">\n            <SecretDisplay value={secret} defaultHidden={false} />\n          </div>\n          <p className=\"mt-2 text-xs text-status-warning-text\">\n            {tr(\n              \"devportal.copySecretNow\",\n              \"Make sure to copy this secret now. You won't be able to see it again!\",\n            )}\n          </p>\n        </div>\n        {onDismiss && (\n          <button\n            type=\"button\"\n            onClick={onDismiss}\n            className=\"text-status-warning-text hover:text-status-warning-text\"\n          >\n            <span className=\"sr-only\">Dismiss</span>\n            <svg className=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </button>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAuBA,IAAa,KAAyC,EACpD,UACA,UACA,cACA,cAAW,IACX,mBAAgB,IAChB,iBACI;CACJ,IAAM,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAa,EAAE,EAAI;AACzB,SAAO,MAAe,IAAM,IAAW;IAGnC,CAAC,GAAW,KAAgB,EAChC,MAAY,KAAA,IAAsB,CAAC,IAAX,EACzB,EACK,CAAC,GAAQ,KAAa,EAAS,GAAM,EAErC,IAAa,YAAY;AAG7B,EAFK,EAAa,QAAQ,EACf,MAAM,EAAe,EAAM,IAEpC,EAAU,GAAK,EACV,EAAa,UAAU,EAC5B,iBAAiB,EAAU,GAAM,EAAE,IAAK,IAEnC,EAAa,QAAQ;IAIxB,IAAc,IAAI,OAAO,KAAK,IAAI,EAAM,QAAQ,GAAG,CAAC;AAE1D,QACE,kBAAC,OAAD;EAAK,WAAW,EAAG,aAAa,EAAU;YAA1C,CACG,KACC,kBAAC,SAAD;GAAO,WAAU;aACd;GACK,CAAA,EAEV,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,QAAD;KAAM,WAAU;eACb,IAAY,IAAQ;KAChB,CAAA;IACP,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAa,CAAC,EAAU;KACvC,WAAU;KACV,OACE,IACI,EAAG,kBAAkB,OAAO,GAC5B,EAAG,kBAAkB,OAAO;eAGrB,EAAZ,IAAa,IAAuB,GAAxB,EAAQ,MAAM,IAAM,CAAoB;KAC9C,CAAA;IACR,KACC,kBAAC,UAAD;KACE,MAAK;KACL,SAAS;KACT,WAAU;KACV,OAAO,EAAG,6BAA6B,oBAAoB;eAE1D,IACC,kBAAC,GAAD;MAAO,MAAM;MAAI,WAAU;MAA6B,CAAA,GAExD,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;KAEb,CAAA;IAEP;KACF;;GA0DG,KAKP,EAAE,UAAO,WAAQ,gBAAa,mBAAgB;CAClD,IAAM,EAAE,SAAM,GAAS;AAKvB,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MACE,WAAU;MACV,SAAQ;MACR,MAAK;gBAEL,kBAAC,QAAD;OACE,UAAS;OACT,GAAE;OACF,UAAS;OACT,CAAA;MACE,CAAA;KACF,CAAA;IACN,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,MAAD;OAAI,WAAU;iBAAwC;OAAW,CAAA;MAChE,KACC,kBAAC,KAAD;OAAG,WAAU;iBACV;OACC,CAAA;MAEN,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,GAAD;QAAe,OAAO;QAAQ,eAAe;QAAS,CAAA;OAClD,CAAA;MACN,kBAAC,KAAD;OAAG,WAAU;mBA9BT,GAAa,MAA6B;QACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,eAAO,MAAU,IAAM,IAAW;UA8BxB,2BACA,wEACD;OACC,CAAA;MACA;;IACL,KACC,kBAAC,UAAD;KACE,MAAK;KACL,SAAS;KACT,WAAU;eAHZ,CAKE,kBAAC,QAAD;MAAM,WAAU;gBAAU;MAAc,CAAA,EACxC,kBAAC,OAAD;MAAK,WAAU;MAAU,SAAQ;MAAY,MAAK;gBAChD,kBAAC,QAAD;OACE,UAAS;OACT,GAAE;OACF,UAAS;OACT,CAAA;MACE,CAAA,CACC;;IAEP;;EACF,CAAA"}

package/dist/devportal/components/SelectionCheckbox.d.ts

@@ -0,0 +1,11 @@
+interface SelectionCheckboxProps {
+    checked: boolean;
+    indeterminate?: boolean;
+    disabled?: boolean;
+    onChange: (checked: boolean) => void;
+    ariaLabel: string;
+    className?: string;
+}
+export declare function SelectionCheckbox({ checked, indeterminate, disabled, onChange, ariaLabel, className, }: SelectionCheckboxProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SelectionCheckbox.d.ts.map

package/dist/devportal/components/SelectionCheckbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionCheckbox.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/SelectionCheckbox.tsx"],"names":[],"mappings":"AAIA,UAAU,sBAAsB;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,aAAqB,EACrB,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,SAAS,GACV,EAAE,sBAAsB,2CAgCxB"}

package/dist/devportal/components/SelectionCheckbox.js

@@ -0,0 +1,26 @@
+import { cn as e } from "../utils/cn.js";
+import { useEffect as t, useRef as n } from "react";
+import { Check as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/devportal/components/SelectionCheckbox.tsx
+function o({ checked: o, indeterminate: s = !1, disabled: c = !1, onChange: l, ariaLabel: u, className: d }) {
+	let f = n(null);
+	return t(() => {
+		f.current && (f.current.indeterminate = s && !o);
+	}, [o, s]), /* @__PURE__ */ a("label", {
+		className: e("inline-flex h-5 w-5 cursor-pointer items-center justify-center rounded border border-border-primary bg-background transition-colors", o && "border-primary bg-primary text-primary-foreground", c && "cursor-not-allowed opacity-50", d),
+		children: [/* @__PURE__ */ i("input", {
+			ref: f,
+			type: "checkbox",
+			checked: o,
+			disabled: c,
+			"aria-label": u,
+			onChange: (e) => l(e.target.checked),
+			className: "sr-only"
+		}), (o || s) && /* @__PURE__ */ i(r, { className: e("h-3.5 w-3.5", s && "opacity-70") })]
+	});
+}
+//#endregion
+export { o as SelectionCheckbox };
+
+//# sourceMappingURL=SelectionCheckbox.js.map

package/dist/devportal/components/SelectionCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionCheckbox.js","names":[],"sources":["../../../src/devportal/components/SelectionCheckbox.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { Check } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\n\ninterface SelectionCheckboxProps {\n  checked: boolean;\n  indeterminate?: boolean;\n  disabled?: boolean;\n  onChange: (checked: boolean) => void;\n  ariaLabel: string;\n  className?: string;\n}\n\nexport function SelectionCheckbox({\n  checked,\n  indeterminate = false,\n  disabled = false,\n  onChange,\n  ariaLabel,\n  className,\n}: SelectionCheckboxProps) {\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (inputRef.current) {\n      inputRef.current.indeterminate = indeterminate && !checked;\n    }\n  }, [checked, indeterminate]);\n\n  return (\n    <label\n      className={cn(\n        \"inline-flex h-5 w-5 cursor-pointer items-center justify-center rounded border border-border-primary bg-background transition-colors\",\n        checked && \"border-primary bg-primary text-primary-foreground\",\n        disabled && \"cursor-not-allowed opacity-50\",\n        className,\n      )}\n    >\n      <input\n        ref={inputRef}\n        type=\"checkbox\"\n        checked={checked}\n        disabled={disabled}\n        aria-label={ariaLabel}\n        onChange={(event) => onChange(event.target.checked)}\n        className=\"sr-only\"\n      />\n      {(checked || indeterminate) && (\n        <Check className={cn(\"h-3.5 w-3.5\", indeterminate && \"opacity-70\")} />\n      )}\n    </label>\n  );\n}\n"],"mappings":";;;;;AAaA,SAAgB,EAAkB,EAChC,YACA,mBAAgB,IAChB,cAAW,IACX,aACA,cACA,gBACyB;CACzB,IAAM,IAAW,EAAyB,KAAK;AAQ/C,QANA,QAAgB;AACd,EAAI,EAAS,YACX,EAAS,QAAQ,gBAAgB,KAAiB,CAAC;IAEpD,CAAC,GAAS,EAAc,CAAC,EAG1B,kBAAC,SAAD;EACE,WAAW,EACT,uIACA,KAAW,qDACX,KAAY,iCACZ,EACD;YANH,CAQE,kBAAC,SAAD;GACE,KAAK;GACL,MAAK;GACI;GACC;GACV,cAAY;GACZ,WAAW,MAAU,EAAS,EAAM,OAAO,QAAQ;GACnD,WAAU;GACV,CAAA,GACA,KAAW,MACX,kBAAC,GAAD,EAAO,WAAW,EAAG,eAAe,KAAiB,aAAa,EAAI,CAAA,CAElE"}

package/dist/devportal/components/StatCard.d.ts

@@ -0,0 +1,27 @@
+import { FC, ReactNode } from 'react';
+
+interface StatCardProps {
+    title: string;
+    value: string | number | ReactNode;
+    description?: string;
+    icon?: ReactNode;
+    trend?: {
+        value: number;
+        label?: string;
+    };
+    className?: string;
+}
+/**
+ * Statistics card for dashboard metrics
+ */
+export declare const StatCard: FC<StatCardProps>;
+/**
+ * Grid of stat cards
+ */
+export declare const StatCardGrid: FC<{
+    children: ReactNode;
+    columns?: 2 | 3 | 4;
+    className?: string;
+}>;
+export {};
+//# sourceMappingURL=StatCard.d.ts.map

package/dist/devportal/components/StatCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatCard.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/StatCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAI3C,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA4DtC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAYA,CAAC"}

package/dist/devportal/components/StatCard.js

@@ -0,0 +1,54 @@
+import { cn as e } from "../utils/cn.js";
+import { Minus as t, TrendingDown as n, TrendingUp as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/devportal/components/StatCard.tsx
+var o = ({ title: o, value: s, description: c, icon: l, trend: u, className: d }) => /* @__PURE__ */ a("div", {
+	className: e("rounded-lg border bg-card p-6 shadow-sm transition-shadow hover:shadow-md", d),
+	children: [/* @__PURE__ */ a("div", {
+		className: "flex items-start justify-between",
+		children: [/* @__PURE__ */ a("div", {
+			className: "space-y-1",
+			children: [/* @__PURE__ */ i("p", {
+				className: "text-sm font-medium text-muted-foreground",
+				children: o
+			}), /* @__PURE__ */ i("p", {
+				className: "text-2xl font-bold",
+				children: s
+			})]
+		}), l && /* @__PURE__ */ i("div", {
+			className: "rounded-lg bg-primary/10 p-2 text-primary",
+			children: l
+		})]
+	}), (c || u) && /* @__PURE__ */ a("div", {
+		className: "mt-4 flex items-center gap-2 text-sm",
+		children: [
+			u && /* @__PURE__ */ a("span", {
+				className: e("flex items-center gap-1", u ? u.value > 0 ? "text-status-success-text" : u.value < 0 ? "text-status-error-text" : "text-text-secondary" : ""),
+				children: [
+					u ? u.value > 0 ? /* @__PURE__ */ i(r, { className: "h-4 w-4 text-status-success-text" }) : u.value < 0 ? /* @__PURE__ */ i(n, { className: "h-4 w-4 text-status-error-text" }) : /* @__PURE__ */ i(t, { className: "h-4 w-4 text-text-secondary" }) : null,
+					Math.abs(u.value),
+					"%"
+				]
+			}),
+			c && /* @__PURE__ */ i("span", {
+				className: "text-muted-foreground",
+				children: c
+			}),
+			u?.label && /* @__PURE__ */ i("span", {
+				className: "text-muted-foreground",
+				children: u.label
+			})
+		]
+	})]
+}), s = ({ children: t, columns: n = 4, className: r }) => /* @__PURE__ */ i("div", {
+	className: e("grid gap-4", {
+		2: "grid-cols-1 sm:grid-cols-2",
+		3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
+		4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
+	}[n], r),
+	children: t
+});
+//#endregion
+export { o as StatCard, s as StatCardGrid };
+
+//# sourceMappingURL=StatCard.js.map

package/dist/devportal/components/StatCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatCard.js","names":[],"sources":["../../../src/devportal/components/StatCard.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport { TrendingUp, TrendingDown, Minus } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\n\ninterface StatCardProps {\n  title: string;\n  value: string | number | ReactNode;\n  description?: string;\n  icon?: ReactNode;\n  trend?: {\n    value: number;\n    label?: string;\n  };\n  className?: string;\n}\n\n/**\n * Statistics card for dashboard metrics\n */\nexport const StatCard: FC<StatCardProps> = ({\n  title,\n  value,\n  description,\n  icon,\n  trend,\n  className,\n}) => {\n  const getTrendIcon = () => {\n    if (!trend) return null;\n    if (trend.value > 0)\n      return <TrendingUp className=\"h-4 w-4 text-status-success-text\" />;\n    if (trend.value < 0)\n      return <TrendingDown className=\"h-4 w-4 text-status-error-text\" />;\n    return <Minus className=\"h-4 w-4 text-text-secondary\" />;\n  };\n\n  const getTrendColor = () => {\n    if (!trend) return \"\";\n    if (trend.value > 0) return \"text-status-success-text\";\n    if (trend.value < 0) return \"text-status-error-text\";\n    return \"text-text-secondary\";\n  };\n\n  return (\n    <div\n      className={cn(\n        \"rounded-lg border bg-card p-6 shadow-sm transition-shadow hover:shadow-md\",\n        className,\n      )}\n    >\n      <div className=\"flex items-start justify-between\">\n        <div className=\"space-y-1\">\n          <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>\n          <p className=\"text-2xl font-bold\">{value}</p>\n        </div>\n        {icon && (\n          <div className=\"rounded-lg bg-primary/10 p-2 text-primary\">\n            {icon}\n          </div>\n        )}\n      </div>\n      {(description || trend) && (\n        <div className=\"mt-4 flex items-center gap-2 text-sm\">\n          {trend && (\n            <span className={cn(\"flex items-center gap-1\", getTrendColor())}>\n              {getTrendIcon()}\n              {Math.abs(trend.value)}%\n            </span>\n          )}\n          {description && (\n            <span className=\"text-muted-foreground\">{description}</span>\n          )}\n          {trend?.label && (\n            <span className=\"text-muted-foreground\">{trend.label}</span>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\n/**\n * Grid of stat cards\n */\nexport const StatCardGrid: FC<{\n  children: ReactNode;\n  columns?: 2 | 3 | 4;\n  className?: string;\n}> = ({ children, columns = 4, className }) => {\n  const colClasses = {\n    2: \"grid-cols-1 sm:grid-cols-2\",\n    3: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\n    4: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-4\",\n  };\n\n  return (\n    <div className={cn(\"grid gap-4\", colClasses[columns], className)}>\n      {children}\n    </div>\n  );\n};\n"],"mappings":";;;;AAmBA,IAAa,KAA+B,EAC1C,UACA,UACA,gBACA,SACA,UACA,mBAmBE,kBAAC,OAAD;CACE,WAAW,EACT,6EACA,EACD;WAJH,CAME,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAA6C;IAAU,CAAA,EACpE,kBAAC,KAAD;IAAG,WAAU;cAAsB;IAAU,CAAA,CACzC;MACL,KACC,kBAAC,OAAD;GAAK,WAAU;aACZ;GACG,CAAA,CAEJ;MACJ,KAAe,MACf,kBAAC,OAAD;EAAK,WAAU;YAAf;GACG,KACC,kBAAC,QAAD;IAAM,WAAW,EAAG,2BA3BvB,IACD,EAAM,QAAQ,IAAU,6BACxB,EAAM,QAAQ,IAAU,2BACrB,wBAHY,GA2BoD;cAA/D;KApCH,IACD,EAAM,QAAQ,IACT,kBAAC,GAAD,EAAY,WAAU,oCAAqC,CAAA,GAChE,EAAM,QAAQ,IACT,kBAAC,GAAD,EAAc,WAAU,kCAAmC,CAAA,GAC7D,kBAAC,GAAD,EAAO,WAAU,+BAAgC,CAAA,GALrC;KAsCR,KAAK,IAAI,EAAM,MAAM;KAAC;KAClB;;GAER,KACC,kBAAC,QAAD;IAAM,WAAU;cAAyB;IAAmB,CAAA;GAE7D,GAAO,SACN,kBAAC,QAAD;IAAM,WAAU;cAAyB,EAAM;IAAa,CAAA;GAE1D;IAEJ;IAOG,KAIP,EAAE,aAAU,aAAU,GAAG,mBAQ3B,kBAAC,OAAD;CAAK,WAAW,EAAG,cAPF;EACjB,GAAG;EACH,GAAG;EACH,GAAG;EACJ,CAG6C,IAAU,EAAU;CAC7D;CACG,CAAA"}

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

@@ -0,0 +1,33 @@
+import { FC } from 'react';
+
+interface StatusBadgeProps {
+    status: string;
+    type?: "app" | "webhook" | "delivery" | "invitation" | "tier" | "partner";
+    className?: string;
+}
+/**
+ * Status badge component with color coding
+ */
+export declare const StatusBadge: FC<StatusBadgeProps>;
+/**
+ * Verification badge
+ */
+export declare const VerifiedBadge: FC<{
+    verified: boolean;
+    className?: string;
+}>;
+/**
+ * Featured badge
+ */
+export declare const FeaturedBadge: FC<{
+    className?: string;
+}>;
+/**
+ * Active/Inactive indicator dot
+ */
+export declare const ActiveIndicator: FC<{
+    active: boolean;
+    className?: string;
+}>;
+export {};
+//# sourceMappingURL=StatusBadge.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/StatusBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAYhC,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,KAAK,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,GAAG,SAAS,CAAC;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA+C5C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC;IAAE,QAAQ,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAwBvE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAgBpD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC;IAAE,MAAM,EAAE,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAuBvE,CAAC"}

package/dist/devportal/components/StatusBadge.js

@@ -0,0 +1,49 @@
+import { cn as e } from "../utils/cn.js";
+import { APP_STATUS_COLORS as t, DELIVERY_STATUS_COLORS as n, INVITATION_STATUS_COLORS as r, ORG_TIER_COLORS as i, PARTNER_TIER_COLORS as a, WEBHOOK_STATUS_COLORS as o } from "../utils/constants.js";
+import { useI18n as s } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/devportal/components/StatusBadge.tsx
+var l = ({ status: s, type: l = "app", className: u }) => /* @__PURE__ */ c("span", {
+	className: e("inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium", (() => {
+		switch (l) {
+			case "webhook": return o[s] || "bg-bg-sunken text-text-primary";
+			case "delivery": return n[s] || "bg-bg-sunken text-text-primary";
+			case "invitation": return r[s] || "bg-bg-sunken text-text-primary";
+			case "tier": return i[s] || "bg-bg-sunken text-text-primary";
+			case "partner": return a[s] || "bg-bg-sunken text-text-primary";
+			default: return t[s] || "bg-bg-sunken text-text-primary";
+		}
+	})(), u),
+	children: ((e) => e.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (e) => e.toUpperCase()))(s)
+}), u = ({ verified: t, className: n }) => {
+	let { t: r } = s(), i = (e, t) => {
+		let n = r(e);
+		return n === e ? t : n;
+	};
+	return /* @__PURE__ */ c("span", {
+		className: e("inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium", t ? "bg-status-info-bg-subtle text-status-info-text" : "bg-bg-sunken text-text-secondary", n),
+		children: t ? i("devportal.verifiedBadge", "✓ Verified") : i("devportal.unverified", "Unverified")
+	});
+}, d = ({ className: t }) => {
+	let { t: n } = s();
+	return /* @__PURE__ */ c("span", {
+		className: e("inline-flex items-center gap-1 rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-xs font-medium text-status-warning-text", t),
+		children: ((e, t) => {
+			let r = n(e);
+			return r === e ? t : r;
+		})("devportal.featuredBadge", "★ Featured")
+	});
+}, f = ({ active: t, className: n }) => {
+	let { t: r } = s(), i = (e, t) => {
+		let n = r(e);
+		return n === e ? t : n;
+	};
+	return /* @__PURE__ */ c("span", {
+		className: e("inline-block h-2 w-2 rounded-full", t ? "bg-status-success-bg-subtle" : "bg-text-tertiary", n),
+		title: t ? i("devportal.active", "Active") : i("devportal.inactive", "Inactive")
+	});
+};
+//#endregion
+export { f as ActiveIndicator, d as FeaturedBadge, l as StatusBadge, u as VerifiedBadge };
+
+//# sourceMappingURL=StatusBadge.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBadge.js","names":[],"sources":["../../../src/devportal/components/StatusBadge.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { cn } from \"../utils/cn\";\nimport {\n  APP_STATUS_COLORS,\n  WEBHOOK_STATUS_COLORS,\n  DELIVERY_STATUS_COLORS,\n  INVITATION_STATUS_COLORS,\n  ORG_TIER_COLORS,\n  PARTNER_TIER_COLORS,\n} from \"../utils/constants\";\n\ninterface StatusBadgeProps {\n  status: string;\n  type?: \"app\" | \"webhook\" | \"delivery\" | \"invitation\" | \"tier\" | \"partner\";\n  className?: string;\n}\n\n/**\n * Status badge component with color coding\n */\nexport const StatusBadge: FC<StatusBadgeProps> = ({\n  status,\n  type = \"app\",\n  className,\n}) => {\n  const getColorClass = () => {\n    switch (type) {\n      case \"webhook\":\n        return (\n          WEBHOOK_STATUS_COLORS[status] || \"bg-bg-sunken text-text-primary\"\n        );\n      case \"delivery\":\n        return (\n          DELIVERY_STATUS_COLORS[status] || \"bg-bg-sunken text-text-primary\"\n        );\n      case \"invitation\":\n        return (\n          INVITATION_STATUS_COLORS[status] || \"bg-bg-sunken text-text-primary\"\n        );\n      case \"tier\":\n        return ORG_TIER_COLORS[status] || \"bg-bg-sunken text-text-primary\";\n      case \"partner\":\n        return PARTNER_TIER_COLORS[status] || \"bg-bg-sunken text-text-primary\";\n      case \"app\":\n      default:\n        return APP_STATUS_COLORS[status] || \"bg-bg-sunken text-text-primary\";\n    }\n  };\n\n  const formatStatus = (s: string) => {\n    return s\n      .replace(/_/g, \" \")\n      .toLowerCase()\n      .replace(/\\b\\w/g, (c) => c.toUpperCase());\n  };\n\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium\",\n        getColorClass(),\n        className,\n      )}\n    >\n      {formatStatus(status)}\n    </span>\n  );\n};\n\n/**\n * Verification badge\n */\nexport const VerifiedBadge: FC<{ verified: boolean; className?: string }> = ({\n  verified,\n  className,\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium\",\n        verified\n          ? \"bg-status-info-bg-subtle text-status-info-text\"\n          : \"bg-bg-sunken text-text-secondary\",\n        className,\n      )}\n    >\n      {verified\n        ? tr(\"devportal.verifiedBadge\", \"✓ Verified\")\n        : tr(\"devportal.unverified\", \"Unverified\")}\n    </span>\n  );\n};\n\n/**\n * Featured badge\n */\nexport const FeaturedBadge: FC<{ className?: string }> = ({ className }) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center gap-1 rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-xs font-medium text-status-warning-text\",\n        className,\n      )}\n    >\n      {tr(\"devportal.featuredBadge\", \"★ Featured\")}\n    </span>\n  );\n};\n\n/**\n * Active/Inactive indicator dot\n */\nexport const ActiveIndicator: FC<{ active: boolean; className?: string }> = ({\n  active,\n  className,\n}) => {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const value = t(key);\n    return value === key ? fallback : value;\n  };\n  return (\n    <span\n      className={cn(\n        \"inline-block h-2 w-2 rounded-full\",\n        active ? \"bg-status-success-bg-subtle\" : \"bg-text-tertiary\",\n        className,\n      )}\n      title={\n        active\n          ? tr(\"devportal.active\", \"Active\")\n          : tr(\"devportal.inactive\", \"Inactive\")\n      }\n    />\n  );\n};\n"],"mappings":";;;;;AAqBA,IAAa,KAAqC,EAChD,WACA,UAAO,OACP,mBAkCE,kBAAC,QAAD;CACE,WAAW,EACT,kFAlCsB;AAC1B,UAAQ,GAAR;GACE,KAAK,UACH,QACE,EAAsB,MAAW;GAErC,KAAK,WACH,QACE,EAAuB,MAAW;GAEtC,KAAK,aACH,QACE,EAAyB,MAAW;GAExC,KAAK,OACH,QAAO,EAAgB,MAAW;GACpC,KAAK,UACH,QAAO,EAAoB,MAAW;GAExC,QACE,QAAO,EAAkB,MAAW;;KAerB,EACf,EACD;aAbiB,MACb,EACJ,QAAQ,MAAM,IAAI,CAClB,aAAa,CACb,QAAQ,UAAU,MAAM,EAAE,aAAa,CAAC,EAW3B,EAAO;CAChB,CAAA,EAOE,KAAgE,EAC3E,aACA,mBACI;CACJ,IAAM,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;;AAEpC,QACE,kBAAC,QAAD;EACE,WAAW,EACT,+EACA,IACI,mDACA,oCACJ,EACD;YAEA,IACG,EAAG,2BAA2B,aAAa,GAC3C,EAAG,wBAAwB,aAAa;EACvC,CAAA;GAOE,KAA6C,EAAE,mBAAgB;CAC1E,IAAM,EAAE,SAAM,GAAS;AAKvB,QACE,kBAAC,QAAD;EACE,WAAW,EACT,oIACA,EACD;cATO,GAAa,MAA6B;GACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,UAAO,MAAU,IAAM,IAAW;KAS5B,2BAA2B,aAAa;EACvC,CAAA;GAOE,KAAgE,EAC3E,WACA,mBACI;CACJ,IAAM,EAAE,SAAM,GAAS,EACjB,KAAM,GAAa,MAA6B;EACpD,IAAM,IAAQ,EAAE,EAAI;AACpB,SAAO,MAAU,IAAM,IAAW;;AAEpC,QACE,kBAAC,QAAD;EACE,WAAW,EACT,qCACA,IAAS,gCAAgC,oBACzC,EACD;EACD,OACE,IACI,EAAG,oBAAoB,SAAS,GAChC,EAAG,sBAAsB,WAAW;EAE1C,CAAA"}

package/dist/devportal/components/TelemetryErrorBoundary.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+
+interface Props {
+    children: ReactNode;
+    fallback?: ReactNode;
+    /** Optional logical name (page slug) included in event payload. */
+    scope?: string;
+}
+export declare function TelemetryErrorBoundary({ children, fallback, scope, }: Props): ReactNode;
+export {};
+//# sourceMappingURL=TelemetryErrorBoundary.d.ts.map

package/dist/devportal/components/TelemetryErrorBoundary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TelemetryErrorBoundary.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/TelemetryErrorBoundary.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlE,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAoDD,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,QAAQ,EACR,KAAK,GACN,EAAE,KAAK,GAAG,SAAS,CAoBnB"}

package/dist/devportal/components/TelemetryErrorBoundary.js

@@ -0,0 +1,49 @@
+import { useDevportalEventBus as e } from "../events/index.js";
+import { Component as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/devportal/components/TelemetryErrorBoundary.tsx
+var i = class extends t {
+	state = { hasError: !1 };
+	static getDerivedStateFromError(e) {
+		return {
+			hasError: !0,
+			message: e.message
+		};
+	}
+	componentDidCatch(e, t) {
+		this.props.emit(e.message, e.stack, t.componentStack ?? void 0);
+	}
+	render() {
+		return this.state.hasError ? this.props.fallback ?? /* @__PURE__ */ r("div", {
+			role: "alert",
+			className: "rounded-lg border border-border bg-bg-secondary p-6 text-text-primary",
+			children: [/* @__PURE__ */ n("h2", {
+				className: "text-lg font-semibold",
+				children: "Something went wrong"
+			}), /* @__PURE__ */ n("p", {
+				className: "mt-2 text-sm text-text-secondary",
+				children: "The page failed to render. Try refreshing — our team has been notified."
+			})]
+		}) : this.props.children;
+	}
+};
+function a({ children: t, fallback: r, scope: a }) {
+	let o = e();
+	return /* @__PURE__ */ n(i, {
+		fallback: r,
+		scope: a,
+		emit: (e, t, n) => {
+			o.emit("devportal.error.boundary", {
+				scope: a ?? "unknown",
+				message: e,
+				stack: t,
+				componentStack: n
+			});
+		},
+		children: t
+	});
+}
+//#endregion
+export { a as TelemetryErrorBoundary };
+
+//# sourceMappingURL=TelemetryErrorBoundary.js.map

package/dist/devportal/components/TelemetryErrorBoundary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TelemetryErrorBoundary.js","names":[],"sources":["../../../src/devportal/components/TelemetryErrorBoundary.tsx"],"sourcesContent":["/**\n * TelemetryErrorBoundary\n *\n * React error boundary that emits a `devportal.error.boundary` event to the\n * frontend event bus when a render error occurs. The app shell's RybbitSink /\n * BackendAuditSink / OtelBrowserSink consume the event — MFEs never call\n * Rybbit or analytics endpoints directly (memory rule + spec 47).\n *\n * If the EventBusProvider isn't mounted (standalone dev mode), the boundary\n * still catches errors and renders the fallback UI; emission is just skipped.\n */\nimport { Component, type ErrorInfo, type ReactNode } from \"react\";\nimport { useDevportalEventBus } from \"../events\";\n\ninterface Props {\n  children: ReactNode;\n  fallback?: ReactNode;\n  /** Optional logical name (page slug) included in event payload. */\n  scope?: string;\n}\n\ninterface State {\n  hasError: boolean;\n  message?: string;\n}\n\nclass InnerBoundary extends Component<\n  Props & {\n    emit: (\n      message: string,\n      stack: string | undefined,\n      componentStack: string | undefined,\n    ) => void;\n  },\n  State\n> {\n  state: State = { hasError: false };\n\n  static getDerivedStateFromError(error: Error): State {\n    return { hasError: true, message: error.message };\n  }\n\n  componentDidCatch(error: Error, info: ErrorInfo): void {\n    this.props.emit(\n      error.message,\n      error.stack,\n      info.componentStack ?? undefined,\n    );\n  }\n\n  render(): ReactNode {\n    if (this.state.hasError) {\n      return (\n        this.props.fallback ?? (\n          <div\n            role=\"alert\"\n            className=\"rounded-lg border border-border bg-bg-secondary p-6 text-text-primary\"\n          >\n            <h2 className=\"text-lg font-semibold\">Something went wrong</h2>\n            <p className=\"mt-2 text-sm text-text-secondary\">\n              The page failed to render. Try refreshing — our team has been\n              notified.\n            </p>\n          </div>\n        )\n      );\n    }\n    return this.props.children;\n  }\n}\n\nexport function TelemetryErrorBoundary({\n  children,\n  fallback,\n  scope,\n}: Props): ReactNode {\n  const bus = useDevportalEventBus();\n  const emit = (\n    message: string,\n    stack: string | undefined,\n    componentStack: string | undefined,\n  ): void => {\n    bus.emit(\"devportal.error.boundary\", {\n      scope: scope ?? \"unknown\",\n      message,\n      stack,\n      componentStack,\n    });\n  };\n\n  return (\n    <InnerBoundary fallback={fallback} scope={scope} emit={emit}>\n      {children}\n    </InnerBoundary>\n  );\n}\n"],"mappings":";;;;AA0BA,IAAM,IAAN,cAA4B,EAS1B;CACA,QAAe,EAAE,UAAU,IAAO;CAElC,OAAO,yBAAyB,GAAqB;AACnD,SAAO;GAAE,UAAU;GAAM,SAAS,EAAM;GAAS;;CAGnD,kBAAkB,GAAc,GAAuB;AACrD,OAAK,MAAM,KACT,EAAM,SACN,EAAM,OACN,EAAK,kBAAkB,KAAA,EACxB;;CAGH,SAAoB;AAiBlB,SAhBI,KAAK,MAAM,WAEX,KAAK,MAAM,YACT,kBAAC,OAAD;GACE,MAAK;GACL,WAAU;aAFZ,CAIE,kBAAC,MAAD;IAAI,WAAU;cAAwB;IAAyB,CAAA,EAC/D,kBAAC,KAAD;IAAG,WAAU;cAAmC;IAG5C,CAAA,CACA;OAIL,KAAK,MAAM;;;AAItB,SAAgB,EAAuB,EACrC,aACA,aACA,YACmB;CACnB,IAAM,IAAM,GAAsB;AAclC,QACE,kBAAC,GAAD;EAAyB;EAAiB;EAAa,OAbvD,GACA,GACA,MACS;AACT,KAAI,KAAK,4BAA4B;IACnC,OAAO,KAAS;IAChB;IACA;IACA;IACD,CAAC;;EAKC;EACa,CAAA"}

package/dist/devportal/components/index.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Developer Portal Components
+ *
+ * Re-exports all components for easy importing
+ */
+export * from './LoadingState';
+export * from './EmptyState';
+export * from './PageLayout';
+export * from './StatCard';
+export * from './StatusBadge';
+export * from './AppCard';
+export * from './SecretDisplay';
+export * from './DataTable';
+export * from './FormField';
+export * from './ConfirmDialog';
+export * from './GrantDelegationModal';
+export * from './PermissionGuard';
+export * from './FeatureFlaggedRoute';
+export * from './TelemetryErrorBoundary';
+//# sourceMappingURL=index.d.ts.map

package/dist/devportal/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/devportal/components/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC"}

package/dist/devportal/components/index.js

@@ -0,0 +1,14 @@
+import "./LoadingState.js";
+import "./EmptyState.js";
+import "./FeatureFlaggedRoute.js";
+import "./TelemetryErrorBoundary.js";
+import "./PageLayout.js";
+import "./StatCard.js";
+import "./StatusBadge.js";
+import "./AppCard.js";
+import "./SecretDisplay.js";
+import "./DataTable.js";
+import "./FormField.js";
+import "./ConfirmDialog.js";
+import "./GrantDelegationModal.js";
+import "./PermissionGuard.js";