npm - @burdenoff/microfe-devportal - Versions diffs - 2026.1108.1 → 2026.1109.1 - Mend

@burdenoff/microfe-devportal 2026.1108.1 → 2026.1109.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1408) hide show

package/dist/devportal/components/AppCard.js CHANGED Viewed

@@ -1,15 +1,15 @@
-import { useDevportal as e } from "../providers/DevportalProvider.js";
-import { cn as t } from "../utils/cn.js";
-import { APP_TYPE_LABELS as n } from "../utils/constants.js";
-import { FeaturedBadge as r, StatusBadge as i, VerifiedBadge as a } from "./StatusBadge.js";
+import { cn as e } from "../utils/cn.js";
+import { FeaturedBadge as t, StatusBadge as n, VerifiedBadge as r } from "./StatusBadge.js";
+import { APP_TYPE_LABELS as i } from "../utils/constants.js";
+import { useDevportal as a } from "../providers/DevportalProvider.js";
 import { SelectionCheckbox as o } from "./SelectionCheckbox.js";
 import { AppWindow as s, Download as c, ExternalLink as l, Star as u } from "lucide-react";
 import { jsx as d, jsxs as f } from "react/jsx-runtime";
 import { useI18n as p } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 import { GlassCard as m } from "@burdenoff/fe-libs/ui";
-//#region src/devportal/components/AppCard.tsx
+// src/devportal/components/AppCard.tsx
 var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y = !1, onToggleSelect: b }) => {
-	let { navigate: x, basePath: S } = e(), { t: C } = p(), w = (e, t) => {
+	let { navigate: x, basePath: S } = a(), { t: C } = p(), w = (e, t) => {
 		let n = C(e);
 		return n === e ? t : n;
 	}, T = () => {
@@ -19,7 +19,7 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 		treatment: "insight",
 		role: "button",
 		tabIndex: 0,
-		className: t("group cursor-pointer border-border-seam p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", y && "border-primary bg-action-primary-bg/5", _),
+		className: e("group cursor-pointer border-border-seam p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", y && "border-primary bg-action-primary-bg/5", _),
 		onClick: T,
 		onKeyDown: (e) => {
 			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), T());
@@ -52,10 +52,10 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 							children: [/* @__PURE__ */ d("h3", {
 								className: "font-semibold truncate",
 								children: h.name
-							}), h.isVerified && /* @__PURE__ */ d(a, { verified: !0 })]
+							}), h.isVerified && /* @__PURE__ */ d(r, { verified: !0 })]
 						}), /* @__PURE__ */ d("p", {
 							className: "text-sm text-text-secondary",
-							children: n[h.appType] || h.appType
+							children: i[h.appType] || h.appType
 						})]
 					})
 				]
@@ -66,7 +66,7 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 			}),
 			/* @__PURE__ */ f("div", {
 				className: "mt-3 flex flex-wrap items-center gap-2",
-				children: [/* @__PURE__ */ d(i, { status: h.status }), h.isFeatured && /* @__PURE__ */ d(r, {})]
+				children: [/* @__PURE__ */ d(n, { status: h.status }), h.isFeatured && /* @__PURE__ */ d(t, {})]
 			}),
 			/* @__PURE__ */ f("div", {
 				className: "mt-4 flex items-center gap-4 text-sm text-text-secondary",
@@ -98,14 +98,14 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 			})
 		]
 	});
