@wildo-ai/presets-components 1.1.4 → 1.1.6

package/dist/esm/components/navigation/app-level/menu-user-org.js

@@ -35,13 +35,19 @@ export const ApplicationLevelPreset_MenuUserOrg_Default = ({ containerType, cont
             return null;
         const hasMultipleOrgs = organizations && organizations.length > 1;
         const orgsLabel = tc('organizations');
+        const ownOrganizations = (organizations ?? []).filter(org => !org.viaProviderOrganizationName);
+        const clientOrganizations = (organizations ?? []).filter(org => Boolean(org.viaProviderOrganizationName));
+        const orgGroups = [
+            { key: 'own', label: orgsLabel, organizations: ownOrganizations },
+            { key: 'clients', label: tc('clientOrganizations'), organizations: clientOrganizations },
+        ].filter(group => group.organizations.length > 0);
         const checkIcon = renderIcon(StandardIconReference.CHECK, { size: IconSize.SM });
         return (_jsxs(_Fragment, { children: [_jsx(Separator, {}), hasMultipleOrgs && showOrgSwitcher && sections.includes(UserDropdownSection.ORG_SWITCHER) ? (
                 /* Multiple orgs — full selectable list */
-                _jsxs("div", { className: "p-item", children: [_jsx("p", { className: "text-xs text-muted-foreground mb-item px-card-sm", children: orgsLabel }), _jsx("div", { className: "space-y-item-xs", children: organizations.map(org => {
-                                const isSelected = org._id === currentOrganization?._id;
-                                return (_jsxs(Button, { "data-component-type": "user-org-menu-option", "data-organization-id": org._id, "data-selected": isSelected ? 'true' : 'false', variant: ButtonVariants_Variant.GHOST, size: ButtonSize.SM, onClick: () => handleSwitchOrg(org._id), className: cn('w-full justify-start text-sm rounded-sm', isSelected && 'bg-primary/10 text-primary hover:bg-primary/15'), children: [_jsx("span", { className: cn('flex-shrink-0', isSelected ? 'text-primary' : 'invisible'), children: checkIcon }), _jsx("span", { className: "truncate", children: org.name })] }, org._id));
-                            }) })] })) : (
+                _jsx("div", { className: "p-item", children: orgGroups.map(group => (_jsxs("div", { className: cn(group.key === 'clients' && 'mt-item'), children: [_jsx("p", { className: "text-xs text-muted-foreground mb-item px-card-sm", children: group.label }), _jsx("div", { className: "space-y-item-xs", children: group.organizations.map(org => {
+                                    const isSelected = org._id === currentOrganization?._id;
+                                    return (_jsxs(Button, { "data-component-type": "user-org-menu-option", "data-organization-id": org._id, "data-selected": isSelected ? 'true' : 'false', variant: ButtonVariants_Variant.GHOST, size: ButtonSize.SM, onClick: () => handleSwitchOrg(org._id), className: cn('w-full justify-start text-sm rounded-sm', isSelected && 'bg-primary/10 text-primary hover:bg-primary/15'), children: [_jsx("span", { className: cn('flex-shrink-0', isSelected ? 'text-primary' : 'invisible'), children: checkIcon }), _jsxs("span", { className: "flex min-w-0 flex-col items-start", children: [_jsx("span", { className: "truncate", children: org.name }), org.viaProviderOrganizationName ? (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: tComponent(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, 'servedViaFirm', { firm: org.viaProviderOrganizationName }) })) : null] })] }, org._id));
+                                }) })] }, group.key))) })) : (
                 /* Single org — non-interactive display */
                 _jsxs("div", { className: "px-card py-card-sm", children: [_jsx("p", { className: "text-xs text-muted-foreground leading-none", children: orgsLabel }), _jsx("p", { className: "text-sm font-medium leading-none mt-element truncate", children: currentOrganization?.name ?? '' })] }))] }));
     };

