@burdenoff/microfe-export 2026.830.1 → 2026.830.2

package/dist/export/pages/TemplateDetailPage.js

@@ -1,228 +1,232 @@
 import { useExport as e } from "../providers/ExportProvider.js";
-import { useDeleteExportTemplate as t, useExportTemplate as n } from "../hooks/useExportQueries.js";
-import { getArchiveFormatDisplayName as r, getFormatDisplayName as i } from "../constants/enums.js";
-import { PageLayout as a, PageSection as o } from "../components/PageLayout.js";
-import { nativeImpact as s, nativeNotify as c } from "../../utils/nativeBridge.js";
-import { useState as l } from "react";
-import { ArrowLeft as u, Clock as d, Download as f, FileBox as p, FileText as m, HardDrive as h, Loader2 as g, Play as _, Trash2 as v } from "lucide-react";
-import { useParams as y } from "react-router";
-import { jsx as b, jsxs as x } from "react/jsx-runtime";
-import { CTAOverflowMenu as S, GlassCard as C, IllustratedEmptyState as w, NextSteps as T, ShowMore as E } from "@burdenoff/fe-libs/ui";
+import { useTr as t } from "../hooks/useTr.js";
+import { useDeleteExportTemplate as n, useExportTemplate as r } from "../hooks/useExportQueries.js";
+import { getArchiveFormatDisplayName as i, getFormatDisplayName as a } from "../constants/enums.js";
+import { PageLayout as o, PageSection as s } from "../components/PageLayout.js";
+import { nativeImpact as c, nativeNotify as l } from "../../utils/nativeBridge.js";
+import { useState as u } from "react";
+import { ArrowLeft as d, Clock as f, Download as p, FileBox as m, FileText as h, HardDrive as g, Loader2 as _, Play as v, Trash2 as y } from "lucide-react";
+import { useParams as b } from "react-router";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+import { CTAOverflowMenu as C, GlassCard as w, IllustratedEmptyState as T, NextSteps as E, ShowMore as D } from "@burdenoff/fe-libs/ui";
 //#region src/export/pages/TemplateDetailPage.tsx
