@the-portland-company/shell 0.98.0 → 0.99.0

package/dist/app-chrome.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { S as StandardNavIconKey, t as NavIcon, N as NavItem, u as NavBreadcrumb, v as StandardNavMode, w as NavLinkComponent, x as NavChromeFetcher, y as NavMode, z as NavUserMenu, D as NavOrgOption, f as NotificationsAdapter, E as NavFooterLink, G as NavFooter, I as NavDisplayMode } from './index-CUPeC2Ji.cjs';
+import { S as StandardNavIconKey, z as NavIcon, N as NavItem, D as NavBreadcrumb, E as StandardNavMode, G as NavLinkComponent, I as NavChromeFetcher, J as NavMode, L as NavUserMenu, M as NavOrgOption, i as NotificationsAdapter, O as NavFooterLink, Q as NavFooter, U as NavDisplayMode } from './index-DhrhpBVm.cjs';
 import './theme-preference.cjs';
 import './brand-favicon.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 { S as StandardNavIconKey, t as NavIcon, N as NavItem, u as NavBreadcrumb, v as StandardNavMode, w as NavLinkComponent, x as NavChromeFetcher, y as NavMode, z as NavUserMenu, D as NavOrgOption, f as NotificationsAdapter, E as NavFooterLink, G as NavFooter, I as NavDisplayMode } from './index-DAD6tSfV.js';
+import { S as StandardNavIconKey, z as NavIcon, N as NavItem, D as NavBreadcrumb, E as StandardNavMode, G as NavLinkComponent, I as NavChromeFetcher, J as NavMode, L as NavUserMenu, M as NavOrgOption, i as NotificationsAdapter, O as NavFooterLink, Q as NavFooter, U as NavDisplayMode } from './index-Di9AyVsU.js';
 import './theme-preference.js';
 import './brand-favicon.js';
 

package/dist/app-chrome.js

@@ -1,10 +1,10 @@
 "use client";
 import { broadcastLogout, watchLogout } from './chunk-LL6LSJAH.js';
 import { writeUrlState } from './chunk-GVQKZI5X.js';
-import { clearBetaBannerDismissal, standardPolitogyNav, standardNavIcons, isNavItemActive, NavAppShell } from './chunk-IVLXZFGV.js';
-export { standardNavIcons } from './chunk-IVLXZFGV.js';
+import { clearBetaBannerDismissal, standardPolitogyNav, standardNavIcons, isNavItemActive, NavAppShell } from './chunk-YMCWLO2L.js';
+export { standardNavIcons } from './chunk-YMCWLO2L.js';
 import { orgIdTail, ORG_ID_QUERY_PARAM, settingsBaseUrl, authBaseUrl, readOrgSelectorFromUrl, matchOrgSelector, syncOrgIdInUrl, isOrgId, switchActiveOrg, ACTIVE_ORG_QUERY_PARAM, writeActiveOrgCookie, resolveActiveOrg, readActiveOrgCookie } from './chunk-5LO5W7W5.js';
-import { warnDeprecated, NavChromeProvider, FuelAction, NotificationsAction, OrganizationSettingsAction, MyProfileAction, useChromeMe, useNavChromeDedupedFetch, useChromeOrgs, useNavChromeFetcher } from './chunk-WOOBPM4V.js';
+import { warnDeprecated, NavChromeProvider, FuelAction, NotificationsAction, OrganizationSettingsAction, MyProfileAction, useChromeMe, useNavChromeDedupedFetch, useChromeOrgs, useNavChromeFetcher } from './chunk-PQQLCUNO.js';
 import './chunk-BHRVZPZ7.js';
 import { NAV_DISPLAY_DEFAULT, resolveNavDisplay, writeNavDisplayLocal, writeNavDisplayCookie, isNavDisplayPreference, NAV_DISPLAY_STORAGE_KEY, readNavDisplayCookie } from './chunk-7YVJ7HQG.js';
 import { useBrandAssets, BrandFavicon } from './chunk-Q5DTPY5N.js';