package/dist/esm/components/navigation/app-level/menu-user-org.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-user-org.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menu-user-org.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EACL,mBAAmB,EACnB,yBAAyB,GAC1B,MAAM,6BAA6B,CAAC;AAErC,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAExF,OAAO,EACL,YAAY,EAAE,mBAAmB,EAAE,mBAAmB,EACtD,MAAM,EAAE,cAAc,EAAE,WAAW,EACnC,MAAM,EAAE,sBAAsB,EAC9B,SAAS,EACT,OAAO,EACP,eAAe,EACf,sBAAsB,EACtB,QAAQ,EAAE,qBAAqB,EAC/B,EAAE,GACH,MAAM,6BAA6B,CAAC;AAIrC,MAAM,CAAC,MAAM,0CAA0C,GAAgD,CAAC,EACtG,aAAa,EACb,kBAAkB,GACnB,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,sBAAsB,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAC;IAC3E,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,EAAE,SAAS,EAAE,qBAAqB,CAAC,+BAA+B,EAAE,CAAC,CAAC;IAC9G,MAAM,EAAE,UAAU,EAAE,GAAG,eAAe,EAAE,CAAC;IAEzC,MAAM,EACJ,MAAM,EACN,SAAS,EACT,mBAAmB,EACnB,YAAY,EACZ,WAAW,EACX,KAAK,EACL,SAAS,EACT,mBAAmB,EACnB,aAAa,EACb,QAAQ,EACR,aAAa,EACb,eAAe,EACf,UAAU,EACV,cAAc,EACd,eAAe,EACf,cAAc,EACd,YAAY,EACZ,eAAe,EACf,8BAA8B,GAC/B,GAAG,QAAQ,CAAC;IAEb,MAAM,EAAE,GAAG,WAAW,CACpB,CAAC,GAAW,EAAE,EAAE,CAAC,UAAU,CAAC,qBAAqB,CAAC,+BAA+B,EAAE,GAAG,CAAC,EACvF,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,sEAAsE;IACtE,iBAAiB;IACjB,sEAAsE;IAEtE,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAEhC,QAAQ,aAAa,EAAE,CAAC;YACtB,KAAK,yBAAyB,CAAC,WAAW;gBACxC,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,MAAC,MAAM,IAAC,SAAS,EAAC,SAAS,aACzB,KAAC,WAAW,IAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,GAAI,EACjD,KAAC,cAAc,IAAC,SAAS,EAAC,SAAS,YAAE,YAAY,GAAkB,IAC5D,EACT,eAAM,SAAS,EAAC,4CAA4C,YAAE,WAAW,GAAQ,IAC7E,CACP,CAAC;YACJ,KAAK,yBAAyB,CAAC,UAAU;gBACvC,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,MAAC,MAAM,IAAC,SAAS,EAAC,SAAS,aACzB,KAAC,WAAW,IAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,GAAI,EACjD,KAAC,cAAc,IAAC,SAAS,EAAC,SAAS,YAAE,YAAY,GAAkB,IAC5D,EACT,eAAM,SAAS,EAAC,4CAA4C,YACzD,mBAAmB,EAAE,IAAI,IAAI,WAAW,GACpC,IACH,CACP,CAAC;YACJ,KAAK,yBAAyB,CAAC,IAAI;gBACjC,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,MAAC,MAAM,IAAC,SAAS,EAAC,SAAS,aACzB,KAAC,WAAW,IAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,GAAI,EACjD,KAAC,cAAc,IAAC,SAAS,EAAC,SAAS,YAAE,YAAY,GAAkB,IAC5D,EACT,eAAK,SAAS,EAAC,2BAA2B,aACxC,eAAM,SAAS,EAAC,4CAA4C,YAAE,WAAW,GAAQ,EACjF,eAAM,SAAS,EAAC,sDAAsD,YACnE,mBAAmB,EAAE,IAAI,GACrB,IACH,IACF,CACP,CAAC;YACJ,KAAK,yBAAyB,CAAC,WAAW,CAAC;YAC3C;gBACE,OAAO,CACL,MAAC,MAAM,IAAC,SAAS,EAAC,SAAS,aACzB,KAAC,WAAW,IAAC,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,GAAI,EACjD,KAAC,cAAc,IAAC,SAAS,EAAC,SAAS,YAAE,YAAY,GAAkB,IAC5D,CACV,CAAC;QACN,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,GAAG,EAAE;QACjC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,SAAS,CAAC;YAAE,OAAO,IAAI,CAAC;QAEnE,OAAO,CACL,eAAK,SAAS,EAAC,oBAAoB,aACjC,YAAG,SAAS,EAAC,2CAA2C,YAAE,WAAW,GAAK,EAC1E,YAAG,SAAS,EAAC,6DAA6D,YAAE,KAAK,GAAK,IAClF,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,YAAY,CAAC;YAAE,OAAO,IAAI,CAAC;QAEtE,MAAM,eAAe,GAAG,aAAa,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;QAClE,MAAM,SAAS,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC;QAEtC,MAAM,SAAS,GAAG,UAAU,CAC1B,qBAAqB,CAAC,KAAK,EAC3B,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,EAAE,CACtB,CAAC;QAEF,OAAO,CACL,8BACE,KAAC,SAAS,KAAG,EAEZ,eAAe,IAAI,eAAe,IAAI,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;gBAC3F,0CAA0C;gBAC1C,eAAK,SAAS,EAAC,QAAQ,aACrB,YAAG,SAAS,EAAC,kDAAkD,YAAE,SAAS,GAAK,EAC/E,cAAK,SAAS,EAAC,iBAAiB,YAC7B,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;gCACvB,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,KAAK,mBAAmB,EAAE,GAAG,CAAC;gCACxD,OAAO,CACL,MAAC,MAAM,2BAQe,sBAAsB,0BACpB,GAAG,CAAC,GAAG,mBACd,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC5C,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EACvC,SAAS,EAAE,EAAE,CAAC,yCAAyC,EAAE,UAAU,IAAI,gDAAgD,CAAC,aAExH,eAAM,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,WAAW,CAAC,YAC5E,SAAS,GACL,EACP,eAAM,SAAS,EAAC,UAAU,YAAE,GAAG,CAAC,IAAI,GAAQ,KAlBvC,GAAG,CAAC,GAAG,CAmBL,CACV,CAAC;4BACJ,CAAC,CAAC,GACE,IACF,CACP,CAAC,CAAC,CAAC;gBACF,0CAA0C;gBAC1C,eAAK,SAAS,EAAC,oBAAoB,aACjC,YAAG,SAAS,EAAC,4CAA4C,YAAE,SAAS,GAAK,EACzE,YAAG,SAAS,EAAC,sDAAsD,YAChE,mBAAmB,EAAE,IAAI,IAAI,EAAE,GAC9B,IACA,CACP,IACA,CACJ,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,GAAG,EAAE;QACjC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,CAAC;YAAE,OAAO,IAAI,CAAC;QAElE,MAAM,aAAa,GAAG,EAAE,CAAC,UAAU,CAAC,CAAC;QACrC,MAAM,YAAY,GAAG,UAAU,CAC7B,qBAAqB,CAAC,QAAQ,EAC9B,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,EAAE,CACtB,CAAC;QAEF,yEAAyE;QACzE,2EAA2E;QAC3E,uDAAuD;QACvD,IAAI,eAAe,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAC/B,OAAO,CACL,8BACE,KAAC,SAAS,KAAG,EACb,eAAK,SAAS,EAAC,QAAQ,aACrB,YAAG,SAAS,EAAC,kDAAkD,YAAE,aAAa,GAAK,EACnF,cAAK,SAAS,EAAC,iBAAiB,YAC7B,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAC3B,MAAC,MAAM,IAEL,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,SAAS,EAAC,iCAAiC,EAC3C,OAAO,EAAE,GAAG,EAAE,CAAC,8BAA8B,CAAC,IAAI,CAAC,aAElD,IAAI,CAAC,IAAI,IAAI,YAAY,EAC1B,eAAM,SAAS,EAAC,UAAU,YAAE,IAAI,CAAC,KAAK,GAAQ,KAPzC,IAAI,CAAC,EAAE,CAQL,CACV,CAAC,GACE,IACF,IACL,CACJ,CAAC;QACJ,CAAC;QAED,OAAO,CACL,8BACE,KAAC,SAAS,KAAG,EACb,cAAK,SAAS,EAAC,QAAQ,YACrB,MAAC,MAAM,IACL,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,SAAS,EAAC,iCAAiC,EAC3C,QAAQ,EAAE,CAAC,cAAc,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,IAAI,8BAA8B,CAAC,cAAc,CAAC,aAE9E,YAAY,EACZ,aAAa,IACP,GACL,IACL,CACJ,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU;YAAE,OAAO,IAAI,CAAC;QAE/E,MAAM,WAAW,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC;QACjC,MAAM,UAAU,GAAG,UAAU,CAC3B,qBAAqB,CAAC,MAAM,EAC5B,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,EAAE,CACtB,CAAC;QAEF,OAAO,CACL,8BACE,KAAC,SAAS,KAAG,EACb,cAAK,SAAS,EAAC,QAAQ,YACrB,MAAC,MAAM,IACL,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,EAAE,EACnB,OAAO,EAAE,YAAY,EACrB,SAAS,EAAC,yEAAyE,aAElF,UAAU,EACV,WAAW,IACL,GACL,IACL,CACJ,CAAC;IACJ,CAAC,CAAC;IAEF,sEAAsE;IACtE,mCAAmC;IACnC,sEAAsE;IAEtE,IAAI,CAAC,mBAAmB,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,sEAAsE;IACtE,SAAS;IACT,sEAAsE;IAEtE,MAAM,YAAY,GAAG,aAAa,KAAK,yBAAyB,CAAC,WAAW;WACvE,CAAC,CAAC,aAAa,CAAC,CAAC;IAEtB,OAAO;IACL;;;;;;;;;;;;;;;;OAgBG;IACH,MAAC,YAAY,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,aAC/D,KAAC,mBAAmB,IAAC,OAAO,kBAC1B,KAAC,MAAM;gBACL;;;;mBAIG;2CACiB,eAAe,EACnC,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,EAAE,EACpD,SAAS,EAAE,YAAY;wBACrB,CAAC,CAAC,sBAAsB;wBACxB,CAAC,CAAC,yBAAyB,gBAEjB,EAAE,CAAC,eAAe,CAAC,YAE9B,oBAAoB,EAAE,GAChB,GACW,EACtB,MAAC,mBAAmB,IAClB,KAAK,EAAE,cAAc,CAAC,KAAK,EAC3B,IAAI,EAAE,cAAc,CAAC,IAAI,EACzB,SAAS,EAAC,mCAAmC,aAE5C,qBAAqB,EAAE,EACvB,gBAAgB,EAAE,EAClB,qBAAqB,EAAE,EACvB,mBAAmB,EAAE,IACF,IACT,CAChB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React, { useCallback } from 'react';\nimport {\n  UserDropdownSection,\n  UserDropdownAvatarDisplay,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { ButtonSize, FrontendComponentType } from '@wildo-ai/presets-components-models';\n\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuTrigger,\n  Avatar, AvatarFallback, AvatarImage,\n  Button, ButtonVariants_Variant,\n  Separator,\n  useI18n,\n  useIconRegistry,\n  useMenuUserOrgBehavior,\n  IconSize, StandardIconReference,\n  cn,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport type { ApplicationLevelProps_MenuUserOrg } from '@wildo-ai/saas-frontend-lib';\n\nexport const ApplicationLevelPreset_MenuUserOrg_Default: React.FC<ApplicationLevelProps_MenuUserOrg> = ({\n  containerType,\n  containerPlacement,\n}) => {\n  const behavior = useMenuUserOrgBehavior(containerType, containerPlacement);\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN });\n  const { renderIcon } = useIconRegistry();\n\n  const {\n    isOpen,\n    setIsOpen,\n    isUserAuthenticated,\n    userInitials,\n    displayName,\n    email,\n    avatarUrl,\n    currentOrganization,\n    organizations,\n    sections,\n    avatarDisplay,\n    showOrgSwitcher,\n    showLogout,\n    settingsTarget,\n    settingsTargets,\n    popupAlignment,\n    handleLogout,\n    handleSwitchOrg,\n    handleNavigateToSettingsTarget,\n  } = behavior;\n\n  const tc = useCallback(\n    (key: string) => tComponent(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, key),\n    [tComponent],\n  );\n\n  // ===================================================================\n  // Render Helpers\n  // ===================================================================\n\n  const renderTriggerContent = () => {\n\n    switch (avatarDisplay) {\n      case UserDropdownAvatarDisplay.AVATAR_NAME:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <span className=\"text-sm font-medium max-w-[120px] truncate\">{displayName}</span>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.AVATAR_ORG:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <span className=\"text-sm font-medium max-w-[120px] truncate\">\n              {currentOrganization?.name ?? displayName}\n            </span>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.FULL:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <div className=\"flex flex-col items-start\">\n              <span className=\"text-sm font-medium max-w-[120px] truncate\">{displayName}</span>\n              <span className=\"text-xs text-muted-foreground max-w-[120px] truncate\">\n                {currentOrganization?.name}\n              </span>\n            </div>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.AVATAR_ONLY:\n      default:\n        return (\n          <Avatar className=\"h-8 w-8\">\n            <AvatarImage src={avatarUrl} alt={displayName} />\n            <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n          </Avatar>\n        );\n    }\n  };\n\n  const renderUserInfoSection = () => {\n    if (!sections.includes(UserDropdownSection.USER_INFO)) return null;\n\n    return (\n      <div className=\"px-card py-card-sm\">\n        <p className=\"text-sm font-medium leading-none truncate\">{displayName}</p>\n        <p className=\"text-xs leading-none text-muted-foreground mt-item truncate\">{email}</p>\n      </div>\n    );\n  };\n\n  const renderOrgSection = () => {\n    if (!sections.includes(UserDropdownSection.ORG_SWITCHER)) return null;\n\n    const hasMultipleOrgs = organizations && organizations.length > 1;\n    const orgsLabel = tc('organizations');\n\n    const checkIcon = renderIcon(\n      StandardIconReference.CHECK,\n      { size: IconSize.SM }\n    );\n\n    return (\n      <>\n        <Separator />\n\n        {hasMultipleOrgs && showOrgSwitcher && sections.includes(UserDropdownSection.ORG_SWITCHER) ? (\n          /* Multiple orgs — full selectable list */\n          <div className=\"p-item\">\n            <p className=\"text-xs text-muted-foreground mb-item px-card-sm\">{orgsLabel}</p>\n            <div className=\"space-y-item-xs\">\n              {organizations.map(org => {\n                const isSelected = org._id === currentOrganization?._id;\n                return (\n                  <Button\n                    key={org._id}\n                    /*\n                     * The org's IDENTITY on the element, not its name: a scenario asserting which\n                     * organization is active must not have to match a display name it did not choose,\n                     * and `data-selected` states the current one without reading the check icon —\n                     * which is an icon, and therefore not assertable text at all.\n                     */\n                    data-component-type=\"user-org-menu-option\"\n                    data-organization-id={org._id}\n                    data-selected={isSelected ? 'true' : 'false'}\n                    variant={ButtonVariants_Variant.GHOST}\n                    size={ButtonSize.SM}\n                    onClick={() => handleSwitchOrg(org._id)}\n                    className={cn('w-full justify-start text-sm rounded-sm', isSelected && 'bg-primary/10 text-primary hover:bg-primary/15')}\n                  >\n                    <span className={cn('flex-shrink-0', isSelected ? 'text-primary' : 'invisible')}>\n                      {checkIcon}\n                    </span>\n                    <span className=\"truncate\">{org.name}</span>\n                  </Button>\n                );\n              })}\n            </div>\n          </div>\n        ) : (\n          /* Single org — non-interactive display */\n          <div className=\"px-card py-card-sm\">\n            <p className=\"text-xs text-muted-foreground leading-none\">{orgsLabel}</p>\n            <p className=\"text-sm font-medium leading-none mt-element truncate\">\n              {currentOrganization?.name ?? ''}\n            </p>\n          </div>\n        )}\n      </>\n    );\n  };\n\n  const renderSettingsSection = () => {\n    if (!sections.includes(UserDropdownSection.SETTINGS)) return null;\n\n    const settingsLabel = tc('settings');\n    const settingsIcon = renderIcon(\n      StandardIconReference.SETTINGS,\n      { size: IconSize.SM }\n    );\n\n    // Authored settings entries render inline (icon + label), one per entry,\n    // instead of a single \"Settings\" button. The list IS the intent — there is\n    // no separate enable flag that could disagree with it.\n    if (settingsTargets.length > 0) {\n      return (\n        <>\n          <Separator />\n          <div className=\"p-item\">\n            <p className=\"text-xs text-muted-foreground mb-item px-card-sm\">{settingsLabel}</p>\n            <div className=\"space-y-item-xs\">\n              {settingsTargets.map(item => (\n                <Button\n                  key={item.id}\n                  variant={ButtonVariants_Variant.GHOST}\n                  size={ButtonSize.SM}\n                  className=\"w-full justify-start rounded-sm\"\n                  onClick={() => handleNavigateToSettingsTarget(item)}\n                >\n                  {item.icon ?? settingsIcon}\n                  <span className=\"truncate\">{item.label}</span>\n                </Button>\n              ))}\n            </div>\n          </div>\n        </>\n      );\n    }\n\n    return (\n      <>\n        <Separator />\n        <div className=\"p-item\">\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            className=\"w-full justify-start rounded-sm\"\n            disabled={!settingsTarget}\n            onClick={() => settingsTarget && handleNavigateToSettingsTarget(settingsTarget)}\n          >\n            {settingsIcon}\n            {settingsLabel}\n          </Button>\n        </div>\n      </>\n    );\n  };\n\n  const renderLogoutSection = () => {\n    if (!sections.includes(UserDropdownSection.LOGOUT) || !showLogout) return null;\n\n    const logoutLabel = tc('logout');\n    const logoutIcon = renderIcon(\n      StandardIconReference.LOGOUT,\n      { size: IconSize.SM }\n    );\n\n    return (\n      <>\n        <Separator />\n        <div className=\"p-item\">\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            onClick={handleLogout}\n            className=\"w-full justify-start rounded-sm text-destructive hover:text-destructive\"\n          >\n            {logoutIcon}\n            {logoutLabel}\n          </Button>\n        </div>\n      </>\n    );\n  };\n\n  // ===================================================================\n  // Early Return - Not Authenticated\n  // ===================================================================\n\n  if (!isUserAuthenticated) {\n    return null;\n  }\n\n  if (!isReady) return null;\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  const isAvatarOnly = avatarDisplay === UserDropdownAvatarDisplay.AVATAR_ONLY\n    || (!avatarDisplay);\n\n  return (\n    /*\n     * `modal={false}` is required, not cosmetic.\n     *\n     * The trigger below lives INSIDE the menubar (`role=\"banner\"`), while the\n     * dropdown content is portaled OUT of it. Radix's default `modal={true}`\n     * runs `hideOthers(content)` on open, which sets `aria-hidden=\"true\"` on\n     * every subtree outside the portaled content — including the menubar that\n     * still hosts the focused trigger (the click that opened the menu focuses\n     * the avatar button). The browser then blocks that aria-hidden with\n     * \"descendant retained focus\", an accessibility violation.\n     *\n     * A transient account menu needs none of the modal guarantees (scroll\n     * lock, outside-pointer blocking, background AT-hiding), so going\n     * non-modal is both the correct UX and removes the invalid\n     * aria-hidden-on-a-focused-ancestor by construction. Outside-click and\n     * Escape dismissal still work via the DismissableLayer.\n     */\n    <DropdownMenu open={isOpen} onOpenChange={setIsOpen} modal={false}>\n      <DropdownMenuTrigger asChild>\n        <Button\n          /*\n           * The only i18n-INDEPENDENT handle on this menu. Its `aria-label` is a translated string,\n           * so a browser scenario keying on it would break in any locale but the default — the same\n           * discipline `quick-switcher` follows with `data-component-type`.\n           */\n          data-component-type=\"user-org-menu\"\n          variant={ButtonVariants_Variant.GHOST}\n          size={isAvatarOnly ? ButtonSize.ICON : ButtonSize.SM}\n          className={isAvatarOnly\n            ? 'rounded-full h-9 w-9'\n            : 'rounded-full pe-card-sm'\n          }\n          aria-label={tc('userMenuLabel')}\n        >\n          {renderTriggerContent()}\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        align={popupAlignment.align}\n        side={popupAlignment.side}\n        className=\"w-72 max-w-[calc(100vw-2rem)] p-0\"\n      >\n        {renderUserInfoSection()}\n        {renderOrgSection()}\n        {renderSettingsSection()}\n        {renderLogoutSection()}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n};\n"]}
+{"version":3,"file":"menu-user-org.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menu-user-org.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useCallback } from 'react';\nimport {\n  UserDropdownSection,\n  UserDropdownAvatarDisplay,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport { ButtonSize, FrontendComponentType } from '@wildo-ai/presets-components-models';\n\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuTrigger,\n  Avatar, AvatarFallback, AvatarImage,\n  Button, ButtonVariants_Variant,\n  Separator,\n  useI18n,\n  useIconRegistry,\n  useMenuUserOrgBehavior,\n  IconSize, StandardIconReference,\n  cn,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport type { ApplicationLevelProps_MenuUserOrg } from '@wildo-ai/saas-frontend-lib';\n\nexport const ApplicationLevelPreset_MenuUserOrg_Default: React.FC<ApplicationLevelProps_MenuUserOrg> = ({\n  containerType,\n  containerPlacement,\n}) => {\n  const behavior = useMenuUserOrgBehavior(containerType, containerPlacement);\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN });\n  const { renderIcon } = useIconRegistry();\n\n  const {\n    isOpen,\n    setIsOpen,\n    isUserAuthenticated,\n    userInitials,\n    displayName,\n    email,\n    avatarUrl,\n    currentOrganization,\n    organizations,\n    sections,\n    avatarDisplay,\n    showOrgSwitcher,\n    showLogout,\n    settingsTarget,\n    settingsTargets,\n    popupAlignment,\n    handleLogout,\n    handleSwitchOrg,\n    handleNavigateToSettingsTarget,\n  } = behavior;\n\n  const tc = useCallback(\n    (key: string) => tComponent(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, key),\n    [tComponent],\n  );\n\n  // ===================================================================\n  // Render Helpers\n  // ===================================================================\n\n  const renderTriggerContent = () => {\n\n    switch (avatarDisplay) {\n      case UserDropdownAvatarDisplay.AVATAR_NAME:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <span className=\"text-sm font-medium max-w-[120px] truncate\">{displayName}</span>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.AVATAR_ORG:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <span className=\"text-sm font-medium max-w-[120px] truncate\">\n              {currentOrganization?.name ?? displayName}\n            </span>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.FULL:\n        return (\n          <div className=\"flex items-center gap-element\">\n            <Avatar className=\"h-8 w-8\">\n              <AvatarImage src={avatarUrl} alt={displayName} />\n              <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n            </Avatar>\n            <div className=\"flex flex-col items-start\">\n              <span className=\"text-sm font-medium max-w-[120px] truncate\">{displayName}</span>\n              <span className=\"text-xs text-muted-foreground max-w-[120px] truncate\">\n                {currentOrganization?.name}\n              </span>\n            </div>\n          </div>\n        );\n      case UserDropdownAvatarDisplay.AVATAR_ONLY:\n      default:\n        return (\n          <Avatar className=\"h-8 w-8\">\n            <AvatarImage src={avatarUrl} alt={displayName} />\n            <AvatarFallback className=\"text-xs\">{userInitials}</AvatarFallback>\n          </Avatar>\n        );\n    }\n  };\n\n  const renderUserInfoSection = () => {\n    if (!sections.includes(UserDropdownSection.USER_INFO)) return null;\n\n    return (\n      <div className=\"px-card py-card-sm\">\n        <p className=\"text-sm font-medium leading-none truncate\">{displayName}</p>\n        <p className=\"text-xs leading-none text-muted-foreground mt-item truncate\">{email}</p>\n      </div>\n    );\n  };\n\n  const renderOrgSection = () => {\n    if (!sections.includes(UserDropdownSection.ORG_SWITCHER)) return null;\n\n    const hasMultipleOrgs = organizations && organizations.length > 1;\n    const orgsLabel = tc('organizations');\n    const ownOrganizations = (organizations ?? []).filter(org => !org.viaProviderOrganizationName);\n    const clientOrganizations = (organizations ?? []).filter(org => Boolean(org.viaProviderOrganizationName));\n    const orgGroups = [\n      { key: 'own', label: orgsLabel, organizations: ownOrganizations },\n      { key: 'clients', label: tc('clientOrganizations'), organizations: clientOrganizations },\n    ].filter(group => group.organizations.length > 0);\n\n    const checkIcon = renderIcon(\n      StandardIconReference.CHECK,\n      { size: IconSize.SM }\n    );\n\n    return (\n      <>\n        <Separator />\n\n        {hasMultipleOrgs && showOrgSwitcher && sections.includes(UserDropdownSection.ORG_SWITCHER) ? (\n          /* Multiple orgs — full selectable list */\n          <div className=\"p-item\">\n            {/* Own organizations first; the clients a service firm's expert works in follow under their\n                own heading (#1597), each naming the firm through which it is reached. */}\n            {orgGroups.map(group => (\n              <div key={group.key} className={cn(group.key === 'clients' && 'mt-item')}>\n                <p className=\"text-xs text-muted-foreground mb-item px-card-sm\">{group.label}</p>\n                <div className=\"space-y-item-xs\">\n                  {group.organizations.map(org => {\n                    const isSelected = org._id === currentOrganization?._id;\n                    return (\n                      <Button\n                        key={org._id}\n                        /*\n                         * The org's IDENTITY on the element, not its name: a scenario asserting which\n                         * organization is active must not have to match a display name it did not choose,\n                         * and `data-selected` states the current one without reading the check icon —\n                         * which is an icon, and therefore not assertable text at all.\n                         */\n                        data-component-type=\"user-org-menu-option\"\n                        data-organization-id={org._id}\n                        data-selected={isSelected ? 'true' : 'false'}\n                        variant={ButtonVariants_Variant.GHOST}\n                        size={ButtonSize.SM}\n                        onClick={() => handleSwitchOrg(org._id)}\n                        className={cn('w-full justify-start text-sm rounded-sm', isSelected && 'bg-primary/10 text-primary hover:bg-primary/15')}\n                      >\n                        <span className={cn('flex-shrink-0', isSelected ? 'text-primary' : 'invisible')}>\n                          {checkIcon}\n                        </span>\n                        <span className=\"flex min-w-0 flex-col items-start\">\n                          <span className=\"truncate\">{org.name}</span>\n                          {org.viaProviderOrganizationName ? (\n                            <span className=\"truncate text-xs text-muted-foreground\">\n                              {tComponent(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, 'servedViaFirm', { firm: org.viaProviderOrganizationName })}\n                            </span>\n                          ) : null}\n                        </span>\n                      </Button>\n                    );\n                  })}\n                </div>\n              </div>\n            ))}\n          </div>\n        ) : (\n          /* Single org — non-interactive display */\n          <div className=\"px-card py-card-sm\">\n            <p className=\"text-xs text-muted-foreground leading-none\">{orgsLabel}</p>\n            <p className=\"text-sm font-medium leading-none mt-element truncate\">\n              {currentOrganization?.name ?? ''}\n            </p>\n          </div>\n        )}\n      </>\n    );\n  };\n\n  const renderSettingsSection = () => {\n    if (!sections.includes(UserDropdownSection.SETTINGS)) return null;\n\n    const settingsLabel = tc('settings');\n    const settingsIcon = renderIcon(\n      StandardIconReference.SETTINGS,\n      { size: IconSize.SM }\n    );\n\n    // Authored settings entries render inline (icon + label), one per entry,\n    // instead of a single \"Settings\" button. The list IS the intent — there is\n    // no separate enable flag that could disagree with it.\n    if (settingsTargets.length > 0) {\n      return (\n        <>\n          <Separator />\n          <div className=\"p-item\">\n            <p className=\"text-xs text-muted-foreground mb-item px-card-sm\">{settingsLabel}</p>\n            <div className=\"space-y-item-xs\">\n              {settingsTargets.map(item => (\n                <Button\n                  key={item.id}\n                  variant={ButtonVariants_Variant.GHOST}\n                  size={ButtonSize.SM}\n                  className=\"w-full justify-start rounded-sm\"\n                  onClick={() => handleNavigateToSettingsTarget(item)}\n                >\n                  {item.icon ?? settingsIcon}\n                  <span className=\"truncate\">{item.label}</span>\n                </Button>\n              ))}\n            </div>\n          </div>\n        </>\n      );\n    }\n\n    return (\n      <>\n        <Separator />\n        <div className=\"p-item\">\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            className=\"w-full justify-start rounded-sm\"\n            disabled={!settingsTarget}\n            onClick={() => settingsTarget && handleNavigateToSettingsTarget(settingsTarget)}\n          >\n            {settingsIcon}\n            {settingsLabel}\n          </Button>\n        </div>\n      </>\n    );\n  };\n\n  const renderLogoutSection = () => {\n    if (!sections.includes(UserDropdownSection.LOGOUT) || !showLogout) return null;\n\n    const logoutLabel = tc('logout');\n    const logoutIcon = renderIcon(\n      StandardIconReference.LOGOUT,\n      { size: IconSize.SM }\n    );\n\n    return (\n      <>\n        <Separator />\n        <div className=\"p-item\">\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            onClick={handleLogout}\n            className=\"w-full justify-start rounded-sm text-destructive hover:text-destructive\"\n          >\n            {logoutIcon}\n            {logoutLabel}\n          </Button>\n        </div>\n      </>\n    );\n  };\n\n  // ===================================================================\n  // Early Return - Not Authenticated\n  // ===================================================================\n\n  if (!isUserAuthenticated) {\n    return null;\n  }\n\n  if (!isReady) return null;\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  const isAvatarOnly = avatarDisplay === UserDropdownAvatarDisplay.AVATAR_ONLY\n    || (!avatarDisplay);\n\n  return (\n    /*\n     * `modal={false}` is required, not cosmetic.\n     *\n     * The trigger below lives INSIDE the menubar (`role=\"banner\"`), while the\n     * dropdown content is portaled OUT of it. Radix's default `modal={true}`\n     * runs `hideOthers(content)` on open, which sets `aria-hidden=\"true\"` on\n     * every subtree outside the portaled content — including the menubar that\n     * still hosts the focused trigger (the click that opened the menu focuses\n     * the avatar button). The browser then blocks that aria-hidden with\n     * \"descendant retained focus\", an accessibility violation.\n     *\n     * A transient account menu needs none of the modal guarantees (scroll\n     * lock, outside-pointer blocking, background AT-hiding), so going\n     * non-modal is both the correct UX and removes the invalid\n     * aria-hidden-on-a-focused-ancestor by construction. Outside-click and\n     * Escape dismissal still work via the DismissableLayer.\n     */\n    <DropdownMenu open={isOpen} onOpenChange={setIsOpen} modal={false}>\n      <DropdownMenuTrigger asChild>\n        <Button\n          /*\n           * The only i18n-INDEPENDENT handle on this menu. Its `aria-label` is a translated string,\n           * so a browser scenario keying on it would break in any locale but the default — the same\n           * discipline `quick-switcher` follows with `data-component-type`.\n           */\n          data-component-type=\"user-org-menu\"\n          variant={ButtonVariants_Variant.GHOST}\n          size={isAvatarOnly ? ButtonSize.ICON : ButtonSize.SM}\n          className={isAvatarOnly\n            ? 'rounded-full h-9 w-9'\n            : 'rounded-full pe-card-sm'\n          }\n          aria-label={tc('userMenuLabel')}\n        >\n          {renderTriggerContent()}\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        align={popupAlignment.align}\n        side={popupAlignment.side}\n        className=\"w-72 max-w-[calc(100vw-2rem)] p-0\"\n      >\n        {renderUserInfoSection()}\n        {renderOrgSection()}\n        {renderSettingsSection()}\n        {renderLogoutSection()}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n};\n"]}