-}, g = ({ app: r, onClick: a, className: c, selected: l = !1, onToggleSelect: u }) => {
-	let { navigate: p, basePath: m } = e(), h = () => {
-		a ? a() : p && p(`${m}/apps/${r.id}`);
+}, g = ({ app: t, onClick: r, className: c, selected: l = !1, onToggleSelect: u }) => {
+	let { navigate: p, basePath: m } = a(), h = () => {
+		r ? r() : p && p(`${m}/apps/${t.id}`);
 	};
 	return /* @__PURE__ */ f("div", {
 		role: "button",
 		tabIndex: 0,
-		className: t("flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 cursor-pointer transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", l && "border-primary bg-action-primary-bg/5", c),
+		className: e("flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 cursor-pointer transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", l && "border-primary bg-action-primary-bg/5", c),
 		onClick: h,
 		onKeyDown: (e) => {
 			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), h());
@@ -116,12 +116,12 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 				children: /* @__PURE__ */ d(o, {
 					checked: l,
 					onChange: u,
-					ariaLabel: `Select application ${r.name}`
+					ariaLabel: `Select application ${t.name}`
 				})
 			}),
-			r.iconUrl ? /* @__PURE__ */ d("img", {
-				src: r.iconUrl,
-				alt: r.name,
+			t.iconUrl ? /* @__PURE__ */ d("img", {
+				src: t.iconUrl,
+				alt: t.name,
 				className: "h-10 w-10 rounded-lg object-cover"
 			}) : /* @__PURE__ */ d("div", {
 				className: "flex h-10 w-10 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
@@ -131,17 +131,16 @@ var h = ({ app: h, onClick: g, className: _, showActions: v = !0, selected: y =
 				className: "flex-1 min-w-0",
 				children: [/* @__PURE__ */ d("p", {
 					className: "font-medium truncate",
-					children: r.name
+					children: t.name
 				}), /* @__PURE__ */ d("p", {
 					className: "text-sm text-text-secondary truncate",
-					children: r.shortDescription || n[r.appType]
+					children: t.shortDescription || i[t.appType]
 				})]
 			}),
-			/* @__PURE__ */ d(i, { status: r.status })
+			/* @__PURE__ */ d(n, { status: t.status })
 		]
 	});
 };
-//#endregion
 export { h as AppCard, g as AppListItem };
 //# sourceMappingURL=AppCard.js.map

package/dist/devportal/components/AppCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppCard.js","names":[],"sources":["../../../src/devportal/components/AppCard.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { AppWindow, Star, Download, ExternalLink } from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { cn } from \"../utils/cn\";\nimport { StatusBadge, VerifiedBadge, FeaturedBadge } from \"./StatusBadge\";\nimport type { Application } from \"../types\";\nimport { APP_TYPE_LABELS } from \"../utils/constants\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { SelectionCheckbox } from \"./SelectionCheckbox\";\n\ninterface AppCardProps {\n app: Application;\n onClick?: () => void;\n className?: string;\n showActions?: boolean;\n selected?: boolean;\n onToggleSelect?: (checked: boolean) => void;\n}\n\n/*\n Application card for displaying app information\n /\nexport const AppCard: FC<AppCardProps> = ({\n app,\n onClick,\n className,\n showActions = true,\n selected = false,\n onToggleSelect,\n}) => {\n const { navigate, basePath } = useDevportal();\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 const handleClick = () => {\n if (onClick) {\n onClick();\n } else if (navigate) {\n navigate(`${basePath}/apps/${app.id}`);\n }\n };\n\n return (\n <GlassCard\n treatment=\"insight\"\n role=\"button\"\n tabIndex={0}\n className={cn(\n \"group cursor-pointer border-border-seam p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n selected && \"border-primary bg-action-primary-bg/5\",\n className,\n )}\n onClick={handleClick}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n handleClick();\n }\n }}\n >\n {/ Header /}\n <div className=\"flex items-start gap-3\">\n {onToggleSelect && (\n <div onClick={(event) => event.stopPropagation()}>\n <SelectionCheckbox\n checked={selected}\n onChange={onToggleSelect}\n ariaLabel={`Select application ${app.name}`}\n className=\"mt-1\"\n />\n </div>\n )}\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-12 w-12 rounded-lg object-cover\"\n />\n ) : (\n <div className=\"flex h-12 w-12 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n <AppWindow size={24} />\n </div>\n )}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold truncate\">{app.name}</h3>\n {app.isVerified && <VerifiedBadge verified />}\n </div>\n <p className=\"text-sm text-text-secondary\">\n {APP_TYPE_LABELS[app.appType] \|\| app.appType}\n </p>\n </div>\n </div>\n\n {/ Description /}\n {app.shortDescription && (\n <p className=\"mt-3 text-sm text-text-secondary line-clamp-2\">\n {app.shortDescription}\n </p>\n )}\n\n {/ Badges /}\n <div className=\"mt-3 flex flex-wrap items-center gap-2\">\n <StatusBadge status={app.status} />\n {app.isFeatured && <FeaturedBadge />}\n </div>\n\n {/ Stats /}\n <div className=\"mt-4 flex items-center gap-4 text-sm text-text-secondary\">\n {app.averageRating !== undefined && app.averageRating > 0 && (\n <span className=\"flex items-center gap-1\">\n <Star\n size={14}\n className=\"text-status-warning-text fill-status-warning-text\"\n />\n {app.averageRating.toFixed(1)}\n </span>\n )}\n <span className=\"flex items-center gap-1\">\n <Download size={14} />\n {app.installCount.toLocaleString()}{\" \"}\n {tr(\"devportal.installs\", \"installs\")}\n </span>\n </div>\n\n {/ Actions /}\n {showActions && (\n <div className=\"mt-4 flex items-center justify-between opacity-0 group-hover:opacity-100 transition-opacity\">\n <button\n className=\"text-sm text-primary hover:underline flex items-center gap-1\"\n onClick={(e) => {\n e.stopPropagation();\n handleClick();\n }}\n >\n {tr(\"devportal.viewDetails\", \"View Details\")}\n <ExternalLink size={14} />\n </button>\n </div>\n )}\n </GlassCard>\n );\n};\n\n/\n Grid of app cards\n /\nexport const AppCardGrid: FC<{\n apps: Application[];\n onAppClick?: (app: Application) => void;\n className?: string;\n}> = ({ apps, onAppClick, className }) => (\n <div\n className={cn(\n \"grid gap-4 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\n className,\n )}\n >\n {apps.map((app) => (\n <AppCard\n key={app.id}\n app={app}\n onClick={onAppClick ? () => onAppClick(app) : undefined}\n />\n ))}\n </div>\n);\n\n/\n Compact app list item\n */\nexport const AppListItem: FC<{\n app: Application;\n onClick?: () => void;\n className?: string;\n selected?: boolean;\n onToggleSelect?: (checked: boolean) => void;\n}> = ({ app, onClick, className, selected = false, onToggleSelect }) => {\n const { navigate, basePath } = useDevportal();\n\n const handleClick = () => {\n if (onClick) {\n onClick();\n } else if (navigate) {\n navigate(`${basePath}/apps/${app.id}`);\n }\n };\n\n return (\n <div\n role=\"button\"\n tabIndex={0}\n className={cn(\n \"flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 cursor-pointer transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n selected && \"border-primary bg-action-primary-bg/5\",\n className,\n )}\n onClick={handleClick}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n handleClick();\n }\n }}\n >\n {onToggleSelect && (\n <div onClick={(event) => event.stopPropagation()}>\n <SelectionCheckbox\n checked={selected}\n onChange={onToggleSelect}\n ariaLabel={`Select application ${app.name}`}\n />\n </div>\n )}\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-10 w-10 rounded-lg object-cover\"\n />\n ) : (\n <div className=\"flex h-10 w-10 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n <AppWindow size={20} />\n </div>\n )}\n <div className=\"flex-1 min-w-0\">\n <p className=\"font-medium truncate\">{app.name}</p>\n <p className=\"text-sm text-text-secondary truncate\">\n {app.shortDescription \|\| APP_TYPE_LABELS[app.appType]}\n </p>\n </div>\n <StatusBadge status={app.status} />\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"AppCard.js","names":["AppCard","useDevportal","useI18n","tr","value","t","key","fallback","handleClick","onClick","navigate","basePath","app","GlassCard","cn","selected","className","event","onToggleSelect","SelectionCheckbox","AppWindow","VerifiedBadge","APP_TYPE_LABELS","StatusBadge","FeaturedBadge","Star","Download","showActions","ExternalLink","AppListItem"],"sources":["../../../src/devportal/components/AppCard.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { AppWindow, Star, Download, ExternalLink } from \"lucide-react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { cn } from \"../utils/cn\";\nimport { StatusBadge, VerifiedBadge, FeaturedBadge } from \"./StatusBadge\";\nimport type { Application } from \"../types\";\nimport { APP_TYPE_LABELS } from \"../utils/constants\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { SelectionCheckbox } from \"./SelectionCheckbox\";\n\ninterface AppCardProps {\n app: Application;\n onClick?: () => void;\n className?: string;\n showActions?: boolean;\n selected?: boolean;\n onToggleSelect?: (checked: boolean) => void;\n}\n\n/*\n Application card for displaying app information\n /\nexport const AppCard: FC<AppCardProps> = ({\n app,\n onClick,\n className,\n showActions = true,\n selected = false,\n onToggleSelect,\n}) => {\n const { navigate, basePath } = useDevportal();\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 const handleClick = () => {\n if (onClick) {\n onClick();\n } else if (navigate) {\n navigate(`${basePath}/apps/${app.id}`);\n }\n };\n\n return (\n <GlassCard\n treatment=\"insight\"\n role=\"button\"\n tabIndex={0}\n className={cn(\n \"group cursor-pointer border-border-seam p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n selected && \"border-primary bg-action-primary-bg/5\",\n className,\n )}\n onClick={handleClick}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n handleClick();\n }\n }}\n >\n {/ Header /}\n <div className=\"flex items-start gap-3\">\n {onToggleSelect && (\n <div onClick={(event) => event.stopPropagation()}>\n <SelectionCheckbox\n checked={selected}\n onChange={onToggleSelect}\n ariaLabel={`Select application ${app.name}`}\n className=\"mt-1\"\n />\n </div>\n )}\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-12 w-12 rounded-lg object-cover\"\n />\n ) : (\n <div className=\"flex h-12 w-12 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n <AppWindow size={24} />\n </div>\n )}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-center gap-2\">\n <h3 className=\"font-semibold truncate\">{app.name}</h3>\n {app.isVerified && <VerifiedBadge verified />}\n </div>\n <p className=\"text-sm text-text-secondary\">\n {APP_TYPE_LABELS[app.appType] \|\| app.appType}\n </p>\n </div>\n </div>\n\n {/ Description /}\n {app.shortDescription && (\n <p className=\"mt-3 text-sm text-text-secondary line-clamp-2\">\n {app.shortDescription}\n </p>\n )}\n\n {/ Badges /}\n <div className=\"mt-3 flex flex-wrap items-center gap-2\">\n <StatusBadge status={app.status} />\n {app.isFeatured && <FeaturedBadge />}\n </div>\n\n {/ Stats /}\n <div className=\"mt-4 flex items-center gap-4 text-sm text-text-secondary\">\n {app.averageRating !== undefined && app.averageRating > 0 && (\n <span className=\"flex items-center gap-1\">\n <Star\n size={14}\n className=\"text-status-warning-text fill-status-warning-text\"\n />\n {app.averageRating.toFixed(1)}\n </span>\n )}\n <span className=\"flex items-center gap-1\">\n <Download size={14} />\n {app.installCount.toLocaleString()}{\" \"}\n {tr(\"devportal.installs\", \"installs\")}\n </span>\n </div>\n\n {/ Actions /}\n {showActions && (\n <div className=\"mt-4 flex items-center justify-between opacity-0 group-hover:opacity-100 transition-opacity\">\n <button\n className=\"text-sm text-primary hover:underline flex items-center gap-1\"\n onClick={(e) => {\n e.stopPropagation();\n handleClick();\n }}\n >\n {tr(\"devportal.viewDetails\", \"View Details\")}\n <ExternalLink size={14} />\n </button>\n </div>\n )}\n </GlassCard>\n );\n};\n\n/\n Grid of app cards\n /\nexport const AppCardGrid: FC<{\n apps: Application[];\n onAppClick?: (app: Application) => void;\n className?: string;\n}> = ({ apps, onAppClick, className }) => (\n <div\n className={cn(\n \"grid gap-4 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\n className,\n )}\n >\n {apps.map((app) => (\n <AppCard\n key={app.id}\n app={app}\n onClick={onAppClick ? () => onAppClick(app) : undefined}\n />\n ))}\n </div>\n);\n\n/\n Compact app list item\n */\nexport const AppListItem: FC<{\n app: Application;\n onClick?: () => void;\n className?: string;\n selected?: boolean;\n onToggleSelect?: (checked: boolean) => void;\n}> = ({ app, onClick, className, selected = false, onToggleSelect }) => {\n const { navigate, basePath } = useDevportal();\n\n const handleClick = () => {\n if (onClick) {\n onClick();\n } else if (navigate) {\n navigate(`${basePath}/apps/${app.id}`);\n }\n };\n\n return (\n <div\n role=\"button\"\n tabIndex={0}\n className={cn(\n \"flex items-center gap-3 rounded-lg border border-border-seam bg-bg-surface p-3 cursor-pointer transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n selected && \"border-primary bg-action-primary-bg/5\",\n className,\n )}\n onClick={handleClick}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n handleClick();\n }\n }}\n >\n {onToggleSelect && (\n <div onClick={(event) => event.stopPropagation()}>\n <SelectionCheckbox\n checked={selected}\n onChange={onToggleSelect}\n ariaLabel={`Select application ${app.name}`}\n />\n </div>\n )}\n {app.iconUrl ? (\n <img\n src={app.iconUrl}\n alt={app.name}\n className=\"h-10 w-10 rounded-lg object-cover\"\n />\n ) : (\n <div className=\"flex h-10 w-10 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary\">\n <AppWindow size={20} />\n </div>\n )}\n <div className=\"flex-1 min-w-0\">\n <p className=\"font-medium truncate\">{app.name}</p>\n <p className=\"text-sm text-text-secondary truncate\">\n {app.shortDescription \|\| APP_TYPE_LABELS[app.appType]}\n </p>\n </div>\n <StatusBadge status={app.status} />\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/devportal/components/ConfirmDialog.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, ReactNode } from 'react';
 export interface ConfirmDialogProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
@@ -26,4 +25,3 @@ export declare const Alert: FC<{
     onDismiss?: () => void;
     className?: string;
 }>;
-//# sourceMappingURL=ConfirmDialog.d.ts.map

package/dist/devportal/components/ConfirmDialog.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { useTr as e } from "../utils/i18n.js";
-import { cn as t } from "../utils/cn.js";
+import { cn as e } from "../utils/cn.js";
+import { useTr as t } from "../utils/i18n.js";
 import { useEffect as n, useId as r, useRef as i } from "react";
 import { AlertTriangle as a, CheckCircle as o, Info as s, XCircle as c } from "lucide-react";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
-//#region src/devportal/components/ConfirmDialog.tsx
+// src/devportal/components/ConfirmDialog.tsx
 var d = ({ open: d, onOpenChange: f, onConfirm: p, title: m, description: h, confirmLabel: g = "Confirm", cancelLabel: _ = "Cancel", variant: v = "default", loading: y = !1, children: b }) => {
-	let x = r(), S = r(), C = i(null), w = i(null), T = i(null), E = e(), D = i(f);
+	let x = r(), S = r(), C = i(null), w = i(null), T = i(null), E = t(), D = i(f);
 	if (n(() => {
 		D.current = f;
 	}, [f]), n(() => {
@@ -64,7 +64,7 @@ var d = ({ open: d, onOpenChange: f, onConfirm: p, title: m, description: h, con
 			children: [/* @__PURE__ */ u("div", {
 				className: "flex items-start gap-4",
 				children: [/* @__PURE__ */ l("div", {
-					className: t("rounded-full p-2", O.iconBg),
+					className: e("rounded-full p-2", O.iconBg),
 					children: O.icon
 				}), /* @__PURE__ */ u("div", {
 					className: "flex-1",
@@ -99,13 +99,13 @@ var d = ({ open: d, onOpenChange: f, onConfirm: p, title: m, description: h, con
 					type: "button",
 					onClick: p,
 					disabled: y,
-					className: t("rounded-md px-4 py-2 text-sm font-medium transition-colors disabled:opacity-50", O.button),
+					className: e("rounded-md px-4 py-2 text-sm font-medium transition-colors disabled:opacity-50", O.button),
 					children: y ? E("devportal.processing", "Processing...") : g
 				})]
 			})]
 		})]
 	});
-}, f = ({ variant: e = "info", title: n, children: r, onDismiss: i, className: d }) => {
+}, f = ({ variant: t = "info", title: n, children: r, onDismiss: i, className: d }) => {
 	let f = {
 		info: "bg-status-info-bg-subtle border-border-subtle text-status-info-text",
 		warning: "bg-status-warning-bg-subtle border-border-subtle text-status-warning-text",
@@ -118,11 +118,11 @@ var d = ({ open: d, onOpenChange: f, onConfirm: p, title: m, description: h, con
 		success: /* @__PURE__ */ l(o, { className: "h-5 w-5" })
 	};
 	return /* @__PURE__ */ l("div", {
-		className: t("rounded-lg border p-4", f[e], d),
+		className: e("rounded-lg border p-4", f[t], d),
 		children: /* @__PURE__ */ u("div", {
 			className: "flex items-start gap-3",
 			children: [
-				p[e],
+				p[t],
 				/* @__PURE__ */ u("div", {
 					className: "flex-1",
 					children: [n && /* @__PURE__ */ l("h4", {
@@ -143,7 +143,6 @@ var d = ({ open: d, onOpenChange: f, onConfirm: p, title: m, description: h, con
 		})
 	});
 };
-//#endregion
 export { f as Alert, d as ConfirmDialog };
 //# sourceMappingURL=ConfirmDialog.js.map

package/dist/devportal/components/ConfirmDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfirmDialog.js","names":[],"sources":["../../../src/devportal/components/ConfirmDialog.tsx"],"sourcesContent":["import { useEffect, useId, useRef, type FC, type ReactNode } from \"react\";\nimport { AlertTriangle, Info, CheckCircle, XCircle } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport interface ConfirmDialogProps {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n onConfirm: () => void \| Promise<void>;\n title: string;\n description?: string;\n confirmLabel?: string;\n cancelLabel?: string;\n variant?: \"default\" \| \"danger\" \| \"warning\" \| \"success\" \| \"destructive\";\n loading?: boolean;\n children?: ReactNode;\n}\n\n/*\n Confirmation dialog component\n /\nexport const ConfirmDialog: FC<ConfirmDialogProps> = ({\n open,\n onOpenChange,\n onConfirm,\n title,\n description,\n confirmLabel = \"Confirm\",\n cancelLabel = \"Cancel\",\n variant = \"default\",\n loading = false,\n children,\n}) => {\n const titleId = useId();\n const descriptionId = useId();\n const dialogRef = useRef<HTMLDivElement \| null>(null);\n const confirmButtonRef = useRef<HTMLButtonElement \| null>(null);\n const previousFocusRef = useRef<HTMLElement \| null>(null);\n const tr = useTr();\n\n // Keep a stable ref to the latest onOpenChange. Parents commonly pass an\n // inline arrow (new reference every render), so depending on it directly\n // would re-run the focus effect on every keystroke and yank focus away from\n // form inputs. Storing it in a ref lets the effect depend only on open/loading.\n const onOpenChangeRef = useRef(onOpenChange);\n useEffect(() => {\n onOpenChangeRef.current = onOpenChange;\n }, [onOpenChange]);\n\n useEffect(() => {\n if (!open) {\n return undefined;\n }\n\n previousFocusRef.current = document.activeElement as HTMLElement \| null;\n const originalOverflow = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n\n // For form dialogs (with children), focus the container so Tab naturally\n // walks through the form fields first. Only auto-focus the confirm button\n // for simple confirmation dialogs that have no form fields.\n const focusTarget = children\n ? dialogRef.current\n : (confirmButtonRef.current ?? dialogRef.current);\n window.requestAnimationFrame(() => {\n focusTarget?.focus();\n });\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && !loading) {\n event.preventDefault();\n onOpenChangeRef.current(false);\n }\n };\n\n document.addEventListener(\"keydown\", onKeyDown);\n\n return () => {\n document.body.style.overflow = originalOverflow;\n document.removeEventListener(\"keydown\", onKeyDown);\n previousFocusRef.current?.focus();\n };\n // children is intentionally omitted: it re-creates every render and would\n // re-trigger focus-stealing on each keystroke. Only open/loading gate this.\n }, [loading, open]);\n\n if (!open) return null;\n\n // Map 'destructive' to 'danger' for internal use\n const normalizedVariant = variant === \"destructive\" ? \"danger\" : variant;\n\n const variantStyles = {\n default: {\n icon: <Info className=\"h-6 w-6 text-accent-blue\" />,\n iconBg: \"bg-status-info-bg-subtle\",\n button:\n \"bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90\",\n },\n danger: {\n icon: <XCircle className=\"h-6 w-6 text-status-error-text\" />,\n iconBg: \"bg-status-error-bg-subtle\",\n button: \"bg-status-error-bg text-white hover:bg-status-error-bg/90\",\n },\n warning: {\n icon: <AlertTriangle className=\"h-6 w-6 text-status-warning-text\" />,\n iconBg: \"bg-status-warning-bg-subtle\",\n button: \"bg-status-warning-bg text-white hover:bg-status-warning-bg/90\",\n },\n success: {\n icon: <CheckCircle className=\"h-6 w-6 text-status-success-text\" />,\n iconBg: \"bg-status-success-bg-subtle\",\n button: \"bg-status-success-bg text-white hover:bg-status-success-bg/90\",\n },\n };\n\n const styles = variantStyles[normalizedVariant];\n\n const handleClose = () => onOpenChange(false);\n\n return (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center pt-[3.5rem]\">\n {/ Backdrop /}\n <button\n type=\"button\"\n aria-label=\"Close dialog backdrop\"\n className=\"absolute inset-0 bg-bg-overlay\"\n onClick={handleClose}\n />\n\n {/ Dialog /}\n <div\n ref={dialogRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={description \|\| children ? descriptionId : undefined}\n tabIndex={-1}\n className=\"relative z-10 flex max-h-[calc(100dvh-3.5rem-2rem)] w-full max-w-md flex-col overflow-y-auto rounded-lg bg-bg-surface p-6 shadow-xl\"\n >\n <div className=\"flex items-start gap-4\">\n <div className={cn(\"rounded-full p-2\", styles.iconBg)}>\n {styles.icon}\n </div>\n <div className=\"flex-1\">\n <h3 id={titleId} className=\"text-lg font-semibold\">\n {title}\n </h3>\n {description && (\n <p\n id={descriptionId}\n className=\"mt-2 text-sm text-text-secondary\"\n >\n {description}\n </p>\n )}\n {children && (\n <div\n className=\"mt-4\"\n id={description ? undefined : descriptionId}\n >\n {children}\n </div>\n )}\n </div>\n </div>\n\n <div className=\"mt-6 flex justify-end gap-3\">\n <button\n type=\"button\"\n onClick={handleClose}\n disabled={loading}\n className=\"rounded-md border px-4 py-2 text-sm font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n {cancelLabel}\n </button>\n <button\n ref={confirmButtonRef}\n type=\"button\"\n onClick={onConfirm}\n disabled={loading}\n className={cn(\n \"rounded-md px-4 py-2 text-sm font-medium transition-colors disabled:opacity-50\",\n styles.button,\n )}\n >\n {loading\n ? tr(\"devportal.processing\", \"Processing...\")\n : confirmLabel}\n </button>\n </div>\n </div>\n </div>\n );\n};\n\n/\n Alert banner component\n */\nexport const Alert: FC<{\n variant?: \"info\" \| \"warning\" \| \"error\" \| \"success\";\n title?: string;\n children: ReactNode;\n onDismiss?: () => void;\n className?: string;\n}> = ({ variant = \"info\", title, children, onDismiss, className }) => {\n const variantStyles = {\n info: \"bg-status-info-bg-subtle border-border-subtle text-status-info-text\",\n warning:\n \"bg-status-warning-bg-subtle border-border-subtle text-status-warning-text\",\n error:\n \"bg-status-error-bg-subtle border-border-subtle text-status-error-text\",\n success:\n \"bg-status-success-bg-subtle border-border-subtle text-status-success-text\",\n };\n\n const icons = {\n info: <Info className=\"h-5 w-5\" />,\n warning: <AlertTriangle className=\"h-5 w-5\" />,\n error: <XCircle className=\"h-5 w-5\" />,\n success: <CheckCircle className=\"h-5 w-5\" />,\n };\n\n return (\n <div\n className={cn(\"rounded-lg border p-4\", variantStyles[variant], className)}\n >\n <div className=\"flex items-start gap-3\">\n {icons[variant]}\n <div className=\"flex-1\">\n {title && <h4 className=\"font-medium\">{title}</h4>}\n <div className=\"text-sm\">{children}</div>\n </div>\n {onDismiss && (\n <button\n type=\"button\"\n onClick={onDismiss}\n className=\"hover:opacity-70\"\n >\n <XCircle className=\"h-5 w-5\" />\n </button>\n )}\n </div>\n </div>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"ConfirmDialog.js","names":["ConfirmDialog","titleId","useId","descriptionId","dialogRef","useRef","confirmButtonRef","previousFocusRef","tr","useTr","onOpenChangeRef","onOpenChange","useEffect","open","originalOverflow","focusTarget","children","onKeyDown","event","loading","styles","Info","XCircle","AlertTriangle","CheckCircle","variant","handleClose","description","cn","title","cancelLabel","onConfirm","confirmLabel","Alert","variantStyles","icons","className","onDismiss"],"sources":["../../../src/devportal/components/ConfirmDialog.tsx"],"sourcesContent":["import { useEffect, useId, useRef, type FC, type ReactNode } from \"react\";\nimport { AlertTriangle, Info, CheckCircle, XCircle } from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport interface ConfirmDialogProps {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n onConfirm: () => void \| Promise<void>;\n title: string;\n description?: string;\n confirmLabel?: string;\n cancelLabel?: string;\n variant?: \"default\" \| \"danger\" \| \"warning\" \| \"success\" \| \"destructive\";\n loading?: boolean;\n children?: ReactNode;\n}\n\n/*\n Confirmation dialog component\n /\nexport const ConfirmDialog: FC<ConfirmDialogProps> = ({\n open,\n onOpenChange,\n onConfirm,\n title,\n description,\n confirmLabel = \"Confirm\",\n cancelLabel = \"Cancel\",\n variant = \"default\",\n loading = false,\n children,\n}) => {\n const titleId = useId();\n const descriptionId = useId();\n const dialogRef = useRef<HTMLDivElement \| null>(null);\n const confirmButtonRef = useRef<HTMLButtonElement \| null>(null);\n const previousFocusRef = useRef<HTMLElement \| null>(null);\n const tr = useTr();\n\n // Keep a stable ref to the latest onOpenChange. Parents commonly pass an\n // inline arrow (new reference every render), so depending on it directly\n // would re-run the focus effect on every keystroke and yank focus away from\n // form inputs. Storing it in a ref lets the effect depend only on open/loading.\n const onOpenChangeRef = useRef(onOpenChange);\n useEffect(() => {\n onOpenChangeRef.current = onOpenChange;\n }, [onOpenChange]);\n\n useEffect(() => {\n if (!open) {\n return undefined;\n }\n\n previousFocusRef.current = document.activeElement as HTMLElement \| null;\n const originalOverflow = document.body.style.overflow;\n document.body.style.overflow = \"hidden\";\n\n // For form dialogs (with children), focus the container so Tab naturally\n // walks through the form fields first. Only auto-focus the confirm button\n // for simple confirmation dialogs that have no form fields.\n const focusTarget = children\n ? dialogRef.current\n : (confirmButtonRef.current ?? dialogRef.current);\n window.requestAnimationFrame(() => {\n focusTarget?.focus();\n });\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && !loading) {\n event.preventDefault();\n onOpenChangeRef.current(false);\n }\n };\n\n document.addEventListener(\"keydown\", onKeyDown);\n\n return () => {\n document.body.style.overflow = originalOverflow;\n document.removeEventListener(\"keydown\", onKeyDown);\n previousFocusRef.current?.focus();\n };\n // children is intentionally omitted: it re-creates every render and would\n // re-trigger focus-stealing on each keystroke. Only open/loading gate this.\n }, [loading, open]);\n\n if (!open) return null;\n\n // Map 'destructive' to 'danger' for internal use\n const normalizedVariant = variant === \"destructive\" ? \"danger\" : variant;\n\n const variantStyles = {\n default: {\n icon: <Info className=\"h-6 w-6 text-accent-blue\" />,\n iconBg: \"bg-status-info-bg-subtle\",\n button:\n \"bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90\",\n },\n danger: {\n icon: <XCircle className=\"h-6 w-6 text-status-error-text\" />,\n iconBg: \"bg-status-error-bg-subtle\",\n button: \"bg-status-error-bg text-white hover:bg-status-error-bg/90\",\n },\n warning: {\n icon: <AlertTriangle className=\"h-6 w-6 text-status-warning-text\" />,\n iconBg: \"bg-status-warning-bg-subtle\",\n button: \"bg-status-warning-bg text-white hover:bg-status-warning-bg/90\",\n },\n success: {\n icon: <CheckCircle className=\"h-6 w-6 text-status-success-text\" />,\n iconBg: \"bg-status-success-bg-subtle\",\n button: \"bg-status-success-bg text-white hover:bg-status-success-bg/90\",\n },\n };\n\n const styles = variantStyles[normalizedVariant];\n\n const handleClose = () => onOpenChange(false);\n\n return (\n <div className=\"fixed inset-0 z-50 flex items-center justify-center pt-[3.5rem]\">\n {/ Backdrop /}\n <button\n type=\"button\"\n aria-label=\"Close dialog backdrop\"\n className=\"absolute inset-0 bg-bg-overlay\"\n onClick={handleClose}\n />\n\n {/ Dialog /}\n <div\n ref={dialogRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={description \|\| children ? descriptionId : undefined}\n tabIndex={-1}\n className=\"relative z-10 flex max-h-[calc(100dvh-3.5rem-2rem)] w-full max-w-md flex-col overflow-y-auto rounded-lg bg-bg-surface p-6 shadow-xl\"\n >\n <div className=\"flex items-start gap-4\">\n <div className={cn(\"rounded-full p-2\", styles.iconBg)}>\n {styles.icon}\n </div>\n <div className=\"flex-1\">\n <h3 id={titleId} className=\"text-lg font-semibold\">\n {title}\n </h3>\n {description && (\n <p\n id={descriptionId}\n className=\"mt-2 text-sm text-text-secondary\"\n >\n {description}\n </p>\n )}\n {children && (\n <div\n className=\"mt-4\"\n id={description ? undefined : descriptionId}\n >\n {children}\n </div>\n )}\n </div>\n </div>\n\n <div className=\"mt-6 flex justify-end gap-3\">\n <button\n type=\"button\"\n onClick={handleClose}\n disabled={loading}\n className=\"rounded-md border px-4 py-2 text-sm font-medium hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n >\n {cancelLabel}\n </button>\n <button\n ref={confirmButtonRef}\n type=\"button\"\n onClick={onConfirm}\n disabled={loading}\n className={cn(\n \"rounded-md px-4 py-2 text-sm font-medium transition-colors disabled:opacity-50\",\n styles.button,\n )}\n >\n {loading\n ? tr(\"devportal.processing\", \"Processing...\")\n : confirmLabel}\n </button>\n </div>\n </div>\n </div>\n );\n};\n\n/\n Alert banner component\n */\nexport const Alert: FC<{\n variant?: \"info\" \| \"warning\" \| \"error\" \| \"success\";\n title?: string;\n children: ReactNode;\n onDismiss?: () => void;\n className?: string;\n}> = ({ variant = \"info\", title, children, onDismiss, className }) => {\n const variantStyles = {\n info: \"bg-status-info-bg-subtle border-border-subtle text-status-info-text\",\n warning:\n \"bg-status-warning-bg-subtle border-border-subtle text-status-warning-text\",\n error:\n \"bg-status-error-bg-subtle border-border-subtle text-status-error-text\",\n success:\n \"bg-status-success-bg-subtle border-border-subtle text-status-success-text\",\n };\n\n const icons = {\n info: <Info className=\"h-5 w-5\" />,\n warning: <AlertTriangle className=\"h-5 w-5\" />,\n error: <XCircle className=\"h-5 w-5\" />,\n success: <CheckCircle className=\"h-5 w-5\" />,\n };\n\n return (\n <div\n className={cn(\"rounded-lg border p-4\", variantStyles[variant], className)}\n >\n <div className=\"flex items-start gap-3\">\n {icons[variant]}\n <div className=\"flex-1\">\n {title && <h4 className=\"font-medium\">{title}</h4>}\n <div className=\"text-sm\">{children}</div>\n </div>\n {onDismiss && (\n <button\n type=\"button\"\n onClick={onDismiss}\n className=\"hover:opacity-70\"\n >\n <XCircle className=\"h-5 w-5\" />\n </button>\n )}\n </div>\n </div>\n );\n};\n"],"mappings":"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"}

package/dist/devportal/components/DataTable.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, ReactNode } from 'react';
 export interface Column<T> {
     key: string;
     header: ReactNode;
@@ -27,7 +26,7 @@ export interface DataTableProps<T> {
  */
 export declare function DataTable<T extends {
     [K in keyof T]: T[K];
-}>({ data, columns, keyField, onRowClick, className, emptyMessage, loading, pagination, }: DataTableProps<T>): import("react").JSX.Element;
+}>({ data, columns, keyField, onRowClick, className, emptyMessage, loading, pagination, }: DataTableProps<T>): import('react').JSX.Element;
 /**
  * Simple key-value detail list
  */
@@ -38,4 +37,3 @@ export declare const DetailList: FC<{
     }>;
     className?: string;
 }>;
-//# sourceMappingURL=DataTable.d.ts.map

package/dist/devportal/components/DataTable.js CHANGED Viewed

@@ -1,22 +1,22 @@
-import { useTr as e } from "../utils/i18n.js";
-import { cn as t } from "../utils/cn.js";
+import { cn as e } from "../utils/cn.js";
+import { useTr as t } from "../utils/i18n.js";
 import { ChevronLeft as n, ChevronRight as r, ChevronsLeft as i, ChevronsRight as a } from "lucide-react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
-//#region src/devportal/components/DataTable.tsx
+// src/devportal/components/DataTable.tsx
 function c({ data: c, columns: l, keyField: u, onRowClick: d, className: f, emptyMessage: p, loading: m, pagination: h }) {
-	let g = e(), _ = p ?? g("devportal.noDataAvailable", "No data available"), v = h ? Math.ceil(h.totalCount / h.pageSize) : 1;
+	let g = t(), _ = p ?? g("devportal.noDataAvailable", "No data available"), v = h ? Math.ceil(h.totalCount / h.pageSize) : 1;
 	return /* @__PURE__ */ s("div", {
-		className: t("rounded-lg border border-border-seam bg-bg-surface", f),
+		className: e("rounded-lg border border-border-seam bg-bg-surface", f),
 		children: [/* @__PURE__ */ o("div", {
 			className: "overflow-x-auto",
 			children: /* @__PURE__ */ s("table", {
 				className: "w-full",
 				children: [/* @__PURE__ */ o("thead", { children: /* @__PURE__ */ o("tr", {
 					className: "border-b border-border-seam bg-bg-sunken/40",
-					children: l.map((e) => /* @__PURE__ */ o("th", {
-						className: t("px-4 py-3 text-left text-sm font-medium text-text-secondary", e.className),
-						children: e.header
-					}, e.key))
+					children: l.map((t) => /* @__PURE__ */ o("th", {
+						className: e("px-4 py-3 text-left text-sm font-medium text-text-secondary", t.className),
+						children: t.header
+					}, t.key))
 				}) }), /* @__PURE__ */ o("tbody", { children: m ? Array.from({ length: 5 }).map((e, t) => /* @__PURE__ */ o("tr", {
 					className: "animate-pulse border-b border-border-seam",
 					children: l.map((e) => /* @__PURE__ */ o("td", {
@@ -27,19 +27,19 @@ function c({ data: c, columns: l, keyField: u, onRowClick: d, className: f, empt
 					colSpan: l.length,
 					className: "px-4 py-8 text-center text-text-secondary",
 					children: _
-				}) }) : c.map((e) => /* @__PURE__ */ o("tr", {
+				}) }) : c.map((t) => /* @__PURE__ */ o("tr", {
 					role: d ? "button" : void 0,
 					tabIndex: d ? 0 : void 0,
-					className: t("border-b border-border-seam transition-colors", d && "cursor-pointer hover:bg-bg-sunken/50 focus-visible:outline-none focus-visible:bg-bg-sunken/50"),
-					onClick: () => d?.(e),
-					onKeyDown: (t) => {
-						d && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), d(e));
+					className: e("border-b border-border-seam transition-colors", d && "cursor-pointer hover:bg-bg-sunken/50 focus-visible:outline-none focus-visible:bg-bg-sunken/50"),
+					onClick: () => d?.(t),
+					onKeyDown: (e) => {
+						d && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), d(t));
 					},
 					children: l.map((n) => /* @__PURE__ */ o("td", {
-						className: t("px-4 py-3 text-sm", n.className),
-						children: n.render ? n.render(e) : String(e[n.key] ?? "")
+						className: e("px-4 py-3 text-sm", n.className),
+						children: n.render ? n.render(t) : String(t[n.key] ?? "")
 					}, String(n.key)))
-				}, String(e[u]))) })]
+				}, String(t[u]))) })]
 			})
 		}), h && v > 1 && /* @__PURE__ */ s("div", {
 			className: "flex items-center justify-between border-t border-border-seam px-4 py-3",
@@ -104,9 +104,9 @@ function c({ data: c, columns: l, keyField: u, onRowClick: d, className: f, empt
 		})]
 	});
 }
-var l = ({ items: e, className: n }) => /* @__PURE__ */ o("dl", {
-	className: t("divide-y divide-border-seam rounded-lg border border-border-seam", n),
-	children: e.map((e, t) => /* @__PURE__ */ s("div", {
+var l = ({ items: t, className: n }) => /* @__PURE__ */ o("dl", {
+	className: e("divide-y divide-border-seam rounded-lg border border-border-seam", n),
+	children: t.map((e, t) => /* @__PURE__ */ s("div", {
 		className: "flex flex-col gap-1 px-4 py-3 sm:flex-row sm:gap-4",
 		children: [/* @__PURE__ */ o("dt", {
 			className: "text-sm font-medium text-text-secondary sm:w-1/3",
@@ -117,7 +117,6 @@ var l = ({ items: e, className: n }) => /* @__PURE__ */ o("dl", {
 		})]
 	}, t))
 });
-//#endregion
 export { c as DataTable, l as DetailList };
 //# sourceMappingURL=DataTable.js.map

package/dist/devportal/components/DataTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.js","names":[],"sources":["../../../src/devportal/components/DataTable.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport {\n ChevronLeft,\n ChevronRight,\n ChevronsLeft,\n ChevronsRight,\n} from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport interface Column<T> {\n key: string;\n header: ReactNode;\n render?: (item: T) => ReactNode;\n className?: string;\n sortable?: boolean;\n}\n\nexport interface DataTableProps<T> {\n data: T[];\n columns: Column<T>[];\n keyField: keyof T;\n onRowClick?: (item: T) => void;\n className?: string;\n emptyMessage?: string;\n loading?: boolean;\n pagination?: {\n page: number;\n pageSize: number;\n totalCount: number;\n onPageChange: (page: number) => void;\n };\n}\n\n/*\n Reusable data table component with pagination\n /\nexport function DataTable<T extends { [K in keyof T]: T[K] }>({\n data,\n columns,\n keyField,\n onRowClick,\n className,\n emptyMessage,\n loading,\n pagination,\n}: DataTableProps<T>) {\n const tr = useTr();\n const resolvedEmptyMessage =\n emptyMessage ?? tr(\"devportal.noDataAvailable\", \"No data available\");\n const totalPages = pagination\n ? Math.ceil(pagination.totalCount / pagination.pageSize)\n : 1;\n\n return (\n <div\n className={cn(\n \"rounded-lg border border-border-seam bg-bg-surface\",\n className,\n )}\n >\n <div className=\"overflow-x-auto\">\n <table className=\"w-full\">\n <thead>\n <tr className=\"border-b border-border-seam bg-bg-sunken/40\">\n {columns.map((column) => (\n <th\n key={column.key}\n className={cn(\n \"px-4 py-3 text-left text-sm font-medium text-text-secondary\",\n column.className,\n )}\n >\n {column.header}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {loading ? (\n Array.from({ length: 5 }).map((_, i) => (\n <tr\n key={i}\n className=\"animate-pulse border-b border-border-seam\"\n >\n {columns.map((column) => (\n <td key={column.key} className=\"px-4 py-3\">\n <div className=\"h-4 rounded bg-bg-sunken\" />\n </td>\n ))}\n </tr>\n ))\n ) : data.length === 0 ? (\n <tr>\n <td\n colSpan={columns.length}\n className=\"px-4 py-8 text-center text-text-secondary\"\n >\n {resolvedEmptyMessage}\n </td>\n </tr>\n ) : (\n data.map((item) => (\n <tr\n key={String(item[keyField])}\n role={onRowClick ? \"button\" : undefined}\n tabIndex={onRowClick ? 0 : undefined}\n className={cn(\n \"border-b border-border-seam transition-colors\",\n onRowClick &&\n \"cursor-pointer hover:bg-bg-sunken/50 focus-visible:outline-none focus-visible:bg-bg-sunken/50\",\n )}\n onClick={() => onRowClick?.(item)}\n onKeyDown={(event) => {\n if (!onRowClick) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onRowClick(item);\n }\n }}\n >\n {columns.map((column) => (\n <td\n key={String(column.key)}\n className={cn(\"px-4 py-3 text-sm\", column.className)}\n >\n {column.render\n ? column.render(item)\n : String(\n (item as Record<string, unknown>)[\n column.key as string\n ] ?? \"\",\n )}\n </td>\n ))}\n </tr>\n ))\n )}\n </tbody>\n </table>\n </div>\n\n {/ Pagination /}\n {pagination && totalPages > 1 && (\n <div className=\"flex items-center justify-between border-t border-border-seam px-4 py-3\">\n <p className=\"text-sm text-text-secondary\">\n {tr(\"devportal.showingResults\", \"Showing\")}{\" \"}\n {(pagination.page - 1) pagination.pageSize + 1}{\" \"}\n {tr(\"devportal.to\", \"to\")}{\" \"}\n {Math.min(\n pagination.page * pagination.pageSize,\n pagination.totalCount,\n )}{\" \"}\n {tr(\"devportal.of\", \"of\")} {pagination.totalCount}{\" \"}\n {tr(\"devportal.results\", \"results\")}\n </p>\n <div className=\"flex items-center gap-1\">\n <button\n onClick={() => pagination.onPageChange(1)}\n disabled={pagination.page === 1}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronsLeft size={20} />\n </button>\n <button\n onClick={() => pagination.onPageChange(pagination.page - 1)}\n disabled={pagination.page === 1}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronLeft size={20} />\n </button>\n <span className=\"px-3 text-sm\">\n {tr(\"devportal.page\", \"Page\")} {pagination.page}{\" \"}\n {tr(\"devportal.of\", \"of\")} {totalPages}\n </span>\n <button\n onClick={() => pagination.onPageChange(pagination.page + 1)}\n disabled={pagination.page === totalPages}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronRight size={20} />\n </button>\n <button\n onClick={() => pagination.onPageChange(totalPages)}\n disabled={pagination.page === totalPages}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronsRight size={20} />\n </button>\n </div>\n </div>\n )}\n </div>\n );\n}\n\n/*\n Simple key-value detail list\n */\nexport const DetailList: FC<{\n items: Array<{ label: string; value: ReactNode }>;\n className?: string;\n}> = ({ items, className }) => (\n <dl\n className={cn(\n \"divide-y divide-border-seam rounded-lg border border-border-seam\",\n className,\n )}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className=\"flex flex-col gap-1 px-4 py-3 sm:flex-row sm:gap-4\"\n >\n <dt className=\"text-sm font-medium text-text-secondary sm:w-1/3\">\n {item.label}\n </dt>\n <dd className=\"text-sm sm:w-2/3\">{item.value}</dd>\n </div>\n ))}\n </dl>\n);\n"],"mappings":"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"}
1	+ {"version":3,"file":"DataTable.js","names":["DataTable","tr","useTr","resolvedEmptyMessage","emptyMessage","totalPages","pagination","cn","className","columns","column","loading","i","data","onRowClick","item","event","keyField","ChevronsLeft","ChevronLeft","ChevronRight","ChevronsRight","DetailList","items","index"],"sources":["../../../src/devportal/components/DataTable.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport {\n ChevronLeft,\n ChevronRight,\n ChevronsLeft,\n ChevronsRight,\n} from \"lucide-react\";\nimport { cn } from \"../utils/cn\";\nimport { useTr } from \"../utils/i18n\";\n\nexport interface Column<T> {\n key: string;\n header: ReactNode;\n render?: (item: T) => ReactNode;\n className?: string;\n sortable?: boolean;\n}\n\nexport interface DataTableProps<T> {\n data: T[];\n columns: Column<T>[];\n keyField: keyof T;\n onRowClick?: (item: T) => void;\n className?: string;\n emptyMessage?: string;\n loading?: boolean;\n pagination?: {\n page: number;\n pageSize: number;\n totalCount: number;\n onPageChange: (page: number) => void;\n };\n}\n\n/*\n Reusable data table component with pagination\n /\nexport function DataTable<T extends { [K in keyof T]: T[K] }>({\n data,\n columns,\n keyField,\n onRowClick,\n className,\n emptyMessage,\n loading,\n pagination,\n}: DataTableProps<T>) {\n const tr = useTr();\n const resolvedEmptyMessage =\n emptyMessage ?? tr(\"devportal.noDataAvailable\", \"No data available\");\n const totalPages = pagination\n ? Math.ceil(pagination.totalCount / pagination.pageSize)\n : 1;\n\n return (\n <div\n className={cn(\n \"rounded-lg border border-border-seam bg-bg-surface\",\n className,\n )}\n >\n <div className=\"overflow-x-auto\">\n <table className=\"w-full\">\n <thead>\n <tr className=\"border-b border-border-seam bg-bg-sunken/40\">\n {columns.map((column) => (\n <th\n key={column.key}\n className={cn(\n \"px-4 py-3 text-left text-sm font-medium text-text-secondary\",\n column.className,\n )}\n >\n {column.header}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {loading ? (\n Array.from({ length: 5 }).map((_, i) => (\n <tr\n key={i}\n className=\"animate-pulse border-b border-border-seam\"\n >\n {columns.map((column) => (\n <td key={column.key} className=\"px-4 py-3\">\n <div className=\"h-4 rounded bg-bg-sunken\" />\n </td>\n ))}\n </tr>\n ))\n ) : data.length === 0 ? (\n <tr>\n <td\n colSpan={columns.length}\n className=\"px-4 py-8 text-center text-text-secondary\"\n >\n {resolvedEmptyMessage}\n </td>\n </tr>\n ) : (\n data.map((item) => (\n <tr\n key={String(item[keyField])}\n role={onRowClick ? \"button\" : undefined}\n tabIndex={onRowClick ? 0 : undefined}\n className={cn(\n \"border-b border-border-seam transition-colors\",\n onRowClick &&\n \"cursor-pointer hover:bg-bg-sunken/50 focus-visible:outline-none focus-visible:bg-bg-sunken/50\",\n )}\n onClick={() => onRowClick?.(item)}\n onKeyDown={(event) => {\n if (!onRowClick) return;\n if (event.key === \"Enter\" \|\| event.key === \" \") {\n event.preventDefault();\n onRowClick(item);\n }\n }}\n >\n {columns.map((column) => (\n <td\n key={String(column.key)}\n className={cn(\"px-4 py-3 text-sm\", column.className)}\n >\n {column.render\n ? column.render(item)\n : String(\n (item as Record<string, unknown>)[\n column.key as string\n ] ?? \"\",\n )}\n </td>\n ))}\n </tr>\n ))\n )}\n </tbody>\n </table>\n </div>\n\n {/ Pagination /}\n {pagination && totalPages > 1 && (\n <div className=\"flex items-center justify-between border-t border-border-seam px-4 py-3\">\n <p className=\"text-sm text-text-secondary\">\n {tr(\"devportal.showingResults\", \"Showing\")}{\" \"}\n {(pagination.page - 1) pagination.pageSize + 1}{\" \"}\n {tr(\"devportal.to\", \"to\")}{\" \"}\n {Math.min(\n pagination.page * pagination.pageSize,\n pagination.totalCount,\n )}{\" \"}\n {tr(\"devportal.of\", \"of\")} {pagination.totalCount}{\" \"}\n {tr(\"devportal.results\", \"results\")}\n </p>\n <div className=\"flex items-center gap-1\">\n <button\n onClick={() => pagination.onPageChange(1)}\n disabled={pagination.page === 1}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronsLeft size={20} />\n </button>\n <button\n onClick={() => pagination.onPageChange(pagination.page - 1)}\n disabled={pagination.page === 1}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronLeft size={20} />\n </button>\n <span className=\"px-3 text-sm\">\n {tr(\"devportal.page\", \"Page\")} {pagination.page}{\" \"}\n {tr(\"devportal.of\", \"of\")} {totalPages}\n </span>\n <button\n onClick={() => pagination.onPageChange(pagination.page + 1)}\n disabled={pagination.page === totalPages}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronRight size={20} />\n </button>\n <button\n onClick={() => pagination.onPageChange(totalPages)}\n disabled={pagination.page === totalPages}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-md hover:bg-bg-sunken disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n >\n <ChevronsRight size={20} />\n </button>\n </div>\n </div>\n )}\n </div>\n );\n}\n\n/*\n Simple key-value detail list\n */\nexport const DetailList: FC<{\n items: Array<{ label: string; value: ReactNode }>;\n className?: string;\n}> = ({ items, className }) => (\n <dl\n className={cn(\n \"divide-y divide-border-seam rounded-lg border border-border-seam\",\n className,\n )}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className=\"flex flex-col gap-1 px-4 py-3 sm:flex-row sm:gap-4\"\n >\n <dt className=\"text-sm font-medium text-text-secondary sm:w-1/3\">\n {item.label}\n </dt>\n <dd className=\"text-sm sm:w-2/3\">{item.value}</dd>\n </div>\n ))}\n </dl>\n);\n"],"mappings":"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"}

package/dist/devportal/components/EmptyState.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, ReactNode } from 'react';
 /**
  * Standard illustration names served by the host shell at
  * `/illustrations/<name>.webp`.
@@ -29,4 +28,3 @@ interface EmptyStateProps {
  */
 export declare const EmptyState: FC<EmptyStateProps>;
 export {};
-//# sourceMappingURL=EmptyState.d.ts.map

package/dist/devportal/components/EmptyState.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as e } from "react/jsx-runtime";
 import { EmptyState as t, IllustratedEmptyState as n } from "@burdenoff/fe-libs/ui";
-//#region src/devportal/components/EmptyState.tsx
+// src/devportal/components/EmptyState.tsx
 var r = ({ icon: r, illustration: i, title: a, description: o, action: s, className: c }) => i ? /* @__PURE__ */ e(n, {
 	illustration: i,
 	title: a,
@@ -14,7 +14,6 @@ var r = ({ icon: r, illustration: i, title: a, description: o, action: s, classN
 	action: s,
 	className: c
 });
-//#endregion
 export { r as EmptyState };
 //# sourceMappingURL=EmptyState.js.map

package/dist/devportal/components/EmptyState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyState.js","names":[],"sources":["../../../src/devportal/components/EmptyState.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport {\n EmptyState as CanonicalEmptyState,\n IllustratedEmptyState,\n} from \"@burdenoff/fe-libs/ui\";\n\n/*\n Standard illustration names served by the host shell at\n * `/illustrations/<name>.webp`.\n /\ntype IllustrationName =\n \| \"empty-agents\"\n \| \"empty-vibes\"\n \| \"empty-sessions\"\n \| \"empty-files\"\n \| \"empty-people\"\n \| \"empty-notifications\"\n \| \"empty-search\"\n \| \"empty-data\"\n \| \"onboarding\"\n \| \"empty-generic\";\n\ninterface EmptyStateProps {\n icon?: ReactNode;\n /\n On-brand illustration rendered instead of an icon glyph. When provided the\n * empty state renders via `IllustratedEmptyState` for a richer, more\n * welcoming zero-state. Falls back to the icon-based `EmptyState` otherwise.\n /\n illustration?: IllustrationName;\n title: string;\n description?: string;\n action?: ReactNode;\n className?: string;\n}\n\n/\n Local wrapper around the canonical empty-state primitives from\n * `@burdenoff/fe-libs/ui`.\n \n Keeps existing devportal call sites stable while routing all empty-state\n * rendering through the canonical primitive. When an `illustration` is\n * supplied the richer `IllustratedEmptyState` is used; otherwise the\n * icon-based `EmptyState` is rendered.\n */\nexport const EmptyState: FC<EmptyStateProps> = ({\n icon,\n illustration,\n title,\n description,\n action,\n className,\n}) => {\n if (illustration) {\n return (\n <IllustratedEmptyState\n illustration={illustration}\n title={title}\n description={description}\n action={action}\n className={className}\n />\n );\n }\n\n return (\n <CanonicalEmptyState\n icon={icon}\n title={title}\n description={description}\n action={action}\n className={className}\n />\n );\n};\n"],"mappings":";;;AA6CA,~~IAAa~~,KAAmC,EAC9C,SACA,iBACA,UACA,gBACA,WACA,~~mBAEI~~,IAEA,~~kBAAC~~,GAAD;CACgB;CACP;CACM;CACL;CACG;~~CACX~~,CAAA,~~GAKJ~~,~~kBAAC~~,GAAD;CACQ;CACC;CACM;CACL;CACG;~~CACX~~,CAAA"}
1	+ {"version":3,"file":"EmptyState.js","names":["EmptyState","CanonicalEmptyState","EmptyState$1","illustration","IllustratedEmptyState","EmptyState"],"sources":["../../../src/devportal/components/EmptyState.tsx"],"sourcesContent":["import type { FC, ReactNode } from \"react\";\nimport {\n EmptyState as CanonicalEmptyState,\n IllustratedEmptyState,\n} from \"@burdenoff/fe-libs/ui\";\n\n/*\n Standard illustration names served by the host shell at\n * `/illustrations/<name>.webp`.\n /\ntype IllustrationName =\n \| \"empty-agents\"\n \| \"empty-vibes\"\n \| \"empty-sessions\"\n \| \"empty-files\"\n \| \"empty-people\"\n \| \"empty-notifications\"\n \| \"empty-search\"\n \| \"empty-data\"\n \| \"onboarding\"\n \| \"empty-generic\";\n\ninterface EmptyStateProps {\n icon?: ReactNode;\n /\n On-brand illustration rendered instead of an icon glyph. When provided the\n * empty state renders via `IllustratedEmptyState` for a richer, more\n * welcoming zero-state. Falls back to the icon-based `EmptyState` otherwise.\n /\n illustration?: IllustrationName;\n title: string;\n description?: string;\n action?: ReactNode;\n className?: string;\n}\n\n/\n Local wrapper around the canonical empty-state primitives from\n * `@burdenoff/fe-libs/ui`.\n \n Keeps existing devportal call sites stable while routing all empty-state\n * rendering through the canonical primitive. When an `illustration` is\n * supplied the richer `IllustratedEmptyState` is used; otherwise the\n * icon-based `EmptyState` is rendered.\n */\nexport const EmptyState: FC<EmptyStateProps> = ({\n icon,\n illustration,\n title,\n description,\n action,\n className,\n}) => {\n if (illustration) {\n return (\n <IllustratedEmptyState\n illustration={illustration}\n title={title}\n description={description}\n action={action}\n className={className}\n />\n );\n }\n\n return (\n <CanonicalEmptyState\n icon={icon}\n title={title}\n description={description}\n action={action}\n className={className}\n />\n );\n};\n"],"mappings":";;;AA6CA,IAAaA,KAAmC,EAC9C,SACA,iBACA,UACA,gBACA,WACA,mBAEIG,IAEA,kBAACC,GAAD;CACgB;CACP;CACM;CACL;CACG;AACZ,CAAA,IAKH,kBAACH,GAAD;CACQ;CACC;CACM;CACL;CACG;AACZ,CAAA"}

package/dist/devportal/components/FeatureFlaggedRoute.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, ReactNode } from 'react';
 export interface FeatureFlaggedRouteProps {
     flag: string;
     children: ReactNode;
@@ -7,4 +6,3 @@ export interface FeatureFlaggedRouteProps {
     fallback?: ReactNode;
 }
 export declare const FeatureFlaggedRoute: FC<FeatureFlaggedRouteProps>;
-//# sourceMappingURL=FeatureFlaggedRoute.d.ts.map

package/dist/devportal/components/FeatureFlaggedRoute.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { EmptyState as e } from "./EmptyState.js";
 import { Fragment as t, jsx as n } from "react/jsx-runtime";
 import { useFeatureFlag as r } from "@burdenoff/fe-libs/shared/feature-flags";
 import { useI18n as i } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-//#region src/devportal/components/FeatureFlaggedRoute.tsx
+// src/devportal/components/FeatureFlaggedRoute.tsx
 var a = (e) => {
 	try {
 		return r(e);
@@ -23,7 +23,6 @@ var a = (e) => {
 		description: l("devportal.featureDisabled.description", "Your administrator has disabled this section. Please check back later.")
 	});
 };
-//#endregion
 export { s as FeatureFlaggedRoute };
 //# sourceMappingURL=FeatureFlaggedRoute.js.map

package/dist/devportal/components/FeatureFlaggedRoute.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeatureFlaggedRoute.js","names":[],"sources":["../../../src/devportal/components/FeatureFlaggedRoute.tsx"],"sourcesContent":["/*\n FeatureFlaggedRoute\n \n Wraps a route's lazy-loaded element with a feature flag gate.\n * When the flag is disabled the user sees a friendly \"feature unavailable\"\n * message; otherwise the wrapped page renders.\n \n Default-allow: if the flag service is unreachable or returns nothing,\n * the FeatureFlagProvider's `defaultEnabled` setting controls behaviour\n * (currently `true` — see `DevportalRoot.tsx`).\n \n Per `dev/platform/context/commercial/feature-flags`.\n /\nimport type { FC, ReactNode } from \"react\";\nimport { useFeatureFlag } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { EmptyState } from \"./EmptyState\";\n\nexport interface FeatureFlaggedRouteProps {\n flag: string;\n children: ReactNode;\n /* Optional override message; defaults to translated \"coming soon\" copy. /\n fallback?: ReactNode;\n}\n\n/\n Safely evaluate a feature flag — `useFeatureFlag` itself throws if no\n * `FeatureFlagProvider` is mounted (standalone dev mode). We always call\n * the hook (rules-of-hooks) and rely on the underlying provider's\n * `defaultEnabled` to default-allow.\n */\nconst useFeatureFlagSafe = (flag: string): boolean => {\n try {\n return useFeatureFlag(flag);\n } catch {\n return true;\n }\n};\n\nconst useI18nSafe = (): {\n t: (key: string, fallback?: string) => string;\n} => {\n try {\n const ctx = useI18n();\n return { t: (key, fallback) => ctx.t(key, fallback) };\n } catch {\n return { t: (key, fallback) => fallback ?? key };\n }\n};\n\nexport const FeatureFlaggedRoute: FC<FeatureFlaggedRouteProps> = ({\n flag,\n children,\n fallback,\n}) => {\n const enabled = useFeatureFlagSafe(flag);\n const { t } = useI18nSafe();\n\n if (enabled) return <>{children}</>;\n if (fallback) return <>{fallback}</>;\n\n return (\n <EmptyState\n title={t(\n \"devportal.featureDisabled.title\",\n \"This feature is currently unavailable\",\n )}\n description={t(\n \"devportal.featureDisabled.description\",\n \"Your administrator has disabled this section. Please check back later.\",\n )}\n />\n );\n};\n"],"mappings":";;;;;AA+BA,~~IAAM~~,KAAsB,MAA0B;~~AACpD~~,~~KAAI~~;~~AACF~~,~~SAAO~~,~~EAAe~~,~~EAAK~~;~~SACrB~~;~~AACN~~,~~SAAO;;GAIL~~,UAED;~~AACH~~,~~KAAI~~;EACF,~~IAAM~~,~~IAAM~~,~~GAAS~~;~~AACrB~~,~~SAAO~~,EAAE,IAAI,GAAK,~~MAAa~~,EAAI,~~EAAE~~,~~GAAK~~,~~EAAS~~,EAAE;~~SAC/C~~;~~AACN~~,~~SAAO~~,EAAE,IAAI,GAAK,~~MAAa~~,~~KAAY~~,~~GAAK;;GAIvC~~,KAAqD,EAChE,SACA,aACA,kBACI;CACJ,~~IAAM~~,~~IAAU~~,~~EAAmB~~,~~EAAK~~,~~EAClC~~,EAAE,~~SAAM~~,~~GAAa~~;~~AAK3B~~,~~QAHI~~,IAAgB,~~kBAAA~~,GAAA,EAAG,~~aAAY~~,CAAA,~~GAC/B~~,IAAiB,~~kBAAA~~,GAAA,EAAA,~~UAAG~~,~~GAAY~~,CAAA,~~GAGlC~~,~~kBAAC~~,GAAD;EACE,~~OAAO~~,EACL,mCACA,~~wCACD~~;~~EACD~~,~~aAAa~~,EACX,yCACA,~~yEACD~~;~~EACD~~,CAAA"}
1	+ {"version":3,"file":"FeatureFlaggedRoute.js","names":["_Fragment","useFeatureFlagSafe","useFeatureFlag","flag","useI18nSafe","ctx","useI18n","key","fallback","FeatureFlaggedRoute","enabled","Fragment","EmptyState","t"],"sources":["../../../src/devportal/components/FeatureFlaggedRoute.tsx"],"sourcesContent":["/*\n FeatureFlaggedRoute\n \n Wraps a route's lazy-loaded element with a feature flag gate.\n * When the flag is disabled the user sees a friendly \"feature unavailable\"\n * message; otherwise the wrapped page renders.\n \n Default-allow: if the flag service is unreachable or returns nothing,\n * the FeatureFlagProvider's `defaultEnabled` setting controls behaviour\n * (currently `true` — see `DevportalRoot.tsx`).\n \n Per `dev/platform/context/commercial/feature-flags`.\n /\nimport type { FC, ReactNode } from \"react\";\nimport { useFeatureFlag } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\nimport { EmptyState } from \"./EmptyState\";\n\nexport interface FeatureFlaggedRouteProps {\n flag: string;\n children: ReactNode;\n /* Optional override message; defaults to translated \"coming soon\" copy. /\n fallback?: ReactNode;\n}\n\n/\n Safely evaluate a feature flag — `useFeatureFlag` itself throws if no\n * `FeatureFlagProvider` is mounted (standalone dev mode). We always call\n * the hook (rules-of-hooks) and rely on the underlying provider's\n * `defaultEnabled` to default-allow.\n */\nconst useFeatureFlagSafe = (flag: string): boolean => {\n try {\n return useFeatureFlag(flag);\n } catch {\n return true;\n }\n};\n\nconst useI18nSafe = (): {\n t: (key: string, fallback?: string) => string;\n} => {\n try {\n const ctx = useI18n();\n return { t: (key, fallback) => ctx.t(key, fallback) };\n } catch {\n return { t: (key, fallback) => fallback ?? key };\n }\n};\n\nexport const FeatureFlaggedRoute: FC<FeatureFlaggedRouteProps> = ({\n flag,\n children,\n fallback,\n}) => {\n const enabled = useFeatureFlagSafe(flag);\n const { t } = useI18nSafe();\n\n if (enabled) return <>{children}</>;\n if (fallback) return <>{fallback}</>;\n\n return (\n <EmptyState\n title={t(\n \"devportal.featureDisabled.title\",\n \"This feature is currently unavailable\",\n )}\n description={t(\n \"devportal.featureDisabled.description\",\n \"Your administrator has disabled this section. Please check back later.\",\n )}\n />\n );\n};\n"],"mappings":";;;;;AA+BA,IAAMC,KAAsB,MAA0B;CACpD,IAAI;EACF,OAAOC,EAAeC,CAAI;CAC5B,QAAQ;EACN,OAAO;CACT;AACF,GAEMC,UAED;CACH,IAAI;EACF,IAAMC,IAAMC,EAAQ;EACpB,OAAO,EAAE,IAAI,GAAK,MAAaD,EAAI,EAAEE,GAAKC,CAAQ,EAAE;CACtD,QAAQ;EACN,OAAO,EAAE,IAAI,GAAK,MAAaA,KAAYD,EAAI;CACjD;AACF,GAEaE,KAAqD,EAChE,SACA,aACA,kBACI;CACJ,IAAMC,IAAUT,EAAmBE,CAAI,GACjC,EAAE,SAAMC,EAAY;CAK1B,OAHIM,IAAgB,kBAAAV,GAAA,EAAG,YAAW,CAAA,IAC9BQ,IAAiB,kBAAAR,GAAA,EAAA,UAAGQ,EAAW,CAAA,IAGjC,kBAACI,GAAD;EACE,OAAOC,EACL,mCACA,uCACF;EACA,aAAaA,EACX,yCACA,wEACF;CACD,CAAA;AAEL"}

package/dist/devportal/components/FormField.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import { FC, InputHTMLAttributes, TextareaHTMLAttributes, SelectHTMLAttributes } from 'react';
 interface BaseFieldProps {
     label: string;
     error?: string;
@@ -67,4 +66,3 @@ export declare const TagInput: FC<{
     className?: string;
 }>;
 export {};
-//# sourceMappingURL=FormField.d.ts.map