@sesionario/blocks 1.17.0 → 1.17.1

package/dist/index.d.cts

@@ -246,8 +246,11 @@ type LanguageSwitcherProps = {
 declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, }: LanguageSwitcherProps): React.JSX.Element;
 
 type PlatformNavbarProps = {
-    /** Brand mark (isotype). Typically a link to the member app home. */
-    logo: ReactNode;
+    /**
+     * Brand mark (isotype). Typically a link to the member app home.
+     * Omit in shells that already brand the sidebar.
+     */
+    logo?: ReactNode;
     /** Optional control before the center (e.g. SidebarTrigger). */
     leading?: ReactNode;
     /** Flex-growing center slot (tabs, subtitle). Horizontally scrollable. */
@@ -259,7 +262,7 @@ type PlatformNavbarProps = {
     innerClassName?: string;
 };
 /**
- * Shared sticky top chrome: logo | optional leading | scrollable center | fixed right.
+ * Shared sticky top chrome: optional logo | optional leading | scrollable center | fixed right.
  * Apps inject search, notifications, and the account menu into `right`.
  */
 declare function PlatformNavbar({ logo, leading, center, right, className, innerClassName, }: PlatformNavbarProps): React.JSX.Element;
@@ -293,7 +296,6 @@ type PlatformAccountMenuUrls = {
     authAppUrl: string;
     appUrl: string;
     adminUrl: string;
-    backofficeUrl: string;
     loginPath?: string;
     accountPath?: string;
     activityPath?: string;
@@ -305,15 +307,6 @@ type PlatformAccountMenuLabels = {
     personalProfile: string;
     activity: string;
     professionalProfile: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    mainApp: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    orgManagement: string;
-    backoffice: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    memberOrgs: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    managementOrgs: string;
     showMoreOrgs: string;
     showLessOrgs: string;
     manageOrg: string;
@@ -339,8 +332,6 @@ type PlatformAccountMenuProps = {
     /** While session is resolving. */
     isPending?: boolean;
     user?: PlatformAccountMenuUser | null;
-    /** Platform admin (JWT role includes admin). Enables Backoffice link. */
-    isAdmin?: boolean;
     verificationStatus?: ProfessionalVerificationStatus;
     urls: PlatformAccountMenuUrls;
     memberOrgs?: PlatformAccountMenuOrg[];
@@ -368,7 +359,7 @@ type PlatformAccountMenuProps = {
  * Cross-app account / settings menu. Guest trigger is a settings cog;
  * signed-in trigger is the user avatar.
  */
-declare function PlatformAccountMenu({ variant, isPending, user, isAdmin, verificationStatus, urls, memberOrgs, manageableOrgs, languages, currentLanguage, onLanguageChange, labels: labelsProp, onSignOut, extraItems, trigger: triggerProp, contentSide, contentAlign, contentSideOffset, contentClassName, className, }: PlatformAccountMenuProps): React.JSX.Element;
+declare function PlatformAccountMenu({ variant, isPending, user, verificationStatus, urls, memberOrgs, manageableOrgs, languages, currentLanguage, onLanguageChange, labels: labelsProp, onSignOut, extraItems, trigger: triggerProp, contentSide, contentAlign, contentSideOffset, contentClassName, className, }: PlatformAccountMenuProps): React.JSX.Element;
 
 declare function DropdownMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
     inset?: boolean;

package/dist/index.d.ts

@@ -246,8 +246,11 @@ type LanguageSwitcherProps = {
 declare function LanguageSwitcher({ languages: propLanguages, currentLanguage: propCurrentLanguage, onLanguageChange: propOnLanguageChange, labels, className, size, shape, variant, showIcon, align, side, }: LanguageSwitcherProps): React.JSX.Element;
 
 type PlatformNavbarProps = {
-    /** Brand mark (isotype). Typically a link to the member app home. */
-    logo: ReactNode;
+    /**
+     * Brand mark (isotype). Typically a link to the member app home.
+     * Omit in shells that already brand the sidebar.
+     */
+    logo?: ReactNode;
     /** Optional control before the center (e.g. SidebarTrigger). */
     leading?: ReactNode;
     /** Flex-growing center slot (tabs, subtitle). Horizontally scrollable. */
@@ -259,7 +262,7 @@ type PlatformNavbarProps = {
     innerClassName?: string;
 };
 /**
- * Shared sticky top chrome: logo | optional leading | scrollable center | fixed right.
+ * Shared sticky top chrome: optional logo | optional leading | scrollable center | fixed right.
  * Apps inject search, notifications, and the account menu into `right`.
  */
 declare function PlatformNavbar({ logo, leading, center, right, className, innerClassName, }: PlatformNavbarProps): React.JSX.Element;
@@ -293,7 +296,6 @@ type PlatformAccountMenuUrls = {
     authAppUrl: string;
     appUrl: string;
     adminUrl: string;
-    backofficeUrl: string;
     loginPath?: string;
     accountPath?: string;
     activityPath?: string;
@@ -305,15 +307,6 @@ type PlatformAccountMenuLabels = {
     personalProfile: string;
     activity: string;
     professionalProfile: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    mainApp: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    orgManagement: string;
-    backoffice: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    memberOrgs: string;
-    /** @deprecated Unused; kept so apps can pass labels without breaking. */
-    managementOrgs: string;
     showMoreOrgs: string;
     showLessOrgs: string;
     manageOrg: string;
@@ -339,8 +332,6 @@ type PlatformAccountMenuProps = {
     /** While session is resolving. */
     isPending?: boolean;
     user?: PlatformAccountMenuUser | null;
-    /** Platform admin (JWT role includes admin). Enables Backoffice link. */
-    isAdmin?: boolean;
     verificationStatus?: ProfessionalVerificationStatus;
     urls: PlatformAccountMenuUrls;
     memberOrgs?: PlatformAccountMenuOrg[];
@@ -368,7 +359,7 @@ type PlatformAccountMenuProps = {
  * Cross-app account / settings menu. Guest trigger is a settings cog;
  * signed-in trigger is the user avatar.
  */
-declare function PlatformAccountMenu({ variant, isPending, user, isAdmin, verificationStatus, urls, memberOrgs, manageableOrgs, languages, currentLanguage, onLanguageChange, labels: labelsProp, onSignOut, extraItems, trigger: triggerProp, contentSide, contentAlign, contentSideOffset, contentClassName, className, }: PlatformAccountMenuProps): React.JSX.Element;
+declare function PlatformAccountMenu({ variant, isPending, user, verificationStatus, urls, memberOrgs, manageableOrgs, languages, currentLanguage, onLanguageChange, labels: labelsProp, onSignOut, extraItems, trigger: triggerProp, contentSide, contentAlign, contentSideOffset, contentClassName, className, }: PlatformAccountMenuProps): React.JSX.Element;
 
 declare function DropdownMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
     inset?: boolean;

package/dist/index.js

@@ -1,7 +1,7 @@
 "use client";
 import * as React7 from 'react';
 import { createContext, useContext, useState, useRef, useEffect, useLayoutEffect, useCallback, useMemo, useId } from 'react';
-import { ChevronsUpDown, CheckIcon, Smile, SearchIcon, Search, Clock, Flag, Hash, Lightbulb, Trophy, Plane, Apple, Leaf, Hand, Loader2, AlertTriangle, Inbox, X, ChevronLeft, ChevronRight, Monitor, Sun, Moon, Building2, Check, Plus, Languages, BadgeCheck, Settings, User, Activity, LayoutDashboard, LogOut, LogIn, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, Pencil, Play, AlertCircle, VolumeX, Pause, Volume1, Volume2, PictureInPicture2, Minimize, Maximize, ArrowDownIcon, MessageCircleDashedIcon, MessageCircle, ChevronUp, ChevronDown, XIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';
+import { ChevronsUpDown, CheckIcon, Smile, SearchIcon, Search, Clock, Flag, Hash, Lightbulb, Trophy, Plane, Apple, Leaf, Hand, Loader2, AlertTriangle, Inbox, X, ChevronLeft, ChevronRight, Monitor, Sun, Moon, Building2, Check, Plus, Languages, BadgeCheck, Settings, User, Activity, LogOut, LogIn, Upload, Move, ZoomOut, ZoomIn, RotateCcw, RotateCw, Grid3X3, RefreshCw, Pencil, Play, AlertCircle, VolumeX, Pause, Volume1, Volume2, PictureInPicture2, Minimize, Maximize, ArrowDownIcon, MessageCircleDashedIcon, MessageCircle, ChevronUp, ChevronDown, XIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { cva } from 'class-variance-authority';
@@ -1715,7 +1715,7 @@ function PlatformNavbar({
             innerClassName
           ),
           children: [
-            /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-2", children: logo }),
+            logo != null && logo !== false ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-2", children: logo }) : null,
             leading ? /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-2", children: leading }) : null,
             /* @__PURE__ */ jsx(
               "div",
@@ -1800,11 +1800,6 @@ var defaultLabels3 = {
   personalProfile: "Personal profile",
   activity: "Activity",
   professionalProfile: "Professional profile",
-  mainApp: "Main app",
-  orgManagement: "Organization management",
-  backoffice: "Backoffice",
-  memberOrgs: "My organizations",
-  managementOrgs: "Management team",
   showMoreOrgs: "Show more",
   showLessOrgs: "Show less",
   manageOrg: "Manage organization",
@@ -1883,9 +1878,9 @@ function LanguageThemeSubs({
   const themeValue = theme ?? "system";
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(DropdownMenuSub, { children: [
-      /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "gap-2", children: [
-        /* @__PURE__ */ jsx(Languages, { className: "size-4" }),
-        labels.language
+      /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "gap-2 [&>svg:last-child]:ml-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.language }),
+        /* @__PURE__ */ jsx(Languages, { className: "size-4" })
       ] }),
       /* @__PURE__ */ jsx(DropdownMenuSubContent, { className: "min-w-40", children: /* @__PURE__ */ jsx(
         DropdownMenuRadioGroup,
@@ -1897,9 +1892,9 @@ function LanguageThemeSubs({
       ) })
     ] }),
     /* @__PURE__ */ jsxs(DropdownMenuSub, { children: [
-      /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "gap-2", children: [
-        themeValue === "light" ? /* @__PURE__ */ jsx(Sun, { className: "size-4" }) : themeValue === "dark" ? /* @__PURE__ */ jsx(Moon, { className: "size-4" }) : /* @__PURE__ */ jsx(Monitor, { className: "size-4" }),
-        labels.theme
+      /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "gap-2 [&>svg:last-child]:ml-0", children: [
+        /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.theme }),
+        themeValue === "light" ? /* @__PURE__ */ jsx(Sun, { className: "size-4" }) : themeValue === "dark" ? /* @__PURE__ */ jsx(Moon, { className: "size-4" }) : /* @__PURE__ */ jsx(Monitor, { className: "size-4" })
       ] }),
       /* @__PURE__ */ jsx(DropdownMenuSubContent, { className: "min-w-40", children: /* @__PURE__ */ jsxs(DropdownMenuRadioGroup, { value: themeValue, onValueChange: setTheme, children: [
         /* @__PURE__ */ jsx(DropdownMenuRadioItem, { value: "system", children: labels.themeSystem }),
@@ -1933,14 +1928,14 @@ function OrgMenuRows({
           return /* @__PURE__ */ jsxs(
             "div",
             {
-              className: "relative flex items-center",
+              className: "relative",
               "data-testid": `platform-account-org-${org.id}`,
               children: [
                 /* @__PURE__ */ jsx(
                   DropdownMenuItem,
                   {
                     asChild: true,
-                    className: cn("min-w-0 flex-1 gap-2", org.canManage && "pr-9"),
+                    className: cn("gap-2", org.canManage && "pr-9"),
                     children: /* @__PURE__ */ jsxs("a", { href: orgHomeHref, children: [
                       /* @__PURE__ */ jsx(
                         MenuAvatar,
@@ -1950,7 +1945,7 @@ function OrgMenuRows({
                           sizeClass: "size-6"
                         }
                       ),
-                      /* @__PURE__ */ jsx("span", { className: "truncate", children: org.name })
+                      /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: org.name })
                     ] })
                   }
                 ),
@@ -1958,8 +1953,8 @@ function OrgMenuRows({
                   DropdownMenuItem,
                   {
                     asChild: true,
-                    className: "absolute right-1 top-1/2 size-7 -translate-y-1/2 p-0",
-                    children: /* @__PURE__ */ jsx("a", { href: manageHref, "aria-label": labels.manageOrg, children: /* @__PURE__ */ jsx(Settings, { className: "size-3.5" }) })
+                    className: "absolute right-0.5 top-1/2 size-7 -translate-y-1/2 p-0",
+                    children: /* @__PURE__ */ jsx("a", { href: manageHref, "aria-label": labels.manageOrg, children: /* @__PURE__ */ jsx(Settings, { className: "size-4" }) })
                   }
                 ) : null
               ]
@@ -1967,7 +1962,7 @@ function OrgMenuRows({
             org.id
           );
         }),
-        collapsible ? /* @__PURE__ */ jsx(
+        collapsible ? /* @__PURE__ */ jsxs(
           DropdownMenuItem,
           {
             className: "gap-2",
@@ -1975,13 +1970,10 @@ function OrgMenuRows({
               event.preventDefault();
               setExpanded((value) => !value);
             },
-            children: expanded ? /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(ChevronUp, { className: "size-4" }),
-              labels.showLessOrgs
-            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" }),
-              labels.showMoreOrgs
-            ] })
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: expanded ? labels.showLessOrgs : labels.showMoreOrgs }),
+              expanded ? /* @__PURE__ */ jsx(ChevronUp, { className: "size-4" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" })
+            ]
           }
         ) : null
       ]
@@ -1992,7 +1984,6 @@ function PlatformAccountMenu({
   variant = "platform",
   isPending = false,
   user = null,
-  isAdmin = false,
   verificationStatus = "unverified",
   urls,
   memberOrgs = [],
@@ -2016,6 +2007,7 @@ function PlatformAccountMenu({
     () => mergePlatformAccountOrgs(memberOrgs, manageableOrgs),
     [memberOrgs, manageableOrgs]
   );
+  const hasOrgs = mergedOrgs.length > 0;
   const loginHref = `${urls.authAppUrl}${urls.loginPath ?? "/login"}`;
   const accountHref = `${urls.authAppUrl}${urls.accountPath ?? "/account"}`;
   const activityHref = `${urls.authAppUrl}${urls.activityPath ?? "/account/activity"}`;
@@ -2095,37 +2087,36 @@ function PlatformAccountMenu({
           ] }),
           /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
           variant === "platform" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            hasOrgs ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                OrgMenuRows,
+                {
+                  orgs: mergedOrgs,
+                  appUrl: urls.appUrl,
+                  adminUrl: urls.adminUrl,
+                  labels
+                }
+              ),
+              /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+            ] }) : null,
             /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: accountHref, children: [
-              /* @__PURE__ */ jsx(User, { className: "size-4" }),
-              labels.personalProfile
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.personalProfile }),
+              /* @__PURE__ */ jsx(User, { className: "size-4" })
             ] }) }),
             /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: activityHref, children: [
-              /* @__PURE__ */ jsx(Activity, { className: "size-4" }),
-              labels.activity
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.activity }),
+              /* @__PURE__ */ jsx(Activity, { className: "size-4" })
             ] }) }),
             /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: profileHref, children: [
-              /* @__PURE__ */ jsx(User, { className: "size-4" }),
-              labels.professionalProfile
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.professionalProfile }),
+              /* @__PURE__ */ jsx(User, { className: "size-4" })
             ] }) }),
-            /* @__PURE__ */ jsx(
-              OrgMenuRows,
-              {
-                orgs: mergedOrgs,
-                appUrl: urls.appUrl,
-                adminUrl: urls.adminUrl,
-                labels
-              }
-            ),
             extraItems,
-            isAdmin && urls.backofficeUrl ? /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: urls.backofficeUrl, children: [
-              /* @__PURE__ */ jsx(LayoutDashboard, { className: "size-4" }),
-              labels.backoffice
-            ] }) }) : null,
             /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
           ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: accountHref, children: [
-              /* @__PURE__ */ jsx(Settings, { className: "size-4" }),
-              labels.accountSettings
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.accountSettings }),
+              /* @__PURE__ */ jsx(Settings, { className: "size-4" })
             ] }) }),
             extraItems,
             /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
