@orangecheck/app-design 1.1.1 → 1.2.1

package/dist/chrome.d.mts

@@ -1,9 +1,9 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { e as FooterColumn, d as FamilySlug, N as NavItem } from './index-C6hDqOOS.mjs';
+import { e as FooterColumn, N as NavItem, d as FamilySlug } from './index-DmfyPYe5.mjs';
 import { T as TocItem } from './hero-Dn37il-9.mjs';
-import { a as Status } from './status-badge-DRwGhB0h.mjs';
-export { A as AccountMenu, a as AccountMenuItem, b as AppShell, O as OCHK_APP_ACCOUNT, S as SessionAccountView, c as SessionState, d as ShellNavGroup, e as ShellNavItem, f as ShellSection, T as ThemeToggle, g as ToolShell, h as ToolShellProps } from './tool-shell-BDx_N5ai.mjs';
+import { a as Status } from './status-badge-BJ9Sdsx8.mjs';
+export { A as AccountMenu, a as AccountMenuItem, b as AppShell, O as OCHK_APP_ACCOUNT, S as SessionAccountView, c as SessionState, d as ShellNavGroup, e as ShellNavItem, f as ShellSection, T as ThemeToggle, g as ToolShell, h as ToolShellProps } from './tool-shell-kqGWMTep.mjs';
 import './tools-DFIxIj5p.mjs';
 import './format.mjs';
 
@@ -39,7 +39,7 @@ declare function SiteBanner({ tone, children, action, className, }: {
 interface SiteFooterProps {
     columns?: readonly FooterColumn[];
     family?: boolean;
-    legal?: boolean;
+    legal?: boolean | readonly NavItem[];
     compact?: boolean;
     fineprint?: ReactNode;
     meta?: ReactNode;

package/dist/chrome.d.ts

@@ -1,9 +1,9 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { e as FooterColumn, d as FamilySlug, N as NavItem } from './index-C6hDqOOS.js';
+import { e as FooterColumn, N as NavItem, d as FamilySlug } from './index-DmfyPYe5.js';
 import { T as TocItem } from './hero-Dn37il-9.js';
-import { a as Status } from './status-badge-BEOxeY9j.js';
-export { A as AccountMenu, a as AccountMenuItem, b as AppShell, O as OCHK_APP_ACCOUNT, S as SessionAccountView, c as SessionState, d as ShellNavGroup, e as ShellNavItem, f as ShellSection, T as ThemeToggle, g as ToolShell, h as ToolShellProps } from './tool-shell-B1C7ahKE.js';
+import { a as Status } from './status-badge-Bt8x3RhO.js';
+export { A as AccountMenu, a as AccountMenuItem, b as AppShell, O as OCHK_APP_ACCOUNT, S as SessionAccountView, c as SessionState, d as ShellNavGroup, e as ShellNavItem, f as ShellSection, T as ThemeToggle, g as ToolShell, h as ToolShellProps } from './tool-shell-DLSwUxTD.js';
 import './tools-BggNN5DV.js';
 import './format.js';
 
@@ -39,7 +39,7 @@ declare function SiteBanner({ tone, children, action, className, }: {
 interface SiteFooterProps {
     columns?: readonly FooterColumn[];
     family?: boolean;
-    legal?: boolean;
+    legal?: boolean | readonly NavItem[];
     compact?: boolean;
     fineprint?: ReactNode;
     meta?: ReactNode;

package/dist/chrome.js

@@ -599,7 +599,7 @@ function NavDropdown({ item }) {
       PopoverTrigger,
       {
         className: cn(
-          "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors",
+          "group inline-flex items-center gap-1 rounded-full py-2 pl-3 pr-2.5 text-[0.9375rem] transition-colors md:max-lg:pl-2.5 md:max-lg:pr-2",
           active ? "text-foreground" : "text-muted-foreground hover:text-foreground data-[state=open]:text-foreground"
         ),
         children: [
@@ -648,7 +648,10 @@ function SiteHeader({
     ] }) : null
   ] });
   const navigation = nav.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Main", className: "hidden items-center gap-1 md:flex", children: nav.map(
-    (n) => n.children?.length ? /* @__PURE__ */ jsxRuntime.jsx(NavDropdown, { item: n }, n.href) : /* @__PURE__ */ jsxRuntime.jsx(NavLink, { item: n, line: tool }, n.href)
+    (n) => n.children?.length ? /* @__PURE__ */ jsxRuntime.jsx(NavDropdown, { item: n }, n.href) : (
+      // Between md and lg the family menu and the actions share the row: tighter.
+      /* @__PURE__ */ jsxRuntime.jsx(NavLink, { item: n, line: tool, className: tool ? void 0 : "md:max-lg:px-2.5" }, n.href)
+    )
   ) }) : null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "header",
@@ -663,7 +666,7 @@ function SiteHeader({
         {
           className: cn(
             "flex items-center justify-between gap-4",
-            tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem]",
+            tool ? "h-14 px-4 md:px-6" : "oca-container h-16 md:h-[4.5rem] md:max-lg:gap-2",
             // Three columns, the outer two each at least their content: the
             // navigation stays centred whatever the actions hold, so it does
             // not shift when they change (signed out to signed in).
@@ -771,9 +774,9 @@ function SiteBanner({
   ] }) });
 }
 var FOOT_LINK = "inline-flex min-h-11 items-center transition-colors hover:text-foreground md:min-h-0";
-function LegalRow() {
+function LegalRow({ links }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:items-center sm:justify-between", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-x-5", children: LEGAL_LINKS.map((l) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Legal", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-x-5", children: links.map((l) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: l.href.startsWith("/") ? /* @__PURE__ */ jsxRuntime.jsx(Link5__default.default, { href: l.href, className: FOOT_LINK, children: l.label }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href: l.href, className: FOOT_LINK, children: l.label }) }, l.href)) }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
       "\xA9 ",
       (/* @__PURE__ */ new Date()).getFullYear(),