package/dist/esm/components/navigation/app-level/menu-user-org.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-user-org.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/menu-user-org.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,kCAAkC,EAAE,mBAAmB,EAYnE,CAAC"}
+{"version":3,"file":"menu-user-org.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menu-user-org.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,kCAAkC,EAAE,mBAAmB,EAmBnE,CAAC"}

package/dist/esm/components/navigation/app-level/menu-user-org.labels.js

@@ -12,6 +12,13 @@ export const ApplicationLevelUserDropdownLabels = [
     { ref: 'switchOrganization', kind: LabelKind.LABEL, purpose: 'Label for the switch-organization action' },
     { ref: 'currentOrganization', kind: LabelKind.LABEL, purpose: 'Label marking the currently selected organization' },
     { ref: 'organizations', kind: LabelKind.HEADING, purpose: 'Section heading listing available organizations' },
+    { ref: 'clientOrganizations', kind: LabelKind.HEADING, purpose: 'Section heading listing the CLIENT organizations the person works in on behalf of a service firm, kept apart from their own organizations' },
+    {
+        ref: 'servedViaFirm',
+        kind: LabelKind.LABEL,
+        purpose: 'Small line under a client organization naming the service firm through which the person works there',
+        params: [{ key: 'firm', meaning: 'the service firm\'s name' }],
+    },
     { ref: 'noOrganizations', kind: LabelKind.EMPTY_STATE, purpose: 'Shown when the user belongs to no organizations' },
     { ref: 'createOrganization', kind: LabelKind.BUTTON, purpose: 'Menu action that starts creating a new organization' },
 ];

package/dist/esm/components/navigation/app-level/menu-user-org.labels.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-user-org.labels.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menu-user-org.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,qBAAqB,EACrB,SAAS,EAET,uBAAuB,GACxB,MAAM,qCAAqC,CAAC;AAE7C,2EAA2E;AAC3E,6EAA6E;AAC7E,+EAA+E;AAE/E,MAAM,CAAC,MAAM,kCAAkC,GAA0B;IACvE,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,CAAC,IAAI,EAAE,OAAO,EAAE,qDAAqD,EAAE;IAC9G,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,wCAAwC,EAAE;IAC9F,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,oCAAoC,EAAE;IAC1F,EAAE,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,+BAA+B,EAAE;IACvF,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,uBAAuB,EAAE;IAC5E,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,EAAE,OAAO,EAAE,qCAAqC,EAAE;IACzF,EAAE,GAAG,EAAE,oBAAoB,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,0CAA0C,EAAE;IACzG,EAAE,GAAG,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,mDAAmD,EAAE;IACnH,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,CAAC,OAAO,EAAE,OAAO,EAAE,iDAAiD,EAAE;IAC7G,EAAE,GAAG,EAAE,iBAAiB,EAAE,IAAI,EAAE,SAAS,CAAC,WAAW,EAAE,OAAO,EAAE,iDAAiD,EAAE;IACnH,EAAE,GAAG,EAAE,oBAAoB,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,EAAE,OAAO,EAAE,qDAAqD,EAAE;CACtH,CAAC;AACF,uBAAuB,CAAC,qBAAqB,CAAC,+BAA+B,EAAE,kCAAkC,CAAC,CAAC","sourcesContent":["import {\n  FrontendComponentType,\n  LabelKind,\n  type LabellingUnitaryDef,\n  registerComponentLabels,\n} from '@wildo-ai/presets-components-models';\n\n// Companion-only label metadata for this component: keys + params + (where\n// authored) per-key purpose / kind / variable meaning. Statically scanned by\n// the dev companion; NOT imported at runtime, so it never ships in the bundle.\n\nexport const ApplicationLevelUserDropdownLabels: LabellingUnitaryDef[] = [\n  { ref: 'userMenuLabel', kind: LabelKind.ARIA, purpose: 'Screen-reader name for the user-menu trigger button' },\n  { ref: 'myAccount', kind: LabelKind.LABEL, purpose: 'Menu link to the user account overview' },\n  { ref: 'myProfile', kind: LabelKind.LABEL, purpose: 'Menu link to the user profile page' },\n  { ref: 'preferences', kind: LabelKind.LABEL, purpose: 'Menu link to user preferences' },\n  { ref: 'settings', kind: LabelKind.LABEL, purpose: 'Menu link to settings' },\n  { ref: 'logout', kind: LabelKind.BUTTON, purpose: 'Menu action that signs the user out' },\n  { ref: 'switchOrganization', kind: LabelKind.LABEL, purpose: 'Label for the switch-organization action' },\n  { ref: 'currentOrganization', kind: LabelKind.LABEL, purpose: 'Label marking the currently selected organization' },\n  { ref: 'organizations', kind: LabelKind.HEADING, purpose: 'Section heading listing available organizations' },\n  { ref: 'noOrganizations', kind: LabelKind.EMPTY_STATE, purpose: 'Shown when the user belongs to no organizations' },\n  { ref: 'createOrganization', kind: LabelKind.BUTTON, purpose: 'Menu action that starts creating a new organization' },\n];\nregisterComponentLabels(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, ApplicationLevelUserDropdownLabels);\n"]}
+{"version":3,"file":"menu-user-org.labels.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menu-user-org.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,qBAAqB,EACrB,SAAS,EAET,uBAAuB,GACxB,MAAM,qCAAqC,CAAC;AAE7C,2EAA2E;AAC3E,6EAA6E;AAC7E,+EAA+E;AAE/E,MAAM,CAAC,MAAM,kCAAkC,GAA0B;IACvE,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,CAAC,IAAI,EAAE,OAAO,EAAE,qDAAqD,EAAE;IAC9G,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,wCAAwC,EAAE;IAC9F,EAAE,GAAG,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,oCAAoC,EAAE;IAC1F,EAAE,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,+BAA+B,EAAE;IACvF,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,uBAAuB,EAAE;IAC5E,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,EAAE,OAAO,EAAE,qCAAqC,EAAE;IACzF,EAAE,GAAG,EAAE,oBAAoB,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,0CAA0C,EAAE;IACzG,EAAE,GAAG,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,mDAAmD,EAAE;IACnH,EAAE,GAAG,EAAE,eAAe,EAAE,IAAI,EAAE,SAAS,CAAC,OAAO,EAAE,OAAO,EAAE,iDAAiD,EAAE;IAC7G,EAAE,GAAG,EAAE,qBAAqB,EAAE,IAAI,EAAE,SAAS,CAAC,OAAO,EAAE,OAAO,EAAE,2IAA2I,EAAE;IAC7M;QACE,GAAG,EAAE,eAAe;QACpB,IAAI,EAAE,SAAS,CAAC,KAAK;QACrB,OAAO,EAAE,qGAAqG;QAC9G,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,OAAO,EAAE,0BAA0B,EAAE,CAAC;KAC/D;IACD,EAAE,GAAG,EAAE,iBAAiB,EAAE,IAAI,EAAE,SAAS,CAAC,WAAW,EAAE,OAAO,EAAE,iDAAiD,EAAE;IACnH,EAAE,GAAG,EAAE,oBAAoB,EAAE,IAAI,EAAE,SAAS,CAAC,MAAM,EAAE,OAAO,EAAE,qDAAqD,EAAE;CACtH,CAAC;AACF,uBAAuB,CAAC,qBAAqB,CAAC,+BAA+B,EAAE,kCAAkC,CAAC,CAAC","sourcesContent":["import {\n  FrontendComponentType,\n  LabelKind,\n  type LabellingUnitaryDef,\n  registerComponentLabels,\n} from '@wildo-ai/presets-components-models';\n\n// Companion-only label metadata for this component: keys + params + (where\n// authored) per-key purpose / kind / variable meaning. Statically scanned by\n// the dev companion; NOT imported at runtime, so it never ships in the bundle.\n\nexport const ApplicationLevelUserDropdownLabels: LabellingUnitaryDef[] = [\n  { ref: 'userMenuLabel', kind: LabelKind.ARIA, purpose: 'Screen-reader name for the user-menu trigger button' },\n  { ref: 'myAccount', kind: LabelKind.LABEL, purpose: 'Menu link to the user account overview' },\n  { ref: 'myProfile', kind: LabelKind.LABEL, purpose: 'Menu link to the user profile page' },\n  { ref: 'preferences', kind: LabelKind.LABEL, purpose: 'Menu link to user preferences' },\n  { ref: 'settings', kind: LabelKind.LABEL, purpose: 'Menu link to settings' },\n  { ref: 'logout', kind: LabelKind.BUTTON, purpose: 'Menu action that signs the user out' },\n  { ref: 'switchOrganization', kind: LabelKind.LABEL, purpose: 'Label for the switch-organization action' },\n  { ref: 'currentOrganization', kind: LabelKind.LABEL, purpose: 'Label marking the currently selected organization' },\n  { ref: 'organizations', kind: LabelKind.HEADING, purpose: 'Section heading listing available organizations' },\n  { ref: 'clientOrganizations', kind: LabelKind.HEADING, purpose: 'Section heading listing the CLIENT organizations the person works in on behalf of a service firm, kept apart from their own organizations' },\n  {\n    ref: 'servedViaFirm',\n    kind: LabelKind.LABEL,\n    purpose: 'Small line under a client organization naming the service firm through which the person works there',\n    params: [{ key: 'firm', meaning: 'the service firm\\'s name' }],\n  },\n  { ref: 'noOrganizations', kind: LabelKind.EMPTY_STATE, purpose: 'Shown when the user belongs to no organizations' },\n  { ref: 'createOrganization', kind: LabelKind.BUTTON, purpose: 'Menu action that starts creating a new organization' },\n];\nregisterComponentLabels(FrontendComponentType.APPLICATION_LEVEL_USER_DROPDOWN, ApplicationLevelUserDropdownLabels);\n"]}

