@broberg/app-shell 0.9.2 → 0.10.1

package/dist/preact.d.cts

@@ -237,6 +237,9 @@ declare const TEXT: {
         readonly closeMenu: "Luk menu";
         readonly home: "Forside";
         readonly language: "Sprog";
+        readonly zoom: "Zoom";
+        readonly zoomOut: "Zoom ud";
+        readonly zoomIn: "Zoom ind";
         readonly couldNotMarkAll: "Kunne ikke markere alle som læst. Prøv igen.";
         readonly collapse: "Skjul sidemenu";
         readonly expand: "Vis sidemenu";
@@ -305,6 +308,9 @@ declare const TEXT: {
         readonly closeMenu: "Close menu";
         readonly home: "Home";
         readonly language: "Language";
+        readonly zoom: "Zoom";
+        readonly zoomOut: "Zoom out";
+        readonly zoomIn: "Zoom in";
         readonly couldNotMarkAll: "Could not mark all as read. Try again.";
         readonly collapse: "Hide sidebar";
         readonly expand: "Show sidebar";
@@ -412,6 +418,8 @@ interface SidebarProps {
     /** localStorage key for which items with children are open (F092.5). */
     itemsKey?: string;
     lang: Lang;
+    /** F092.15 — rendered at the very bottom of the sidebar (the user menu in "sidebar-footer"). */
+    bottom?: ComponentChildren;
 }
 declare function Sidebar(p: SidebarProps): JSX.Element;
 interface NotificationBellProps {
@@ -427,6 +435,8 @@ interface ShellUser {
     email?: string;
     /** Broberg ID OIDC `picture`. Without it: initials. Never Gravatar (D-1dc849). */
     picture?: string;
+    /** F092.15 — a line under the name, e.g. «Administrator · Enhed Nord». */
+    subtitle?: string;
 }
 interface UserMenuItem {
     id: string;
@@ -434,6 +444,19 @@ interface UserMenuItem {
     icon?: Icon;
     href?: string;
     onSelect?: () => void;
+    /** F092.15 — right-aligned hint, e.g. a shortcut «⌘K». The app owns the shortcut itself. */
+    hint?: string;
+}
+/** F092.15 — a radio group in the user menu (organisation, unit, area …). The app owns the choice. */
+interface UserMenuSection {
+    id: string;
+    label: string;
+    items: {
+        id: string;
+        label: string;
+        hint?: string;
+        checked?: boolean;
+    }[];
 }
 interface UserMenuProps {
     user: ShellUser;
@@ -456,6 +479,19 @@ interface UserMenuProps {
         }[];
         onChange: (id: string) => void;
     };
+    /** F092.15 — radio groups shown after your items; a pick calls onSectionSelect and closes the menu. */
+    sections?: UserMenuSection[];
+    onSectionSelect?: (sectionId: string, itemId: string) => void;
+    /** F092.15 — a «Zoom» row: − / value % / +. The app owns the value (percent). */
+    zoom?: {
+        value: number;
+        onChange: (value: number) => void;
+        min?: number;
+        max?: number;
+        step?: number;
+    };
+    /** F092.15 — where the shell put the menu. "sidebar-footer" opens upward. Set by AppShell. */
+    placement?: "topbar" | "sidebar-footer";
     lang: Lang;
 }
 declare function Avatar({ user, size }: {
@@ -518,7 +554,12 @@ interface AppShellProps {
     /** The notification centre's source. The bell is shown either way. */
     notifications?: NotificationSource;
     user?: ShellUser;
-    userMenu?: Omit<UserMenuProps, "user" | "lang" | "onNavigate">;
+    userMenu?: Omit<UserMenuProps, "user" | "lang" | "onNavigate" | "placement">;
+    /**
+     * F092.15 — where the user menu sits. "topbar" (default): the content's top row
+     * (or the full-width bar). "sidebar-footer": the bottom of the sidebar, opening upward.
+     */
+    userMenuPlacement?: "topbar" | "sidebar-footer";
     /** Phone behaviour: a slide-in drawer, or a 60px icon rail. */
     mobile?: "drawer" | "rail";
     /**
@@ -641,4 +682,4 @@ interface ConfirmDialogProps {
 }
 declare function ConfirmDialog(p: ConfirmDialogProps): JSX.Element | null;
 
-export { AVATAR_MAX_BYTES, AVATAR_TYPES, type AccountAdapter, AccountError, AccountPage, type AccountPageProps, type AccountProfile, type AnalyticsAdapter, type AnalyticsData, type AnalyticsDay, AnalyticsError, AnalyticsPage, type AnalyticsPageProps, AppShell, type AppShellProps, Avatar, ConfirmDialog, type ConfirmDialogProps, type Lang, type NavGroup, type NavItem, type Navigate, NotificationBell, type NotificationBellProps, type NotificationSource, PageHeader, type PageTab, PageTabs, type PreactNavGroup, type PreactNavItem, type ShellUser, Sidebar, type SidebarProps, TEXT, type TenantAdapter, TenantLoadError, type TenantMembershipRow, TenantSwitcher, type TenantSwitcherProps, TopBar, type TopBarProps, UserMenu, type UserMenuItem, type UserMenuProps, accountErrorKind, activeNavLabel, analyticsErrorKind, badgeLabel, changePct, checkAvatarFile, copenhagenDay, createFetchAccountAdapter, createFetchAnalyticsAdapter, createFetchNotificationSource, createFetchTenantAdapter, createMemoryNotificationSource, defaultReauthHref, fillDays, initials, isActivePath, isExternal, readFlag, readSet, relativeTime, safeNavigate, useIsMobile, writeFlag, writeSet };
+export { AVATAR_MAX_BYTES, AVATAR_TYPES, type AccountAdapter, AccountError, AccountPage, type AccountPageProps, type AccountProfile, type AnalyticsAdapter, type AnalyticsData, type AnalyticsDay, AnalyticsError, AnalyticsPage, type AnalyticsPageProps, AppShell, type AppShellProps, Avatar, ConfirmDialog, type ConfirmDialogProps, type Lang, type NavGroup, type NavItem, type Navigate, NotificationBell, type NotificationBellProps, type NotificationSource, PageHeader, type PageTab, PageTabs, type PreactNavGroup, type PreactNavItem, type ShellUser, Sidebar, type SidebarProps, TEXT, type TenantAdapter, TenantLoadError, type TenantMembershipRow, TenantSwitcher, type TenantSwitcherProps, TopBar, type TopBarProps, UserMenu, type UserMenuItem, type UserMenuProps, type UserMenuSection, accountErrorKind, activeNavLabel, analyticsErrorKind, badgeLabel, changePct, checkAvatarFile, copenhagenDay, createFetchAccountAdapter, createFetchAnalyticsAdapter, createFetchNotificationSource, createFetchTenantAdapter, createMemoryNotificationSource, defaultReauthHref, fillDays, initials, isActivePath, isExternal, readFlag, readSet, relativeTime, safeNavigate, useIsMobile, writeFlag, writeSet };

package/dist/preact.d.ts

@@ -237,6 +237,9 @@ declare const TEXT: {
         readonly closeMenu: "Luk menu";
         readonly home: "Forside";
         readonly language: "Sprog";
+        readonly zoom: "Zoom";
+        readonly zoomOut: "Zoom ud";
+        readonly zoomIn: "Zoom ind";
         readonly couldNotMarkAll: "Kunne ikke markere alle som læst. Prøv igen.";
         readonly collapse: "Skjul sidemenu";
         readonly expand: "Vis sidemenu";
@@ -305,6 +308,9 @@ declare const TEXT: {
         readonly closeMenu: "Close menu";
         readonly home: "Home";
         readonly language: "Language";
+        readonly zoom: "Zoom";
+        readonly zoomOut: "Zoom out";
+        readonly zoomIn: "Zoom in";
         readonly couldNotMarkAll: "Could not mark all as read. Try again.";
         readonly collapse: "Hide sidebar";
         readonly expand: "Show sidebar";
@@ -412,6 +418,8 @@ interface SidebarProps {
     /** localStorage key for which items with children are open (F092.5). */
     itemsKey?: string;
     lang: Lang;
+    /** F092.15 — rendered at the very bottom of the sidebar (the user menu in "sidebar-footer"). */
+    bottom?: ComponentChildren;
 }
 declare function Sidebar(p: SidebarProps): JSX.Element;
 interface NotificationBellProps {
@@ -427,6 +435,8 @@ interface ShellUser {
     email?: string;
     /** Broberg ID OIDC `picture`. Without it: initials. Never Gravatar (D-1dc849). */
     picture?: string;
+    /** F092.15 — a line under the name, e.g. «Administrator · Enhed Nord». */
+    subtitle?: string;
 }
 interface UserMenuItem {
     id: string;
@@ -434,6 +444,19 @@ interface UserMenuItem {
     icon?: Icon;
     href?: string;
     onSelect?: () => void;
+    /** F092.15 — right-aligned hint, e.g. a shortcut «⌘K». The app owns the shortcut itself. */
+    hint?: string;
+}
+/** F092.15 — a radio group in the user menu (organisation, unit, area …). The app owns the choice. */
+interface UserMenuSection {
+    id: string;
+    label: string;
+    items: {
+        id: string;
+        label: string;
+        hint?: string;
+        checked?: boolean;
+    }[];
 }
 interface UserMenuProps {
     user: ShellUser;
@@ -456,6 +479,19 @@ interface UserMenuProps {
         }[];
         onChange: (id: string) => void;
     };
+    /** F092.15 — radio groups shown after your items; a pick calls onSectionSelect and closes the menu. */
+    sections?: UserMenuSection[];
+    onSectionSelect?: (sectionId: string, itemId: string) => void;
+    /** F092.15 — a «Zoom» row: − / value % / +. The app owns the value (percent). */
+    zoom?: {
+        value: number;
+        onChange: (value: number) => void;
+        min?: number;
+        max?: number;
+        step?: number;
+    };
+    /** F092.15 — where the shell put the menu. "sidebar-footer" opens upward. Set by AppShell. */
+    placement?: "topbar" | "sidebar-footer";
     lang: Lang;
 }
 declare function Avatar({ user, size }: {
@@ -518,7 +554,12 @@ interface AppShellProps {
     /** The notification centre's source. The bell is shown either way. */
     notifications?: NotificationSource;
     user?: ShellUser;
-    userMenu?: Omit<UserMenuProps, "user" | "lang" | "onNavigate">;
+    userMenu?: Omit<UserMenuProps, "user" | "lang" | "onNavigate" | "placement">;
+    /**
+     * F092.15 — where the user menu sits. "topbar" (default): the content's top row
+     * (or the full-width bar). "sidebar-footer": the bottom of the sidebar, opening upward.
+     */
+    userMenuPlacement?: "topbar" | "sidebar-footer";
     /** Phone behaviour: a slide-in drawer, or a 60px icon rail. */
     mobile?: "drawer" | "rail";
     /**
@@ -641,4 +682,4 @@ interface ConfirmDialogProps {
 }
 declare function ConfirmDialog(p: ConfirmDialogProps): JSX.Element | null;
 
-export { AVATAR_MAX_BYTES, AVATAR_TYPES, type AccountAdapter, AccountError, AccountPage, type AccountPageProps, type AccountProfile, type AnalyticsAdapter, type AnalyticsData, type AnalyticsDay, AnalyticsError, AnalyticsPage, type AnalyticsPageProps, AppShell, type AppShellProps, Avatar, ConfirmDialog, type ConfirmDialogProps, type Lang, type NavGroup, type NavItem, type Navigate, NotificationBell, type NotificationBellProps, type NotificationSource, PageHeader, type PageTab, PageTabs, type PreactNavGroup, type PreactNavItem, type ShellUser, Sidebar, type SidebarProps, TEXT, type TenantAdapter, TenantLoadError, type TenantMembershipRow, TenantSwitcher, type TenantSwitcherProps, TopBar, type TopBarProps, UserMenu, type UserMenuItem, type UserMenuProps, accountErrorKind, activeNavLabel, analyticsErrorKind, badgeLabel, changePct, checkAvatarFile, copenhagenDay, createFetchAccountAdapter, createFetchAnalyticsAdapter, createFetchNotificationSource, createFetchTenantAdapter, createMemoryNotificationSource, defaultReauthHref, fillDays, initials, isActivePath, isExternal, readFlag, readSet, relativeTime, safeNavigate, useIsMobile, writeFlag, writeSet };
+export { AVATAR_MAX_BYTES, AVATAR_TYPES, type AccountAdapter, AccountError, AccountPage, type AccountPageProps, type AccountProfile, type AnalyticsAdapter, type AnalyticsData, type AnalyticsDay, AnalyticsError, AnalyticsPage, type AnalyticsPageProps, AppShell, type AppShellProps, Avatar, ConfirmDialog, type ConfirmDialogProps, type Lang, type NavGroup, type NavItem, type Navigate, NotificationBell, type NotificationBellProps, type NotificationSource, PageHeader, type PageTab, PageTabs, type PreactNavGroup, type PreactNavItem, type ShellUser, Sidebar, type SidebarProps, TEXT, type TenantAdapter, TenantLoadError, type TenantMembershipRow, TenantSwitcher, type TenantSwitcherProps, TopBar, type TopBarProps, UserMenu, type UserMenuItem, type UserMenuProps, type UserMenuSection, accountErrorKind, activeNavLabel, analyticsErrorKind, badgeLabel, changePct, checkAvatarFile, copenhagenDay, createFetchAccountAdapter, createFetchAnalyticsAdapter, createFetchNotificationSource, createFetchTenantAdapter, createMemoryNotificationSource, defaultReauthHref, fillDays, initials, isActivePath, isExternal, readFlag, readSet, relativeTime, safeNavigate, useIsMobile, writeFlag, writeSet };

package/dist/preact.js

@@ -304,6 +304,9 @@ var TEXT = {
     closeMenu: "Luk menu",
     home: "Forside",
     language: "Sprog",
+    zoom: "Zoom",
+    zoomOut: "Zoom ud",
+    zoomIn: "Zoom ind",
     couldNotMarkAll: "Kunne ikke markere alle som l\xE6st. Pr\xF8v igen.",
     collapse: "Skjul sidemenu",
     expand: "Vis sidemenu",
@@ -372,6 +375,9 @@ var TEXT = {
     closeMenu: "Close menu",
     home: "Home",
     language: "Language",
+    zoom: "Zoom",
+    zoomOut: "Zoom out",
+    zoomIn: "Zoom in",
     couldNotMarkAll: "Could not mark all as read. Try again.",
     collapse: "Hide sidebar",
     expand: "Show sidebar",
@@ -629,7 +635,7 @@ function Sidebar(p) {
         "aria-label": "Navigation",
         children: [
           p.header || p.brandMark ? /* @__PURE__ */ jsxs("div", { class: "bas-sidebar__head", children: [
-            p.header ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__brand", children: p.homeHref ? /* @__PURE__ */ jsx(NavLink, { href: p.homeHref, onNavigate: p.onNavigate, onAfter: close, class: "bas-home", "data-testid": p.brandTestId ?? "sidebar-brand-home", children: p.header }) : p.header }) : null,
+            p.header ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__brand", children: p.homeHref ? /* @__PURE__ */ jsx(NavLink, { href: p.homeHref, onNavigate: p.onNavigate, onAfter: close, class: "bas-home", "data-testid": p.brandTestId ?? "sidebar-brand-home", "aria-label": p.homeLabel, children: p.header }) : p.header }) : null,
             p.brandMark ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__mark", "data-testid": "sidebar-brand-mark", children: p.homeHref ? /* @__PURE__ */ jsx(
               NavLink,
               {
@@ -655,7 +661,8 @@ function Sidebar(p) {
               open ? g.items.map(item) : null
             ] }, g.label);
           }) }),
-          p.footer?.length ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__foot", children: p.footer.map(item) }) : null
+          p.footer?.length ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__foot", children: p.footer.map(item) }) : null,
+          p.bottom ? /* @__PURE__ */ jsx("div", { class: "bas-sidebar__user", "data-testid": "sidebar-user", children: p.bottom }) : null
         ]
       }
     )
@@ -876,28 +883,48 @@ function UserMenu(p) {
       setOpen(false);
     }
   };
-  return /* @__PURE__ */ jsxs("div", { class: "bas-usermenu", ref: root, children: [
+  const inSidebar = p.placement === "sidebar-footer";
+  const btn = useRef(null);
+  const [upPos, setUpPos] = useState(void 0);
+  useLayoutEffect(() => {
+    if (!open || !inSidebar || !btn.current) return;
+    const r = btn.current.getBoundingClientRect();
+    const vw = window.innerWidth, vh = window.innerHeight;
+    const railed = !!btn.current.closest(".is-railed");
+    const width = Math.min(320, vw - 16);
+    const left = railed ? r.right + 8 : Math.max(8, Math.min(r.left, vw - width - 8));
+    const bottom = railed ? Math.max(8, vh - r.bottom) : vh - r.top + 8;
+    setUpPos({ position: "fixed", left: `${left}px`, bottom: `${bottom}px`, width: `${width}px`, maxHeight: `${vh - bottom - 8}px` });
+  }, [open, inSidebar]);
+  const zoom = p.zoom;
+  const zMin = zoom?.min ?? 50, zMax = zoom?.max ?? 200, zStep = zoom?.step ?? 10;
+  return /* @__PURE__ */ jsxs("div", { class: "bas-usermenu" + (inSidebar ? " is-sidebar" : ""), ref: root, children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
+        ref: btn,
         type: "button",
-        class: "bas-userbtn" + (open ? " is-open" : ""),
-        "data-testid": "topbar-user-menu",
+        class: "bas-userbtn" + (open ? " is-open" : "") + (inSidebar ? " is-sidebar" : ""),
+        "data-testid": inSidebar ? "sidebar-user-menu" : "topbar-user-menu",
         "aria-haspopup": "menu",
         "aria-expanded": open,
         "aria-label": p.user.email ?? p.user.name ?? t.account,
         onClick: () => setOpen((v) => !v),
         children: [
-          /* @__PURE__ */ jsx(Avatar, { user: p.user }),
-          /* @__PURE__ */ jsx("span", { class: "bas-userbtn__name", children: firstName })
+          /* @__PURE__ */ jsx(Avatar, { user: p.user, size: inSidebar ? 32 : 28 }),
+          inSidebar ? /* @__PURE__ */ jsxs("span", { class: "bas-userbtn__text", children: [
+            /* @__PURE__ */ jsx("span", { class: "bas-userbtn__name", children: p.user.name ?? firstName }),
+            p.user.subtitle ? /* @__PURE__ */ jsx("span", { class: "bas-userbtn__sub", "data-testid": "sidebar-user-subtitle", children: p.user.subtitle }) : null
+          ] }) : /* @__PURE__ */ jsx("span", { class: "bas-userbtn__name", children: firstName })
         ]
       }
     ),
-    open ? /* @__PURE__ */ jsxs("div", { class: "bas-menu", role: "menu", "data-testid": "topbar-user-menu-dropdown", children: [
+    open ? /* @__PURE__ */ jsxs("div", { class: "bas-menu" + (inSidebar ? " is-up" : ""), style: inSidebar ? upPos : void 0, role: "menu", "data-testid": "topbar-user-menu-dropdown", children: [
       /* @__PURE__ */ jsxs("div", { class: "bas-menu__who", children: [
         /* @__PURE__ */ jsx(Avatar, { user: p.user, size: 36 }),
         /* @__PURE__ */ jsxs("div", { class: "bas-menu__whotext", children: [
           p.user.name ? /* @__PURE__ */ jsx("div", { class: "bas-menu__name", children: p.user.name }) : null,
+          p.user.subtitle ? /* @__PURE__ */ jsx("div", { class: "bas-menu__sub", children: p.user.subtitle }) : null,
           p.user.email ? /* @__PURE__ */ jsx("div", { class: "bas-menu__email", children: p.user.email }) : null
         ] })
       ] }),
@@ -909,7 +936,8 @@ function UserMenu(p) {
       (p.items ?? []).map(
         (it) => it.href ? /* @__PURE__ */ jsxs(NavLink, { href: it.href, onNavigate: p.onNavigate, onAfter: () => setOpen(false), class: "bas-mi", "data-testid": `user-menu-${it.id}`, children: [
           it.icon ?? null,
-          /* @__PURE__ */ jsx("span", { children: it.label })
+          /* @__PURE__ */ jsx("span", { children: it.label }),
+          it.hint ? /* @__PURE__ */ jsx("span", { class: "bas-mi__hint", children: it.hint }) : null
         ] }, it.id) : /* @__PURE__ */ jsxs(
           "button",
           {
@@ -923,12 +951,37 @@ function UserMenu(p) {
             },
             children: [
               it.icon ?? null,
-              /* @__PURE__ */ jsx("span", { children: it.label })
+              /* @__PURE__ */ jsx("span", { children: it.label }),
+              it.hint ? /* @__PURE__ */ jsx("span", { class: "bas-mi__hint", children: it.hint }) : null
             ]
           },
           it.id
         )
       ),
+      (p.sections ?? []).map((sec) => /* @__PURE__ */ jsxs("div", { class: "bas-menu__section", role: "group", "aria-label": sec.label, "data-testid": `user-menu-section-${sec.id}`, children: [
+        /* @__PURE__ */ jsx("div", { class: "bas-sep" }),
+        /* @__PURE__ */ jsx("div", { class: "bas-menu__label", children: sec.label }),
+        sec.items.map((it) => /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            class: "bas-mi" + (it.checked ? " is-checked" : ""),
+            role: "menuitemradio",
+            "aria-checked": it.checked ? "true" : "false",
+            "data-testid": `user-menu-section-${sec.id}-${it.id}`,
+            onClick: () => {
+              setOpen(false);
+              p.onSectionSelect?.(sec.id, it.id);
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { class: "bas-mi__check", "aria-hidden": "true", children: it.checked ? "\u2713" : "" }),
+              /* @__PURE__ */ jsx("span", { children: it.label }),
+              it.hint ? /* @__PURE__ */ jsx("span", { class: "bas-mi__hint", children: it.hint }) : null
+            ]
+          },
+          it.id
+        ))
+      ] }, sec.id)),
       p.appearance !== false ? /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("div", { class: "bas-sep" }),
         /* @__PURE__ */ jsxs("div", { class: "bas-prefs", children: [
@@ -977,6 +1030,42 @@ function UserMenu(p) {
           )
         ] }) })
       ] }) : null,
+      zoom ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        p.appearance === false && !p.language ? /* @__PURE__ */ jsx("div", { class: "bas-sep" }) : null,
+        /* @__PURE__ */ jsx("div", { class: "bas-prefs", children: /* @__PURE__ */ jsxs("div", { class: "bas-pref", children: [
+          /* @__PURE__ */ jsx("span", { children: t.zoom }),
+          /* @__PURE__ */ jsxs("div", { class: "bas-zoom", role: "group", "aria-label": t.zoom, children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                class: "bas-zoom__btn",
+                "data-testid": "user-menu-zoom-out",
+                "aria-label": t.zoomOut,
+                disabled: zoom.value - zStep < zMin,
+                onClick: () => zoom.onChange(Math.max(zMin, zoom.value - zStep)),
+                children: "\u2212"
+              }
+            ),
+            /* @__PURE__ */ jsxs("span", { class: "bas-zoom__value", "data-testid": "user-menu-zoom-value", children: [
+              zoom.value,
+              " %"
+            ] }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                class: "bas-zoom__btn",
+                "data-testid": "user-menu-zoom-in",
+                "aria-label": t.zoomIn,
+                disabled: zoom.value + zStep > zMax,
+                onClick: () => zoom.onChange(Math.min(zMax, zoom.value + zStep)),
+                children: "+"
+              }
+            )
+          ] })
+        ] }) })
+      ] }) : null,
       p.onSignOut ? /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("div", { class: "bas-sep" }),
         /* @__PURE__ */ jsxs("button", { type: "button", class: "bas-mi is-danger", role: "menuitem", "data-testid": "topbar-sign-out", disabled: busy, onClick: () => void signOut(), children: [
@@ -1043,6 +1132,8 @@ function AppShell(p) {
   const expanded = drawerMode ? drawer : !collapsed;
   const triggerLabel = drawerMode ? drawer ? t.closeMenu : t.openMenu : collapsed ? t.expand : t.collapse;
   const heading = p.title ?? activeNavLabel(p.groups, p.footer, p.currentPath);
+  const userInSidebar = p.userMenuPlacement === "sidebar-footer";
+  const sidebarUser = userInSidebar && p.user ? /* @__PURE__ */ jsx(UserMenu, { user: p.user, ...p.userMenu, placement: "sidebar-footer", onNavigate: p.onNavigate, lang: p.lang }) : null;
   return /* @__PURE__ */ jsxs("div", { class: "bas-root", "data-testid": "app-shell", "data-mobile": mode, "data-layout": layout, children: [
     inset ? null : /* @__PURE__ */ jsx(
       TopBar,
@@ -1052,7 +1143,7 @@ function AppShell(p) {
         onHome: () => setDrawer(false),
         actions: p.actions,
         notifications: p.notifications,
-        user: p.user,
+        user: userInSidebar ? void 0 : p.user,
         userMenu: p.userMenu,
         onNavigate: p.onNavigate,
         lang: p.lang
@@ -1078,6 +1169,7 @@ function AppShell(p) {
           brandTestId: inset ? "brand-home" : void 0,
           groupsKey: `${prefix}.groups`,
           itemsKey: `${prefix}.items`,
+          bottom: sidebarUser,
           lang: p.lang
         }
       ),
@@ -1104,7 +1196,7 @@ function AppShell(p) {
             /* @__PURE__ */ jsx("div", { class: "bas-spacer" }),
             p.actions ? /* @__PURE__ */ jsx("div", { class: "bas-contenthead__actions", children: p.actions }) : null,
             /* @__PURE__ */ jsx(NotificationBell, { source: p.notifications, onNavigate: p.onNavigate, lang: p.lang }),
-            p.user ? /* @__PURE__ */ jsx(UserMenu, { user: p.user, ...p.userMenu, onNavigate: p.onNavigate, lang: p.lang }) : null
+            p.user && !userInSidebar ? /* @__PURE__ */ jsx(UserMenu, { user: p.user, ...p.userMenu, onNavigate: p.onNavigate, lang: p.lang }) : null
           ] }) : null
         ] }),
         p.children