@the-portland-company/shell 0.89.0 → 0.90.0

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+## 0.90.0
+
+`PageHeader` matches the Spec (Reference/UI-Platform "Page header" and "Page header and width").
+
+- **Surface and color.** The filled `--app-tab-header-bg` bar, white title, `text-slate-100` and bottom border are gone: the header sits on the page background and the title is Graphite (`--color-text`, fallback `#2F3136`). The title is now an `h1`.
+- **Breadcrumbs.** The `breadcrumbs` prop is deprecated: accepted, renders nothing, `console.warn` once in dev.
+- **Eyebrow.** Reads the mode color through `--color-accent-fg`, which follows the Mode's stamped primary (`--mode-accent`, the same token the tab strip uses for `modes.<mode>.primary`) and is pinned AA-safe for Petition. Never the white `modes.<mode>.accent`.
+- **Spacing.** 22px above the header; 24px desktop gutter, 16px below `md`. `md:ml-60` sidebar offset unchanged.
+- **Width.** `maxW` is deprecated and ignored (warns once in dev); the header spans its container.
+- **Email guard.** A string `title` / `subtitle` containing an email address warns once in dev.
+- Unchanged: 30px bold title, 11px uppercase eyebrow, 15px G4 subtitle, actions right, tabBar beneath.
+- Tests: `__tests__/pageHeaderEyebrow.test.tsx`.
+
 ## 0.89.0
 
 Card follows the theme, and the form set gains Checkbox and FileInput. Follow-up to the 0.88.0 migrations.

package/README.md

@@ -139,7 +139,8 @@ All `<ShellChrome>` props are optional — only supply what your app has. The ch
 | `<BrandLogo>` | `<img>` wrapper for the branded mode logo. |
 | `<BrandIcon name="...">` | Renders `/brand/icons/<name>.svg` from your `public/`. |
 | `<CommitCopyButton>` | Footer commit/version display with copy-to-clipboard. |
-| `<Card>`, `<PageHeader>` | Page-level layout primitives. |
+| `<Card>` | Page-level layout primitive. |
+| `<PageHeader>` | The page header (Reference/UI-Platform → "Page header"): no filled surface, 22px below the top bar, 24px gutter (16px below `md`), spans its container. Eyebrow in the mode color, 30px bold Graphite `h1` title, 15px G4 subtitle, `actions` right, `tabBar` beneath. `breadcrumbs` and `maxW` are **deprecated** (accepted, ignored, warn once in dev); width comes from `FormColumn` (960px) or the fluid frame. Warns in dev if `title` / `subtitle` is a string holding an email address. |
 | `<FormColumn>` | The one constrained layout inside the frame's fluid `<main>`: a left-aligned column, `max-width: 960px`, for form and settings pages. Also exported from `./native`. |
 | `<NavTabStrip>` (from `./native`) | The canonical page tab strip: underlined text tabs with a 2px underline in the mode color. Render it in the page body, below the page header. |
 | `<PageContainer>`, `<BreadcrumbBar>`, `<HeaderTabBar>` | **Deprecated for apps** (each warns in dev). The frame owns a fluid `<main>` (24px gutter, 16px below `md`, no max-width); there are no breadcrumbs; the tab strip is `NavTabStrip`. |