package/dist/esm/components/navigation/app-level/menubar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menubar.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/menubar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAEL,6BAA6B,EAiB9B,MAAM,6BAA6B,CAAC;AAcrC,eAAO,MAAM,sCAAsC,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CA6N1F,CAAC"}
+{"version":3,"file":"menubar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menubar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,OAAO,EAEL,6BAA6B,EAmB9B,MAAM,6BAA6B,CAAC;AAMrC,eAAO,MAAM,sCAAsC,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAiT1F,CAAC"}

package/dist/esm/components/navigation/app-level/menubar.js

@@ -1,21 +1,29 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Suspense } from 'react';
-import { ApplicationLevelComponentType, useI18n, ComponentRegistryService, useUI, useMenuBarBehavior, useHostedComponentInteractions, useSidebarMobileDrawerMode, useEventBus, useIconRegistry, FrontendEvents, IconSize, StandardIconReference, envLoader, Button, ButtonVariants_Variant, cn, Surface, } from '@wildo-ai/saas-frontend-lib';
-import { CorePresetNames, FrontendComponentType, HorizontalPlacement, ShellAppearance, SurfaceVariant, UIBehavior } from '@wildo-ai/presets-components-models';
+import { ApplicationLevelComponentType, useI18n, ComponentRegistryService, useUI, useMenuBarBehavior, useHostedComponentInteractions, useSidebarMobileDrawerMode, useEventBus, useIconRegistry, FrontendEvents, IconSize, StandardIconReference, envLoader, Button, ButtonVariants_Variant, cn, Surface, useBrandPresentation, NavigationItemBadge, } from '@wildo-ai/saas-frontend-lib';
+import { CorePresetNames, FrontendComponentType, HorizontalPlacement, SelectableVariant, ShellAppearance, ShellRegion, SurfaceVariant, UIBehavior } from '@wildo-ai/presets-components-models';
 import { HostedTriggerAppearance } from '@wildo-ai/saas-frontend-lib';
 import { Menubar } from '../../../components/navigation/menu-bar.js';
-function humanizeMenubarGroup(group) {
-    return group
-        .replace(/([a-z0-9])([A-Z])/g, '$1 $2')
-        .replace(/[-_]/g, ' ')
-        .trim()
-        .replace(/\b\w/g, character => character.toUpperCase());
-}
 export const ApplicationLevelPreset_Menubar_Default = ({ mode, children }) => {
     const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_MENUBAR });
     const { UIConfig, getRecipe, shellAppearance } = useUI();
     const overlayRecipe = getRecipe(UIBehavior.SURFACE, SurfaceVariant.OVERLAY);
-    const { containerComponents, items, menubarConfig } = useMenuBarBehavior({ mode });
+    /*
+     * Destination items take the theme's SELECTABLE/FILLED recipe — the same vocabulary the sidebar
+     * uses for "the current destination" — so a menubar-only shell reads which page it is on. Opt-in
+     * via `data-active`, appended after the GHOST recipe so the selected wash wins over GHOST's.
+     */
+    const selectableRecipe = getRecipe(UIBehavior.SELECTABLE, SelectableVariant.FILLED);
+    const itemStateClasses = cn(selectableRecipe.states.hover, selectableRecipe.states.selected, selectableRecipe.motion.transition);
+    const { containerComponents, items, menubarConfig, brandHeader, isHomeActive, handleHomeClick } = useMenuBarBehavior({ mode });
+    /*
+     * The same four data decisions the sidebar's brand header takes (a failed mark degrading to the
+     * name, the latch resetting on a theme change, a wordmark replacing the name, nothing rendering
+     * for an empty identity) live once in `useBrandPresentation`; what stays here is layout. Called
+     * unconditionally, as a hook must be — `brandHeader` is `undefined` unless the config opted in,
+     * and the hook answers `isEmpty` for that.
+     */
+    const brand = useBrandPresentation(brandHeader);
     // Mobile burger: while the sidebar operates as an overlay drawer (BURGER policy
     // at/below its responsive breakpoint) nothing renders inline, so the menubar
     // provides the drawer's opening affordance. State stays owned by the sidebar's
@@ -60,6 +68,20 @@ export const ApplicationLevelPreset_Menubar_Default = ({ mode, children }) => {
         groups.set(item.group, existing);
         return groups;
     }, new Map());
+    /**
+     * The identity as the HOME affordance at the start of the bar (`brandHeader: true`) — the
+     * horizontal counterpart of the sidebar's pinned brand header, for a shell that has no sidebar.
+     * Mark beside name; a WORDMARK/LOCKUP already spells the name and replaces it. `aria-current`
+     * stays truthful on the home route but NO `data-active`: the identity is not a menu item that
+     * lights up (the sidebar records the same decision).
+     */
+    const renderBrandHeader = () => {
+        if (!brandHeader || brand.isEmpty)
+            return null;
+        const { name, logoUrl, hasMark, markCarriesName, onMarkError } = brand;
+        const showNameText = !(hasMark && markCarriesName);
+        return (_jsxs(Button, { type: "button", variant: ButtonVariants_Variant.GHOST, onClick: handleHomeClick, "aria-current": isHomeActive ? 'page' : undefined, "aria-label": showNameText ? undefined : name, "data-slot": "menubar-brand-header", className: "h-auto min-w-0 shrink-0 gap-element px-card-sm py-item-xs text-sm font-semibold", children: [hasMark && logoUrl && (_jsx("img", { src: logoUrl, alt: markCarriesName ? name : '', "aria-hidden": markCarriesName ? undefined : 'true', onError: onMarkError, className: markCarriesName ? 'h-6 w-auto' : 'size-6 shrink-0 object-contain' })), showNameText && _jsx("span", { className: "truncate", children: name })] }));
+    };
     const renderMenubarItems = () => {
         if (items.length === 0) {
             return null;
@@ -67,21 +89,21 @@ export const ApplicationLevelPreset_Menubar_Default = ({ mode, children }) => {
         const renderedGroups = new Set();
         return (_jsx("div", { className: "flex items-center gap-item-xs min-w-0", children: items.map(item => {
                 if (!item.group) {
-                    return (_jsxs(Button, { type: "button", onClick: item.onExecute, variant: ButtonVariants_Variant.GHOST, className: "h-auto gap-element px-card-sm py-item-xs text-sm font-medium", children: [item.icon && _jsx("span", { className: "shrink-0", children: item.icon }), _jsx("span", { className: "truncate", children: item.label })] }, item.id));
+                    return (_jsxs(Button, { type: "button", onClick: item.onExecute, variant: ButtonVariants_Variant.GHOST, "aria-current": item.isActive ? 'page' : undefined, "data-active": item.isActive || undefined, "data-nav-item-id": item.id, className: cn('h-auto gap-element px-card-sm py-item-xs text-sm font-medium', itemStateClasses), children: [item.icon && _jsx("span", { className: "shrink-0", children: item.icon }), _jsx("span", { className: "truncate", children: item.label }), item.notificationBadgeRef && (_jsx("span", { className: "shrink-0", children: _jsx(NavigationItemBadge, { notificationBadgeRef: item.notificationBadgeRef, label: item.label }) }))] }, item.id));
                 }
                 if (renderedGroups.has(item.group)) {
                     return null;
                 }
                 renderedGroups.add(item.group);
                 const groupItems = groupedItems.get(item.group) ?? [];
-                return (_jsx(Menubar, { className: "h-auto gap-item-xs rounded-none border-0 bg-transparent p-0 shadow-none", children: _jsxs(Menubar.Menu, { children: [_jsx(Menubar.Trigger, { children: humanizeMenubarGroup(item.group) }), _jsx(Menubar.Content, { children: groupItems.map(groupItem => (_jsxs(Menubar.Item, { onSelect: groupItem.onExecute, children: [groupItem.icon && _jsx("span", { className: "shrink-0", children: groupItem.icon }), _jsx("span", { className: "truncate", children: groupItem.label })] }, groupItem.id))) })] }) }, item.group));
+                return (_jsx(Menubar, { className: "h-auto gap-item-xs rounded-none border-0 bg-transparent p-0 shadow-none", children: _jsxs(Menubar.Menu, { children: [_jsx(Menubar.Trigger, { children: item.group }), _jsx(Menubar.Content, { children: groupItems.map(groupItem => (_jsxs(Menubar.Item, { onSelect: groupItem.onExecute, "aria-current": groupItem.isActive ? 'page' : undefined, "data-active": groupItem.isActive || undefined, "data-nav-item-id": groupItem.id, children: [groupItem.icon && _jsx("span", { className: "shrink-0", children: groupItem.icon }), _jsx("span", { className: "truncate", children: groupItem.label }), groupItem.notificationBadgeRef && (_jsx("span", { className: "ms-auto shrink-0", children: _jsx(NavigationItemBadge, { notificationBadgeRef: groupItem.notificationBadgeRef, label: groupItem.label }) }))] }, groupItem.id))) })] }) }, item.group));
             }) }));
     };
     // ===================================================================
     // Render
     // ===================================================================
-    return (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: menubarConfig.isOverlay ? SurfaceVariant.OVERLAY : SurfaceVariant.SUNKEN, children: _jsxs("div", { "data-component-area": "menubar", "data-component-type": ApplicationLevelComponentType.MENUBAR, "data-menubar-mode": menubarConfig.mode, "data-frontend-service-name": envLoader.loadEnvironmentConfig().frontendServiceName, "data-viewport": currentBreakpoint, role: "banner", "aria-label": tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'menubarLabel'), className: cn(isContinuousShell
+    return (_jsx(Surface, { asChild: true, emitPolicyVars: false, variant: menubarConfig.isOverlay ? SurfaceVariant.OVERLAY : SurfaceVariant.SUNKEN, children: _jsxs("div", { "data-component-area": ShellRegion.MENUBAR, "data-component-type": ApplicationLevelComponentType.MENUBAR, "data-menubar-mode": menubarConfig.mode, "data-frontend-service-name": envLoader.loadEnvironmentConfig().frontendServiceName, "data-viewport": currentBreakpoint, role: "banner", "aria-label": tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'menubarLabel'), className: cn(isContinuousShell
                 ? 'bg-transparent text-foreground'
-                : 'bg-surface-sunken text-surface-sunken-foreground border-b border-surface-sunken-border', menubarConfig.isOverlay && cn('absolute top-0 inset-inline-start-0 inset-inline-end-0 z-(--z-overlay)', overlayRecipe.base), menubarConfig.showMobileLayout ? 'px-card-sm py-item-xs' : 'px-card py-card-sm'), children: [_jsxs("div", { className: "grid w-full grid-cols-[1fr_auto_1fr] items-center", children: [_jsxs("div", { className: "flex items-center gap-item-xs justify-self-start", children: [isSidebarDrawerMode && (_jsx(Button, { type: "button", variant: ButtonVariants_Variant.GHOST, onClick: () => emit(FrontendEvents.HOTKEY_SIDEBAR_TOGGLE, {}), "aria-label": tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'toggleSidebar'), "data-component-type": "sidebar-drawer-trigger", className: "h-auto shrink-0 px-card-sm py-item-xs", children: renderIcon(StandardIconReference.MENU, { size: IconSize.SM }) })), renderConfigComponents(HorizontalPlacement.START)] }), _jsxs("div", { className: "flex items-center gap-item-xs min-w-0 px-item-xs", children: [renderConfigComponents(HorizontalPlacement.MIDDLE), renderMenubarItems()] }), _jsx("div", { className: "flex items-center gap-item-xs justify-self-end", children: renderConfigComponents(HorizontalPlacement.END) })] }), children && (_jsx("div", { className: cn('px-card py-card-sm', !isContinuousShell && 'border-t border-surface-sunken-border'), children: children }))] }) }));
+                : 'bg-surface-sunken text-surface-sunken-foreground border-b border-surface-sunken-border', menubarConfig.isOverlay && cn('absolute top-0 inset-inline-start-0 inset-inline-end-0 z-(--z-overlay)', overlayRecipe.base), menubarConfig.showMobileLayout ? 'px-card-sm py-item-xs' : 'px-card py-card-sm'), children: [_jsxs("div", { className: "grid w-full grid-cols-[1fr_auto_1fr] items-center", children: [_jsxs("div", { className: "flex items-center gap-item-xs justify-self-start", children: [isSidebarDrawerMode && (_jsx(Button, { type: "button", variant: ButtonVariants_Variant.GHOST, onClick: () => emit(FrontendEvents.HOTKEY_SIDEBAR_TOGGLE, {}), "aria-label": tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'toggleSidebar'), "aria-haspopup": "dialog", "data-component-type": "sidebar-drawer-trigger", className: "h-auto shrink-0 px-card-sm py-item-xs", children: renderIcon(StandardIconReference.MENU, { size: IconSize.SM }) })), renderBrandHeader(), renderConfigComponents(HorizontalPlacement.START)] }), _jsxs("div", { className: "flex items-center gap-item-xs min-w-0 px-item-xs", children: [renderConfigComponents(HorizontalPlacement.MIDDLE), renderMenubarItems()] }), _jsx("div", { className: "flex items-center gap-item-xs justify-self-end", children: renderConfigComponents(HorizontalPlacement.END) })] }), children && (_jsx("div", { className: cn('px-card py-card-sm', !isContinuousShell && 'border-t border-surface-sunken-border'), children: children }))] }) }));
 };
 //# sourceMappingURL=menubar.js.map

