@burdenoff/microfe-devportal 2026.1112.2 → 2026.1113.2

package/dist/devportal/DevportalRoot.js

@@ -2,149 +2,95 @@ import { DevportalProvider as e } from "./providers/DevportalProvider.js";
 import { useTr as t } from "./utils/i18n.js";
 import { DevportalRoutes as n } from "./DevportalRoutes.js";
 import { setDevportalEventBusBridge as r } from "./events/index.js";
-import { useEffect as i } from "react";
-import { ErrorBoundary as a } from "@burdenoff/fe-libs/shared/components";
-import { AppWindow as o, BarChart3 as s, Blocks as c, BookOpen as l, Building2 as u, Code2 as d, DollarSign as f, Key as p, LayoutDashboard as m, Settings as h, Shield as g, Webhook as _, Wrench as v } from "lucide-react";
-import { jsx as y } from "react/jsx-runtime";
-import { FeatureFlagProvider as b } from "@burdenoff/fe-libs/shared/feature-flags";
-import { useEventBus as x } from "@burdenoff/fe-libs/shared/events";
+import { getMenuEntries as i } from "./utils/developerNav.js";
+import { useEffect as a } from "react";
+import { ErrorBoundary as o } from "@burdenoff/fe-libs/shared/components";
+import { AppWindow as s, BarChart3 as c, Blocks as l, BookOpen as u, Building2 as d, Code2 as f, DollarSign as p, Key as m, LayoutDashboard as h, Settings as g, Shield as _, UserCircle as v, Webhook as y, Wrench as b } from "lucide-react";
+import { jsx as x } from "react/jsx-runtime";
+import { FeatureFlagProvider as S } from "@burdenoff/fe-libs/shared/feature-flags";
+import { useEventBus as C } from "@burdenoff/fe-libs/shared/events";
+import { useHeadingDocumentTitle as w } from "@burdenoff/fe-libs/ui";
 // src/devportal/DevportalRoot.tsx
