@campfire-interactive/shell-header 0.8.10 → 0.8.13

package/dist/index.d.ts

@@ -21,12 +21,16 @@ interface AppDefinition {
      */
     byline?: string;
     /**
-     * Which launcher section the app appears under. `'apps'` (default) is the
-     * user's product apps; `'admin'` groups admin surfaces (Master Data, User
-     * Management) into a separate section that the launcher hides entirely when
-     * the user can see none of them. Launcher-only.
+     * Which launcher section the app appears under, by persona. Product apps use
+     * a persona group (`'sales'` / `'sourcing'` / `'planning'` / `'engineering'`);
+     * `'admin'` groups admin surfaces (Master Data, User Management) — the
+     * launcher hides that section entirely when the user can see none of them, and
+     * the AppSwitcher pins admin apps to the end. `'apps'` is the legacy/default
+     * bucket for anything untagged. Launcher renders one section per group, in
+     * the launcher's defined group order; the AppSwitcher renders in catalog
+     * array order (non-admin, then admin).
      */
-    group?: 'apps' | 'admin';
+    group?: 'apps' | 'sales' | 'sourcing' | 'planning' | 'engineering' | 'admin';
     /** Local dev port (e.g., 3000). Omit if the app doesn't run locally. */
     localPort?: number;
     /**

package/dist/index.js

@@ -28,6 +28,29 @@ styleInject(".cfi-sh-header {\n  display: flex;\n  align-items: center;\n  heigh
 
 // src/appCatalog.ts
 var appCatalog = [
+  // ── Sales & Commercial ──────────────────────────────────────────────────
+  {
+    id: "omsf",
+    name: "Opportunity Management",
+    icon: "FileText",
+    letter: "O",
+    color: "#0ea5e9",
+    byline: "Automate RFQ intake, submit to OEMs in one click, & quickly handover awards.",
+    group: "sales",
+    localPort: 3500
+  },
+  {
+    id: "cpq",
+    name: "CPQ",
+    fullName: "Cost, Price, Quote",
+    icon: "Calculator",
+    letter: "C",
+    color: "#4f46e5",
+    byline: "Know exactly what products cost & make pricing decisions with confidence.",
+    group: "sales",
+    localPort: 3400
+  },
+  // ── Sourcing & Supply ───────────────────────────────────────────────────
   {
     id: "si",
     name: "Supplier Intelligence",
@@ -35,19 +58,21 @@ var appCatalog = [
     letter: "S",
     color: "#6366f1",
     byline: "Monitor supplier performance and risk across your supply base.",
+    group: "sourcing",
     localPort: 3e3
   },
   {
-    id: "masterdata",
-    name: "Master Data",
-    icon: "Database",
-    letter: "M",
+    id: "pim",
+    name: "Price Index",
+    fullName: "Price Index Management",
+    icon: "BarChart3",
+    letter: "P",
     color: "#f97316",
-    byline: "Define it once, use it everywhere \u2014 the canonical records every app reads from.",
-    group: "admin",
-    requiresRole: ["admin", "owner"],
-    localPort: 3100
+    byline: "Every escalation, automated & accurate. Monitor commodity and material pricing, recover margin when indices move.",
+    group: "sourcing",
+    localPort: 3300
   },
+  // ── Planning ────────────────────────────────────────────────────────────
   {
     id: "forecast",
     name: "Volume Intelligence",
@@ -55,36 +80,32 @@ var appCatalog = [
     letter: "V",
     color: "#10b981",
     byline: "Know what you'll build before you bid. AI-driven production-volume forecasts you can plan revenue and quotes around.",
+    group: "planning",
     localPort: 3200
   },
+  // ── Engineering ─────────────────────────────────────────────────────────
   {
-    id: "pim",
-    name: "Price Index",
-    fullName: "Price Index Management",
-    icon: "BarChart3",
-    letter: "P",
-    color: "#f97316",
-    byline: "Every escalation, automated & accurate. Monitor commodity and material pricing, recover margin when indices move.",
-    localPort: 3300
-  },
-  {
-    id: "cpq",
-    name: "CPQ",
-    fullName: "Cost, Price, Quote",
-    icon: "Calculator",
-    letter: "C",
-    color: "#4f46e5",
-    byline: "Know exactly what products cost & make pricing decisions with confidence.",
-    localPort: 3400
+    id: "bom",
+    name: "BOM",
+    fullName: "BOM Management",
+    icon: "Network",
+    letter: "B",
+    color: "#0d9488",
+    byline: "Control bill of materials and costs across the program lifecycle.",
+    group: "engineering",
+    localPort: 3700
   },
+  // ── Admin (role-gated; pinned to the end of both surfaces) ──────────────
   {
-    id: "omsf",
-    name: "Opportunity Management",
-    icon: "FileText",
-    letter: "O",
-    color: "#0ea5e9",
-    byline: "Automate RFQ intake, submit to OEMs in one click, & quickly handover awards.",
-    localPort: 3500
+    id: "masterdata",
+    name: "Master Data",
+    icon: "Database",
+    letter: "M",
+    color: "#f97316",
+    byline: "Define it once, use it everywhere \u2014 the canonical records every app reads from.",
+    group: "admin",
+    requiresRole: ["admin", "owner"],
+    localPort: 3100
   },
   {
     id: "identity",
@@ -97,16 +118,6 @@ var appCatalog = [
     requiresRole: ["admin", "owner"],
     localPort: 3600,
     path: "/admin/users"
-  },
-  {
-    id: "bom",
-    name: "BOM",
-    fullName: "BOM Management",
-    icon: "Network",
-    letter: "B",
-    color: "#0d9488",
-    byline: "Control bill of materials and costs across the program lifecycle.",
-    localPort: 3700
   }
 ];
 function getAppUrl(app) {
@@ -177,6 +188,10 @@ function AppSwitcher({ currentAppId, authorizedApps, currentTenantRole }) {
   const visibleApps = appCatalog.filter(
     (a) => authorizedApps.includes(a.id) && (!a.requiresRole || currentTenantRole !== void 0 && a.requiresRole.includes(currentTenantRole))
   );
+  const orderedApps = [
+    ...visibleApps.filter((a) => a.group !== "admin"),
+    ...visibleApps.filter((a) => a.group === "admin")
+  ];
   useEffect(() => {
     function handleClickOutside(e) {
       if (ref.current && !ref.current.contains(e.target)) {
@@ -198,7 +213,7 @@ function AppSwitcher({ currentAppId, authorizedApps, currentTenantRole }) {
         children: /* @__PURE__ */ jsx2(GridIcon, { size: 20 })
       }
     ),
-    open && /* @__PURE__ */ jsx2("div", { className: "cfi-sh-app-grid", children: visibleApps.map((app) => {
+    open && /* @__PURE__ */ jsx2("div", { className: "cfi-sh-app-grid", children: orderedApps.map((app) => {
       const Icon = getIcon(app.icon);
       const isCurrent = app.id === currentAppId;
       return /* @__PURE__ */ jsxs2(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@campfire-interactive/shell-header",
-  "version": "0.8.10",
+  "version": "0.8.13",
   "description": "Shared shell header with app switcher for Campfire Suite",
   "type": "module",
   "main": "dist/index.js",