package/dist/{chunk-WOOBPM4V.js → chunk-PQQLCUNO.js}

@@ -361,17 +361,19 @@ var TIER_TOOLTIPS = {
   inactive: "Inactive: the voter file marks this registration inactive or canceled."
 };
 var DOT_FALLBACK = {
+  verified: "#00A651",
   identified: "#a855f7",
   anonymous: "var(--color-graphite, #2b2b2b)",
   stale: "#eab308",
   inactive: "var(--muted, #8a8a8a)"
 };
-function VrmVerifiedBadge({ tier, size, showLabel = true, className, style }) {
-  const icon = useBrandAsset("verified-icon");
+function VrmVerifiedBadge({ tier, variant = "pill", size, showLabel = true, className, style }) {
   const known = tier && tier in VRM_TIER_LABELS ? tier : null;
+  if (variant === "icon") {
+    return known === "verified" ? /* @__PURE__ */ jsx(VerifiedIcon, { size: size ?? 16, className, style }) : null;
+  }
   const label = known ? VRM_TIER_LABELS[known] : "Not yet computed";
   const title = known ? TIER_TOOLTIPS[known] : "The VRM Verified tier has not been worked out yet.";
-  const iconSize = size ?? 16;
   const dotSize = size ?? 8;
   return /* @__PURE__ */ jsxs(
     "span",
@@ -395,24 +397,11 @@ function VrmVerifiedBadge({ tier, size, showLabel = true, className, style }) {
         ...style
       },
       children: [
-        known === "verified" ? (
-          // The box is reserved while the Brand sheet loads; nothing stands in.
-          /* @__PURE__ */ jsx("span", { "aria-hidden": true, style: { display: "inline-block", width: iconSize, height: iconSize, flexShrink: 0 }, children: icon ? /* @__PURE__ */ jsx(
-            "img",
-            {
-              src: icon,
-              alt: "",
-              width: iconSize,
-              height: iconSize,
-              draggable: false,
-              "data-testid": "vrm-verified-icon",
-              style: { display: "block", width: iconSize, height: iconSize }
-            }
-          ) : null })
-        ) : /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(
           "span",
           {
             "aria-hidden": true,
+            "data-vrm-dot": true,
             style: {
               display: "inline-block",
               width: dotSize,
@@ -429,6 +418,184 @@ function VrmVerifiedBadge({ tier, size, showLabel = true, className, style }) {
     }
   );
 }
+function VerifiedIcon({ size, className, style }) {
+  const icon = useBrandAsset("verified-icon");
+  return (
+    // The box is reserved while the Brand sheet loads; nothing stands in.
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        "data-vrm-tier": "verified",
+        "data-vrm-variant": "icon",
+        role: "img",
+        "aria-label": VRM_TIER_LABELS.verified,
+        title: VRM_VERIFIED_TOOLTIP,
+        className,
+        style: { display: "inline-block", width: size, height: size, flexShrink: 0, verticalAlign: "middle", ...style },
+        children: icon ? /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: icon,
+            alt: "",
+            width: size,
+            height: size,
+            draggable: false,
+            "data-testid": "vrm-verified-icon",
+            style: { display: "block", width: size, height: size }
+          }
+        ) : null
+      }
+    )
+  );
+}
+var CONTACTS_ORIGIN = "https://contacts.politogyvrm.com";
+function withOrg(path, orgId) {
+  return orgId ? `${path}?org=${encodeURIComponent(orgId)}` : path;
+}
+function contactEmbedUrl(contactId, orgId, origin = CONTACTS_ORIGIN) {
+  return withOrg(`${origin}/contacts/embed/${encodeURIComponent(contactId)}`, orgId);
+}
+function contactPageUrl(contactId, orgId, origin = CONTACTS_ORIGIN) {
+  return withOrg(`${origin}/contacts/${encodeURIComponent(contactId)}`, orgId);
+}
+function prefersReducedMotion() {
+  try {
+    return typeof window !== "undefined" && !!window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+  } catch {
+    return false;
+  }
+}
+var iconButton = {
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  borderRadius: 9999,
+  border: "1px solid var(--line, #d7dadf)",
+  padding: 6,
+  background: "transparent",
+  color: "var(--muted, #5c6b80)",
+  cursor: "pointer"
+};
+function ContactSlideIn({ contactId, orgId, onClose, contactsOrigin = CONTACTS_ORIGIN }) {
+  const [shown, setShown] = useState(false);
+  useEffect(() => {
+    if (!contactId) {
+      setShown(false);
+      return;
+    }
+    if (prefersReducedMotion()) {
+      setShown(true);
+      return;
+    }
+    const id = requestAnimationFrame(() => setShown(true));
+    return () => cancelAnimationFrame(id);
+  }, [contactId]);
+  useEffect(() => {
+    if (!contactId) return;
+    const onKey = (event) => {
+      if (event.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [contactId, onClose]);
+  if (!contactId) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-testid": "contact-slide-in-overlay",
+      onClick: onClose,
+      style: { position: "fixed", inset: 0, zIndex: 60, background: "rgba(0, 0, 0, 0.4)" },
+      children: /* @__PURE__ */ jsxs(
+        "aside",
+        {
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": "Contact card",
+          "data-testid": "contact-slide-in",
+          onClick: (event) => event.stopPropagation(),
+          style: {
+            position: "absolute",
+            top: 0,
+            right: 0,
+            bottom: 0,
+            width: "100%",
+            maxWidth: 672,
+            display: "flex",
+            flexDirection: "column",
+            background: "var(--panel, #ffffff)",
+            color: "var(--foreground, #2f3136)",
+            borderLeft: "1px solid var(--line, #d7dadf)",
+            boxShadow: "var(--shadow-soft, 0 10px 28px rgba(27, 28, 32, 0.14))",
+            transform: shown ? "translateX(0)" : "translateX(100%)",
+            transition: "transform 220ms cubic-bezier(0.16, 1, 0.3, 1)"
+          },
+          children: [
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "space-between",
+                  gap: 12,
+                  borderBottom: "1px solid var(--line, #d7dadf)",
+                  padding: "12px 24px"
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "p",
+                    {
+                      style: {
+                        margin: 0,
+                        fontSize: 12,
+                        fontWeight: 600,
+                        letterSpacing: "0.18em",
+                        textTransform: "uppercase",
+                        color: "var(--muted, #5c6b80)"
+                      },
+                      children: "Contact Card"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
+                    /* @__PURE__ */ jsx(
+                      "a",
+                      {
+                        href: contactPageUrl(contactId, orgId, contactsOrigin),
+                        target: "_top",
+                        style: { fontSize: 13, fontWeight: 600, color: "var(--color-race-blue-500, #007bff)", textDecoration: "none" },
+                        children: "Open in Contacts"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Close contact card", title: "Close", onClick: onClose, style: iconButton, children: /* @__PURE__ */ jsxs("svg", { "aria-hidden": true, width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: [
+                      /* @__PURE__ */ jsx("path", { d: "M18 6 6 18" }),
+                      /* @__PURE__ */ jsx("path", { d: "m6 6 12 12" })
+                    ] }) })
+                  ] })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "iframe",
+              {
+                title: "Contact card",
+                src: contactEmbedUrl(contactId, orgId, contactsOrigin),
+                "data-testid": "contact-slide-in-frame",
+                style: { flex: 1, minHeight: 0, width: "100%", border: 0, background: "var(--panel, #ffffff)" }
+              },
+              contactId
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+function useContactSlideIn() {
+  const [contactId, setContactId] = useState(null);
+  const open = useCallback((id) => setContactId(id), []);
+  const close = useCallback(() => setContactId(null), []);
+  return { contactId, open, close };
+}
 function FormColumn({ children, className }) {
   return /* @__PURE__ */ jsx("div", { "data-shell-form-column": "", className: clsx2("w-full max-w-[960px]", className), children });
 }
@@ -2818,6 +2985,6 @@ function BreadcrumbBarView({
   );
 }
 
-export { AI_CREDITS_STATE_TITLES, AiCreditsState, BreadcrumbBarView, CORE_APP_ORIGIN, CORE_BILLING_PATH, CREDIT_TYPE_LABELS, CREDIT_TYPE_ORDER, Card, CreditsAction, FormColumn, FuelAction, HeaderTabBar, KNOWN_TAB_GLYPHS, MyProfileAction, NAV_DISPLAY_OPTIONS, NavChromeProvider, NavDisplayAction, NavThemeControl, NotificationsAction, OrganizationSettingsAction, PageHeaderView, RowMenu, RowMenuItem, SPECS_ORIGIN, SpecOverlayAction, SpeculationRulesScript, SupportAction, TOPBAR_GLYPH_SIZE, TopBarCountBadge, TopBarLinkAction, TopBarPanelArrow, TopBarPopover, TopBarTooltip, TopBarWidgetSlot, VRM_TIER_LABELS, VRM_VERIFIED_TOOLTIP, VrmVerifiedBadge, aiCreditsWalletUrl, buildNavSpeculationRules, buildSpeculationRules, collectSiblingAppUrls, createCommsNotificationsAdapter, creditGaugeRatio, creditStateWord, creditTooltipLine, creditsAriaLabel, creditsIconState, emptyNotificationsFeed, normalizeNotificationsFeed, resolveBrandGlyph, resolveOrgLogoUrl, resolveTabGlyph, rowMenuPosition, topBarIconButtonClass, useChromeMe, useChromeOrgs, useNavChromeDedupedFetch, useNavChromeFetcher, useThemePreference, useTopBarIconSlotGlyph, warnDeprecated };
-//# sourceMappingURL=chunk-WOOBPM4V.js.map
-//# sourceMappingURL=chunk-WOOBPM4V.js.map
+export { AI_CREDITS_STATE_TITLES, AiCreditsState, BreadcrumbBarView, CONTACTS_ORIGIN, CORE_APP_ORIGIN, CORE_BILLING_PATH, CREDIT_TYPE_LABELS, CREDIT_TYPE_ORDER, Card, ContactSlideIn, CreditsAction, FormColumn, FuelAction, HeaderTabBar, KNOWN_TAB_GLYPHS, MyProfileAction, NAV_DISPLAY_OPTIONS, NavChromeProvider, NavDisplayAction, NavThemeControl, NotificationsAction, OrganizationSettingsAction, PageHeaderView, RowMenu, RowMenuItem, SPECS_ORIGIN, SpecOverlayAction, SpeculationRulesScript, SupportAction, TOPBAR_GLYPH_SIZE, TopBarCountBadge, TopBarLinkAction, TopBarPanelArrow, TopBarPopover, TopBarTooltip, TopBarWidgetSlot, VRM_TIER_LABELS, VRM_VERIFIED_TOOLTIP, VrmVerifiedBadge, aiCreditsWalletUrl, buildNavSpeculationRules, buildSpeculationRules, collectSiblingAppUrls, contactEmbedUrl, contactPageUrl, createCommsNotificationsAdapter, creditGaugeRatio, creditStateWord, creditTooltipLine, creditsAriaLabel, creditsIconState, emptyNotificationsFeed, normalizeNotificationsFeed, resolveBrandGlyph, resolveOrgLogoUrl, resolveTabGlyph, rowMenuPosition, topBarIconButtonClass, useChromeMe, useChromeOrgs, useContactSlideIn, useNavChromeDedupedFetch, useNavChromeFetcher, useThemePreference, useTopBarIconSlotGlyph, warnDeprecated };
+//# sourceMappingURL=chunk-PQQLCUNO.js.map
+//# sourceMappingURL=chunk-PQQLCUNO.js.map