-var D = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
-function O() {
-	let { templateId: O } = y(), { basePath: k = "/", navigate: A } = e(), [j, M] = l(!1), { data: N, isLoading: P } = n(O), { deleteTemplate: F, isPending: I } = t();
-	if (P) return /* @__PURE__ */ x("div", {
+var O = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
+function k() {
+	let { templateId: k } = b(), { basePath: A = "/", navigate: j } = e(), M = t(), [N, P] = u(!1), { data: F, isLoading: I } = r(k), { deleteTemplate: L, isPending: R } = n();
+	if (I) return /* @__PURE__ */ S("div", {
 		className: "flex flex-col items-center justify-center py-20",
-		children: [/* @__PURE__ */ b(g, {
+		children: [/* @__PURE__ */ x(_, {
 			size: 48,
 			className: "animate-spin text-primary"
-		}), /* @__PURE__ */ b("span", {
+		}), /* @__PURE__ */ x("span", {
 			className: "mt-6 text-sm font-medium text-text-secondary",
-			children: "Loading template details…"
+			children: M("export.templateDetail.loading", "Loading template details…")
 		})]
 	});
-	if (!N) return /* @__PURE__ */ x(a, {
+	if (!F) return /* @__PURE__ */ S(o, {
 		showHeader: !1,
-		children: [/* @__PURE__ */ x("div", {
+		children: [/* @__PURE__ */ S("div", {
 			className: "flex items-center gap-3 mb-6",
-			children: [/* @__PURE__ */ b("button", {
+			children: [/* @__PURE__ */ x("button", {
 				type: "button",
-				onClick: () => A?.(D(k, "templates")),
-				"aria-label": "Back to templates",
+				onClick: () => j?.(O(A, "templates")),
+				"aria-label": M("export.templateDetail.actions.backToTemplates", "Back to templates"),
 				className: "p-2.5 hover:bg-accent rounded-lg transition-all duration-200",
-				children: /* @__PURE__ */ b(u, { size: 20 })
-			}), /* @__PURE__ */ b("h1", {
+				children: /* @__PURE__ */ x(d, { size: 20 })
+			}), /* @__PURE__ */ x("h1", {
 				className: "text-xl font-bold",
-				children: "Template Not Found"
+				children: M("export.templateDetail.notFound.title", "Template Not Found")
 			})]
-		}), /* @__PURE__ */ b(w, {
+		}), /* @__PURE__ */ x(T, {
 			illustration: "empty-data",
-			title: "Template not found",
-			description: "The template you are looking for does not exist.",
-			action: /* @__PURE__ */ x("button", {
+			title: M("export.templateDetail.notFound.heading", "Template not found"),
+			description: M("export.templateDetail.notFound.description", "The template you are looking for does not exist."),
+			action: /* @__PURE__ */ S("button", {
 				type: "button",
-				onClick: () => A?.(D(k, "templates")),
+				onClick: () => j?.(O(A, "templates")),
 				className: "inline-flex items-center gap-2 px-6 py-3 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors font-medium",
-				children: [/* @__PURE__ */ b(u, { size: 18 }), "Back to Templates"]
+				children: [/* @__PURE__ */ x(d, { size: 18 }), M("export.templateDetail.actions.backToTemplates", "Back to Templates")]
 			})
 		})]
 	});
-	let L = () => {
-		A?.(D(k, `new?templateId=${O}`));
-	}, R = async () => {
-		if (O) {
-			s("medium");
+	let z = () => {
+		j?.(O(A, `new?templateId=${k}`));
+	}, B = async () => {
+		if (k) {
+			c("medium");
 			try {
-				await F(O), c("success"), A?.(D(k, "templates"));
+				await L(k), l("success"), j?.(O(A, "templates"));
 			} catch {
-				c("error");
+				l("error");
 			}
 		}
-	}, z = N.isDefault ? [] : [{
-		label: "Delete Template",
-		icon: /* @__PURE__ */ b(v, { size: 16 }),
+	}, V = F.isDefault ? [] : [{
+		label: M("export.templateDetail.actions.delete", "Delete Template"),
+		icon: /* @__PURE__ */ x(y, { size: 16 }),
 		intent: "destructive",
-		disabled: I,
-		onSelect: () => M(!0)
-	}], B = [{
+		disabled: R,
+		onSelect: () => P(!0)
+	}], H = [{
 		id: "use",
-		label: "Start an export from this template",
-		description: "Pre-fills a new export with this template's entity types and format.",
-		icon: /* @__PURE__ */ b(_, { size: 16 }),
-		onClick: L
+		label: M("export.templateDetail.nextSteps.use.label", "Start an export from this template"),
+		description: M("export.templateDetail.nextSteps.use.description", "Pre-fills a new export with this template's entity types and format."),
+		icon: /* @__PURE__ */ x(v, { size: 16 }),
+		onClick: z
 	}, {
 		id: "browse",
-		label: "Browse all templates",
-		description: "Manage your other saved export configurations.",
-		icon: /* @__PURE__ */ b(p, { size: 16 }),
-		onClick: () => A?.(D(k, "templates"))
+		label: M("export.templateDetail.nextSteps.browse.label", "Browse all templates"),
+		description: M("export.templateDetail.nextSteps.browse.description", "Manage your other saved export configurations."),
+		icon: /* @__PURE__ */ x(m, { size: 16 }),
+		onClick: () => j?.(O(A, "templates"))
 	}];
-	return /* @__PURE__ */ x(a, {
+	return /* @__PURE__ */ S(o, {
 		showHeader: !1,
 		children: [
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "relative overflow-hidden rounded-xl bg-accent-wash border border-border-seam p-6 shadow-[var(--shadow-pop)]",
-				children: /* @__PURE__ */ x("div", {
+				children: /* @__PURE__ */ S("div", {
 					className: "relative z-10 flex flex-col sm:flex-row sm:items-center gap-4",
 					children: [
-						/* @__PURE__ */ b("button", {
+						/* @__PURE__ */ x("button", {
 							type: "button",
-							onClick: () => A?.(D(k, "templates")),
-							"aria-label": "Back to templates",
+							onClick: () => j?.(O(A, "templates")),
+							"aria-label": M("export.templateDetail.actions.backToTemplates", "Back to templates"),
 							className: "p-2.5 hover:bg-accent rounded-lg transition-colors duration-200 self-start focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",
-							children: /* @__PURE__ */ b(u, { size: 20 })
+							children: /* @__PURE__ */ x(d, { size: 20 })
 						}),
-						/* @__PURE__ */ x("div", {
+						/* @__PURE__ */ S("div", {
 							className: "flex items-center gap-3 flex-1 min-w-0",
-							children: [/* @__PURE__ */ b("div", {
+							children: [/* @__PURE__ */ x("div", {
 								className: "p-2.5 rounded-lg bg-action-primary-bg/10",
-								children: /* @__PURE__ */ b(p, {
+								children: /* @__PURE__ */ x(m, {
 									size: 24,
 									className: "text-primary"
 								})
-							}), /* @__PURE__ */ x("div", {
+							}), /* @__PURE__ */ S("div", {
 								className: "flex-1 min-w-0",
-								children: [/* @__PURE__ */ b("h1", {
+								children: [/* @__PURE__ */ x("h1", {
 									className: "text-xl sm:text-2xl font-bold truncate",
-									children: N.name
-								}), /* @__PURE__ */ b("p", {
+									children: F.name
+								}), /* @__PURE__ */ x("p", {
 									className: "text-sm text-text-secondary mt-1",
-									children: N.isDefault ? "Default template" : "Custom template"
+									children: F.isDefault ? M("export.templateDetail.badge.default", "Default template") : M("export.templateDetail.badge.custom", "Custom template")
 								})]
 							})]
 						}),
-						/* @__PURE__ */ b("div", {
+						/* @__PURE__ */ x("div", {
 							className: "flex-shrink-0",
-							children: /* @__PURE__ */ b(S, {
+							children: /* @__PURE__ */ x(C, {
 								primary: {
-									label: "Use Template",
-									icon: /* @__PURE__ */ b(_, { size: 16 }),
-									onSelect: L
+									label: M("export.templateDetail.actions.use", "Use Template"),
+									icon: /* @__PURE__ */ x(v, { size: 16 }),
+									onSelect: z
 								},
-								actions: z
+								actions: V
 							})
 						})
 					]
 				})
 			}),
-			N.description && /* @__PURE__ */ b("div", {
+			F.description && /* @__PURE__ */ x("div", {
 				className: "border border-border-seam rounded-xl p-5 bg-bg-surface",
-				children: /* @__PURE__ */ b("p", {
+				children: /* @__PURE__ */ x("p", {
 					className: "text-sm text-text-secondary",
-					children: N.description
+					children: F.description
 				})
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4",
 				children: [
 					{
-						icon: /* @__PURE__ */ b(m, { size: 18 }),
-						label: "Format",
-						value: i(N.format)
+						icon: /* @__PURE__ */ x(h, { size: 18 }),
+						label: M("export.templateDetail.info.format", "Format"),
+						value: a(F.format)
 					},
 					{
-						icon: /* @__PURE__ */ b(h, { size: 18 }),
-						label: "Archive",
-						value: r("ZIP")
+						icon: /* @__PURE__ */ x(g, { size: 18 }),
+						label: M("export.templateDetail.info.archive", "Archive"),
+						value: i("ZIP")
 					},
 					{
-						icon: /* @__PURE__ */ b(f, { size: 18 }),
-						label: "Entity Types",
-						value: `${N.entityTypes.length} type${N.entityTypes.length === 1 ? "" : "s"}`
+						icon: /* @__PURE__ */ x(p, { size: 18 }),
+						label: M("export.templateDetail.info.entityTypes", "Entity Types"),
+						value: M("export.templateDetail.info.entityTypesCount", "{{count}} type{{suffix}}", {
+							count: F.entityTypes.length,
+							suffix: F.entityTypes.length === 1 ? "" : "s"
+						})
 					},
 					{
-						icon: /* @__PURE__ */ b(d, { size: 18 }),
-						label: "Last Updated",
-						value: new Date(N.updatedAt).toLocaleDateString()
+						icon: /* @__PURE__ */ x(f, { size: 18 }),
+						label: M("export.templateDetail.info.lastUpdated", "Last Updated"),
+						value: new Date(F.updatedAt).toLocaleDateString()
 					}
-				].map((e) => /* @__PURE__ */ x(C, {
+				].map((e) => /* @__PURE__ */ S(w, {
 					treatment: "metric",
 					className: "p-4 border-border-seam",
-					children: [/* @__PURE__ */ x("div", {
+					children: [/* @__PURE__ */ S("div", {
 						className: "flex items-center gap-2 text-text-secondary mb-1",
-						children: [e.icon, /* @__PURE__ */ b("span", {
+						children: [e.icon, /* @__PURE__ */ x("span", {
 							className: "text-xs font-medium",
 							children: e.label
 						})]
-					}), /* @__PURE__ */ b("p", {
+					}), /* @__PURE__ */ x("p", {
 						className: "font-bold text-lg tabular-nums",
 						children: e.value
 					})]
 				}, e.label))
 			}),
-			/* @__PURE__ */ b(T, {
-				storageKey: `export-template-${N.id}`,
-				title: "What's next",
-				steps: B
+			/* @__PURE__ */ x(E, {
+				storageKey: `export-template-${F.id}`,
+				title: M("export.templateDetail.nextSteps.title", "What's next"),
+				steps: H
 			}),
-			/* @__PURE__ */ b(o, {
-				title: "Included Entity Types",
-				description: "Data types that will be exported",
-				children: /* @__PURE__ */ b(E, {
+			/* @__PURE__ */ x(s, {
+				title: M("export.templateDetail.entityTypes.title", "Included Entity Types"),
+				description: M("export.templateDetail.entityTypes.description", "Data types that will be exported"),
+				children: /* @__PURE__ */ x(D, {
 					collapsedHeight: 96,
-					children: /* @__PURE__ */ b("div", {
+					children: /* @__PURE__ */ x("div", {
 						className: "flex flex-wrap gap-2",
-						children: N.entityTypes.map((e) => /* @__PURE__ */ b("span", {
+						children: F.entityTypes.map((e) => /* @__PURE__ */ x("span", {
 							className: "inline-flex items-center gap-2 px-3 py-2 rounded-lg text-sm font-medium border border-border-seam bg-bg-sunken/30",
 							children: e
 						}, e))
 					})
 				})
 			}),
-			j && /* @__PURE__ */ b("div", {
+			N && /* @__PURE__ */ x("div", {
 				role: "dialog",
 				"aria-modal": "true",
 				"aria-labelledby": "template-delete-title",
 				className: "fixed inset-0 z-50 flex items-center justify-center bg-bg-surface/80 backdrop-blur-sm p-4",
-				children: /* @__PURE__ */ x("div", {
+				children: /* @__PURE__ */ S("div", {
 					className: "w-full max-w-md rounded-xl border-2 border-border-subtle bg-bg-surface p-6 shadow-xl",
 					children: [
-						/* @__PURE__ */ b("h2", {
+						/* @__PURE__ */ x("h2", {
 							id: "template-delete-title",
 							className: "text-lg font-bold",
-							children: "Delete template?"
+							children: M("export.templateDetail.delete.title", "Delete template?")
 						}),
-						/* @__PURE__ */ b("p", {
+						/* @__PURE__ */ x("p", {
 							className: "mt-2 text-sm text-text-secondary",
-							children: "This removes the saved export configuration. Existing export jobs are not deleted."
+							children: M("export.templateDetail.delete.description", "This removes the saved export configuration. Existing export jobs are not deleted.")
 						}),
-						/* @__PURE__ */ x("div", {
+						/* @__PURE__ */ S("div", {
 							className: "mt-6 flex flex-col-reverse sm:flex-row sm:justify-end gap-3",
-							children: [/* @__PURE__ */ b("button", {
+							children: [/* @__PURE__ */ x("button", {
 								type: "button",
-								onClick: () => M(!1),
+								onClick: () => P(!1),
 								className: "px-4 py-2 rounded-lg border-2 border-border-subtle hover:bg-accent transition-colors font-medium",
-								children: "Keep Template"
-							}), /* @__PURE__ */ x("button", {
+								children: M("export.templateDetail.delete.keep", "Keep Template")
+							}), /* @__PURE__ */ S("button", {
 								type: "button",
-								onClick: R,
-								disabled: I,
+								onClick: B,
+								disabled: R,
 								className: "inline-flex items-center justify-center gap-2 px-4 py-2 rounded-lg bg-status-error-bg text-status-error-text hover:bg-status-error-bg/90 transition-colors font-medium disabled:opacity-50",
-								children: [I ? /* @__PURE__ */ b(g, {
+								children: [R ? /* @__PURE__ */ x(_, {
 									size: 16,
 									className: "animate-spin"
-								}) : null, "Delete Template"]
+								}) : null, M("export.templateDetail.delete.confirmAction", "Delete Template")]
 							})]
 						})
 					]
@@ -232,6 +236,6 @@ function O() {
 	});
 }
 //#endregion
-export { O as TemplateDetailPage };
+export { k as TemplateDetailPage };
 
 //# sourceMappingURL=TemplateDetailPage.js.map

package/dist/export/pages/TemplateDetailPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateDetailPage.js","names":[],"sources":["../../../src/export/pages/TemplateDetailPage.tsx"],"sourcesContent":["import { useParams } from \"react-router\";\nimport { useState } from \"react\";\nimport {\n  ArrowLeft,\n  FileBox,\n  Download,\n  Play,\n  Trash2,\n  Clock,\n  FileText,\n  HardDrive,\n  Loader2,\n} from \"lucide-react\";\nimport {\n  GlassCard,\n  CTAOverflowMenu,\n  ShowMore,\n  IllustratedEmptyState,\n  NextSteps,\n  type NextStep,\n} from \"@burdenoff/fe-libs/ui\";\nimport type { CTAAction } from \"@burdenoff/fe-libs/ui\";\nimport { useExport } from \"../providers/ExportProvider\";\nimport {\n  useExportTemplate,\n  useDeleteExportTemplate,\n} from \"../hooks/useExportQueries\";\nimport {\n  getFormatDisplayName,\n  getArchiveFormatDisplayName,\n} from \"../constants/enums\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\n/**\n * Helper to join paths correctly\n */\nconst joinPath = (base: string, path: string): string => {\n  const cleanBase = base.endsWith(\"/\") ? base.slice(0, -1) : base;\n  const cleanPath = path.startsWith(\"/\") ? path : `/${path}`;\n  return cleanBase + cleanPath;\n};\n\n/**\n * Template Detail Page\n * View template details and use it to create a new export.\n * Fetches template from the backend via useExportTemplate hook.\n */\nexport function TemplateDetailPage() {\n  const { templateId } = useParams<{ templateId: string }>();\n  const { basePath = \"/\", navigate } = useExport();\n  const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);\n\n  const { data: template, isLoading } = useExportTemplate(templateId);\n  const { deleteTemplate, isPending: deleting } = useDeleteExportTemplate();\n\n  // Loading\n  if (isLoading) {\n    return (\n      <div className=\"flex flex-col items-center justify-center py-20\">\n        <Loader2 size={48} className=\"animate-spin text-primary\" />\n        <span className=\"mt-6 text-sm font-medium text-text-secondary\">\n          Loading template details…\n        </span>\n      </div>\n    );\n  }\n\n  if (!template) {\n    return (\n      <PageLayout showHeader={false}>\n        <div className=\"flex items-center gap-3 mb-6\">\n          <button\n            type=\"button\"\n            onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n            aria-label=\"Back to templates\"\n            className=\"p-2.5 hover:bg-accent rounded-lg transition-all duration-200\"\n          >\n            <ArrowLeft size={20} />\n          </button>\n          <h1 className=\"text-xl font-bold\">Template Not Found</h1>\n        </div>\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title=\"Template not found\"\n          description=\"The template you are looking for does not exist.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n              className=\"inline-flex items-center gap-2 px-6 py-3 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors font-medium\"\n            >\n              <ArrowLeft size={18} />\n              Back to Templates\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const handleUseTemplate = () => {\n    // Navigate to new export page pre-selected with this template\n    navigate?.(joinPath(basePath, `new?templateId=${templateId}`));\n  };\n\n  const handleDelete = async () => {\n    if (!templateId) return;\n    nativeImpact(\"medium\");\n    try {\n      await deleteTemplate(templateId);\n      nativeNotify(\"success\");\n      navigate?.(joinPath(basePath, \"templates\"));\n    } catch {\n      nativeNotify(\"error\");\n    }\n  };\n\n  const overflowActions: CTAAction[] = template.isDefault\n    ? []\n    : [\n        {\n          label: \"Delete Template\",\n          icon: <Trash2 size={16} />,\n          intent: \"destructive\",\n          disabled: deleting,\n          onSelect: () => setShowDeleteConfirm(true),\n        },\n      ];\n\n  // Next-step guidance — what a new user would do with a saved template.\n  const nextSteps: NextStep[] = [\n    {\n      id: \"use\",\n      label: \"Start an export from this template\",\n      description:\n        \"Pre-fills a new export with this template's entity types and format.\",\n      icon: <Play size={16} />,\n      onClick: handleUseTemplate,\n    },\n    {\n      id: \"browse\",\n      label: \"Browse all templates\",\n      description: \"Manage your other saved export configurations.\",\n      icon: <FileBox size={16} />,\n      onClick: () => navigate?.(joinPath(basePath, \"templates\")),\n    },\n  ];\n\n  return (\n    <PageLayout showHeader={false}>\n      {/* Header */}\n      <div className=\"relative overflow-hidden rounded-xl bg-accent-wash border border-border-seam p-6 shadow-[var(--shadow-pop)]\">\n        <div className=\"relative z-10 flex flex-col sm:flex-row sm:items-center gap-4\">\n          <button\n            type=\"button\"\n            onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n            aria-label=\"Back to templates\"\n            className=\"p-2.5 hover:bg-accent rounded-lg transition-colors duration-200 self-start focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40\"\n          >\n            <ArrowLeft size={20} />\n          </button>\n          <div className=\"flex items-center gap-3 flex-1 min-w-0\">\n            <div className=\"p-2.5 rounded-lg bg-action-primary-bg/10\">\n              <FileBox size={24} className=\"text-primary\" />\n            </div>\n            <div className=\"flex-1 min-w-0\">\n              <h1 className=\"text-xl sm:text-2xl font-bold truncate\">\n                {template.name}\n              </h1>\n              <p className=\"text-sm text-text-secondary mt-1\">\n                {template.isDefault ? \"Default template\" : \"Custom template\"}\n              </p>\n            </div>\n          </div>\n          <div className=\"flex-shrink-0\">\n            <CTAOverflowMenu\n              primary={{\n                label: \"Use Template\",\n                icon: <Play size={16} />,\n                onSelect: handleUseTemplate,\n              }}\n              actions={overflowActions}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Description */}\n      {template.description && (\n        <div className=\"border border-border-seam rounded-xl p-5 bg-bg-surface\">\n          <p className=\"text-sm text-text-secondary\">{template.description}</p>\n        </div>\n      )}\n\n      {/* Info Grid */}\n      <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4\">\n        {[\n          {\n            icon: <FileText size={18} />,\n            label: \"Format\",\n            value: getFormatDisplayName(template.format),\n          },\n          {\n            icon: <HardDrive size={18} />,\n            label: \"Archive\",\n            // Backend template doesn't carry archiveFormat, default to ZIP\n            value: getArchiveFormatDisplayName(\"ZIP\"),\n          },\n          {\n            icon: <Download size={18} />,\n            label: \"Entity Types\",\n            value: `${template.entityTypes.length} type${template.entityTypes.length !== 1 ? \"s\" : \"\"}`,\n          },\n          {\n            icon: <Clock size={18} />,\n            label: \"Last Updated\",\n            value: new Date(template.updatedAt).toLocaleDateString(),\n          },\n        ].map((item) => (\n          <GlassCard\n            key={item.label}\n            treatment=\"metric\"\n            className=\"p-4 border-border-seam\"\n          >\n            <div className=\"flex items-center gap-2 text-text-secondary mb-1\">\n              {item.icon}\n              <span className=\"text-xs font-medium\">{item.label}</span>\n            </div>\n            <p className=\"font-bold text-lg tabular-nums\">{item.value}</p>\n          </GlassCard>\n        ))}\n      </div>\n\n      {/* Next-step guidance (dismissable, per-template) */}\n      <NextSteps\n        storageKey={`export-template-${template.id}`}\n        title=\"What's next\"\n        steps={nextSteps}\n      />\n\n      {/* Entity Types */}\n      <PageSection\n        title=\"Included Entity Types\"\n        description=\"Data types that will be exported\"\n      >\n        <ShowMore collapsedHeight={96}>\n          <div className=\"flex flex-wrap gap-2\">\n            {template.entityTypes.map((entity) => (\n              <span\n                key={entity}\n                className=\"inline-flex items-center gap-2 px-3 py-2 rounded-lg text-sm font-medium border border-border-seam bg-bg-sunken/30\"\n              >\n                {entity}\n              </span>\n            ))}\n          </div>\n        </ShowMore>\n      </PageSection>\n\n      {showDeleteConfirm && (\n        <div\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby=\"template-delete-title\"\n          className=\"fixed inset-0 z-50 flex items-center justify-center bg-bg-surface/80 backdrop-blur-sm p-4\"\n        >\n          <div className=\"w-full max-w-md rounded-xl border-2 border-border-subtle bg-bg-surface p-6 shadow-xl\">\n            <h2 id=\"template-delete-title\" className=\"text-lg font-bold\">\n              Delete template?\n            </h2>\n            <p className=\"mt-2 text-sm text-text-secondary\">\n              This removes the saved export configuration. Existing export jobs\n              are not deleted.\n            </p>\n            <div className=\"mt-6 flex flex-col-reverse sm:flex-row sm:justify-end gap-3\">\n              <button\n                type=\"button\"\n                onClick={() => setShowDeleteConfirm(false)}\n                className=\"px-4 py-2 rounded-lg border-2 border-border-subtle hover:bg-accent transition-colors font-medium\"\n              >\n                Keep Template\n              </button>\n              <button\n                type=\"button\"\n                onClick={handleDelete}\n                disabled={deleting}\n                className=\"inline-flex items-center justify-center gap-2 px-4 py-2 rounded-lg bg-status-error-bg text-status-error-text hover:bg-status-error-bg/90 transition-colors font-medium disabled:opacity-50\"\n              >\n                {deleting ? (\n                  <Loader2 size={16} className=\"animate-spin\" />\n                ) : null}\n                Delete Template\n              </button>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAqCA,IAAM,KAAY,GAAc,OACZ,EAAK,SAAS,IAAI,GAAG,EAAK,MAAM,GAAG,GAAG,GAAG,MACzC,EAAK,WAAW,IAAI,GAAG,IAAO,IAAI;AAStD,SAAgB,IAAqB;CACnC,IAAM,EAAE,kBAAe,GAAmC,EACpD,EAAE,cAAW,KAAK,gBAAa,GAAW,EAC1C,CAAC,GAAmB,KAAwB,EAAS,GAAM,EAE3D,EAAE,MAAM,GAAU,iBAAc,EAAkB,EAAW,EAC7D,EAAE,mBAAgB,WAAW,MAAa,GAAyB;AAGzE,KAAI,EACF,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,GAAD;GAAS,MAAM;GAAI,WAAU;GAA8B,CAAA,EAC3D,kBAAC,QAAD;GAAM,WAAU;aAA+C;GAExD,CAAA,CACH;;AAIV,KAAI,CAAC,EACH,QACE,kBAAC,GAAD;EAAY,YAAY;YAAxB,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,IAAW,EAAS,GAAU,YAAY,CAAC;IAC1D,cAAW;IACX,WAAU;cAEV,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;IAChB,CAAA,EACT,kBAAC,MAAD;IAAI,WAAU;cAAoB;IAAuB,CAAA,CACrD;MACN,kBAAC,GAAD;GACE,cAAa;GACb,OAAM;GACN,aAAY;GACZ,QACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,IAAW,EAAS,GAAU,YAAY,CAAC;IAC1D,WAAU;cAHZ,CAKE,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA,EAAA,oBAEhB;;GAEX,CAAA,CACS;;CAIjB,IAAM,UAA0B;AAE9B,MAAW,EAAS,GAAU,kBAAkB,IAAa,CAAC;IAG1D,IAAe,YAAY;AAC1B,SACL;KAAa,SAAS;AACtB,OAAI;AAGF,IAFA,MAAM,EAAe,EAAW,EAChC,EAAa,UAAU,EACvB,IAAW,EAAS,GAAU,YAAY,CAAC;WACrC;AACN,MAAa,QAAQ;;;IAInB,IAA+B,EAAS,YAC1C,EAAE,GACF,CACE;EACE,OAAO;EACP,MAAM,kBAAC,GAAD,EAAQ,MAAM,IAAM,CAAA;EAC1B,QAAQ;EACR,UAAU;EACV,gBAAgB,EAAqB,GAAK;EAC3C,CACF,EAGC,IAAwB,CAC5B;EACE,IAAI;EACJ,OAAO;EACP,aACE;EACF,MAAM,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;EACxB,SAAS;EACV,EACD;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,MAAM,kBAAC,GAAD,EAAS,MAAM,IAAM,CAAA;EAC3B,eAAe,IAAW,EAAS,GAAU,YAAY,CAAC;EAC3D,CACF;AAED,QACE,kBAAC,GAAD;EAAY,YAAY;YAAxB;GAEE,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,IAAW,EAAS,GAAU,YAAY,CAAC;OAC1D,cAAW;OACX,WAAU;iBAEV,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;OAChB,CAAA;MACT,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBACb,kBAAC,GAAD;SAAS,MAAM;SAAI,WAAU;SAAiB,CAAA;QAC1C,CAAA,EACN,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,MAAD;SAAI,WAAU;mBACX,EAAS;SACP,CAAA,EACL,kBAAC,KAAD;SAAG,WAAU;mBACV,EAAS,YAAY,qBAAqB;SACzC,CAAA,CACA;UACF;;MACN,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,GAAD;QACE,SAAS;SACP,OAAO;SACP,MAAM,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;SACxB,UAAU;SACX;QACD,SAAS;QACT,CAAA;OACE,CAAA;MACF;;IACF,CAAA;GAGL,EAAS,eACR,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,KAAD;KAAG,WAAU;eAA+B,EAAS;KAAgB,CAAA;IACjE,CAAA;GAIR,kBAAC,OAAD;IAAK,WAAU;cACZ;KACC;MACE,MAAM,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA;MAC5B,OAAO;MACP,OAAO,EAAqB,EAAS,OAAO;MAC7C;KACD;MACE,MAAM,kBAAC,GAAD,EAAW,MAAM,IAAM,CAAA;MAC7B,OAAO;MAEP,OAAO,EAA4B,MAAM;MAC1C;KACD;MACE,MAAM,kBAAC,GAAD,EAAU,MAAM,IAAM,CAAA;MAC5B,OAAO;MACP,OAAO,GAAG,EAAS,YAAY,OAAO,OAAO,EAAS,YAAY,WAAW,IAAU,KAAN;MAClF;KACD;MACE,MAAM,kBAAC,GAAD,EAAO,MAAM,IAAM,CAAA;MACzB,OAAO;MACP,OAAO,IAAI,KAAK,EAAS,UAAU,CAAC,oBAAoB;MACzD;KACF,CAAC,KAAK,MACL,kBAAC,GAAD;KAEE,WAAU;KACV,WAAU;eAHZ,CAKE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACG,EAAK,MACN,kBAAC,QAAD;OAAM,WAAU;iBAAuB,EAAK;OAAa,CAAA,CACrD;SACN,kBAAC,KAAD;MAAG,WAAU;gBAAkC,EAAK;MAAU,CAAA,CACpD;OATL,EAAK,MASA,CACZ;IACE,CAAA;GAGN,kBAAC,GAAD;IACE,YAAY,mBAAmB,EAAS;IACxC,OAAM;IACN,OAAO;IACP,CAAA;GAGF,kBAAC,GAAD;IACE,OAAM;IACN,aAAY;cAEZ,kBAAC,GAAD;KAAU,iBAAiB;eACzB,kBAAC,OAAD;MAAK,WAAU;gBACZ,EAAS,YAAY,KAAK,MACzB,kBAAC,QAAD;OAEE,WAAU;iBAET;OACI,EAJA,EAIA,CACP;MACE,CAAA;KACG,CAAA;IACC,CAAA;GAEb,KACC,kBAAC,OAAD;IACE,MAAK;IACL,cAAW;IACX,mBAAgB;IAChB,WAAU;cAEV,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,MAAD;OAAI,IAAG;OAAwB,WAAU;iBAAoB;OAExD,CAAA;MACL,kBAAC,KAAD;OAAG,WAAU;iBAAmC;OAG5C,CAAA;MACJ,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAqB,GAAM;QAC1C,WAAU;kBACX;QAEQ,CAAA,EACT,kBAAC,UAAD;QACE,MAAK;QACL,SAAS;QACT,UAAU;QACV,WAAU;kBAJZ,CAMG,IACC,kBAAC,GAAD;SAAS,MAAM;SAAI,WAAU;SAAiB,CAAA,GAC5C,MAAK,kBAEF;UACL;;MACF;;IACF,CAAA;GAEG"}
+{"version":3,"file":"TemplateDetailPage.js","names":[],"sources":["../../../src/export/pages/TemplateDetailPage.tsx"],"sourcesContent":["import { useParams } from \"react-router\";\nimport { useState } from \"react\";\nimport {\n  ArrowLeft,\n  FileBox,\n  Download,\n  Play,\n  Trash2,\n  Clock,\n  FileText,\n  HardDrive,\n  Loader2,\n} from \"lucide-react\";\nimport {\n  GlassCard,\n  CTAOverflowMenu,\n  ShowMore,\n  IllustratedEmptyState,\n  NextSteps,\n  type NextStep,\n} from \"@burdenoff/fe-libs/ui\";\nimport type { CTAAction } from \"@burdenoff/fe-libs/ui\";\nimport { useExport } from \"../providers/ExportProvider\";\nimport {\n  useExportTemplate,\n  useDeleteExportTemplate,\n} from \"../hooks/useExportQueries\";\nimport {\n  getFormatDisplayName,\n  getArchiveFormatDisplayName,\n} from \"../constants/enums\";\nimport { PageLayout, PageSection } from \"../components/PageLayout\";\nimport { useTr } from \"../hooks/useTr\";\nimport { nativeImpact, nativeNotify } from \"../../utils/nativeBridge\";\n\n/**\n * Helper to join paths correctly\n */\nconst joinPath = (base: string, path: string): string => {\n  const cleanBase = base.endsWith(\"/\") ? base.slice(0, -1) : base;\n  const cleanPath = path.startsWith(\"/\") ? path : `/${path}`;\n  return cleanBase + cleanPath;\n};\n\n/**\n * Template Detail Page\n * View template details and use it to create a new export.\n * Fetches template from the backend via useExportTemplate hook.\n */\nexport function TemplateDetailPage() {\n  const { templateId } = useParams<{ templateId: string }>();\n  const { basePath = \"/\", navigate } = useExport();\n  const tr = useTr();\n  const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);\n\n  const { data: template, isLoading } = useExportTemplate(templateId);\n  const { deleteTemplate, isPending: deleting } = useDeleteExportTemplate();\n\n  // Loading\n  if (isLoading) {\n    return (\n      <div className=\"flex flex-col items-center justify-center py-20\">\n        <Loader2 size={48} className=\"animate-spin text-primary\" />\n        <span className=\"mt-6 text-sm font-medium text-text-secondary\">\n          {tr(\"export.templateDetail.loading\", \"Loading template details…\")}\n        </span>\n      </div>\n    );\n  }\n\n  if (!template) {\n    return (\n      <PageLayout showHeader={false}>\n        <div className=\"flex items-center gap-3 mb-6\">\n          <button\n            type=\"button\"\n            onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n            aria-label={tr(\n              \"export.templateDetail.actions.backToTemplates\",\n              \"Back to templates\",\n            )}\n            className=\"p-2.5 hover:bg-accent rounded-lg transition-all duration-200\"\n          >\n            <ArrowLeft size={20} />\n          </button>\n          <h1 className=\"text-xl font-bold\">\n            {tr(\"export.templateDetail.notFound.title\", \"Template Not Found\")}\n          </h1>\n        </div>\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title={tr(\n            \"export.templateDetail.notFound.heading\",\n            \"Template not found\",\n          )}\n          description={tr(\n            \"export.templateDetail.notFound.description\",\n            \"The template you are looking for does not exist.\",\n          )}\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n              className=\"inline-flex items-center gap-2 px-6 py-3 bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg/90 transition-colors font-medium\"\n            >\n              <ArrowLeft size={18} />\n              {tr(\n                \"export.templateDetail.actions.backToTemplates\",\n                \"Back to Templates\",\n              )}\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const handleUseTemplate = () => {\n    // Navigate to new export page pre-selected with this template\n    navigate?.(joinPath(basePath, `new?templateId=${templateId}`));\n  };\n\n  const handleDelete = async () => {\n    if (!templateId) return;\n    nativeImpact(\"medium\");\n    try {\n      await deleteTemplate(templateId);\n      nativeNotify(\"success\");\n      navigate?.(joinPath(basePath, \"templates\"));\n    } catch {\n      nativeNotify(\"error\");\n    }\n  };\n\n  const overflowActions: CTAAction[] = template.isDefault\n    ? []\n    : [\n        {\n          label: tr(\"export.templateDetail.actions.delete\", \"Delete Template\"),\n          icon: <Trash2 size={16} />,\n          intent: \"destructive\",\n          disabled: deleting,\n          onSelect: () => setShowDeleteConfirm(true),\n        },\n      ];\n\n  // Next-step guidance — what a new user would do with a saved template.\n  const nextSteps: NextStep[] = [\n    {\n      id: \"use\",\n      label: tr(\n        \"export.templateDetail.nextSteps.use.label\",\n        \"Start an export from this template\",\n      ),\n      description: tr(\n        \"export.templateDetail.nextSteps.use.description\",\n        \"Pre-fills a new export with this template's entity types and format.\",\n      ),\n      icon: <Play size={16} />,\n      onClick: handleUseTemplate,\n    },\n    {\n      id: \"browse\",\n      label: tr(\n        \"export.templateDetail.nextSteps.browse.label\",\n        \"Browse all templates\",\n      ),\n      description: tr(\n        \"export.templateDetail.nextSteps.browse.description\",\n        \"Manage your other saved export configurations.\",\n      ),\n      icon: <FileBox size={16} />,\n      onClick: () => navigate?.(joinPath(basePath, \"templates\")),\n    },\n  ];\n\n  return (\n    <PageLayout showHeader={false}>\n      {/* Header */}\n      <div className=\"relative overflow-hidden rounded-xl bg-accent-wash border border-border-seam p-6 shadow-[var(--shadow-pop)]\">\n        <div className=\"relative z-10 flex flex-col sm:flex-row sm:items-center gap-4\">\n          <button\n            type=\"button\"\n            onClick={() => navigate?.(joinPath(basePath, \"templates\"))}\n            aria-label={tr(\n              \"export.templateDetail.actions.backToTemplates\",\n              \"Back to templates\",\n            )}\n            className=\"p-2.5 hover:bg-accent rounded-lg transition-colors duration-200 self-start focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40\"\n          >\n            <ArrowLeft size={20} />\n          </button>\n          <div className=\"flex items-center gap-3 flex-1 min-w-0\">\n            <div className=\"p-2.5 rounded-lg bg-action-primary-bg/10\">\n              <FileBox size={24} className=\"text-primary\" />\n            </div>\n            <div className=\"flex-1 min-w-0\">\n              <h1 className=\"text-xl sm:text-2xl font-bold truncate\">\n                {template.name}\n              </h1>\n              <p className=\"text-sm text-text-secondary mt-1\">\n                {template.isDefault\n                  ? tr(\n                      \"export.templateDetail.badge.default\",\n                      \"Default template\",\n                    )\n                  : tr(\"export.templateDetail.badge.custom\", \"Custom template\")}\n              </p>\n            </div>\n          </div>\n          <div className=\"flex-shrink-0\">\n            <CTAOverflowMenu\n              primary={{\n                label: tr(\"export.templateDetail.actions.use\", \"Use Template\"),\n                icon: <Play size={16} />,\n                onSelect: handleUseTemplate,\n              }}\n              actions={overflowActions}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* Description */}\n      {template.description && (\n        <div className=\"border border-border-seam rounded-xl p-5 bg-bg-surface\">\n          <p className=\"text-sm text-text-secondary\">{template.description}</p>\n        </div>\n      )}\n\n      {/* Info Grid */}\n      <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4\">\n        {[\n          {\n            icon: <FileText size={18} />,\n            label: tr(\"export.templateDetail.info.format\", \"Format\"),\n            value: getFormatDisplayName(template.format),\n          },\n          {\n            icon: <HardDrive size={18} />,\n            label: tr(\"export.templateDetail.info.archive\", \"Archive\"),\n            // Backend template doesn't carry archiveFormat, default to ZIP\n            value: getArchiveFormatDisplayName(\"ZIP\"),\n          },\n          {\n            icon: <Download size={18} />,\n            label: tr(\"export.templateDetail.info.entityTypes\", \"Entity Types\"),\n            value: tr(\n              \"export.templateDetail.info.entityTypesCount\",\n              \"{{count}} type{{suffix}}\",\n              {\n                count: template.entityTypes.length,\n                suffix: template.entityTypes.length !== 1 ? \"s\" : \"\",\n              },\n            ),\n          },\n          {\n            icon: <Clock size={18} />,\n            label: tr(\"export.templateDetail.info.lastUpdated\", \"Last Updated\"),\n            value: new Date(template.updatedAt).toLocaleDateString(),\n          },\n        ].map((item) => (\n          <GlassCard\n            key={item.label}\n            treatment=\"metric\"\n            className=\"p-4 border-border-seam\"\n          >\n            <div className=\"flex items-center gap-2 text-text-secondary mb-1\">\n              {item.icon}\n              <span className=\"text-xs font-medium\">{item.label}</span>\n            </div>\n            <p className=\"font-bold text-lg tabular-nums\">{item.value}</p>\n          </GlassCard>\n        ))}\n      </div>\n\n      {/* Next-step guidance (dismissable, per-template) */}\n      <NextSteps\n        storageKey={`export-template-${template.id}`}\n        title={tr(\"export.templateDetail.nextSteps.title\", \"What's next\")}\n        steps={nextSteps}\n      />\n\n      {/* Entity Types */}\n      <PageSection\n        title={tr(\n          \"export.templateDetail.entityTypes.title\",\n          \"Included Entity Types\",\n        )}\n        description={tr(\n          \"export.templateDetail.entityTypes.description\",\n          \"Data types that will be exported\",\n        )}\n      >\n        <ShowMore collapsedHeight={96}>\n          <div className=\"flex flex-wrap gap-2\">\n            {template.entityTypes.map((entity) => (\n              <span\n                key={entity}\n                className=\"inline-flex items-center gap-2 px-3 py-2 rounded-lg text-sm font-medium border border-border-seam bg-bg-sunken/30\"\n              >\n                {entity}\n              </span>\n            ))}\n          </div>\n        </ShowMore>\n      </PageSection>\n\n      {showDeleteConfirm && (\n        <div\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby=\"template-delete-title\"\n          className=\"fixed inset-0 z-50 flex items-center justify-center bg-bg-surface/80 backdrop-blur-sm p-4\"\n        >\n          <div className=\"w-full max-w-md rounded-xl border-2 border-border-subtle bg-bg-surface p-6 shadow-xl\">\n            <h2 id=\"template-delete-title\" className=\"text-lg font-bold\">\n              {tr(\"export.templateDetail.delete.title\", \"Delete template?\")}\n            </h2>\n            <p className=\"mt-2 text-sm text-text-secondary\">\n              {tr(\n                \"export.templateDetail.delete.description\",\n                \"This removes the saved export configuration. Existing export jobs are not deleted.\",\n              )}\n            </p>\n            <div className=\"mt-6 flex flex-col-reverse sm:flex-row sm:justify-end gap-3\">\n              <button\n                type=\"button\"\n                onClick={() => setShowDeleteConfirm(false)}\n                className=\"px-4 py-2 rounded-lg border-2 border-border-subtle hover:bg-accent transition-colors font-medium\"\n              >\n                {tr(\"export.templateDetail.delete.keep\", \"Keep Template\")}\n              </button>\n              <button\n                type=\"button\"\n                onClick={handleDelete}\n                disabled={deleting}\n                className=\"inline-flex items-center justify-center gap-2 px-4 py-2 rounded-lg bg-status-error-bg text-status-error-text hover:bg-status-error-bg/90 transition-colors font-medium disabled:opacity-50\"\n              >\n                {deleting ? (\n                  <Loader2 size={16} className=\"animate-spin\" />\n                ) : null}\n                {tr(\n                  \"export.templateDetail.delete.confirmAction\",\n                  \"Delete Template\",\n                )}\n              </button>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/export/utils/i18n.d.ts

@@ -1,6 +1,22 @@
 import { I18nContextValue } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';
 
-type TranslationParams = Record<string, string | number>;
+export type TranslationParams = Record<string, string | number>;
+/**
+ * Interpolate `{{key}}` placeholders in a fallback string.
+ *
+ * Matches the VibeControls `useTr` interpolation convention so call sites
+ * across the platform stay consistent.
+ */
+export declare function interpolateFallback(fallback: string, params?: TranslationParams): string;
+/**
+ * Translate a key using the provided `t` function, falling back to the
+ * caller's English string when the key is missing.
+ *
+ * Supports optional interpolation with `{{key}}` placeholders.
+ *
+ * Prefer the `useTr()` hook in components; this helper is useful when a
+ * translation is needed outside a hook context (e.g. inside a callback that
+ * already has access to `t`).
+ */
 export declare function tWithFallback(t: I18nContextValue["t"], key: string, fallback: string, params?: TranslationParams): string;
-export {};
 //# sourceMappingURL=i18n.d.ts.map

package/dist/export/utils/i18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../../src/export/utils/i18n.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAE/F,KAAK,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAgBzD,wBAAgB,aAAa,CAC3B,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,EACxB,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,iBAAiB,GACzB,MAAM,CAKR"}
+{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../../src/export/utils/i18n.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAE/F,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEhE;;;;;GAKG;AACH,wBAAgB,mBAAmB,CACjC,QAAQ,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,iBAAiB,GACzB,MAAM,CAUR;AAED;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAC3B,CAAC,EAAE,gBAAgB,CAAC,GAAG,CAAC,EACxB,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,iBAAiB,GACzB,MAAM,CAIR"}

package/dist/export/utils/i18n.js

@@ -1,15 +1,8 @@
 //#region src/export/utils/i18n.ts
 function e(e, t) {
-	return t ? e.replace(/\{(\w+)\}/g, (e, n) => {
-		let r = t[n];
-		return r == null ? e : String(r);
-	}) : e;
-}
-function t(t, n, r, i) {
-	let a = t(n, i);
-	return a === n ? e(r, i) : a;
+	return t ? Object.entries(t).reduce((e, [t, n]) => e.replace(RegExp(`\\{\\{${t}\\}\\}`, "g"), String(n)), e) : e;
 }
 //#endregion
-export { t as tWithFallback };
+export { e as interpolateFallback };
 
 //# sourceMappingURL=i18n.js.map

package/dist/export/utils/i18n.js.map

@@ -1 +1 @@
-{"version":3,"file":"i18n.js","names":[],"sources":["../../../src/export/utils/i18n.ts"],"sourcesContent":["import type { I18nContextValue } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\n\ntype TranslationParams = Record<string, string | number>;\n\nfunction interpolateFallback(\n  fallback: string,\n  params?: TranslationParams,\n): string {\n  if (!params) {\n    return fallback;\n  }\n\n  return fallback.replace(/\\{(\\w+)\\}/g, (match, key: string) => {\n    const value = params[key];\n    return value == null ? match : String(value);\n  });\n}\n\nexport function tWithFallback(\n  t: I18nContextValue[\"t\"],\n  key: string,\n  fallback: string,\n  params?: TranslationParams,\n): string {\n  const translated = t(key, params);\n  return translated === key\n    ? interpolateFallback(fallback, params)\n    : translated;\n}\n"],"mappings":";AAIA,SAAS,EACP,GACA,GACQ;AAKR,QAJK,IAIE,EAAS,QAAQ,eAAe,GAAO,MAAgB;EAC5D,IAAM,IAAQ,EAAO;AACrB,SAAO,KAAS,OAAO,IAAQ,OAAO,EAAM;GAC5C,GANO;;AASX,SAAgB,EACd,GACA,GACA,GACA,GACQ;CACR,IAAM,IAAa,EAAE,GAAK,EAAO;AACjC,QAAO,MAAe,IAClB,EAAoB,GAAU,EAAO,GACrC"}
+{"version":3,"file":"i18n.js","names":[],"sources":["../../../src/export/utils/i18n.ts"],"sourcesContent":["import type { I18nContextValue } from \"@burdenoff/fe-libs/shared/providers/shell/I18nProvider\";\n\nexport type TranslationParams = Record<string, string | number>;\n\n/**\n * Interpolate `{{key}}` placeholders in a fallback string.\n *\n * Matches the VibeControls `useTr` interpolation convention so call sites\n * across the platform stay consistent.\n */\nexport function interpolateFallback(\n  fallback: string,\n  params?: TranslationParams,\n): string {\n  if (!params) {\n    return fallback;\n  }\n\n  return Object.entries(params).reduce(\n    (str, [key, value]) =>\n      str.replace(new RegExp(`\\\\{\\\\{${key}\\\\}\\\\}`, \"g\"), String(value)),\n    fallback,\n  );\n}\n\n/**\n * Translate a key using the provided `t` function, falling back to the\n * caller's English string when the key is missing.\n *\n * Supports optional interpolation with `{{key}}` placeholders.\n *\n * Prefer the `useTr()` hook in components; this helper is useful when a\n * translation is needed outside a hook context (e.g. inside a callback that\n * already has access to `t`).\n */\nexport function tWithFallback(\n  t: I18nContextValue[\"t\"],\n  key: string,\n  fallback: string,\n  params?: TranslationParams,\n): string {\n  const translated = t(key);\n  const raw = translated === key ? fallback : translated;\n  return interpolateFallback(raw, params);\n}\n"],"mappings":";AAUA,SAAgB,EACd,GACA,GACQ;AAKR,QAJK,IAIE,OAAO,QAAQ,EAAO,CAAC,QAC3B,GAAK,CAAC,GAAK,OACV,EAAI,QAAY,OAAO,SAAS,EAAI,SAAS,IAAI,EAAE,OAAO,EAAM,CAAC,EACnE,EACD,GAPQ"}

package/dist/index.js

@@ -1,5 +1,6 @@
 import { useExport as e } from "./export/providers/ExportProvider.js";
 import { useExportStore as t } from "./export/store/exportStore.js";
 import { ExportRoot as n } from "./export/ExportRoot.js";
+import { enTranslations as r } from "./translations/en.js";
 import "./export/index.js";
-export { n as ExportRoot, e as useExport, t as useExportStore };
+export { n as ExportRoot, r as enTranslations, e as useExport, t as useExportStore };