package/dist/esm/components/navigation/app-level/menubar.js.map

@@ -1 +1 @@
-{"version":3,"file":"menubar.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menubar.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Suspense } from 'react';\n\nimport {\n  ApplicationLevelComponentType,\n  ApplicationLevelProps_Menubar,\n  useI18n,\n  ComponentRegistryService,\n  useUI,\n  useMenuBarBehavior,\n  useHostedComponentInteractions,\n  useSidebarMobileDrawerMode,\n  useEventBus,\n  useIconRegistry,\n  FrontendEvents,\n  IconSize,\n  StandardIconReference,\n  envLoader,\n  Button,\n  ButtonVariants_Variant,\n  cn,\n  Surface,\n} from '@wildo-ai/saas-frontend-lib';\nimport { CorePresetNames, FrontendComponentType, HorizontalPlacement, ShellAppearance, SurfaceVariant, UIBehavior, VerticalPlacement } from '@wildo-ai/presets-components-models';\nimport { HostedTriggerAppearance } from '@wildo-ai/saas-frontend-lib';\n\nimport { Menubar } from '~wildo-presets/components/navigation/menu-bar';\n\nfunction humanizeMenubarGroup(group: string): string {\n  return group\n    .replace(/([a-z0-9])([A-Z])/g, '$1 $2')\n    .replace(/[-_]/g, ' ')\n    .trim()\n    .replace(/\\b\\w/g, character => character.toUpperCase());\n}\n\nexport const ApplicationLevelPreset_Menubar_Default: React.FC<ApplicationLevelProps_Menubar> = ({\n  mode,\n  children\n}) => {\n\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_MENUBAR });\n  const { UIConfig, getRecipe, shellAppearance } = useUI();\n  const overlayRecipe = getRecipe(UIBehavior.SURFACE, SurfaceVariant.OVERLAY);\n\n  const { containerComponents, items, menubarConfig } = useMenuBarBehavior({ mode });\n  // Mobile burger: while the sidebar operates as an overlay drawer (BURGER policy\n  // at/below its responsive breakpoint) nothing renders inline, so the menubar\n  // provides the drawer's opening affordance. State stays owned by the sidebar's\n  // behavior instance — the burger only speaks the existing toggle event.\n  const isSidebarDrawerMode = useSidebarMobileDrawerMode();\n  const { emit } = useEventBus();\n  const { renderIcon } = useIconRegistry();\n  // CONTINUOUS shell chrome: the menubar is a transparent strip of the shared\n  // canvas — no sunken slab, no separating border-b. The overlay mode keeps its\n  // own (opaque) recipe chrome: a floating bar must stay readable over content.\n  const isContinuousShell = shellAppearance === ShellAppearance.CONTINUOUS && !menubarConfig.isOverlay;\n  const { getHostedComponentProps } = useHostedComponentInteractions();\n  const currentBreakpoint = UIConfig?.currentBreakpoint;\n\n  if (!isReady) return null;\n\n  // ===================================================================\n  // Component Renderers\n  // ===================================================================\n\n  const renderResolvedComponent = (\n    instanceId: string,\n    appLevelType: ApplicationLevelComponentType,\n    frontendComponentType: FrontendComponentType,\n    placement: HorizontalPlacement | VerticalPlacement | undefined,\n    presetName?: string,\n    triggerWidth?: string | number,\n    triggerAppearance?: HostedTriggerAppearance,\n  ) => {\n    const Component = ComponentRegistryService.resolve(\n      frontendComponentType,\n      presetName ?? CorePresetNames.DEFAULT\n    );\n    if (!Component) return null;\n\n    return (\n      <Suspense key={instanceId} fallback={<div className=\"h-8 w-8 animate-pulse motion-reduce:animate-none bg-muted rounded\" aria-hidden=\"true\" />}>\n        <Component\n          {...getHostedComponentProps(appLevelType, instanceId)}\n          containerType={ApplicationLevelComponentType.MENUBAR}\n          containerPlacement={placement}\n          triggerWidth={triggerWidth}\n          // A COMPACT declaration renders the hosted trigger as an icon button —\n          // what belongs in a menubar cluster beside the bell and the avatar.\n          // Passed as the component's existing `compact` prop so a preset that\n          // already collapses for its own reasons (the sidebar's collapsed rail)\n          // keeps one meaning for \"render small\".\n          compact={triggerAppearance === HostedTriggerAppearance.COMPACT}\n        />\n      </Suspense>\n    );\n  };\n\n  const renderConfigComponents = (targetPlacement: HorizontalPlacement) => {\n    return containerComponents\n      .filter(comp => comp.placement === targetPlacement)\n      .map(comp => renderResolvedComponent(comp.instanceId, comp.component, comp.frontendComponentType, comp.placement, comp.presetName, comp.triggerWidth, comp.triggerAppearance));\n  };\n\n  const groupedItems = items.reduce((groups, item) => {\n    if (!item.group) {\n      return groups;\n    }\n\n    const existing = groups.get(item.group) ?? [];\n    existing.push(item);\n    groups.set(item.group, existing);\n    return groups;\n  }, new Map<string, typeof items>());\n\n  const renderMenubarItems = () => {\n    if (items.length === 0) {\n      return null;\n    }\n\n    const renderedGroups = new Set<string>();\n\n    return (\n      <div className=\"flex items-center gap-item-xs min-w-0\">\n        {items.map(item => {\n          if (!item.group) {\n            return (\n              <Button\n                key={item.id}\n                type=\"button\"\n                onClick={item.onExecute}\n                variant={ButtonVariants_Variant.GHOST}\n                className=\"h-auto gap-element px-card-sm py-item-xs text-sm font-medium\"\n              >\n                {item.icon && <span className=\"shrink-0\">{item.icon}</span>}\n                <span className=\"truncate\">{item.label}</span>\n              </Button>\n            );\n          }\n\n          if (renderedGroups.has(item.group)) {\n            return null;\n          }\n\n          renderedGroups.add(item.group);\n          const groupItems = groupedItems.get(item.group) ?? [];\n\n          return (\n            <Menubar\n              key={item.group}\n              className=\"h-auto gap-item-xs rounded-none border-0 bg-transparent p-0 shadow-none\"\n            >\n              <Menubar.Menu>\n                <Menubar.Trigger>{humanizeMenubarGroup(item.group)}</Menubar.Trigger>\n                <Menubar.Content>\n                  {groupItems.map(groupItem => (\n                    <Menubar.Item\n                      key={groupItem.id}\n                      onSelect={groupItem.onExecute}\n                    >\n                      {groupItem.icon && <span className=\"shrink-0\">{groupItem.icon}</span>}\n                      <span className=\"truncate\">{groupItem.label}</span>\n                    </Menubar.Item>\n                  ))}\n                </Menubar.Content>\n              </Menubar.Menu>\n            </Menubar>\n          );\n        })}\n      </div>\n    );\n  };\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  return (\n    <Surface\n      asChild\n      emitPolicyVars={false}\n      variant={menubarConfig.isOverlay ? SurfaceVariant.OVERLAY : SurfaceVariant.SUNKEN}\n    >\n      <div\n        data-component-area=\"menubar\"\n        data-component-type={ApplicationLevelComponentType.MENUBAR}\n        data-menubar-mode={menubarConfig.mode}\n        data-frontend-service-name={envLoader.loadEnvironmentConfig().frontendServiceName}\n        data-viewport={currentBreakpoint}\n        role=\"banner\"\n        aria-label={tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'menubarLabel')}\n        className={cn(\n          isContinuousShell\n            ? 'bg-transparent text-foreground'\n            : 'bg-surface-sunken text-surface-sunken-foreground border-b border-surface-sunken-border',\n          menubarConfig.isOverlay && cn('absolute top-0 inset-inline-start-0 inset-inline-end-0 z-(--z-overlay)', overlayRecipe.base),\n          menubarConfig.showMobileLayout ? 'px-card-sm py-item-xs' : 'px-card py-card-sm',\n        )}\n      >\n        {/*\n         * Three-zone bar as a GRID, not a flex sandwich. `flex-1 justify-center`\n         * centered the MIDDLE zone within the RESIDUAL space between the two\n         * side groups, so whenever START and END had different widths (the\n         * normal case — END carries bell + avatar while START may be empty at a\n         * root route) the \"centered\" content drifted off the bar's true center\n         * by (start − end)/2, and the drift changed as breakpoint-gated\n         * components appeared. `1fr auto 1fr` anchors the MIDDLE column to the\n         * bar's center whenever space allows, and degrades by pushing (never\n         * overlapping) when a side group genuinely needs more than half the\n         * remaining width.\n         */}\n        {/*\n         * The bar has NO fixed height — only padding — and it is an intrinsic\n         * flex item in the shell's `flex flex-col` column whose content area\n         * takes `flex-1`. So it GROWS to fit its tallest hosted control (a\n         * quick switcher declaring `LABEL_ABOVE` renders a stacked label ~63px\n         * tall) and the content area shrinks by exactly that much; `items-center`\n         * re-centres every shorter sibling in the taller row rather than\n         * top-aligning them. Do not pin a height here to \"stabilise\" the bar:\n         * that would clip the taller control instead of hosting it.\n         */}\n        <div className=\"grid w-full grid-cols-[1fr_auto_1fr] items-center\">\n          <div className=\"flex items-center gap-item-xs justify-self-start\">\n            {isSidebarDrawerMode && (\n              <Button\n                type=\"button\"\n                variant={ButtonVariants_Variant.GHOST}\n                onClick={() => emit(FrontendEvents.HOTKEY_SIDEBAR_TOGGLE, {})}\n                aria-label={tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'toggleSidebar')}\n                data-component-type=\"sidebar-drawer-trigger\"\n                className=\"h-auto shrink-0 px-card-sm py-item-xs\"\n              >\n                {renderIcon(StandardIconReference.MENU, { size: IconSize.SM })}\n              </Button>\n            )}\n            {renderConfigComponents(HorizontalPlacement.START)}\n          </div>\n\n          <div className=\"flex items-center gap-item-xs min-w-0 px-item-xs\">\n            {renderConfigComponents(HorizontalPlacement.MIDDLE)}\n            {renderMenubarItems()}\n          </div>\n\n          <div className=\"flex items-center gap-item-xs justify-self-end\">\n            {renderConfigComponents(HorizontalPlacement.END)}\n          </div>\n        </div>\n\n        {children && (\n          <div className={cn('px-card py-card-sm', !isContinuousShell && 'border-t border-surface-sunken-border')}>\n            {children}\n          </div>\n        )}\n      </div>\n    </Surface>\n  );\n};\n"]}
+{"version":3,"file":"menubar.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menubar.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { Suspense } from 'react';\n\nimport {\n  ApplicationLevelComponentType,\n  ApplicationLevelProps_Menubar,\n  useI18n,\n  ComponentRegistryService,\n  useUI,\n  useMenuBarBehavior,\n  useHostedComponentInteractions,\n  useSidebarMobileDrawerMode,\n  useEventBus,\n  useIconRegistry,\n  FrontendEvents,\n  IconSize,\n  StandardIconReference,\n  envLoader,\n  Button,\n  ButtonVariants_Variant,\n  cn,\n  Surface,\n  useBrandPresentation,\n  NavigationItemBadge,\n} from '@wildo-ai/saas-frontend-lib';\nimport { CorePresetNames, FrontendComponentType, HorizontalPlacement, SelectableVariant, ShellAppearance, ShellRegion, SurfaceVariant, UIBehavior, VerticalPlacement } from '@wildo-ai/presets-components-models';\nimport { HostedTriggerAppearance } from '@wildo-ai/saas-frontend-lib';\n\nimport { Menubar } from '~wildo-presets/components/navigation/menu-bar';\n\nexport const ApplicationLevelPreset_Menubar_Default: React.FC<ApplicationLevelProps_Menubar> = ({\n  mode,\n  children\n}) => {\n\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_MENUBAR });\n  const { UIConfig, getRecipe, shellAppearance } = useUI();\n  const overlayRecipe = getRecipe(UIBehavior.SURFACE, SurfaceVariant.OVERLAY);\n  /*\n   * Destination items take the theme's SELECTABLE/FILLED recipe — the same vocabulary the sidebar\n   * uses for \"the current destination\" — so a menubar-only shell reads which page it is on. Opt-in\n   * via `data-active`, appended after the GHOST recipe so the selected wash wins over GHOST's.\n   */\n  const selectableRecipe = getRecipe(UIBehavior.SELECTABLE, SelectableVariant.FILLED);\n  const itemStateClasses = cn(\n    selectableRecipe.states.hover,\n    selectableRecipe.states.selected,\n    selectableRecipe.motion.transition,\n  );\n\n  const { containerComponents, items, menubarConfig, brandHeader, isHomeActive, handleHomeClick } = useMenuBarBehavior({ mode });\n  /*\n   * The same four data decisions the sidebar's brand header takes (a failed mark degrading to the\n   * name, the latch resetting on a theme change, a wordmark replacing the name, nothing rendering\n   * for an empty identity) live once in `useBrandPresentation`; what stays here is layout. Called\n   * unconditionally, as a hook must be — `brandHeader` is `undefined` unless the config opted in,\n   * and the hook answers `isEmpty` for that.\n   */\n  const brand = useBrandPresentation(brandHeader);\n  // Mobile burger: while the sidebar operates as an overlay drawer (BURGER policy\n  // at/below its responsive breakpoint) nothing renders inline, so the menubar\n  // provides the drawer's opening affordance. State stays owned by the sidebar's\n  // behavior instance — the burger only speaks the existing toggle event.\n  const isSidebarDrawerMode = useSidebarMobileDrawerMode();\n  const { emit } = useEventBus();\n  const { renderIcon } = useIconRegistry();\n  // CONTINUOUS shell chrome: the menubar is a transparent strip of the shared\n  // canvas — no sunken slab, no separating border-b. The overlay mode keeps its\n  // own (opaque) recipe chrome: a floating bar must stay readable over content.\n  const isContinuousShell = shellAppearance === ShellAppearance.CONTINUOUS && !menubarConfig.isOverlay;\n  const { getHostedComponentProps } = useHostedComponentInteractions();\n  const currentBreakpoint = UIConfig?.currentBreakpoint;\n\n  if (!isReady) return null;\n\n  // ===================================================================\n  // Component Renderers\n  // ===================================================================\n\n  const renderResolvedComponent = (\n    instanceId: string,\n    appLevelType: ApplicationLevelComponentType,\n    frontendComponentType: FrontendComponentType,\n    placement: HorizontalPlacement | VerticalPlacement | undefined,\n    presetName?: string,\n    triggerWidth?: string | number,\n    triggerAppearance?: HostedTriggerAppearance,\n  ) => {\n    const Component = ComponentRegistryService.resolve(\n      frontendComponentType,\n      presetName ?? CorePresetNames.DEFAULT\n    );\n    if (!Component) return null;\n\n    return (\n      <Suspense key={instanceId} fallback={<div className=\"h-8 w-8 animate-pulse motion-reduce:animate-none bg-muted rounded\" aria-hidden=\"true\" />}>\n        <Component\n          {...getHostedComponentProps(appLevelType, instanceId)}\n          containerType={ApplicationLevelComponentType.MENUBAR}\n          containerPlacement={placement}\n          triggerWidth={triggerWidth}\n          // A COMPACT declaration renders the hosted trigger as an icon button —\n          // what belongs in a menubar cluster beside the bell and the avatar.\n          // Passed as the component's existing `compact` prop so a preset that\n          // already collapses for its own reasons (the sidebar's collapsed rail)\n          // keeps one meaning for \"render small\".\n          compact={triggerAppearance === HostedTriggerAppearance.COMPACT}\n        />\n      </Suspense>\n    );\n  };\n\n  const renderConfigComponents = (targetPlacement: HorizontalPlacement) => {\n    return containerComponents\n      .filter(comp => comp.placement === targetPlacement)\n      .map(comp => renderResolvedComponent(comp.instanceId, comp.component, comp.frontendComponentType, comp.placement, comp.presetName, comp.triggerWidth, comp.triggerAppearance));\n  };\n\n  const groupedItems = items.reduce((groups, item) => {\n    if (!item.group) {\n      return groups;\n    }\n\n    const existing = groups.get(item.group) ?? [];\n    existing.push(item);\n    groups.set(item.group, existing);\n    return groups;\n  }, new Map<string, typeof items>());\n\n  /**\n   * The identity as the HOME affordance at the start of the bar (`brandHeader: true`) — the\n   * horizontal counterpart of the sidebar's pinned brand header, for a shell that has no sidebar.\n   * Mark beside name; a WORDMARK/LOCKUP already spells the name and replaces it. `aria-current`\n   * stays truthful on the home route but NO `data-active`: the identity is not a menu item that\n   * lights up (the sidebar records the same decision).\n   */\n  const renderBrandHeader = () => {\n    if (!brandHeader || brand.isEmpty) return null;\n    const { name, logoUrl, hasMark, markCarriesName, onMarkError } = brand;\n    const showNameText = !(hasMark && markCarriesName);\n    return (\n      <Button\n        type=\"button\"\n        variant={ButtonVariants_Variant.GHOST}\n        onClick={handleHomeClick}\n        aria-current={isHomeActive ? 'page' : undefined}\n        aria-label={showNameText ? undefined : name}\n        data-slot=\"menubar-brand-header\"\n        className=\"h-auto min-w-0 shrink-0 gap-element px-card-sm py-item-xs text-sm font-semibold\"\n      >\n        {hasMark && logoUrl && (\n          <img\n            src={logoUrl}\n            alt={markCarriesName ? name : ''}\n            aria-hidden={markCarriesName ? undefined : 'true'}\n            onError={onMarkError}\n            className={markCarriesName ? 'h-6 w-auto' : 'size-6 shrink-0 object-contain'}\n          />\n        )}\n        {showNameText && <span className=\"truncate\">{name}</span>}\n      </Button>\n    );\n  };\n\n  const renderMenubarItems = () => {\n    if (items.length === 0) {\n      return null;\n    }\n\n    const renderedGroups = new Set<string>();\n\n    return (\n      <div className=\"flex items-center gap-item-xs min-w-0\">\n        {items.map(item => {\n          if (!item.group) {\n            return (\n              <Button\n                key={item.id}\n                type=\"button\"\n                onClick={item.onExecute}\n                variant={ButtonVariants_Variant.GHOST}\n                aria-current={item.isActive ? 'page' : undefined}\n                data-active={item.isActive || undefined}\n                data-nav-item-id={item.id}\n                className={cn('h-auto gap-element px-card-sm py-item-xs text-sm font-medium', itemStateClasses)}\n              >\n                {item.icon && <span className=\"shrink-0\">{item.icon}</span>}\n                <span className=\"truncate\">{item.label}</span>\n                {/* The destination's count, when it declares one — the sidebar row's badge, on the bar. */}\n                {item.notificationBadgeRef && (\n                  <span className=\"shrink-0\">\n                    <NavigationItemBadge notificationBadgeRef={item.notificationBadgeRef} label={item.label} />\n                  </span>\n                )}\n              </Button>\n            );\n          }\n\n          if (renderedGroups.has(item.group)) {\n            return null;\n          }\n\n          renderedGroups.add(item.group);\n          const groupItems = groupedItems.get(item.group) ?? [];\n\n          return (\n            <Menubar\n              key={item.group}\n              className=\"h-auto gap-item-xs rounded-none border-0 bg-transparent p-0 shadow-none\"\n            >\n              <Menubar.Menu>\n                {/*\n                  The group identifier AS AUTHORED. It used to be humanized into English here —\n                  `billingSettings` rendered as \"Billing Settings\" — which is display text produced\n                  by code: untranslatable, invisible to whoever owns the product's wording, and wrong\n                  on every acronym (`GDPR` became \"Gdpr\"). The identifier is what the application\n                  declared, so showing it unchanged is honest and makes an unlabelled group visibly\n                  unlabelled. Giving this trigger a label lookup is owed and needs a key per group.\n                */}\n                <Menubar.Trigger>{item.group}</Menubar.Trigger>\n                <Menubar.Content>\n                  {groupItems.map(groupItem => (\n                    <Menubar.Item\n                      key={groupItem.id}\n                      onSelect={groupItem.onExecute}\n                      aria-current={groupItem.isActive ? 'page' : undefined}\n                      data-active={groupItem.isActive || undefined}\n                      data-nav-item-id={groupItem.id}\n                    >\n                      {groupItem.icon && <span className=\"shrink-0\">{groupItem.icon}</span>}\n                      <span className=\"truncate\">{groupItem.label}</span>\n                      {groupItem.notificationBadgeRef && (\n                        <span className=\"ms-auto shrink-0\">\n                          <NavigationItemBadge notificationBadgeRef={groupItem.notificationBadgeRef} label={groupItem.label} />\n                        </span>\n                      )}\n                    </Menubar.Item>\n                  ))}\n                </Menubar.Content>\n              </Menubar.Menu>\n            </Menubar>\n          );\n        })}\n      </div>\n    );\n  };\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  return (\n    <Surface\n      asChild\n      emitPolicyVars={false}\n      variant={menubarConfig.isOverlay ? SurfaceVariant.OVERLAY : SurfaceVariant.SUNKEN}\n    >\n      <div\n        data-component-area={ShellRegion.MENUBAR}\n        data-component-type={ApplicationLevelComponentType.MENUBAR}\n        data-menubar-mode={menubarConfig.mode}\n        data-frontend-service-name={envLoader.loadEnvironmentConfig().frontendServiceName}\n        data-viewport={currentBreakpoint}\n        role=\"banner\"\n        aria-label={tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'menubarLabel')}\n        className={cn(\n          isContinuousShell\n            ? 'bg-transparent text-foreground'\n            : 'bg-surface-sunken text-surface-sunken-foreground border-b border-surface-sunken-border',\n          menubarConfig.isOverlay && cn('absolute top-0 inset-inline-start-0 inset-inline-end-0 z-(--z-overlay)', overlayRecipe.base),\n          menubarConfig.showMobileLayout ? 'px-card-sm py-item-xs' : 'px-card py-card-sm',\n        )}\n      >\n        {/*\n         * Three-zone bar as a GRID, not a flex sandwich. `flex-1 justify-center`\n         * centered the MIDDLE zone within the RESIDUAL space between the two\n         * side groups, so whenever START and END had different widths (the\n         * normal case — END carries bell + avatar while START may be empty at a\n         * root route) the \"centered\" content drifted off the bar's true center\n         * by (start − end)/2, and the drift changed as breakpoint-gated\n         * components appeared. `1fr auto 1fr` anchors the MIDDLE column to the\n         * bar's center whenever space allows, and degrades by pushing (never\n         * overlapping) when a side group genuinely needs more than half the\n         * remaining width.\n         */}\n        {/*\n         * The bar has NO fixed height — only padding — and it is an intrinsic\n         * flex item in the shell's `flex flex-col` column whose content area\n         * takes `flex-1`. So it GROWS to fit its tallest hosted control (a\n         * quick switcher declaring `LABEL_ABOVE` renders a stacked label ~63px\n         * tall) and the content area shrinks by exactly that much; `items-center`\n         * re-centres every shorter sibling in the taller row rather than\n         * top-aligning them. Do not pin a height here to \"stabilise\" the bar:\n         * that would clip the taller control instead of hosting it.\n         */}\n        <div className=\"grid w-full grid-cols-[1fr_auto_1fr] items-center\">\n          <div className=\"flex items-center gap-item-xs justify-self-start\">\n            {isSidebarDrawerMode && (\n              <Button\n                type=\"button\"\n                variant={ButtonVariants_Variant.GHOST}\n                onClick={() => emit(FrontendEvents.HOTKEY_SIDEBAR_TOGGLE, {})}\n                aria-label={tComponent(FrontendComponentType.APPLICATION_LEVEL_MENUBAR, 'toggleSidebar')}\n                // It opens the sidebar as a MODAL sheet, so it announces a dialog. `aria-expanded` is the\n                // disclosure pattern (the desktop collapse button uses it); a modal takes focus and\n                // returns it, which is what `aria-haspopup=\"dialog\"` tells assistive technology.\n                aria-haspopup=\"dialog\"\n                data-component-type=\"sidebar-drawer-trigger\"\n                className=\"h-auto shrink-0 px-card-sm py-item-xs\"\n              >\n                {renderIcon(StandardIconReference.MENU, { size: IconSize.SM })}\n              </Button>\n            )}\n            {renderBrandHeader()}\n            {renderConfigComponents(HorizontalPlacement.START)}\n          </div>\n\n          <div className=\"flex items-center gap-item-xs min-w-0 px-item-xs\">\n            {renderConfigComponents(HorizontalPlacement.MIDDLE)}\n            {renderMenubarItems()}\n          </div>\n\n          <div className=\"flex items-center gap-item-xs justify-self-end\">\n            {renderConfigComponents(HorizontalPlacement.END)}\n          </div>\n        </div>\n\n        {children && (\n          <div className={cn('px-card py-card-sm', !isContinuousShell && 'border-t border-surface-sunken-border')}>\n            {children}\n          </div>\n        )}\n      </div>\n    </Surface>\n  );\n};\n"]}