package/dist/app-chrome.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { v as StandardNavIconKey, w as NavIcon, N as NavItem, x as NavBreadcrumb, y as StandardNavMode, z as NavLinkComponent, A as NavChromeFetcher, D as NavMode, E as NavUserMenu, G as NavOrgOption, o as NotificationsAdapter, J as NavFooterLink, K as NavFooter, L as NavDisplayMode } from './index-CZylXAP4.cjs';
+import { v as StandardNavIconKey, w as NavIcon, N as NavItem, x as NavBreadcrumb, y as StandardNavMode, z as NavLinkComponent, A as NavChromeFetcher, D as NavMode, E as NavUserMenu, G as NavOrgOption, o as NotificationsAdapter, J as NavFooterLink, K as NavFooter, L as NavDisplayMode } from './index-CaMJSRDb.cjs';
 import './theme-preference.cjs';
 
 /**

package/dist/app-chrome.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { v as StandardNavIconKey, w as NavIcon, N as NavItem, x as NavBreadcrumb, y as StandardNavMode, z as NavLinkComponent, A as NavChromeFetcher, D as NavMode, E as NavUserMenu, G as NavOrgOption, o as NotificationsAdapter, J as NavFooterLink, K as NavFooter, L as NavDisplayMode } from './index-DwkSyAip.js';
+import { v as StandardNavIconKey, w as NavIcon, N as NavItem, x as NavBreadcrumb, y as StandardNavMode, z as NavLinkComponent, A as NavChromeFetcher, D as NavMode, E as NavUserMenu, G as NavOrgOption, o as NotificationsAdapter, J as NavFooterLink, K as NavFooter, L as NavDisplayMode } from './index-C3jzqN9K.js';
 import './theme-preference.js';
 
 /**

package/dist/app-chrome.js

@@ -1,9 +1,9 @@
 "use client";
 import { broadcastLogout, watchLogout } from './chunk-LL6LSJAH.js';
 import { writeUrlState } from './chunk-GVQKZI5X.js';
-import { clearBetaBannerDismissal, standardPolitogyNav, standardNavIcons, isNavItemActive, NavAppShell } from './chunk-SJDFAK5R.js';
-export { standardNavIcons } from './chunk-SJDFAK5R.js';
-import { warnDeprecated, NavChromeProvider, TopBarWidgetSlot, FuelAction, SpecOverlayAction, NotificationsAction, SupportAction, useChromeMe, useNavChromeDedupedFetch, useChromeOrgs, useNavChromeFetcher } from './chunk-J23MTK56.js';
+import { clearBetaBannerDismissal, standardPolitogyNav, standardNavIcons, isNavItemActive, NavAppShell } from './chunk-LZ5TLJDG.js';
+export { standardNavIcons } from './chunk-LZ5TLJDG.js';
+import { warnDeprecated, NavChromeProvider, TopBarWidgetSlot, FuelAction, SpecOverlayAction, NotificationsAction, SupportAction, useChromeMe, useNavChromeDedupedFetch, useChromeOrgs, useNavChromeFetcher } from './chunk-VBDI7UZS.js';
 import './chunk-BHRVZPZ7.js';
 import { NAV_DISPLAY_DEFAULT, resolveNavDisplay, writeNavDisplayLocal, writeNavDisplayCookie, isNavDisplayPreference, NAV_DISPLAY_STORAGE_KEY, readNavDisplayCookie } from './chunk-7YVJ7HQG.js';
 import { authBaseUrl, orgIdTail, settingsBaseUrl, ORG_ID_QUERY_PARAM, readOrgSelectorFromUrl, matchOrgSelector, syncOrgIdInUrl, isOrgId, switchActiveOrg, ACTIVE_ORG_QUERY_PARAM, writeActiveOrgCookie, resolveActiveOrg, readActiveOrgCookie } from './chunk-5LO5W7W5.js';

package/dist/{chunk-SJDFAK5R.js → chunk-LZ5TLJDG.js}

@@ -1,4 +1,4 @@
-import { PageHeaderView, BreadcrumbBarView, resolveOrgLogoUrl, topBarIconButtonClass, TopBarTooltip, TopBarPanelArrow, NavThemeControl, NAV_DISPLAY_OPTIONS, useTopBarIconSlotGlyph, resolveBrandGlyph, TOPBAR_GLYPH_SIZE, warnDeprecated, SpeculationRulesScript } from './chunk-J23MTK56.js';
+import { PageHeaderView, BreadcrumbBarView, resolveOrgLogoUrl, topBarIconButtonClass, TopBarTooltip, TopBarPanelArrow, NavThemeControl, NAV_DISPLAY_OPTIONS, useTopBarIconSlotGlyph, resolveBrandGlyph, TOPBAR_GLYPH_SIZE, warnDeprecated, SpeculationRulesScript } from './chunk-VBDI7UZS.js';
 import { readRailPreference, writeRailPreference } from './chunk-7YVJ7HQG.js';
 import { orgIdTail, authBaseUrl } from './chunk-5LO5W7W5.js';
 import { createContext, useRef, useEffect, useMemo, useState, Fragment as Fragment$1, useContext } from 'react';
@@ -20,13 +20,7 @@ function normalize(s) {
   return s.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase().trim();
 }
 function PageHeader(props) {
-  return /* @__PURE__ */ jsx(
-    PageHeaderView,
-    {
-      ...props,
-      renderCrumbLink: (href, label, className) => /* @__PURE__ */ jsx("a", { href, className, children: label })
-    }
-  );
+  return /* @__PURE__ */ jsx(PageHeaderView, { ...props });
 }
 function BreadcrumbBar(props) {
   return /* @__PURE__ */ jsx(
@@ -1981,5 +1975,5 @@ function NavAppShell({
 }
 
 export { BETA_BANNER_DISMISS_KEY, BreadcrumbBar, CAMPAIGN_FEATURE_AVAILABILITY, NavAppShell, NavBetaBanner, NavSidebar, NavTabStrip, NavTopBar, PageHeader, clearBetaBannerDismissal, envChipClasses, isNavItemActive, modeIdFromLabel, shortEnvLabel, shortUserName, standardNavIcons, standardPolitogyNav };
-//# sourceMappingURL=chunk-SJDFAK5R.js.map
-//# sourceMappingURL=chunk-SJDFAK5R.js.map
+//# sourceMappingURL=chunk-LZ5TLJDG.js.map
+//# sourceMappingURL=chunk-LZ5TLJDG.js.map