@the-portland-company/shell 0.89.0 → 0.90.0

package/dist/{chunk-J23MTK56.js → chunk-VBDI7UZS.js}

@@ -72,6 +72,21 @@ function Card({
 function FormColumn({ children, className }) {
   return /* @__PURE__ */ jsx("div", { "data-shell-form-column": "", className: clsx("w-full max-w-[960px]", className), children });
 }
+
+// src/lib/deprecation.ts
+var warned = /* @__PURE__ */ new Set();
+function isDev() {
+  try {
+    return typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
+  } catch {
+    return false;
+  }
+}
+function warnDeprecated(key, message) {
+  if (!isDev() || warned.has(key)) return;
+  warned.add(key);
+  console.warn(`[@the-portland-company/shell] ${message}`);
+}
 var VARIANT_CLASS = {
   primary: "border border-transparent bg-[color:var(--app-btn-primary-bg,var(--color-accent))] text-[color:var(--app-btn-primary-fg,var(--color-white))] hover:bg-[color:var(--app-btn-primary-bg-hover,var(--color-accent-hover))]",
   secondary: "border border-[color:var(--app-btn-secondary-border,var(--color-border))] bg-[color:var(--app-btn-secondary-bg,var(--color-white))] text-[color:var(--app-btn-secondary-fg,var(--color-text))] hover:bg-[color:var(--app-btn-secondary-bg-hover,var(--color-bg))]",
@@ -377,21 +392,6 @@ var FileInput = forwardRef(function FileInput2({ label, helperText, error, inval
   );
 });
 var FileInput_default = FileInput;
-
-// src/lib/deprecation.ts
-var warned = /* @__PURE__ */ new Set();
-function isDev() {
-  try {
-    return typeof process !== "undefined" && process.env?.NODE_ENV !== "production";
-  } catch {
-    return false;
-  }
-}
-function warnDeprecated(key, message) {
-  if (!isDev() || warned.has(key)) return;
-  warned.add(key);
-  console.warn(`[@the-portland-company/shell] ${message}`);
-}
 function useTopBarIconSlotGlyph(slot) {
   const [name, setName] = useState(null);
   useEffect(() => {
@@ -2490,60 +2490,65 @@ var MODE_EYEBROW_LABEL = {
   campaign: "Campaign mode",
   petition: "Petition mode"
 };
-var resolveMaxWidthClass = (maxW) => {
-  if (maxW === "full") return "max-w-none";
-  if (maxW === "container.lg") return "max-w-6xl";
-  if (maxW === "container.md") return "max-w-5xl";
-  return "max-w-7xl";
-};
+var EMAIL_PATTERN = /[^\s@]+@[^\s@]+\.[^\s@]+/;
 function PageHeaderView({
-  renderCrumbLink,
   title,
   mode,
   eyebrow,
   showEyebrow = true,
   subtitle,
-  breadcrumbs = [],
+  breadcrumbs,
   actions = null,
   tabBar = null,
-  maxW = "full",
+  maxW,
   hideSidebar = false
 }) {
-  const maxWClass = resolveMaxWidthClass(maxW);
-  const titleText = typeof title === "string" ? title.trim() : "";
-  const normalizedTitle = titleText.toLowerCase();
-  const breadcrumbsWithoutCurrent = [...breadcrumbs];
-  const last = breadcrumbsWithoutCurrent[breadcrumbsWithoutCurrent.length - 1];
-  if (breadcrumbsWithoutCurrent.length > 1 && normalizedTitle && last && last.label.trim().toLowerCase() === normalizedTitle) {
-    breadcrumbsWithoutCurrent.pop();
+  if (breadcrumbs !== void 0) {
+    warnDeprecated(
+      "PageHeader.breadcrumbs",
+      '<PageHeader breadcrumbs> is deprecated and renders nothing: the breadcrumb trail is retired (Reference/UI-Platform \u2192 "Page header"). Remove the prop.'
+    );
+  }
+  if (maxW !== void 0) {
+    warnDeprecated(
+      "PageHeader.maxW",
+      "<PageHeader maxW> is deprecated and ignored: the header spans its container. Use <FormColumn> (960px) or the fluid frame for page width."
+    );
+  }
+  if (typeof title === "string" && EMAIL_PATTERN.test(title) || typeof subtitle === "string" && EMAIL_PATTERN.test(subtitle)) {
+    warnDeprecated(
+      "PageHeader.email",
+      `<PageHeader> title/subtitle contains an email address. The user's email never appears in the page header (Reference/UI-Platform \u2192 "Page header"); identity lives in the left bar footer.`
+    );
   }
   const eyebrowText = showEyebrow ? eyebrow ?? (mode ? MODE_EYEBROW_LABEL[mode] : void 0) : void 0;
-  if (!title && !eyebrowText && breadcrumbsWithoutCurrent.length === 0 && !actions && !tabBar) {
+  if (!title && !eyebrowText && !actions && !tabBar) {
     return null;
   }
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      style: { backgroundColor: "var(--app-tab-header-bg, #888888)" },
-      className: clsx("text-slate-100", tabBar ? "pt-3 pb-0" : "py-3 border-b border-gray-200", {
+      "data-shell-page-header": "",
+      className: clsx("pt-[22px] text-[color:var(--color-text,#2F3136)]", tabBar ? "pb-0" : "pb-4", {
         "md:ml-60": !hideSidebar
       }),
       children: [
-        /* @__PURE__ */ jsx("div", { className: clsx("w-full px-4", maxWClass), children: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-nowrap items-start justify-between gap-4", children: [
+        /* @__PURE__ */ jsx("div", { className: "w-full px-4 md:px-6", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-nowrap items-start justify-between gap-4", children: [
           /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
             eyebrowText ? /* @__PURE__ */ jsx(
               "div",
               {
                 className: "truncate text-[11px] font-bold uppercase leading-[1.2] tracking-[0.09em]",
-                style: { color: "var(--mode-accent, var(--color-accent, #E63946))" },
+                style: { color: "var(--color-accent-fg, var(--mode-accent, var(--color-accent, #E63946)))" },
                 children: eyebrowText
               }
             ) : null,
             title ? /* @__PURE__ */ jsx("div", { className: "min-w-0", children: /* @__PURE__ */ jsx(
-              "div",
+              "h1",
               {
-                className: "truncate font-bold text-white",
+                className: "m-0 truncate font-bold",
                 style: {
+                  color: "var(--color-text, #2F3136)",
                   fontFamily: "var(--font-family, ui-sans-serif, system-ui, sans-serif)",
                   fontSize: "var(--type-h2-size, 1.875rem)",
                   lineHeight: "var(--type-h2-line-height, 1.25)"
@@ -2551,25 +2556,7 @@ function PageHeaderView({
                 children: title
               }
             ) }) : null,
-            subtitle ? /* @__PURE__ */ jsx("div", { className: "mt-1 truncate text-[15px] text-[color:var(--color-g4,#929599)]", children: subtitle }) : null,
-            breadcrumbsWithoutCurrent.length > 0 ? /* @__PURE__ */ jsx(
-              "nav",
-              {
-                "aria-label": "Breadcrumb",
-                className: clsx("min-w-0 text-slate-100", title ? "mt-1" : ""),
-                children: /* @__PURE__ */ jsx("ol", { className: "flex flex-nowrap items-center gap-2 overflow-hidden text-sm text-gray-600", children: breadcrumbsWithoutCurrent.map((item, index) => /* @__PURE__ */ jsxs(
-                  "li",
-                  {
-                    className: "flex min-w-0 flex-shrink-0 items-center gap-2",
-                    children: [
-                      index > 0 ? /* @__PURE__ */ jsx("span", { className: "text-gray-400", children: ">" }) : null,
-                      item.href ? renderCrumbLink(item.href, item.label, "truncate text-slate-100 hover:underline") : /* @__PURE__ */ jsx("span", { className: "truncate text-slate-100", children: item.label })
-                    ]
-                  },
-                  `${item.label}-${index}`
-                )) })
-              }
-            ) : null
+            subtitle ? /* @__PURE__ */ jsx("div", { className: "mt-1 truncate text-[15px] text-[color:var(--color-g4,#58657A)]", children: subtitle }) : null
           ] }),
           actions ? /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: actions }) : null
         ] }) }),
@@ -2609,5 +2596,5 @@ function BreadcrumbBarView({
 }
 
 export { BreadcrumbBarView, Button_default, CORE_APP_ORIGIN, CORE_BILLING_PATH, CREDIT_TYPE_LABELS, CREDIT_TYPE_ORDER, Card, Checkbox_default, CreditsAction, FileInput_default, FormColumn, FuelAction, HeaderTabBar, Input_default, NAV_DISPLAY_OPTIONS, NavChromeProvider, NavDisplayAction, NavThemeControl, NotificationsAction, PageHeaderView, SPECS_ORIGIN, Select_default, SpecOverlayAction, SpeculationRulesScript, SupportAction, TOPBAR_GLYPH_SIZE, Textarea_default, TopBarCountBadge, TopBarPanelArrow, TopBarPopover, TopBarTooltip, TopBarWidgetSlot, buildNavSpeculationRules, buildSpeculationRules, collectSiblingAppUrls, createCommsNotificationsAdapter, creditGaugeRatio, creditStateWord, creditTooltipLine, creditsAriaLabel, creditsIconState, emptyNotificationsFeed, normalizeNotificationsFeed, resolveBrandGlyph, resolveOrgLogoUrl, topBarIconButtonClass, useChromeMe, useChromeOrgs, useNavChromeDedupedFetch, useNavChromeFetcher, useThemePreference, useTopBarIconSlotGlyph, warnDeprecated };
-//# sourceMappingURL=chunk-J23MTK56.js.map
-//# sourceMappingURL=chunk-J23MTK56.js.map
+//# sourceMappingURL=chunk-VBDI7UZS.js.map
+//# sourceMappingURL=chunk-VBDI7UZS.js.map