@@ -2150,8 +2141,8 @@ function PlatformAccountMenu({
                 void handleSignOut();
               },
               children: [
-                /* @__PURE__ */ jsx(LogOut, { className: "size-4" }),
-                signingOut ? labels.signingOut : labels.signOut
+                /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: signingOut ? labels.signingOut : labels.signOut }),
+                /* @__PURE__ */ jsx(LogOut, { className: "size-4" })
               ]
             }
           )
@@ -2167,8 +2158,8 @@ function PlatformAccountMenu({
           ),
           /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
           /* @__PURE__ */ jsx(DropdownMenuItem, { asChild: true, className: "gap-2", children: /* @__PURE__ */ jsxs("a", { href: loginHref, children: [
-            /* @__PURE__ */ jsx(LogIn, { className: "size-4" }),
-            labels.signIn
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labels.signIn }),
+            /* @__PURE__ */ jsx(LogIn, { className: "size-4" })
           ] }) })
         ] })
       }
@@ -7241,6 +7232,7 @@ function SupportMessengerProvider({
   className
 }) {
   const isMobile = useMediaQuery2("(max-width: 767px)");
+  const dockRef = useRef(null);
   const [listOpen, setListOpen] = useState(false);
   const [threads, setThreads] = useState([]);
   const [mobileThreadKey, setMobileThreadKey] = useState(null);
@@ -7248,6 +7240,7 @@ function SupportMessengerProvider({
     () => items.reduce((sum, item) => sum + (item.unreadCount ?? 0), 0),
     [items]
   );
+  const isDesktopOpen = !isMobile && (listOpen || threads.length > 0);
   useEffect(() => {
     if (!forceMinimized) return;
     setListOpen(false);
@@ -7290,6 +7283,20 @@ function SupportMessengerProvider({
     setThreads([]);
     setMobileThreadKey(null);
   }, []);
+  useEffect(() => {
+    if (!isDesktopOpen) return;
+    function onPointerDown(event) {
+      const target = event.target;
+      if (!(target instanceof Node)) return;
+      if (dockRef.current?.contains(target)) return;
+      if (target instanceof Element && target.closest('[data-slot="popover-content"]')) {
+        return;
+      }
+      closeAll();
+    }
+    document.addEventListener("pointerdown", onPointerDown);
+    return () => document.removeEventListener("pointerdown", onPointerDown);
+  }, [isDesktopOpen, closeAll]);
   const ctx = useMemo(
     () => ({
       listOpen,
@@ -7333,6 +7340,7 @@ function SupportMessengerProvider({
     enabled ? /* @__PURE__ */ jsxs(
       "div",
       {
+        ref: dockRef,
         className: cn(
           "pointer-events-none fixed right-4 bottom-4 z-50 flex flex-col items-end gap-3",
           className