@broberg/app-shell 0.15.0 → 0.16.0

package/dist/preact.d.cts

@@ -610,6 +610,12 @@ declare function PageTabs(p: {
     onNavigate?: Navigate;
 }): JSX.Element;
 interface AppShellProps {
+    /**
+     * F092.24 — the app's default text size: 1 = as designed, 1.2 = every shell text
+     * 20 % larger. Sets --bas-font-scale on the root. The APP's choice; the user's own
+     * Zoom (userMenu.zoom) is separate and applies on top.
+     */
+    fontScale?: number;
     /** F092.21 — passed to the sidebar: a row action was chosen. */
     onItemAction?: SidebarProps["onItemAction"];
     brand?: ComponentChildren;

package/dist/preact.d.ts

@@ -610,6 +610,12 @@ declare function PageTabs(p: {
     onNavigate?: Navigate;
 }): JSX.Element;
 interface AppShellProps {
+    /**
+     * F092.24 — the app's default text size: 1 = as designed, 1.2 = every shell text
+     * 20 % larger. Sets --bas-font-scale on the root. The APP's choice; the user's own
+     * Zoom (userMenu.zoom) is separate and applies on top.
+     */
+    fontScale?: number;
     /** F092.21 — passed to the sidebar: a row action was chosen. */
     onItemAction?: SidebarProps["onItemAction"];
     brand?: ComponentChildren;

package/dist/preact.js

@@ -1481,76 +1481,86 @@ function AppShell(p) {
   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,
-      {
-        brand: p.brand,
-        homeHref: p.homeHref,
-        onHome: () => setDrawer(false),
-        actions: p.actions,
-        notifications: p.notifications,
-        user: userInSidebar ? void 0 : p.user,
-        userMenu: p.userMenu,
-        onNavigate: p.onNavigate,
-        lang: p.lang
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { class: "bas-row", children: [
-      /* @__PURE__ */ jsx(
-        Sidebar,
-        {
-          groups: p.groups,
-          footer: p.footer,
-          onItemAction: p.onItemAction,
-          currentPath: p.currentPath,
-          onNavigate: p.onNavigate,
-          collapsed,
-          collapse,
-          brandMark: p.brandMark,
-          homeHref: p.homeHref,
-          homeLabel: p.homeLabel,
-          mobileOpen: drawer,
-          onClose: () => setDrawer(false),
-          mobile: mode,
-          header: inset || mode === "drawer" ? p.brand : void 0,
-          brandTestId: inset ? "brand-home" : void 0,
-          groupsKey: `${prefix}.groups`,
-          itemsKey: `${prefix}.items`,
-          bottom: sidebarUser,
-          lang: p.lang
-        }
-      ),
-      /* @__PURE__ */ jsxs("main", { class: "bas-main", "data-testid": "app-content", children: [
-        /* @__PURE__ */ jsxs("div", { class: "bas-contenthead", "data-testid": "content-header", children: [
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      class: "bas-root",
+      "data-testid": "app-shell",
+      "data-mobile": mode,
+      "data-layout": layout,
+      style: p.fontScale !== void 0 ? { "--bas-font-scale": String(p.fontScale) } : void 0,
+      children: [
+        inset ? null : /* @__PURE__ */ jsx(
+          TopBar,
+          {
+            brand: p.brand,
+            homeHref: p.homeHref,
+            onHome: () => setDrawer(false),
+            actions: p.actions,
+            notifications: p.notifications,
+            user: userInSidebar ? void 0 : p.user,
+            userMenu: p.userMenu,
+            onNavigate: p.onNavigate,
+            lang: p.lang
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { class: "bas-row", children: [
           /* @__PURE__ */ jsx(
-            "button",
+            Sidebar,
             {
-              type: "button",
-              class: "bas-iconbtn bas-trigger",
-              "data-testid": "sidebar-trigger",
-              "aria-label": triggerLabel,
-              "aria-expanded": expanded,
-              title: triggerLabel,
-              onClick: onTrigger,
-              children: /* @__PURE__ */ jsx(IconPanelLeft, {})
+              groups: p.groups,
+              footer: p.footer,
+              onItemAction: p.onItemAction,
+              currentPath: p.currentPath,
+              onNavigate: p.onNavigate,
+              collapsed,
+              collapse,
+              brandMark: p.brandMark,
+              homeHref: p.homeHref,
+              homeLabel: p.homeLabel,
+              mobileOpen: drawer,
+              onClose: () => setDrawer(false),
+              mobile: mode,
+              header: inset || mode === "drawer" ? p.brand : void 0,
+              brandTestId: inset ? "brand-home" : void 0,
+              groupsKey: `${prefix}.groups`,
+              itemsKey: `${prefix}.items`,
+              bottom: sidebarUser,
+              lang: p.lang
             }
           ),
-          heading ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx("span", { class: "bas-contenthead__sep", "data-testid": "content-header-separator", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx("h1", { class: "bas-contenthead__title", "data-testid": "content-header-title", children: heading })
-          ] }) : null,
-          inset ? /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__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 && !userInSidebar ? /* @__PURE__ */ jsx(UserMenu, { user: p.user, ...p.userMenu, onNavigate: p.onNavigate, lang: p.lang }) : null
-          ] }) : null
-        ] }),
-        p.children
-      ] })
-    ] })
-  ] });
+          /* @__PURE__ */ jsxs("main", { class: "bas-main", "data-testid": "app-content", children: [
+            /* @__PURE__ */ jsxs("div", { class: "bas-contenthead", "data-testid": "content-header", children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  class: "bas-iconbtn bas-trigger",
+                  "data-testid": "sidebar-trigger",
+                  "aria-label": triggerLabel,
+                  "aria-expanded": expanded,
+                  title: triggerLabel,
+                  onClick: onTrigger,
+                  children: /* @__PURE__ */ jsx(IconPanelLeft, {})
+                }
+              ),
+              heading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("span", { class: "bas-contenthead__sep", "data-testid": "content-header-separator", "aria-hidden": "true" }),
+                /* @__PURE__ */ jsx("h1", { class: "bas-contenthead__title", "data-testid": "content-header-title", children: heading })
+              ] }) : null,
+              inset ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__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 && !userInSidebar ? /* @__PURE__ */ jsx(UserMenu, { user: p.user, ...p.userMenu, onNavigate: p.onNavigate, lang: p.lang }) : null
+              ] }) : null
+            ] }),
+            p.children
+          ] })
+        ] })
+      ]
+    }
+  );
 }
 function defaultReauthHref() {
   const here = typeof location === "undefined" ? "/" : location.pathname + location.search;