package/dist/esm/components/navigation/app-level/menubar.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menubar.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/menubar.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAO7C,eAAO,MAAM,6BAA6B,EAAE,mBAAmB,EAI9D,CAAC"}
+{"version":3,"file":"menubar.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/menubar.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAO7C,eAAO,MAAM,6BAA6B,EAAE,mBAAmB,EAI9D,CAAC"}

package/dist/esm/components/navigation/app-level/navigation-back.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-back.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/navigation-back.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,KAAK,EAAE,oCAAoC,EAAE,MAAM,6BAA6B,CAAC;AAExF,eAAO,MAAM,6CAA6C,EAAE,KAAK,CAAC,EAAE,CAAC,oCAAoC,CAwCxG,CAAC"}
+{"version":3,"file":"navigation-back.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/navigation-back.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAe1B,OAAO,KAAK,EAAE,oCAAoC,EAAE,MAAM,6BAA6B,CAAC;AAExF,eAAO,MAAM,6CAA6C,EAAE,KAAK,CAAC,EAAE,CAAC,oCAAoC,CAmExG,CAAC"}

package/dist/esm/components/navigation/app-level/navigation-back.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ButtonSize, FrontendComponentType } from '@wildo-ai/presets-components-models';
-import { useI18n, useIconRegistry, useNavigationController, useNavigationState, resolveApplicationLevelNavigationBackZone, StandardIconReference, IconSize, Button, ButtonVariants_Variant, } from '@wildo-ai/saas-frontend-lib';
+import { NavigationZoneName } from '@wildo-ai/saas-models';
+import { useI18n, useIconRegistry, useNavigationController, useNavigationState, NavigationZone, resolveApplicationLevelNavigationBackZone, StandardIconReference, IconSize, Button, ButtonVariants_Variant, } from '@wildo-ai/saas-frontend-lib';
 export const ApplicationLevelPreset_NavigationBack_Default = ({ navigationZone, 
 // V-7: drop the raw `hover:bg-muted` default — the Button GHOST recipe owns
 // the hover/focus/active treatment (theme-aware, focus-ring honored). Pass-
@@ -9,16 +10,41 @@ export const ApplicationLevelPreset_NavigationBack_Default = ({ navigationZone,
 className, ariaLabel, }) => {
     const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK });
     const { renderIcon } = useIconRegistry();
-    const { focusedZone } = useNavigationState();
+    const { focusedZone, getZoneDepth } = useNavigationState();
     const { goBack, canGoBack } = useNavigationController();
-    const resolvedZone = resolveApplicationLevelNavigationBackZone(navigationZone, focusedZone);
-    if (!canGoBack(resolvedZone)) {
+    const resolvedZone = resolveApplicationLevelNavigationBackZone(navigationZone, focusedZone, getZoneDepth(focusedZone) > 0);
+    /*
+     * ─── Hide the control when the gesture would do NOTHING ─────────────────────────────────────────
+     *
+     * In the PRIMARY zone there is nothing to walk back to below the first entry, so the control hides.
+     *
+     * In an ADJACENT zone — a hosted pane beside a page — a single entry is still something to leave:
+     * `goBack` on a structural zone with nothing beneath is the controller's own way of closing it, and
+     * without that a one-entry pane had no close control at all (the workbench's conversation found it,
+     * 2026-09-22). The label stays "back": the gesture returns the page to what it was.
+     *
+     * ── The OVERLAY layer is neither of those, and folding it into "not primary" shipped a DEAD
+     *    CONTROL (2026-09-25). ──
+     *
+     * A scoped controller — the settings hub is the live one — hosts its own section stack inside an
+     * overlay and answers `canGoBack` from its own depth. At a section ROOT that is `false`, and its
+     * `goBack` dispatches a pop its reducer returns unchanged. The guard above tested
+     * `=== PRIMARY`, so an OVERLAY zone fell through it: the root of every settings section rendered an
+     * enabled, focusable back arrow that did nothing on click. The comment claiming "the root (list)
+     * has nothing to pop, so it shows none" described behaviour that did not happen.
+     *
+     * A structural PANE is the only case where "nothing beneath" still means something to do, because
+     * closing the pane is that something. An overlay has its own dismiss chrome.
+     */
+    const zoneClosesOnBack = resolvedZone !== NavigationZoneName.PRIMARY
+        && resolvedZone !== NavigationZone.OVERLAY;
+    if (!canGoBack(resolvedZone) && !zoneClosesOnBack) {
         return null;
     }
     if (!isReady)
         return null;
     const backIcon = renderIcon(StandardIconReference.BACK, { size: IconSize.SM });
     const label = ariaLabel || tComponent(FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK, 'back');
-    return (_jsx(Button, { type: "button", variant: ButtonVariants_Variant.GHOST, size: ButtonSize.ICON_SM, onClick: () => goBack(resolvedZone), className: className, "aria-label": label, children: backIcon }));
+    return (_jsx(Button, { type: "button", variant: ButtonVariants_Variant.GHOST, size: ButtonSize.ICON_SM, onClick: () => goBack(resolvedZone), className: className, "aria-label": label, "data-navigation-back": resolvedZone, children: backIcon }));
 };
 //# sourceMappingURL=navigation-back.js.map

package/dist/esm/components/navigation/app-level/navigation-back.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-back.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/navigation-back.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAExF,OAAO,EACL,OAAO,EACP,eAAe,EACf,uBAAuB,EACvB,kBAAkB,EAClB,yCAAyC,EACzC,qBAAqB,EAAE,QAAQ,EAC/B,MAAM,EAAE,sBAAsB,GAC/B,MAAM,6BAA6B,CAAC;AAIrC,MAAM,CAAC,MAAM,6CAA6C,GAAmD,CAAC,EAC5G,cAAc;AACd,4EAA4E;AAC5E,4EAA4E;AAC5E,yEAAyE;AACzE,+CAA+C;AAC/C,SAAS,EACT,SAAS,GACV,EAAE,EAAE;IACH,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,EAAE,SAAS,EAAE,qBAAqB,CAAC,iCAAiC,EAAE,CAAC,CAAC;IAChH,MAAM,EAAE,UAAU,EAAE,GAAG,eAAe,EAAE,CAAC;IACzC,MAAM,EAAE,WAAW,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAC7C,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,uBAAuB,EAAE,CAAC;IACxD,MAAM,YAAY,GAAG,yCAAyC,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC;IAE5F,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,CAAC;QAC7B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,MAAM,QAAQ,GAAG,UAAU,CACzB,qBAAqB,CAAC,IAAI,EAC1B,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,EAAE,CACtB,CAAC;IAEF,MAAM,KAAK,GAAG,SAAS,IAAI,UAAU,CAAC,qBAAqB,CAAC,iCAAiC,EAAE,MAAM,CAAC,CAAC;IAEvG,OAAO,CACL,KAAC,MAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,OAAO,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,EACnC,SAAS,EAAE,SAAS,gBACR,KAAK,YAEhB,QAAQ,GACF,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { ButtonSize, FrontendComponentType } from '@wildo-ai/presets-components-models';\n\nimport {\n  useI18n,\n  useIconRegistry,\n  useNavigationController,\n  useNavigationState,\n  resolveApplicationLevelNavigationBackZone,\n  StandardIconReference, IconSize,\n  Button, ButtonVariants_Variant,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport type { ApplicationLevelProps_NavigationBack } from '@wildo-ai/saas-frontend-lib';\n\nexport const ApplicationLevelPreset_NavigationBack_Default: React.FC<ApplicationLevelProps_NavigationBack> = ({\n  navigationZone,\n  // V-7: drop the raw `hover:bg-muted` default — the Button GHOST recipe owns\n  // the hover/focus/active treatment (theme-aware, focus-ring honored). Pass-\n  // through `className` is still respected for downstream layout overrides\n  // but the default is empty so the recipe wins.\n  className,\n  ariaLabel,\n}) => {\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK });\n  const { renderIcon } = useIconRegistry();\n  const { focusedZone } = useNavigationState();\n  const { goBack, canGoBack } = useNavigationController();\n  const resolvedZone = resolveApplicationLevelNavigationBackZone(navigationZone, focusedZone);\n\n  if (!canGoBack(resolvedZone)) {\n    return null;\n  }\n\n  if (!isReady) return null;\n\n  const backIcon = renderIcon(\n    StandardIconReference.BACK,\n    { size: IconSize.SM }\n  );\n\n  const label = ariaLabel || tComponent(FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK, 'back');\n\n  return (\n    <Button\n      type=\"button\"\n      variant={ButtonVariants_Variant.GHOST}\n      size={ButtonSize.ICON_SM}\n      onClick={() => goBack(resolvedZone)}\n      className={className}\n      aria-label={label}\n    >\n      {backIcon}\n    </Button>\n  );\n};\n"]}
+{"version":3,"file":"navigation-back.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/navigation-back.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAExF,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EACL,OAAO,EACP,eAAe,EACf,uBAAuB,EACvB,kBAAkB,EAClB,cAAc,EACd,yCAAyC,EACzC,qBAAqB,EAAE,QAAQ,EAC/B,MAAM,EAAE,sBAAsB,GAC/B,MAAM,6BAA6B,CAAC;AAIrC,MAAM,CAAC,MAAM,6CAA6C,GAAmD,CAAC,EAC5G,cAAc;AACd,4EAA4E;AAC5E,4EAA4E;AAC5E,yEAAyE;AACzE,+CAA+C;AAC/C,SAAS,EACT,SAAS,GACV,EAAE,EAAE;IACH,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,EAAE,SAAS,EAAE,qBAAqB,CAAC,iCAAiC,EAAE,CAAC,CAAC;IAChH,MAAM,EAAE,UAAU,EAAE,GAAG,eAAe,EAAE,CAAC;IACzC,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAC3D,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,uBAAuB,EAAE,CAAC;IACxD,MAAM,YAAY,GAAG,yCAAyC,CAAC,cAAc,EAAE,WAAW,EAAE,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC;IAE3H;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,MAAM,gBAAgB,GAAG,YAAY,KAAK,kBAAkB,CAAC,OAAO;WAC/D,YAAY,KAAK,cAAc,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAClD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,MAAM,QAAQ,GAAG,UAAU,CACzB,qBAAqB,CAAC,IAAI,EAC1B,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,EAAE,CACtB,CAAC;IAEF,MAAM,KAAK,GAAG,SAAS,IAAI,UAAU,CAAC,qBAAqB,CAAC,iCAAiC,EAAE,MAAM,CAAC,CAAC;IAEvG,OAAO,CACL,KAAC,MAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,sBAAsB,CAAC,KAAK,EACrC,IAAI,EAAE,UAAU,CAAC,OAAO,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,EACnC,SAAS,EAAE,SAAS,gBACR,KAAK,0BAEK,YAAY,YAEjC,QAAQ,GACF,CACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { ButtonSize, FrontendComponentType } from '@wildo-ai/presets-components-models';\n\nimport { NavigationZoneName } from '@wildo-ai/saas-models';\nimport {\n  useI18n,\n  useIconRegistry,\n  useNavigationController,\n  useNavigationState,\n  NavigationZone,\n  resolveApplicationLevelNavigationBackZone,\n  StandardIconReference, IconSize,\n  Button, ButtonVariants_Variant,\n} from '@wildo-ai/saas-frontend-lib';\n\nimport type { ApplicationLevelProps_NavigationBack } from '@wildo-ai/saas-frontend-lib';\n\nexport const ApplicationLevelPreset_NavigationBack_Default: React.FC<ApplicationLevelProps_NavigationBack> = ({\n  navigationZone,\n  // V-7: drop the raw `hover:bg-muted` default — the Button GHOST recipe owns\n  // the hover/focus/active treatment (theme-aware, focus-ring honored). Pass-\n  // through `className` is still respected for downstream layout overrides\n  // but the default is empty so the recipe wins.\n  className,\n  ariaLabel,\n}) => {\n  const { tComponent, isReady } = useI18n({ component: FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK });\n  const { renderIcon } = useIconRegistry();\n  const { focusedZone, getZoneDepth } = useNavigationState();\n  const { goBack, canGoBack } = useNavigationController();\n  const resolvedZone = resolveApplicationLevelNavigationBackZone(navigationZone, focusedZone, getZoneDepth(focusedZone) > 0);\n\n  /*\n   * ─── Hide the control when the gesture would do NOTHING ─────────────────────────────────────────\n   *\n   * In the PRIMARY zone there is nothing to walk back to below the first entry, so the control hides.\n   *\n   * In an ADJACENT zone — a hosted pane beside a page — a single entry is still something to leave:\n   * `goBack` on a structural zone with nothing beneath is the controller's own way of closing it, and\n   * without that a one-entry pane had no close control at all (the workbench's conversation found it,\n   * 2026-09-22). The label stays \"back\": the gesture returns the page to what it was.\n   *\n   * ── The OVERLAY layer is neither of those, and folding it into \"not primary\" shipped a DEAD\n   *    CONTROL (2026-09-25). ──\n   *\n   * A scoped controller — the settings hub is the live one — hosts its own section stack inside an\n   * overlay and answers `canGoBack` from its own depth. At a section ROOT that is `false`, and its\n   * `goBack` dispatches a pop its reducer returns unchanged. The guard above tested\n   * `=== PRIMARY`, so an OVERLAY zone fell through it: the root of every settings section rendered an\n   * enabled, focusable back arrow that did nothing on click. The comment claiming \"the root (list)\n   * has nothing to pop, so it shows none\" described behaviour that did not happen.\n   *\n   * A structural PANE is the only case where \"nothing beneath\" still means something to do, because\n   * closing the pane is that something. An overlay has its own dismiss chrome.\n   */\n  const zoneClosesOnBack = resolvedZone !== NavigationZoneName.PRIMARY\n    && resolvedZone !== NavigationZone.OVERLAY;\n  if (!canGoBack(resolvedZone) && !zoneClosesOnBack) {\n    return null;\n  }\n\n  if (!isReady) return null;\n\n  const backIcon = renderIcon(\n    StandardIconReference.BACK,\n    { size: IconSize.SM }\n  );\n\n  const label = ariaLabel || tComponent(FrontendComponentType.APPLICATION_LEVEL_NAVIGATION_BACK, 'back');\n\n  return (\n    <Button\n      type=\"button\"\n      variant={ButtonVariants_Variant.GHOST}\n      size={ButtonSize.ICON_SM}\n      onClick={() => goBack(resolvedZone)}\n      className={className}\n      aria-label={label}\n      /* An automation hook, i18n-independent, like `data-nav-item-id` on the sidebar: the zone this control walks back. */\n      data-navigation-back={resolvedZone}\n    >\n      {backIcon}\n    </Button>\n  );\n};\n"]}

package/dist/esm/components/navigation/app-level/navigation-back.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-back.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/navigation-back.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,oCAAoC,EAAE,mBAAmB,EAErE,CAAC"}
+{"version":3,"file":"navigation-back.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/navigation-back.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,oCAAoC,EAAE,mBAAmB,EAErE,CAAC"}

package/dist/esm/components/navigation/app-level/notification-center.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-center.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/notification-center.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAgBL,wCAAwC,EACzC,MAAM,6BAA6B,CAAC;AA2BrC,eAAO,MAAM,iDAAiD,EAAE,KAAK,CAAC,EAAE,CAAC,wCAAwC,CA0NhH,CAAC"}
+{"version":3,"file":"notification-center.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/notification-center.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAgBL,wCAAwC,EACzC,MAAM,6BAA6B,CAAC;AA2BrC,eAAO,MAAM,iDAAiD,EAAE,KAAK,CAAC,EAAE,CAAC,wCAAwC,CA0NhH,CAAC"}

package/dist/esm/components/navigation/app-level/notification-center.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification-center.js","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/notification-center.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ButtonSize, FrontendComponentType, HorizontalPlacement, InteractiveVariant, PlacementSide, SurfaceVariant, UIBehavior, VerticalPlacement } from '@wildo-ai/presets-components-models';\nimport { HorizontalAlign } from '@wildo-ai/zod-decorators';\n\nimport {\n  resolveComponentLabel,\n  useI18n,\n  useIconRegistry,\n  useNotificationCenterBehavior,\n  IconSize,\n  StandardIconReference,\n  useUI,\n  Button,\n  ButtonVariants_Variant,\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n  ScrollArea,\n  cn,\n  Surface,\n  ApplicationLevelProps_NotificationCenter,\n} from '@wildo-ai/saas-frontend-lib';\n\nfunction getNotificationTypeColorClass(type: 'success' | 'warning' | 'error' | 'info'): string {\n  switch (type) {\n    case 'success': return 'text-success';\n    case 'warning': return 'text-warning';\n    case 'error': return 'text-destructive';\n    case 'info':\n    default: return 'text-info';\n  }\n}\n\nfunction getPopoverPlacement(\n  placement?: ApplicationLevelProps_NotificationCenter['placement'],\n): { align: HorizontalAlign; side: PlacementSide } {\n  switch (placement) {\n    case HorizontalPlacement.START:\n      return { align: HorizontalAlign.START, side: PlacementSide.BOTTOM };\n    case VerticalPlacement.BOTTOM:\n      return { align: HorizontalAlign.END, side: PlacementSide.TOP };\n    case VerticalPlacement.TOP:\n    case HorizontalPlacement.END:\n    default:\n      return { align: HorizontalAlign.END, side: PlacementSide.BOTTOM };\n  }\n}\n\nexport const ApplicationLevelPreset_NotificationCenter_Default: React.FC<ApplicationLevelProps_NotificationCenter> = ({\n  placement,\n  isOpen: externalIsOpen,\n  onOpenChange,\n  listenForHotkeys,\n}) => {\n  const behavior = useNotificationCenterBehavior(externalIsOpen, onOpenChange, { listenForHotkeys });\n  const { tComponent, isReady } = useI18n({\n    component: FrontendComponentType.APPLICATION_LEVEL_NOTIFICATION_CENTER,\n  });\n  const { renderIcon } = useIconRegistry();\n  const { getRecipe } = useUI();\n  const ghostRecipe = getRecipe(UIBehavior.INTERACTIVE, InteractiveVariant.GHOST);\n\n  /*\n   * A SESSION FEED, not a message history (#412).\n   *\n   * The filter tabs, the mark-all-read control, the unread emphasis and the today/yesterday/older\n   * grouping were removed on 2026-09-08. Every one of them presented a history over a store that is a\n   * `useReducer` with no hydration: it starts empty on each page load, so \"unread\" meant \"arrived\n   * since you opened the tab\", marking something read died with the page, and the `older` group was\n   * unreachable by construction.\n   */\n  const {\n    isOpen,\n    setIsOpen,\n    sessionNotifications,\n    notificationCount,\n    handleClearAll,\n    dismissNotification,\n  } = behavior;\n\n  // ===================================================================\n  // I18n Labels\n  // ===================================================================\n\n  // I-7: no English fallbacks — missing keys surface as `components.<type>.<key>`\n  // for translation debugging (intentional, framework-wide i18n discipline).\n  const t = (key: string): string => resolveComponentLabel({\n    tComponent,\n    componentType: FrontendComponentType.APPLICATION_LEVEL_NOTIFICATION_CENTER,\n    key,\n  });\n  const titleLabel = t('title');\n  /*\n   * Says the feed is empty because the page just loaded, not that nothing has happened (#412). The\n   * distinction matters: a person who left a tab open, reloaded, and now sees \"No notifications\"\n   * would reasonably conclude the system had been quiet.\n   */\n  const noNotificationsLabel = t('noNotificationsThisSession');\n  const clearAllLabel = t('clearAll');\n  const dismissLabel = t('dismiss');\n  const popoverPlacement = getPopoverPlacement(placement);\n\n  // ===================================================================\n  // Icons\n  // ===================================================================\n\n  const bellIcon = renderIcon(\n    StandardIconReference.NOTIFICATION,\n    { size: IconSize.MD }\n  );\n\n  const dismissIcon = renderIcon(\n    StandardIconReference.CLOSE,\n    { size: IconSize.XS }\n  );\n\n  // ===================================================================\n  // Render Notification Item\n  // ===================================================================\n\n  const renderNotificationItem = (notification: typeof sessionNotifications[number]) => {\n    const typeIcon = renderIcon(\n      notification.iconReference,\n      { size: IconSize.SM }\n    );\n    const rowLabel = notification.displayTitle || 'Notification';\n\n    return (\n      <Surface key={notification.id} asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n        <div\n          className={cn(\n            'group flex items-start gap-field-sm rounded-lg p-card-sm',\n            ghostRecipe.motion.transition,\n            ghostRecipe.states.hover,\n          )}\n        >\n          {/* Type Icon */}\n          <div className={`flex-shrink-0 mt-0.5 ${getNotificationTypeColorClass(notification.type)}`}>\n            {typeIcon}\n          </div>\n\n          {/* Content */}\n          <div className=\"flex-1 min-w-0\">\n            <div className=\"flex items-start justify-between gap-element\">\n              {/*\n                * A DIV, not a button. The row's only action was `handleNotificationClick`, whose sole\n                * effect was marking it read — so once read state went, a button here would announce an\n                * interactive control to a screen reader and then do nothing. The dismiss control and\n                * the optional next-step button beside it remain the row's real actions.\n                */}\n              <div className=\"min-w-0 flex-1 text-start\">\n                <p className=\"text-sm font-medium text-foreground\">\n                  {notification.displayTitle}\n                </p>\n                {notification.displayMessage && (\n                  <p className=\"mt-0.5 truncate text-xs text-muted-foreground\">\n                    {notification.displayMessage}\n                  </p>\n                )}\n                <p className=\"mt-item-xs text-xs text-muted-foreground\">\n                  {notification.relativeTimeLabel}\n                </p>\n              </div>\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.SM}\n                onClick={() => dismissNotification(notification.id)}\n                className=\"h-5 w-5 p-0 opacity-70 group-hover:opacity-100 hover:opacity-100 focus-visible:opacity-100 pointer-coarse:opacity-100\"\n                aria-label={dismissLabel}\n              >\n                {dismissIcon}\n              </Button>\n            </div>\n            {notification.nextStep && (\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.XS}\n                onClick={() => {\n                  setIsOpen(false);\n                  notification.nextStep?.onClick();\n                }}\n                className=\"mt-item-xs\"\n              >\n                {notification.nextStep.label}\n              </Button>\n            )}\n          </div>\n\n        </div>\n      </Surface>\n    );\n  };\n\n  // ===================================================================\n  // Render Notification Group\n  // ===================================================================\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  if (!isReady) return null;\n\n  return (\n    <div data-component-type=\"notification-center\">\n      <Popover open={isOpen} onOpenChange={setIsOpen}>\n        <PopoverTrigger asChild>\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            className=\"relative\"\n            aria-label={titleLabel}\n          >\n            {bellIcon}\n          </Button>\n        </PopoverTrigger>\n\n        <PopoverContent\n          align={popoverPlacement.align}\n          side={popoverPlacement.side}\n          className=\"w-80 p-0\"\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between p-card-sm border-b\">\n            <h3 className=\"font-semibold\">\n              {titleLabel}\n            </h3>\n            <div className=\"flex items-center gap-item-xs\">\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.XS}\n                onClick={handleClearAll}\n                disabled={notificationCount === 0}\n              >\n                {clearAllLabel}\n              </Button>\n            </div>\n          </div>\n\n          {/* Notifications list */}\n          <ScrollArea className=\"h-[400px]\">\n            <div className=\"p-card-sm space-y-field-sm\">\n              {sessionNotifications.length === 0 ? (\n                <div className=\"flex flex-col items-center justify-center py-section-xl text-center\">\n                  <div className=\"text-muted-foreground mb-element\">\n                    {renderIcon(\n                      StandardIconReference.MAIL,\n                      { size: IconSize.LG }\n                    )}\n                  </div>\n                  <p className=\"text-sm text-muted-foreground\">\n                    {noNotificationsLabel}\n                  </p>\n                </div>\n              ) : (\n                /* Flat, newest first. Nothing to group by: the buffer has no yesterday. */\n                <div className=\"space-y-item-xs\">\n                  {sessionNotifications.map(renderNotificationItem)}\n                </div>\n              )}\n            </div>\n          </ScrollArea>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"notification-center.js","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/notification-center.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { ButtonSize, FrontendComponentType, HorizontalPlacement, InteractiveVariant, PlacementSide, SurfaceVariant, UIBehavior, VerticalPlacement } from '@wildo-ai/presets-components-models';\nimport { HorizontalAlign } from '@wildo-ai/zod-decorators';\n\nimport {\n  resolveComponentLabel,\n  useI18n,\n  useIconRegistry,\n  useNotificationCenterBehavior,\n  IconSize,\n  StandardIconReference,\n  useUI,\n  Button,\n  ButtonVariants_Variant,\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n  ScrollArea,\n  cn,\n  Surface,\n  ApplicationLevelProps_NotificationCenter,\n} from '@wildo-ai/saas-frontend-lib';\n\nfunction getNotificationTypeColorClass(type: 'success' | 'warning' | 'error' | 'info'): string {\n  switch (type) {\n    case 'success': return 'text-success';\n    case 'warning': return 'text-warning';\n    case 'error': return 'text-destructive';\n    case 'info':\n    default: return 'text-info';\n  }\n}\n\nfunction getPopoverPlacement(\n  placement?: ApplicationLevelProps_NotificationCenter['placement'],\n): { align: HorizontalAlign; side: PlacementSide } {\n  switch (placement) {\n    case HorizontalPlacement.START:\n      return { align: HorizontalAlign.START, side: PlacementSide.BOTTOM };\n    case VerticalPlacement.BOTTOM:\n      return { align: HorizontalAlign.END, side: PlacementSide.TOP };\n    case VerticalPlacement.TOP:\n    case HorizontalPlacement.END:\n    default:\n      return { align: HorizontalAlign.END, side: PlacementSide.BOTTOM };\n  }\n}\n\nexport const ApplicationLevelPreset_NotificationCenter_Default: React.FC<ApplicationLevelProps_NotificationCenter> = ({\n  placement,\n  isOpen: externalIsOpen,\n  onOpenChange,\n  listenForHotkeys,\n}) => {\n  const behavior = useNotificationCenterBehavior(externalIsOpen, onOpenChange, { listenForHotkeys });\n  const { tComponent, isReady } = useI18n({\n    component: FrontendComponentType.APPLICATION_LEVEL_NOTIFICATION_CENTER,\n  });\n  const { renderIcon } = useIconRegistry();\n  const { getRecipe } = useUI();\n  const ghostRecipe = getRecipe(UIBehavior.INTERACTIVE, InteractiveVariant.GHOST);\n\n  /*\n   * A SESSION FEED, not a message history (#412).\n   *\n   * The filter tabs, the mark-all-read control, the unread emphasis and the today/yesterday/older\n   * grouping were removed on 2026-09-08. Every one of them presented a history over a store that is a\n   * `useReducer` with no hydration: it starts empty on each page load, so \"unread\" meant \"arrived\n   * since you opened the tab\", marking something read died with the page, and the `older` group was\n   * unreachable by construction.\n   */\n  const {\n    isOpen,\n    setIsOpen,\n    sessionNotifications,\n    notificationCount,\n    handleClearAll,\n    dismissNotification,\n  } = behavior;\n\n  // ===================================================================\n  // I18n Labels\n  // ===================================================================\n\n  // I-7: no English fallbacks — missing keys surface as `components.<type>.<key>`\n  // for translation debugging (intentional, framework-wide i18n discipline).\n  const t = (key: string): string => resolveComponentLabel({\n    tComponent,\n    componentType: FrontendComponentType.APPLICATION_LEVEL_NOTIFICATION_CENTER,\n    key,\n  });\n  const titleLabel = t('title');\n  /*\n   * Says the feed is empty because the page just loaded, not that nothing has happened (#412). The\n   * distinction matters: a person who left a tab open, reloaded, and now sees \"No notifications\"\n   * would reasonably conclude the system had been quiet.\n   */\n  const noNotificationsLabel = t('noNotificationsThisSession');\n  const clearAllLabel = t('clearAll');\n  const dismissLabel = t('dismiss');\n  const popoverPlacement = getPopoverPlacement(placement);\n\n  // ===================================================================\n  // Icons\n  // ===================================================================\n\n  const bellIcon = renderIcon(\n    StandardIconReference.NOTIFICATION,\n    { size: IconSize.MD }\n  );\n\n  const dismissIcon = renderIcon(\n    StandardIconReference.CLOSE,\n    { size: IconSize.XS }\n  );\n\n  // ===================================================================\n  // Render Notification Item\n  // ===================================================================\n\n  const renderNotificationItem = (notification: typeof sessionNotifications[number]) => {\n    const typeIcon = renderIcon(\n      notification.iconReference,\n      { size: IconSize.SM }\n    );\n    const rowLabel = notification.displayTitle || 'Notification';\n\n    return (\n      <Surface key={notification.id} asChild emitPolicyVars={false} variant={SurfaceVariant.INSET}>\n        <div\n          className={cn(\n            'group flex items-start gap-field-sm rounded-lg p-card-sm',\n            ghostRecipe.motion.transition,\n            ghostRecipe.states.hover,\n          )}\n        >\n          {/* Type Icon */}\n          <div className={`flex-shrink-0 mt-0.5 ${getNotificationTypeColorClass(notification.type)}`}>\n            {typeIcon}\n          </div>\n\n          {/* Content */}\n          <div className=\"flex-1 min-w-0\">\n            <div className=\"flex items-start justify-between gap-element\">\n              {/*\n                * A DIV, not a button. The row's only action was `handleNotificationClick`, whose sole\n                * effect was marking it read — so once read state went, a button here would announce an\n                * interactive control to a screen reader and then do nothing. The dismiss control and\n                * the optional next-step button beside it remain the row's real actions.\n                */}\n              <div className=\"min-w-0 flex-1 text-start\">\n                <p className=\"text-sm font-medium text-foreground\">\n                  {notification.displayTitle}\n                </p>\n                {notification.displayMessage && (\n                  <p className=\"mt-0.5 truncate text-xs text-muted-foreground\">\n                    {notification.displayMessage}\n                  </p>\n                )}\n                <p className=\"mt-item-xs text-xs text-muted-foreground\">\n                  {notification.relativeTimeLabel}\n                </p>\n              </div>\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.SM}\n                onClick={() => dismissNotification(notification.id)}\n                className=\"h-5 w-5 p-0 opacity-70 group-hover:opacity-100 hover:opacity-100 focus-visible:opacity-100 pointer-coarse:opacity-100\"\n                aria-label={dismissLabel}\n              >\n                {dismissIcon}\n              </Button>\n            </div>\n            {notification.nextStep && (\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.XS}\n                onClick={() => {\n                  setIsOpen(false);\n                  notification.nextStep?.onClick();\n                }}\n                className=\"mt-item-xs\"\n              >\n                {notification.nextStep.label}\n              </Button>\n            )}\n          </div>\n\n        </div>\n      </Surface>\n    );\n  };\n\n  // ===================================================================\n  // Render Notification Group\n  // ===================================================================\n\n  // ===================================================================\n  // Render\n  // ===================================================================\n\n  if (!isReady) return null;\n\n  return (\n    <div data-component-type=\"notification-center\">\n      <Popover open={isOpen} onOpenChange={setIsOpen}>\n        <PopoverTrigger asChild>\n          <Button\n            variant={ButtonVariants_Variant.GHOST}\n            size={ButtonSize.SM}\n            className=\"relative\"\n            aria-label={titleLabel}\n          >\n            {bellIcon}\n          </Button>\n        </PopoverTrigger>\n\n        <PopoverContent\n          align={popoverPlacement.align}\n          side={popoverPlacement.side}\n          className=\"w-80 p-0\"\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between p-card-sm border-b\">\n            <h3 className=\"font-semibold\">\n              {titleLabel}\n            </h3>\n            <div className=\"flex items-center gap-item-xs\">\n              <Button\n                variant={ButtonVariants_Variant.GHOST}\n                size={ButtonSize.XS}\n                onClick={handleClearAll}\n                disabled={notificationCount === 0}\n              >\n                {clearAllLabel}\n              </Button>\n            </div>\n          </div>\n\n          {/* Notifications list */}\n          <ScrollArea className=\"h-[400px]\">\n            <div className=\"p-card-sm space-y-field-sm\">\n              {sessionNotifications.length === 0 ? (\n                <div className=\"flex flex-col items-center justify-center py-section-xl text-center\">\n                  <div className=\"text-muted-foreground mb-element\">\n                    {renderIcon(\n                      StandardIconReference.MAIL,\n                      { size: IconSize.LG }\n                    )}\n                  </div>\n                  <p className=\"text-sm text-muted-foreground\">\n                    {noNotificationsLabel}\n                  </p>\n                </div>\n              ) : (\n                /* Flat, newest first. Nothing to group by: the buffer has no yesterday. */\n                <div className=\"space-y-item-xs\">\n                  {sessionNotifications.map(renderNotificationItem)}\n                </div>\n              )}\n            </div>\n          </ScrollArea>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n};\n"]}

package/dist/esm/components/navigation/app-level/notification-center.labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-center.labels.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/app-level/notification-center.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,wCAAwC,EAAE,mBAAmB,EA0DzE,CAAC"}
+{"version":3,"file":"notification-center.labels.d.ts","sourceRoot":"","sources":["../../../../../../src/components/navigation/app-level/notification-center.labels.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,mBAAmB,EAEzB,MAAM,qCAAqC,CAAC;AAM7C,eAAO,MAAM,wCAAwC,EAAE,mBAAmB,EAyEzE,CAAC"}