@the-portland-company/shell 0.81.1 → 0.82.0

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## 0.82.0
+
+The universal-search placeholder names what the current Mode searches. Spec cited: Reference/UI-Platform v56 "Top bar — required elements" (decided by Ben, 2026-10-12).
+
+- Relationship: "Search contacts, Tribes, forms" · Campaign: "Search voters, walk lists, polls" · Petition: "Search petitions, sheets, circulators". The Glossary term is Tribe, so the design frame's "segments" is not used.
+- A mode-scoped app takes its registry mode; an unscoped app (Contacts, Forms, Surveys, CTAs, Settings) follows the mode the pill shows. `data.searchPlaceholder` still overrides. The old per-app table (Contacts only) is gone.
+- `NavMode` gains `id`; new export `MODE_SEARCH_PLACEHOLDER`.
+- Tests: `__tests__/searchPlaceholder.test.tsx`.
+
+## 0.81.2
+
+The rail header matches the Left Navigation design's vertical rhythm. Spec cited: Specs/Left-Navigation §3-§7 (values the page states are unchanged; the design decides the gaps it does not state).
+
+- **Cause.** The org card's white band was fixed at 70px, the Brand `orgLogoMaxHeight` cap, where the design draws a 52px band; the ORGANIZATION eyebrow sat 21px under the lockup where the design has 16px; the mode caption sat 6px under the track where the design has 8px. Every section row landed about 26px low (Design Compare, 2026-10-12: label_moved on Relationship mode / Dashboard / Contacts).
+- **Fix.** `--sidebar-org-band-height: 52px` (logos still scale to fit; the 70px Brand token stays the logo cap), eyebrow margins 2px/9px, caption 8px.
+
 ## 0.81.1
 
 The active row's left marker is visible. Spec cited: Specs/Left-Navigation §8.1 ("9% white tint, semibold white text, and a 2px inset marker on the left edge in white").

package/dist/app-chrome.cjs

@@ -2742,7 +2742,7 @@ function NavSidebar({
               }
             ),
             org ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: rc("max-md:flex max-md:justify-center"), children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mb-[7px] mt-[7px] flex items-center justify-between ${rc("max-md:hidden")}`, children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: NAV_EYEBROW_CLASS, children: "Organization" }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mb-[9px] mt-[2px] flex items-center justify-between ${rc("max-md:hidden")}`, children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: NAV_EYEBROW_CLASS, children: "Organization" }) }),
               org.loading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `flex w-full items-center gap-2.5 rounded-md border border-[color:var(--line)] bg-[color:var(--panel-elevated)] px-2.5 py-2 shadow-sm ${rc("max-md:w-auto max-md:border-0 max-md:bg-transparent max-md:p-0 max-md:shadow-none")}`, children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   "span",
@@ -2938,7 +2938,7 @@ function NavSidebar({
                   )
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: `mt-1.5 text-left text-[11px] leading-[1.2] text-[color:var(--sidebar-caption,var(--sidebar-text-muted,var(--muted)))] ${rc("max-md:hidden")}`, children: modeCaption(mode.label) })
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: `mt-2 text-left text-[11px] leading-[1.2] text-[color:var(--sidebar-caption,var(--sidebar-text-muted,var(--muted)))] ${rc("max-md:hidden")}`, children: modeCaption(mode.label) })
             ] }) : null
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col overflow-y-auto px-[10px] py-3", children: /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex flex-col gap-0.5", children: [
@@ -4614,8 +4614,10 @@ var POLITOGY_APPS = {
   canvass: { title: "Field Canvassing", origin: "https://canvass.politogyvrm.com", storagePrefix: "canvass", mode: "campaign", grants: ["title"] },
   signs: { title: "Sign Mapping", origin: "https://signs.politogyvrm.com", storagePrefix: "signs", mode: "campaign", grants: ["title"] }
 };
-var DEFAULT_SEARCH_PLACEHOLDER = {
-  contacts: "Search contacts, segments, forms"
+var MODE_SEARCH_PLACEHOLDER = {
+  relationship: "Search contacts, Tribes, forms",
+  campaign: "Search voters, walk lists, polls",
+  petition: "Search petitions, sheets, circulators"
 };
 function PolitogyAppFrame({
   app,
@@ -4893,7 +4895,9 @@ function FrameBody({
           // search is the only thing on the left end of the bar. No app wires
           // search yet, so this stays decorative (`NavTopBarProps.search` — "an
           // app that has not wired search yet still gets the correct chrome").
-          search: { placeholder: data?.searchPlaceholder ?? DEFAULT_SEARCH_PLACEHOLDER[app] ?? "Search" },
+          search: {
+            placeholder: data?.searchPlaceholder ?? MODE_SEARCH_PLACEHOLDER[appMode ?? mode.id ?? "relationship"] ?? "Search"
+          },
           // No Build notes control (Reference/UI-Platform, decided 2026-10-03).
           // The action cluster is IDENTICAL everywhere — core included. Page
           // actions sit BEFORE it, never inside it, so the Alerts bell keeps its
@@ -5539,6 +5543,7 @@ function useChromeMode(arg = {}) {
   const selected = selectedModeId ? options.find((m) => m.id === selectedModeId) ?? null : null;
   const current = pinned ?? selected ?? options[0] ?? MODE_DEFS.find((m) => m.id === fallbackModeId) ?? MODE_DEFS[0];
   return {
+    id: current.id,
     label: current.label,
     icon: current.icon,
     // Left-Navigation §7 / Reference/UI-Platform: always the row of three icon
@@ -5571,6 +5576,7 @@ function useChromeMode(arg = {}) {
 
 exports.ChromeTopBarActions = ChromeTopBarActions;
 exports.LoadingScreen = LoadingScreen;
+exports.MODE_SEARCH_PLACEHOLDER = MODE_SEARCH_PLACEHOLDER;
 exports.POLITOGY_APPS = POLITOGY_APPS;
 exports.PolitogyAppChrome = PolitogyAppChrome;
 exports.PolitogyAppFrame = PolitogyAppFrame;