-var S = (S) => {
-	let { registerNavItems: C, registerFooterItems: w, basePath: T = "/" } = S, E = t(), D = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
-	i(() => {
-		if (!C) return;
+var T = {
+	"devportal-dashboard": h,
+	"devportal-organizations": d,
+	"devportal-apps": s,
+	"devportal-timecampus-applets": l,
+	"devportal-oauth": _,
+	"devportal-api-keys": m,
+	"devportal-webhooks": y,
+	"devportal-analytics": c,
+	"devportal-revenue": p,
+	"devportal-docs": u,
+	"devportal-resources": b,
+	"devportal-settings": g,
+	"devportal-publisher": v
+}, E = ({ id: e }) => {
+	let t = T[e] ?? f;
+	return /* @__PURE__ */ x(t, { size: 16 });
+}, D = (s) => {
+	let { registerNavItems: c, registerFooterItems: l, basePath: u = "/" } = s, d = t(), p = s.variant === "fluidgrids";
+	w({
+		enabled: s.variant === "fluidgrids",
+		suffix: "FluidGrids"
+	});
+	let m = (e, t) => (e.endsWith("/") ? e.slice(0, -1) : e) + (t.startsWith("/") ? t : `/${t}`);
+	a(() => {
+		if (!c) return;
 		let e = {
 			id: "devportal",
-			label: E("devportal.developerPortal", "Developer Portal"),
-			path: T,
-			icon: /* @__PURE__ */ y(d, { size: 20 }),
+			label: d("devportal.developerPortal", "Developer Portal"),
+			path: u,
+			icon: /* @__PURE__ */ x(f, { size: 20 }),
 			order: 75,
 			group: "global",
-			children: [
-				{
-					id: "devportal-dashboard",
-					label: E("devportal.dashboard", "Dashboard"),
-					path: T,
-					icon: /* @__PURE__ */ y(m, { size: 16 }),
-					order: 10
-				},
-				{
-					id: "devportal-organizations",
-					label: E("devportal.organizations", "Organizations"),
-					path: D(T, "organizations"),
-					icon: /* @__PURE__ */ y(u, { size: 16 }),
-					order: 20
-				},
-				{
-					id: "devportal-apps",
-					label: E("devportal.myApps", "My Apps"),
-					path: D(T, "apps"),
-					icon: /* @__PURE__ */ y(o, { size: 16 }),
-					order: 30
-				},
-				{
-					id: "devportal-timecampus-applets",
-					label: E("devportal.nav.timecampusApplets", "TimeCampus Applets"),
-					path: D(T, "timecampus-applets"),
-					icon: /* @__PURE__ */ y(c, { size: 16 }),
-					order: 35
-				},
-				{
-					id: "devportal-oauth",
-					label: E("devportal.oauthClients", "OAuth Clients"),
-					path: D(T, "oauth"),
-					icon: /* @__PURE__ */ y(g, { size: 16 }),
-					order: 40
-				},
-				{
-					id: "devportal-api-keys",
-					label: E("devportal.apiKeys", "API Keys"),
-					path: D(T, "api-keys"),
-					icon: /* @__PURE__ */ y(p, { size: 16 }),
-					order: 50
-				},
-				{
-					id: "devportal-webhooks",
-					label: E("devportal.webhooks", "Webhooks"),
-					path: D(T, "webhooks"),
-					icon: /* @__PURE__ */ y(_, { size: 16 }),
-					order: 60
-				},
-				{
-					id: "devportal-analytics",
-					label: E("devportal.analytics", "Analytics"),
-					path: D(T, "analytics"),
-					icon: /* @__PURE__ */ y(s, { size: 16 }),
-					order: 70
-				},
-				{
-					id: "devportal-revenue",
-					label: E("devportal.revenue", "Revenue"),
-					path: "/billing/earnings",
-					icon: /* @__PURE__ */ y(f, { size: 16 }),
-					order: 80
-				},
-				{
-					id: "devportal-docs",
-					label: E("devportal.documentation", "Documentation"),
-					path: D(T, "docs"),
-					icon: /* @__PURE__ */ y(l, { size: 16 }),
-					order: 90
-				},
-				{
-					id: "devportal-resources",
-					label: E("devportal.resources", "Resources"),
-					path: D(T, "resources"),
-					icon: /* @__PURE__ */ y(v, { size: 16 }),
-					order: 100
-				},
-				{
-					id: "devportal-settings",
-					label: E("devportal.settings", "Settings"),
-					path: D(T, "settings"),
-					icon: /* @__PURE__ */ y(h, { size: 16 }),
-					order: 110
-				}
-			]
+			children: i(p).map((e) => ({
+				id: e.id,
+				label: d(e.i18nKey, e.fallback),
+				path: e.absolutePath ? e.absolutePath : e.path ? m(u, e.path) : u,
+				icon: /* @__PURE__ */ x(E, { id: e.id }),
+				order: e.order
+			}))
 		};
-		return C(e);
+		return c(e);
 	}, [
-		C,
-		T,
-		E
-	]), i(() => {
-		if (!w) return;
+		c,
+		u,
+		d,
+		p
+	]), a(() => {
+		if (!l) return;
 		let e = [{
 			id: "devportal-status",
-			label: E("devportal.developerPortalReady", "Developer Portal Ready"),
+			label: d("devportal.developerPortalReady", "Developer Portal Ready"),
 			type: "status",
 			order: 10,
 			section: "left"
 		}];
-		return w(e);
-	}, [w, E]), i(() => {
+		return l(e);
+	}, [l, d]), a(() => {
 		let e = window.__breadcrumbRegistry;
-		if (e) return e.register("oauth", E("devportal.nav.oauth", "OAuth Clients")), e.register("api-keys", E("devportal.nav.apiKeys", "API Keys")), () => {
+		if (e) return e.register("oauth", p ? d("devportal.nav.oauthApps", "OAuth apps") : d("devportal.nav.oauth", "OAuth Clients")), e.register("api-keys", d("devportal.nav.apiKeys", "API Keys")), () => {
 			e.unregister("oauth"), e.unregister("api-keys");
 		};
-	}, [E]);
-	let O = x();
-	return i(() => (r(O), () => r(null)), [O]), /* @__PURE__ */ y(a, {
-		fallback: /* @__PURE__ */ y("div", {
+	}, [d, p]);
+	let h = C();
+	return a(() => (r(h), () => r(null)), [h]), /* @__PURE__ */ x(o, {
+		fallback: /* @__PURE__ */ x("div", {
 			className: "p-6 text-center text-text-secondary",
-			children: E("devportal.error.moduleLoadFailed", "Something went wrong loading this module. Please refresh the page.")
+			children: d("devportal.error.moduleLoadFailed", "Something went wrong loading this module. Please refresh the page.")
 		}),
-		children: /* @__PURE__ */ y(b, {
+		children: /* @__PURE__ */ x(S, {
 			workspaceId: null,
 			gateway: "global",
 			defaultEnabled: !0,
-			children: /* @__PURE__ */ y(e, {
-				...S,
-				children: /* @__PURE__ */ y(n, {})
+			children: /* @__PURE__ */ x(e, {
+				...s,
+				children: /* @__PURE__ */ x(n, {})
 			})
 		})
 	});
 };
-export { S as DevportalRoot };
+export { D as DevportalRoot };
 
 //# sourceMappingURL=DevportalRoot.js.map

package/dist/devportal/DevportalRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"DevportalRoot.js","names":["DevportalRoot","props","tr","useTr","joinPath","base","path","useEffect","registerNavItems","devportalNavItem","basePath","Code2","LayoutDashboard","Building2","AppWindow","Blocks","Shield","Key","Webhook","BarChart3","DollarSign","BookOpen","Wrench","Settings","registerFooterItems","footerItems","reg","sharedBus","useEventBus","setDevportalEventBusBridge","ErrorBoundary","FeatureFlagProvider","DevportalProvider","DevportalRoutes"],"sources":["../../src/devportal/DevportalRoot.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect } from \"react\";\nimport { ErrorBoundary } from \"@burdenoff/fe-libs/shared/components\";\nimport {\n  Code2,\n  LayoutDashboard,\n  Building2,\n  AppWindow,\n  Blocks,\n  BookOpen,\n  Settings,\n  Webhook,\n  Key,\n  Shield,\n  BarChart3,\n  DollarSign,\n  Wrench,\n} from \"lucide-react\";\nimport { DevportalProvider } from \"./providers/DevportalProvider\";\nimport { FeatureFlagProvider } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { useEventBus } from \"@burdenoff/fe-libs/shared/events\";\nimport { useTr } from \"./utils/i18n\";\nimport type { NavItem, DevportalRootProps } from \"./types\";\nimport { DevportalRoutes } from \"./DevportalRoutes\";\nimport { setDevportalEventBusBridge } from \"./events\";\n\n/**\n * Root component for the Developer Portal microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { DevportalRoot, type DevportalRootProps } from '@burdenoff/microfe-devportal';\n *\n * function App() {\n *   const props: DevportalRootProps = {\n *     basePath: '/devportal',\n *     navigate: (path) => router.push(path),\n *     currentUser: { id: '1', email: 'user@example.com' },\n *     tenantId: 'tenant-123',\n *     apiGatewayUrl: 'https://api.example.com',\n *     authToken: 'token',\n *   };\n *\n *   return <DevportalRoot {...props} />;\n * }\n * ```\n */\nexport const DevportalRoot: FC<DevportalRootProps> = (props) => {\n  const { registerNavItems, registerFooterItems, basePath = \"/\" } = props;\n  const tr = useTr();\n\n  // Helper to join paths correctly, avoiding double slashes\n  const 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  // Register navigation items with the shell\n  useEffect(() => {\n    if (!registerNavItems) return;\n\n    // Create a parent \"Developer Portal\" item with children for dropdown behavior\n    const devportalNavItem: NavItem = {\n      id: \"devportal\",\n      label: tr(\"devportal.developerPortal\", \"Developer Portal\"),\n      path: basePath,\n      icon: <Code2 size={20} />,\n      order: 75,\n      group: \"global\",\n      children: [\n        {\n          id: \"devportal-dashboard\",\n          label: tr(\"devportal.dashboard\", \"Dashboard\"),\n          path: basePath,\n          icon: <LayoutDashboard size={16} />,\n          order: 10,\n        },\n        {\n          id: \"devportal-organizations\",\n          label: tr(\"devportal.organizations\", \"Organizations\"),\n          path: joinPath(basePath, \"organizations\"),\n          icon: <Building2 size={16} />,\n          order: 20,\n        },\n        {\n          id: \"devportal-apps\",\n          label: tr(\"devportal.myApps\", \"My Apps\"),\n          path: joinPath(basePath, \"apps\"),\n          icon: <AppWindow size={16} />,\n          order: 30,\n        },\n        {\n          // TimeCampus applets (BOFF-11005): the third-party applet developer\n          // flow for the active workspace.\n          id: \"devportal-timecampus-applets\",\n          label: tr(\"devportal.nav.timecampusApplets\", \"TimeCampus Applets\"),\n          path: joinPath(basePath, \"timecampus-applets\"),\n          icon: <Blocks size={16} />,\n          order: 35,\n        },\n        {\n          id: \"devportal-oauth\",\n          label: tr(\"devportal.oauthClients\", \"OAuth Clients\"),\n          path: joinPath(basePath, \"oauth\"),\n          icon: <Shield size={16} />,\n          order: 40,\n        },\n        {\n          id: \"devportal-api-keys\",\n          label: tr(\"devportal.apiKeys\", \"API Keys\"),\n          path: joinPath(basePath, \"api-keys\"),\n          icon: <Key size={16} />,\n          order: 50,\n        },\n        {\n          id: \"devportal-webhooks\",\n          label: tr(\"devportal.webhooks\", \"Webhooks\"),\n          path: joinPath(basePath, \"webhooks\"),\n          icon: <Webhook size={16} />,\n          order: 60,\n        },\n        {\n          id: \"devportal-analytics\",\n          label: tr(\"devportal.analytics\", \"Analytics\"),\n          path: joinPath(basePath, \"analytics\"),\n          icon: <BarChart3 size={16} />,\n          order: 70,\n        },\n        {\n          id: \"devportal-revenue\",\n          label: tr(\"devportal.revenue\", \"Revenue\"),\n          path: \"/billing/earnings\",\n          icon: <DollarSign size={16} />,\n          order: 80,\n        },\n        {\n          id: \"devportal-docs\",\n          label: tr(\"devportal.documentation\", \"Documentation\"),\n          path: joinPath(basePath, \"docs\"),\n          icon: <BookOpen size={16} />,\n          order: 90,\n        },\n        {\n          id: \"devportal-resources\",\n          label: tr(\"devportal.resources\", \"Resources\"),\n          path: joinPath(basePath, \"resources\"),\n          icon: <Wrench size={16} />,\n          order: 100,\n        },\n        {\n          id: \"devportal-settings\",\n          label: tr(\"devportal.settings\", \"Settings\"),\n          path: joinPath(basePath, \"settings\"),\n          icon: <Settings size={16} />,\n          order: 110,\n        },\n      ],\n    };\n\n    // Register and get cleanup function\n    const cleanup = registerNavItems(devportalNavItem);\n\n    // Return cleanup function to unregister on unmount\n    return cleanup;\n  }, [registerNavItems, basePath, tr]);\n\n  // Register footer items\n  useEffect(() => {\n    if (!registerFooterItems) return;\n\n    const footerItems = [\n      {\n        id: \"devportal-status\",\n        label: tr(\"devportal.developerPortalReady\", \"Developer Portal Ready\"),\n        type: \"status\" as const,\n        order: 10,\n        section: \"left\" as const,\n      },\n    ];\n\n    const cleanup = registerFooterItems(footerItems);\n    return cleanup;\n  }, [registerFooterItems, tr]);\n\n  // Register static breadcrumb labels for URL segments that need pretty names.\n  // The AutoBreadcrumbs component reads window.__breadcrumbRegistry for all\n  // segments (not just UUIDs), so segments like 'oauth' and 'api-keys' get\n  // human-readable labels instead of the auto-cased URL segment.\n  useEffect(() => {\n    const reg = (\n      window as unknown as {\n        __breadcrumbRegistry?: {\n          register: (id: string, name: string) => void;\n          unregister: (id: string) => void;\n        };\n      }\n    ).__breadcrumbRegistry;\n    if (!reg) return;\n    reg.register(\"oauth\", tr(\"devportal.nav.oauth\", \"OAuth Clients\"));\n    reg.register(\"api-keys\", tr(\"devportal.nav.apiKeys\", \"API Keys\"));\n    return () => {\n      reg.unregister(\"oauth\");\n      reg.unregister(\"api-keys\");\n    };\n  }, [tr]);\n\n  // Bridge fe-libs event bus -> devportal event bus so MFE pages can emit\n  // domain events (`devportal.app.created`, etc.) and the shell sinks\n  // (RybbitSink / BackendAuditSink / OtelBrowserSink) consume them centrally.\n  // Per memory rule + spec 47: MFEs must not call Rybbit/OTel/fetch directly.\n  const sharedBus = useEventBus();\n  useEffect(() => {\n    setDevportalEventBusBridge(\n      sharedBus as unknown as { emit: (n: string, p: unknown) => void },\n    );\n    return () => setDevportalEventBusBridge(null);\n  }, [sharedBus]);\n\n  // NOTE: When running in the shell (workspaces-app), the shell's MultiGatewayProvider\n  // already provides an ApolloProvider via GatewayRoute. The devportal uses that context.\n  // When running standalone, the main.tsx wraps with DevPortalProvider (ApolloProvider).\n  return (\n    <ErrorBoundary\n      fallback={\n        <div className=\"p-6 text-center text-text-secondary\">\n          {tr(\n            \"devportal.error.moduleLoadFailed\",\n            \"Something went wrong loading this module. Please refresh the page.\",\n          )}\n        </div>\n      }\n    >\n      <FeatureFlagProvider\n        workspaceId={null}\n        gateway=\"global\"\n        defaultEnabled={true}\n      >\n        <DevportalProvider {...props}>\n          <DevportalRoutes />\n        </DevportalProvider>\n      </FeatureFlagProvider>\n    </ErrorBoundary>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAmDA,IAAaA,KAAyC,MAAU;CAC9D,IAAM,EAAE,qBAAkB,wBAAqB,cAAW,QAAQC,GAC5DC,IAAKC,EAAM,GAGXC,KAAY,GAAc,OACZC,EAAK,SAAS,GAAG,IAAIA,EAAK,MAAM,GAAG,EAAE,IAAIA,MACzCC,EAAK,WAAW,GAAG,IAAIA,IAAO,IAAIA;CAuItD,AAlIAC,QAAgB;EACd,IAAI,CAACC,GAAkB;EAGvB,IAAMC,IAA4B;GAChC,IAAI;GACJ,OAAOP,EAAG,6BAA6B,kBAAkB;GACzD,MAAMQ;GACN,MAAM,kBAACC,GAAD,EAAO,MAAM,GAAK,CAAA;GACxB,OAAO;GACP,OAAO;GACP,UAAU;IACR;KACE,IAAI;KACJ,OAAOT,EAAG,uBAAuB,WAAW;KAC5C,MAAMQ;KACN,MAAM,kBAACE,GAAD,EAAiB,MAAM,GAAK,CAAA;KAClC,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOV,EAAG,2BAA2B,eAAe;KACpD,MAAME,EAASM,GAAU,eAAe;KACxC,MAAM,kBAACG,GAAD,EAAW,MAAM,GAAK,CAAA;KAC5B,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOX,EAAG,oBAAoB,SAAS;KACvC,MAAME,EAASM,GAAU,MAAM;KAC/B,MAAM,kBAACI,GAAD,EAAW,MAAM,GAAK,CAAA;KAC5B,OAAO;IACT;IACA;KAGE,IAAI;KACJ,OAAOZ,EAAG,mCAAmC,oBAAoB;KACjE,MAAME,EAASM,GAAU,oBAAoB;KAC7C,MAAM,kBAACK,GAAD,EAAQ,MAAM,GAAK,CAAA;KACzB,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOb,EAAG,0BAA0B,eAAe;KACnD,MAAME,EAASM,GAAU,OAAO;KAChC,MAAM,kBAACM,GAAD,EAAQ,MAAM,GAAK,CAAA;KACzB,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOd,EAAG,qBAAqB,UAAU;KACzC,MAAME,EAASM,GAAU,UAAU;KACnC,MAAM,kBAACO,GAAD,EAAK,MAAM,GAAK,CAAA;KACtB,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOf,EAAG,sBAAsB,UAAU;KAC1C,MAAME,EAASM,GAAU,UAAU;KACnC,MAAM,kBAACQ,GAAD,EAAS,MAAM,GAAK,CAAA;KAC1B,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOhB,EAAG,uBAAuB,WAAW;KAC5C,MAAME,EAASM,GAAU,WAAW;KACpC,MAAM,kBAACS,GAAD,EAAW,MAAM,GAAK,CAAA;KAC5B,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOjB,EAAG,qBAAqB,SAAS;KACxC,MAAM;KACN,MAAM,kBAACkB,GAAD,EAAY,MAAM,GAAK,CAAA;KAC7B,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOlB,EAAG,2BAA2B,eAAe;KACpD,MAAME,EAASM,GAAU,MAAM;KAC/B,MAAM,kBAACW,GAAD,EAAU,MAAM,GAAK,CAAA;KAC3B,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOnB,EAAG,uBAAuB,WAAW;KAC5C,MAAME,EAASM,GAAU,WAAW;KACpC,MAAM,kBAACY,GAAD,EAAQ,MAAM,GAAK,CAAA;KACzB,OAAO;IACT;IACA;KACE,IAAI;KACJ,OAAOpB,EAAG,sBAAsB,UAAU;KAC1C,MAAME,EAASM,GAAU,UAAU;KACnC,MAAM,kBAACa,GAAD,EAAU,MAAM,GAAK,CAAA;KAC3B,OAAO;IACT;GACF;EACF;EAMA,OAHgBf,EAAiBC,CAG1B;CACT,GAAG;EAACD;EAAkBE;EAAUR;CAAE,CAAC,GAGnCK,QAAgB;EACd,IAAI,CAACiB,GAAqB;EAE1B,IAAMC,IAAc,CAClB;GACE,IAAI;GACJ,OAAOvB,EAAG,kCAAkC,wBAAwB;GACpE,MAAM;GACN,OAAO;GACP,SAAS;EACX,CACF;EAGA,OADgBsB,EAAoBC,CAC7B;CACT,GAAG,CAACD,GAAqBtB,CAAE,CAAC,GAM5BK,QAAgB;EACd,IAAMmB,IACJ,OAMA;EACF,IAAKA,GAGL,OAFAA,EAAI,SAAS,SAASxB,EAAG,uBAAuB,eAAe,CAAC,GAChEwB,EAAI,SAAS,YAAYxB,EAAG,yBAAyB,UAAU,CAAC,SACnD;GAEX,AADAwB,EAAI,WAAW,OAAO,GACtBA,EAAI,WAAW,UAAU;EAC3B;CACF,GAAG,CAACxB,CAAE,CAAC;CAMP,IAAMyB,IAAYC,EAAY;CAW9B,OAVArB,SACEsB,EACEF,CACF,SACaE,EAA2B,IAAI,IAC3C,CAACF,CAAS,CAAC,GAMZ,kBAACG,GAAD;EACE,UACE,kBAAC,OAAD;GAAK,WAAU;GACZ,UAAA5B,EACC,oCACA,oEACF;EACG,CAAA;EAGP,UAAA,kBAAC6B,GAAD;GACE,aAAa;GACb,SAAQ;GACR,gBAAgB;GAEhB,UAAA,kBAACC,GAAD;IAAmB,GAAI/B;IACrB,UAAA,kBAACgC,GAAD,CAAkB,CAAA;GACD,CAAA;EACA,CAAA;CACR,CAAA;AAEnB"}
+{"version":3,"file":"DevportalRoot.js","names":["MENU_ICONS","LayoutDashboard","Building2","AppWindow","Blocks","Shield","Key","Webhook","BarChart3","DollarSign","BookOpen","Wrench","Settings","UserCircle","MenuIcon","Icon","id","Code2","DevportalRoot","props","tr","useTr","isFluidgrids","joinPath","base","path","useEffect","registerNavItems","devportalNavItem","basePath","getMenuEntries","entry","registerFooterItems","footerItems","reg","sharedBus","useEventBus","setDevportalEventBusBridge","ErrorBoundary","FeatureFlagProvider","DevportalProvider","DevportalRoutes"],"sources":["../../src/devportal/DevportalRoot.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect } from \"react\";\nimport { ErrorBoundary } from \"@burdenoff/fe-libs/shared/components\";\nimport {\n  Code2,\n  LayoutDashboard,\n  Building2,\n  AppWindow,\n  Blocks,\n  BookOpen,\n  Settings,\n  Webhook,\n  Key,\n  Shield,\n  BarChart3,\n  DollarSign,\n  Wrench,\n  UserCircle,\n} from \"lucide-react\";\nimport { DevportalProvider } from \"./providers/DevportalProvider\";\nimport { FeatureFlagProvider } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { useEventBus } from \"@burdenoff/fe-libs/shared/events\";\nimport { useHeadingDocumentTitle } from \"@burdenoff/fe-libs/ui\";\nimport { useTr } from \"./utils/i18n\";\nimport type { NavItem, DevportalRootProps } from \"./types\";\nimport { DevportalRoutes } from \"./DevportalRoutes\";\nimport { setDevportalEventBusBridge } from \"./events\";\nimport { getMenuEntries } from \"./utils/developerNav\";\n\nconst MENU_ICONS: Record<string, typeof Code2> = {\n  \"devportal-dashboard\": LayoutDashboard,\n  \"devportal-organizations\": Building2,\n  \"devportal-apps\": AppWindow,\n  \"devportal-timecampus-applets\": Blocks,\n  \"devportal-oauth\": Shield,\n  \"devportal-api-keys\": Key,\n  \"devportal-webhooks\": Webhook,\n  \"devportal-analytics\": BarChart3,\n  \"devportal-revenue\": DollarSign,\n  \"devportal-docs\": BookOpen,\n  \"devportal-resources\": Wrench,\n  \"devportal-settings\": Settings,\n  \"devportal-publisher\": UserCircle,\n};\n\nconst MenuIcon: FC<{ id: string }> = ({ id }) => {\n  const Icon = MENU_ICONS[id] ?? Code2;\n  return <Icon size={16} />;\n};\n\n/**\n * Root component for the Developer Portal microfrontend.\n *\n * This is the main entry point that host applications import and render.\n * It sets up the necessary providers and renders the internal routing.\n * Automatically registers navigation items with the shell if registration functions are provided.\n *\n * @example\n * ```tsx\n * import { DevportalRoot, type DevportalRootProps } from '@burdenoff/microfe-devportal';\n *\n * function App() {\n *   const props: DevportalRootProps = {\n *     basePath: '/devportal',\n *     navigate: (path) => router.push(path),\n *     currentUser: { id: '1', email: 'user@example.com' },\n *     tenantId: 'tenant-123',\n *     apiGatewayUrl: 'https://api.example.com',\n *     authToken: 'token',\n *   };\n *\n *   return <DevportalRoot {...props} />;\n * }\n * ```\n */\nexport const DevportalRoot: FC<DevportalRootProps> = (props) => {\n  const { registerNavItems, registerFooterItems, basePath = \"/\" } = props;\n  const tr = useTr();\n  const isFluidgrids = props.variant === \"fluidgrids\";\n\n  // FluidGrids only (BOFF-11862, BOFF-11863): each page's browser tab title follows its main heading.\n  useHeadingDocumentTitle({\n    enabled: props.variant === \"fluidgrids\",\n    suffix: \"FluidGrids\",\n  });\n\n  // Helper to join paths correctly, avoiding double slashes\n  const 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  // Register navigation items with the shell\n  useEffect(() => {\n    if (!registerNavItems) return;\n\n    // Create a parent \"Developer Portal\" item with children for dropdown behavior\n    const devportalNavItem: NavItem = {\n      id: \"devportal\",\n      label: tr(\"devportal.developerPortal\", \"Developer Portal\"),\n      path: basePath,\n      icon: <Code2 size={20} />,\n      order: 75,\n      group: \"global\",\n      children: getMenuEntries(isFluidgrids).map((entry) => ({\n        id: entry.id,\n        label: tr(entry.i18nKey, entry.fallback),\n        path: entry.absolutePath\n          ? entry.absolutePath\n          : entry.path\n            ? joinPath(basePath, entry.path)\n            : basePath,\n        icon: <MenuIcon id={entry.id} />,\n        order: entry.order,\n      })),\n    };\n\n    // Register and get cleanup function\n    const cleanup = registerNavItems(devportalNavItem);\n\n    // Return cleanup function to unregister on unmount\n    return cleanup;\n  }, [registerNavItems, basePath, tr, isFluidgrids]);\n\n  // Register footer items\n  useEffect(() => {\n    if (!registerFooterItems) return;\n\n    const footerItems = [\n      {\n        id: \"devportal-status\",\n        label: tr(\"devportal.developerPortalReady\", \"Developer Portal Ready\"),\n        type: \"status\" as const,\n        order: 10,\n        section: \"left\" as const,\n      },\n    ];\n\n    const cleanup = registerFooterItems(footerItems);\n    return cleanup;\n  }, [registerFooterItems, tr]);\n\n  // Register static breadcrumb labels for URL segments that need pretty names.\n  // The AutoBreadcrumbs component reads window.__breadcrumbRegistry for all\n  // segments (not just UUIDs), so segments like 'oauth' and 'api-keys' get\n  // human-readable labels instead of the auto-cased URL segment.\n  useEffect(() => {\n    const reg = (\n      window as unknown as {\n        __breadcrumbRegistry?: {\n          register: (id: string, name: string) => void;\n          unregister: (id: string) => void;\n        };\n      }\n    ).__breadcrumbRegistry;\n    if (!reg) return;\n    reg.register(\n      \"oauth\",\n      isFluidgrids\n        ? tr(\"devportal.nav.oauthApps\", \"OAuth apps\")\n        : tr(\"devportal.nav.oauth\", \"OAuth Clients\"),\n    );\n    reg.register(\"api-keys\", tr(\"devportal.nav.apiKeys\", \"API Keys\"));\n    return () => {\n      reg.unregister(\"oauth\");\n      reg.unregister(\"api-keys\");\n    };\n  }, [tr, isFluidgrids]);\n\n  // Bridge fe-libs event bus -> devportal event bus so MFE pages can emit\n  // domain events (`devportal.app.created`, etc.) and the shell sinks\n  // (RybbitSink / BackendAuditSink / OtelBrowserSink) consume them centrally.\n  // Per memory rule + spec 47: MFEs must not call Rybbit/OTel/fetch directly.\n  const sharedBus = useEventBus();\n  useEffect(() => {\n    setDevportalEventBusBridge(\n      sharedBus as unknown as { emit: (n: string, p: unknown) => void },\n    );\n    return () => setDevportalEventBusBridge(null);\n  }, [sharedBus]);\n\n  // NOTE: When running in the shell (workspaces-app), the shell's MultiGatewayProvider\n  // already provides an ApolloProvider via GatewayRoute. The devportal uses that context.\n  // When running standalone, the main.tsx wraps with DevPortalProvider (ApolloProvider).\n  return (\n    <ErrorBoundary\n      fallback={\n        <div className=\"p-6 text-center text-text-secondary\">\n          {tr(\n            \"devportal.error.moduleLoadFailed\",\n            \"Something went wrong loading this module. Please refresh the page.\",\n          )}\n        </div>\n      }\n    >\n      <FeatureFlagProvider\n        workspaceId={null}\n        gateway=\"global\"\n        defaultEnabled={true}\n      >\n        <DevportalProvider {...props}>\n          <DevportalRoutes />\n        </DevportalProvider>\n      </FeatureFlagProvider>\n    </ErrorBoundary>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AA6BA,IAAMA,IAA2C;CAC/C,uBAAuBC;CACvB,2BAA2BC;CAC3B,kBAAkBC;CAClB,gCAAgCC;CAChC,mBAAmBC;CACnB,sBAAsBC;CACtB,sBAAsBC;CACtB,uBAAuBC;CACvB,qBAAqBC;CACrB,kBAAkBC;CAClB,uBAAuBC;CACvB,sBAAsBC;CACtB,uBAAuBC;AACzB,GAEMC,KAAgC,EAAE,YAAS;CAC/C,IAAMC,IAAOf,EAAWgB,MAAOC;CAC/B,OAAO,kBAACF,GAAD,EAAM,MAAM,GAAK,CAAA;AAC1B,GA2BaG,KAAyC,MAAU;CAC9D,IAAM,EAAE,qBAAkB,wBAAqB,cAAW,QAAQC,GAC5DC,IAAKC,EAAM,GACXC,IAAeH,EAAM,YAAY;CAGvC,EAAwB;EACtB,SAASA,EAAM,YAAY;EAC3B,QAAQ;CACV,CAAC;CAGD,IAAMI,KAAY,GAAc,OACZC,EAAK,SAAS,GAAG,IAAIA,EAAK,MAAM,GAAG,EAAE,IAAIA,MACzCC,EAAK,WAAW,GAAG,IAAIA,IAAO,IAAIA;CA0DtD,AArDAC,QAAgB;EACd,IAAI,CAACC,GAAkB;EAGvB,IAAMC,IAA4B;GAChC,IAAI;GACJ,OAAOR,EAAG,6BAA6B,kBAAkB;GACzD,MAAMS;GACN,MAAM,kBAACZ,GAAD,EAAO,MAAM,GAAK,CAAA;GACxB,OAAO;GACP,OAAO;GACP,UAAUa,EAAeR,CAAY,CAAC,CAAC,KAAK,OAAW;IACrD,IAAIS,EAAM;IACV,OAAOX,EAAGW,EAAM,SAASA,EAAM,QAAQ;IACvC,MAAMA,EAAM,eACRA,EAAM,eACNA,EAAM,OACJR,EAASM,GAAUE,EAAM,IAAI,IAC7BF;IACN,MAAM,kBAACf,GAAD,EAAU,IAAIiB,EAAM,GAAK,CAAA;IAC/B,OAAOA,EAAM;GACf,EAAE;EACJ;EAMA,OAHgBJ,EAAiBC,CAG1B;CACT,GAAG;EAACD;EAAkBE;EAAUT;EAAIE;CAAY,CAAC,GAGjDI,QAAgB;EACd,IAAI,CAACM,GAAqB;EAE1B,IAAMC,IAAc,CAClB;GACE,IAAI;GACJ,OAAOb,EAAG,kCAAkC,wBAAwB;GACpE,MAAM;GACN,OAAO;GACP,SAAS;EACX,CACF;EAGA,OADgBY,EAAoBC,CAC7B;CACT,GAAG,CAACD,GAAqBZ,CAAE,CAAC,GAM5BM,QAAgB;EACd,IAAMQ,IACJ,OAMA;EACF,IAAKA,GAQL,OAPAA,EAAI,SACF,SACAZ,IACIF,EAAG,2BAA2B,YAAY,IAC1CA,EAAG,uBAAuB,eAAe,CAC/C,GACAc,EAAI,SAAS,YAAYd,EAAG,yBAAyB,UAAU,CAAC,SACnD;GAEX,AADAc,EAAI,WAAW,OAAO,GACtBA,EAAI,WAAW,UAAU;EAC3B;CACF,GAAG,CAACd,GAAIE,CAAY,CAAC;CAMrB,IAAMa,IAAYC,EAAY;CAW9B,OAVAV,SACEW,EACEF,CACF,SACaE,EAA2B,IAAI,IAC3C,CAACF,CAAS,CAAC,GAMZ,kBAACG,GAAD;EACE,UACE,kBAAC,OAAD;GAAK,WAAU;GACZ,UAAAlB,EACC,oCACA,oEACF;EACG,CAAA;EAGP,UAAA,kBAACmB,GAAD;GACE,aAAa;GACb,SAAQ;GACR,gBAAgB;GAEhB,UAAA,kBAACC,GAAD;IAAmB,GAAIrB;IACrB,UAAA,kBAACsB,GAAD,CAAkB,CAAA;GACD,CAAA;EACA,CAAA;CACR,CAAA;AAEnB"}

package/dist/devportal/components/AppCard.js

@@ -3,144 +3,147 @@ import { FeaturedBadge as t, StatusBadge as n, VerifiedBadge as r } from "./Stat
 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 { StoreImage as s } from "./StoreImage.js";
+import { AppWindow as c, Download as l, ExternalLink as u, Star as d } from "lucide-react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 import { GlassCard as m } from "@burdenoff/fe-libs/ui";
+import { useI18n as h } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 // 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 } = a(), { t: C } = p(), w = (e, t) => {
-		let n = C(e);
+var g = ({ app: g, onClick: _, className: v, showActions: y = !0, selected: b = !1, onToggleSelect: x }) => {
+	let { navigate: S, basePath: C } = a(), { t: w } = h(), T = (e, t) => {
+		let n = w(e);
 		return n === e ? t : n;
-	}, T = () => {
-		g ? g() : x && x(`${S}/apps/${h.id}`);
+	}, E = () => {
+		_ ? _() : S && S(`${C}/apps/${g.id}`);
 	};
-	return /* @__PURE__ */ f(m, {
+	return /* @__PURE__ */ p(m, {
 		treatment: "insight",
 		role: "button",
 		tabIndex: 0,
-		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,
+		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", b && "border-primary bg-action-primary-bg/5", v),
+		onClick: E,
 		onKeyDown: (e) => {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), T());
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), E());
 		},
 		children: [
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ p("div", {
 				className: "flex items-start gap-3",
 				children: [
-					b && /* @__PURE__ */ d("div", {
+					x && /* @__PURE__ */ f("div", {
 						onClick: (e) => e.stopPropagation(),
-						children: /* @__PURE__ */ d(o, {
-							checked: y,
-							onChange: b,
-							ariaLabel: `Select application ${h.name}`,
+						children: /* @__PURE__ */ f(o, {
+							checked: b,
+							onChange: x,
+							ariaLabel: `Select application ${g.name}`,
 							className: "mt-1"
 						})
 					}),
-					h.iconUrl ? /* @__PURE__ */ d("img", {
-						src: h.iconUrl,
-						alt: h.name,
-						className: "h-12 w-12 rounded-lg object-cover"
-					}) : /* @__PURE__ */ d("div", {
-						className: "flex h-12 w-12 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
-						children: /* @__PURE__ */ d(s, { size: 24 })
+					/* @__PURE__ */ f(s, {
+						src: g.iconUrl,
+						alt: g.name,
+						className: "h-12 w-12 rounded-lg object-cover",
+						fallback: /* @__PURE__ */ f("div", {
+							className: "flex h-12 w-12 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
+							children: /* @__PURE__ */ f(c, { size: 24 })
+						})
 					}),
-					/* @__PURE__ */ f("div", {
+					/* @__PURE__ */ p("div", {
 						className: "flex-1 min-w-0",
-						children: [/* @__PURE__ */ f("div", {
+						children: [/* @__PURE__ */ p("div", {
 							className: "flex items-center gap-2",
-							children: [/* @__PURE__ */ d("h3", {
+							children: [/* @__PURE__ */ f("h3", {
 								className: "font-semibold truncate",
-								children: h.name
-							}), h.isVerified && /* @__PURE__ */ d(r, { verified: !0 })]
-						}), /* @__PURE__ */ d("p", {
+								children: g.name
+							}), g.isVerified && /* @__PURE__ */ f(r, { verified: !0 })]
+						}), /* @__PURE__ */ f("p", {
 							className: "text-sm text-text-secondary",
-							children: i[h.appType] || h.appType
+							children: i[g.appType] || g.appType
 						})]
 					})
 				]
 			}),
-			h.shortDescription && /* @__PURE__ */ d("p", {
+			g.shortDescription && /* @__PURE__ */ f("p", {
 				className: "mt-3 text-sm text-text-secondary line-clamp-2",
-				children: h.shortDescription
+				children: g.shortDescription
 			}),
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ p("div", {
 				className: "mt-3 flex flex-wrap items-center gap-2",
-				children: [/* @__PURE__ */ d(n, { status: h.status }), h.isFeatured && /* @__PURE__ */ d(t, {})]
+				children: [/* @__PURE__ */ f(n, { status: g.status }), g.isFeatured && /* @__PURE__ */ f(t, {})]
 			}),
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ p("div", {
 				className: "mt-4 flex items-center gap-4 text-sm text-text-secondary",
-				children: [h.averageRating !== void 0 && h.averageRating > 0 && /* @__PURE__ */ f("span", {
+				children: [g.averageRating !== void 0 && g.averageRating > 0 && /* @__PURE__ */ p("span", {
 					className: "flex items-center gap-1",
-					children: [/* @__PURE__ */ d(u, {
+					children: [/* @__PURE__ */ f(d, {
 						size: 14,
 						className: "text-status-warning-text fill-status-warning-text"
-					}), h.averageRating.toFixed(1)]
-				}), /* @__PURE__ */ f("span", {
+					}), g.averageRating.toFixed(1)]
+				}), /* @__PURE__ */ p("span", {
 					className: "flex items-center gap-1",
 					children: [
-						/* @__PURE__ */ d(c, { size: 14 }),
-						h.installCount.toLocaleString(),
+						/* @__PURE__ */ f(l, { size: 14 }),
+						g.installCount.toLocaleString(),
 						" ",
-						w("devportal.installs", "installs")
+						T("devportal.installs", "installs")
 					]
 				})]
 			}),
-			v && /* @__PURE__ */ d("div", {
+			y && /* @__PURE__ */ f("div", {
 				className: "mt-4 flex items-center justify-between opacity-0 group-hover:opacity-100 transition-opacity",
-				children: /* @__PURE__ */ f("button", {
+				children: /* @__PURE__ */ p("button", {
 					className: "text-sm text-primary hover:underline flex items-center gap-1",
 					onClick: (e) => {
-						e.stopPropagation(), T();
+						e.stopPropagation(), E();
 					},
-					children: [w("devportal.viewDetails", "View Details"), /* @__PURE__ */ d(l, { size: 14 })]
+					children: [T("devportal.viewDetails", "View Details"), /* @__PURE__ */ f(u, { size: 14 })]
 				})
 			})
 		]
 	});
-}, 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}`);
+}, _ = ({ app: t, onClick: r, className: l, selected: u = !1, onToggleSelect: d }) => {
+	let { navigate: m, basePath: h } = a(), g = () => {
+		r ? r() : m && m(`${h}/apps/${t.id}`);
 	};
-	return /* @__PURE__ */ f("div", {
+	return /* @__PURE__ */ p("div", {
 		role: "button",
 		tabIndex: 0,
-		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,
+		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", u && "border-primary bg-action-primary-bg/5", l),
+		onClick: g,
 		onKeyDown: (e) => {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), h());
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), g());
 		},
 		children: [
-			u && /* @__PURE__ */ d("div", {
+			d && /* @__PURE__ */ f("div", {
 				onClick: (e) => e.stopPropagation(),
-				children: /* @__PURE__ */ d(o, {
-					checked: l,
-					onChange: u,
+				children: /* @__PURE__ */ f(o, {
+					checked: u,
+					onChange: d,
 					ariaLabel: `Select application ${t.name}`
 				})
 			}),
-			t.iconUrl ? /* @__PURE__ */ d("img", {
+			/* @__PURE__ */ f(s, {
 				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",
-				children: /* @__PURE__ */ d(s, { size: 20 })
+				className: "h-10 w-10 rounded-lg object-cover",
+				fallback: /* @__PURE__ */ f("div", {
+					className: "flex h-10 w-10 items-center justify-center rounded-lg bg-action-primary-bg/10 text-primary",
+					children: /* @__PURE__ */ f(c, { size: 20 })
+				})
 			}),
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ p("div", {
 				className: "flex-1 min-w-0",
-				children: [/* @__PURE__ */ d("p", {
+				children: [/* @__PURE__ */ f("p", {
 					className: "font-medium truncate",
 					children: t.name
-				}), /* @__PURE__ */ d("p", {
+				}), /* @__PURE__ */ f("p", {
 					className: "text-sm text-text-secondary truncate",
 					children: t.shortDescription || i[t.appType]
 				})]
 			}),
-			/* @__PURE__ */ d(n, { status: t.status })
+			/* @__PURE__ */ f(n, { status: t.status })
 		]
 	});
 };
-export { h as AppCard, g as AppListItem };
+export { g as AppCard, _ as AppListItem };
 
 //# sourceMappingURL=AppCard.js.map

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

@@ -1 +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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"}
+{"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","StoreImage","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\";\nimport { StoreImage } from \"./StoreImage\";\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        <StoreImage\n          src={app.iconUrl}\n          alt={app.name}\n          className=\"h-12 w-12 rounded-lg object-cover\"\n          fallback={\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        />\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      <StoreImage\n        src={app.iconUrl}\n        alt={app.name}\n        className=\"h-10 w-10 rounded-lg object-cover\"\n        fallback={\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      />\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/DeveloperSettingsHub.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+/**
+ * FluidGrids only: the single home for the rarer developer pages. Each card
+ * opens the page it names; the old URLs keep working.
+ */
+export declare const DeveloperSettingsHub: FC;

package/dist/devportal/components/DeveloperSettingsHub.js

@@ -0,0 +1,59 @@
+import { useDevportal as e } from "../providers/DevportalProvider.js";
+import { useTr as t } from "../utils/i18n.js";
+import { DEVELOPER_SETTINGS_ENTRIES as n, resolveEntryPath as r } from "../utils/developerNav.js";
+import { BarChart3 as i, BookOpen as a, ChevronRight as o, FileClock as s, KeyRound as c, Share2 as l, Shield as u, Webhook as d } from "lucide-react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+// src/devportal/components/DeveloperSettingsHub.tsx
+var m = {
+	"api-keys": c,
+	oauth: u,
+	webhooks: d,
+	delegations: l,
+	"app-logs": s,
+	analytics: i,
+	docs: a
+}, h = () => {
+	let { navigate: i, basePath: a } = e(), s = t();
+	return /* @__PURE__ */ f("nav", {
+		"aria-label": s("devportal.developerSettings.title", "Developer settings"),
+		"data-testid": "developer-settings-hub",
+		children: /* @__PURE__ */ f("ul", {
+			className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
+			children: n.map((e) => {
+				let t = m[e.id] ?? c;
+				return /* @__PURE__ */ f("li", { children: /* @__PURE__ */ p("button", {
+					type: "button",
+					onClick: () => i?.(r(a, e)),
+					className: "flex h-full w-full items-start gap-3 rounded-card border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
+					children: [
+						/* @__PURE__ */ f("span", {
+							className: "rounded-lg bg-action-primary-bg/10 p-2.5 text-primary",
+							children: /* @__PURE__ */ f(t, {
+								size: 20,
+								"aria-hidden": "true"
+							})
+						}),
+						/* @__PURE__ */ p("span", {
+							className: "flex-1",
+							children: [/* @__PURE__ */ f("span", {
+								className: "block font-medium",
+								children: s(e.titleKey, e.titleFallback)
+							}), /* @__PURE__ */ f("span", {
+								className: "mt-1 block text-sm text-text-secondary",
+								children: s(e.descriptionKey, e.descriptionFallback)
+							})]
+						}),
+						/* @__PURE__ */ f(o, {
+							size: 16,
+							"aria-hidden": "true",
+							className: "mt-1 text-text-secondary"
+						})
+					]
+				}) }, e.id);
+			})
+		})
+	});
+};
+export { h as DeveloperSettingsHub };
+
+//# sourceMappingURL=DeveloperSettingsHub.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DeveloperSettingsHub.js","names":["ICONS","KeyRound","Shield","Webhook","Share2","FileClock","BarChart3","BookOpen","DeveloperSettingsHub","useDevportal","tr","useTr","DEVELOPER_SETTINGS_ENTRIES","Icon","entry","navigate","resolveEntryPath","basePath","ChevronRight"],"sources":["../../../src/devportal/components/DeveloperSettingsHub.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport {\n  BarChart3,\n  BookOpen,\n  ChevronRight,\n  FileClock,\n  KeyRound,\n  Share2,\n  Shield,\n  Webhook,\n} from \"lucide-react\";\nimport { useDevportal } from \"../providers/DevportalProvider\";\nimport { useTr } from \"../utils/i18n\";\nimport {\n  DEVELOPER_SETTINGS_ENTRIES,\n  resolveEntryPath,\n} from \"../utils/developerNav\";\n\nconst ICONS: Record<string, typeof KeyRound> = {\n  \"api-keys\": KeyRound,\n  oauth: Shield,\n  webhooks: Webhook,\n  delegations: Share2,\n  \"app-logs\": FileClock,\n  analytics: BarChart3,\n  docs: BookOpen,\n};\n\n/**\n * FluidGrids only: the single home for the rarer developer pages. Each card\n * opens the page it names; the old URLs keep working.\n */\nexport const DeveloperSettingsHub: FC = () => {\n  const { navigate, basePath } = useDevportal();\n  const tr = useTr();\n\n  return (\n    <nav\n      aria-label={tr(\"devportal.developerSettings.title\", \"Developer settings\")}\n      data-testid=\"developer-settings-hub\"\n    >\n      <ul className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n        {DEVELOPER_SETTINGS_ENTRIES.map((entry) => {\n          const Icon = ICONS[entry.id] ?? KeyRound;\n          return (\n            <li key={entry.id}>\n              <button\n                type=\"button\"\n                onClick={() => navigate?.(resolveEntryPath(basePath, entry))}\n                className=\"flex h-full w-full items-start gap-3 rounded-card border border-border-seam bg-bg-surface p-4 text-left transition-colors hover:bg-accent focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n              >\n                <span className=\"rounded-lg bg-action-primary-bg/10 p-2.5 text-primary\">\n                  <Icon size={20} aria-hidden=\"true\" />\n                </span>\n                <span className=\"flex-1\">\n                  <span className=\"block font-medium\">\n                    {tr(entry.titleKey, entry.titleFallback)}\n                  </span>\n                  <span className=\"mt-1 block text-sm text-text-secondary\">\n                    {tr(entry.descriptionKey, entry.descriptionFallback)}\n                  </span>\n                </span>\n                <ChevronRight\n                  size={16}\n                  aria-hidden=\"true\"\n                  className=\"mt-1 text-text-secondary\"\n                />\n              </button>\n            </li>\n          );\n        })}\n      </ul>\n    </nav>\n  );\n};\n"],"mappings":";;;;;;AAkBA,IAAMA,IAAyC;CAC7C,YAAYC;CACZ,OAAOC;CACP,UAAUC;CACV,aAAaC;CACb,YAAYC;CACZ,WAAWC;CACX,MAAMC;AACR,GAMaC,UAAiC;CAC5C,IAAM,EAAE,aAAU,gBAAaC,EAAa,GACtCC,IAAKC,EAAM;CAEjB,OACE,kBAAC,OAAD;EACE,cAAYD,EAAG,qCAAqC,oBAAoB;EACxE,eAAY;EAEZ,UAAA,kBAAC,MAAD;GAAI,WAAU;GACX,UAAAE,EAA2B,KAAK,MAAU;IACzC,IAAMC,IAAOb,EAAMc,EAAM,OAAOb;IAChC,OACE,kBAAC,MAAD,EAAA,UACE,kBAAC,UAAD;KACE,MAAK;KACL,eAAec,IAAWC,EAAiBC,GAAUH,CAAK,CAAC;KAC3D,WAAU;KAHZ,UAAA;MAKE,kBAAC,QAAD;OAAM,WAAU;OACd,UAAA,kBAACD,GAAD;QAAM,MAAM;QAAI,eAAY;OAAQ,CAAA;MAChC,CAAA;MACN,kBAAC,QAAD;OAAM,WAAU;OAAhB,UAAA,CACE,kBAAC,QAAD;QAAM,WAAU;QACb,UAAAH,EAAGI,EAAM,UAAUA,EAAM,aAAa;OACnC,CAAA,GACN,kBAAC,QAAD;QAAM,WAAU;QACb,UAAAJ,EAAGI,EAAM,gBAAgBA,EAAM,mBAAmB;OAC/C,CAAA,CACF;;MACN,kBAACI,GAAD;OACE,MAAM;OACN,eAAY;OACZ,WAAU;MACX,CAAA;KACK;IACN,CAAA,EAAA,GAvBKJ,EAAM,EAuBX;GAER,CAAC;EACC,CAAA;CACD,CAAA;AAET"}