@@ -791,14 +794,15 @@ function SiteFooter({
   signature = true,
   className
 }) {
+  const legalLinks = legal === true ? LEGAL_LINKS : legal || null;
   if (compact) {
     return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: cn("border-t border-border bg-background text-[0.875rem] text-muted-foreground", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oca-container flex flex-col gap-x-8 gap-y-3 py-5 lg:flex-row lg:items-center lg:justify-between", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-x-6 gap-y-1", children: [
         /* @__PURE__ */ jsxRuntime.jsx("a", { href: OCHK_IO, className: "rounded-lg text-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(Lockup, { size: 22 }) }),
         family ? /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Protocols", children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-x-4", children: PROTOCOLS.map((p) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: p.pageHref, className: FOOT_LINK, children: p.label }) }, p.slug)) }) }) : null
       ] }),
-      legal || meta ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
-        legal ? /* @__PURE__ */ jsxRuntime.jsx(LegalRow, {}) : null,
+      legalLinks || meta ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-x-6 gap-y-2 sm:flex-row sm:flex-wrap sm:items-center", children: [
+        legalLinks ? /* @__PURE__ */ jsxRuntime.jsx(LegalRow, { links: legalLinks }) : null,
         meta
       ] }) : null
     ] }) });
@@ -856,8 +860,8 @@ function SiteFooter({
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mb-[0.06em] inline-block w-[1.1em] shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(Mark, { className: "block h-auto w-full" }) }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: "orangecheck" })
     ] }) }) : null,
-    legal || meta ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
-      legal ? /* @__PURE__ */ jsxRuntime.jsx(LegalRow, {}) : null,
+    legalLinks || meta ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oca-container", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 border-t border-border py-6 text-[0.875rem] text-muted-foreground", children: [
+      legalLinks ? /* @__PURE__ */ jsxRuntime.jsx(LegalRow, { links: legalLinks }) : null,
       meta
     ] }) }) : null
   ] });