@the-portland-company/shell 0.70.0 → 0.71.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/native.cjs CHANGED
@@ -256,7 +256,7 @@ function topBarIconButtonClass(tone = "default") {
256
256
  const toneClass = tone === "danger" || tone === "warning" ? "text-[color:var(--chrome-danger)] hover:text-[color:var(--chrome-danger)]" : "text-[color:var(--topbar-icon-color,var(--muted))] hover:text-[color:var(--topbar-icon-hover-color,var(--foreground))] hover:bg-[color:var(--topbar-icon-hover-bg,transparent)]";
257
257
  return [
258
258
  // `group/tbtip` powers the shared <TopBarTooltip> rendered inside the trigger.
259
- "group/tbtip relative flex items-center justify-center rounded-[var(--topbar-icon-button-radius,5px)] border border-[color:var(--line)] transition",
259
+ "group/tbtip relative flex items-center justify-center rounded-[var(--topbar-icon-button-radius,5px)] border border-transparent transition",
260
260
  "h-[var(--topbar-icon-button-size,34px)] w-[var(--topbar-icon-button-size,34px)]",
261
261
  toneClass
262
262
  ].join(" ");
@@ -2242,6 +2242,12 @@ function hasActiveChild(item, pathname, activeFn) {
2242
2242
  )
2243
2243
  );
2244
2244
  }
2245
+ function shortEnvLabel(label) {
2246
+ const l = label.trim().toLowerCase();
2247
+ if (l === "production") return "prod";
2248
+ if (l === "development") return "dev";
2249
+ return l;
2250
+ }
2245
2251
  function envChipClasses(label) {
2246
2252
  const l = label.toLowerCase();
2247
2253
  if (l === "production" || l === "prod")
@@ -2455,7 +2461,7 @@ function NavSidebar({
2455
2461
  }
2456
2462
  ),
2457
2463
  org ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: rc("max-md:flex max-md:justify-center"), children: [
2458
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mb-[7px] flex items-center justify-between ${rc("max-md:hidden")}`, children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: NAV_EYEBROW_CLASS, children: "Organization" }) }),
2464
+ /* @__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" }) }),
2459
2465
  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: [
2460
2466
  /* @__PURE__ */ jsxRuntime.jsx(
2461
2467
  "span",
@@ -2481,7 +2487,7 @@ function NavSidebar({
2481
2487
  className: `flex w-full cursor-pointer list-none flex-col overflow-hidden rounded-[5px] border border-[color:var(--sidebar-card-border,var(--sidebar-line,var(--line)))] bg-[color:var(--sidebar-card-bg,var(--panel-elevated))] text-left text-[color:var(--sidebar-text,var(--foreground))] transition hover:bg-[color:var(--sidebar-row-hover-bg,var(--panel))] [&::-webkit-details-marker]:hidden ${rc("max-md:w-auto max-md:items-center max-md:overflow-visible max-md:border-0 max-md:bg-transparent")}`,
2482
2488
  children: [
2483
2489
  /* @__PURE__ */ jsxRuntime.jsx(OrgIconMark, { org, logoSrc: orgLogoSrc }),
2484
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `relative flex h-[var(--sidebar-org-band-height,48px)] w-full items-center justify-center bg-[#FFFFFF] px-3 py-[7px] ${rc("max-md:hidden")}`, children: [
2490
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `relative flex h-[var(--sidebar-org-band-height,70px)] w-full items-center justify-center bg-[#FFFFFF] px-3 py-[7px] ${rc("max-md:hidden")}`, children: [
2485
2491
  orgLogoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: orgLogoSrc, alt: "", className: "max-h-full max-w-[132px] object-contain" }) : org.canUploadLogo ? /* @__PURE__ */ jsxRuntime.jsx(
2486
2492
  "a",
2487
2493
  {
@@ -2493,7 +2499,7 @@ function NavSidebar({
2493
2499
  ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-semibold text-neutral-800", children: org.name ?? "Organization" }),
2494
2500
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "absolute inset-x-0 bottom-0 h-[3px]", style: { backgroundImage: orgGradient } })
2495
2501
  ] }),
2496
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `flex w-full min-w-0 items-center justify-between gap-[9px] px-[10px] py-2 ${rc("max-md:hidden")}`, children: [
2502
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `flex w-full min-w-0 items-center justify-between gap-[9px] px-[10px] py-[10px] ${rc("max-md:hidden")}`, children: [
2497
2503
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col", children: [
2498
2504
  /* @__PURE__ */ jsxRuntime.jsx(
2499
2505
  "span",
@@ -2583,7 +2589,7 @@ function NavSidebar({
2583
2589
  className: `flex w-full flex-col overflow-hidden rounded-[5px] border border-[color:var(--sidebar-card-border,var(--sidebar-line,var(--line)))] bg-[color:var(--sidebar-card-bg,var(--panel-elevated))] text-left text-[color:var(--sidebar-text,var(--foreground))] transition hover:bg-[color:var(--sidebar-row-hover-bg,var(--panel))] ${rc("max-md:w-auto max-md:items-center max-md:overflow-visible max-md:border-0 max-md:bg-transparent")}`,
2584
2590
  children: [
2585
2591
  /* @__PURE__ */ jsxRuntime.jsx(OrgIconMark, { org, logoSrc: orgLogoSrc }),
2586
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `relative flex h-[var(--sidebar-org-band-height,48px)] w-full items-center justify-center bg-[#FFFFFF] px-3 py-[7px] ${rc("max-md:hidden")}`, children: [
2592
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `relative flex h-[var(--sidebar-org-band-height,70px)] w-full items-center justify-center bg-[#FFFFFF] px-3 py-[7px] ${rc("max-md:hidden")}`, children: [
2587
2593
  orgLogoSrc ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: orgLogoSrc, alt: "", className: "max-h-full max-w-[132px] object-contain" }) : org.canUploadLogo ? /* @__PURE__ */ jsxRuntime.jsx(
2588
2594
  "a",
2589
2595
  {
@@ -2595,7 +2601,7 @@ function NavSidebar({
2595
2601
  ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-semibold text-neutral-800", children: org.name ?? "Organization" }),
2596
2602
  /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "absolute inset-x-0 bottom-0 h-[3px]", style: { backgroundImage: orgGradient } })
2597
2603
  ] }),
2598
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `flex w-full min-w-0 items-center justify-between gap-[9px] px-[10px] py-2 ${rc("max-md:hidden")}`, children: [
2604
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: `flex w-full min-w-0 items-center justify-between gap-[9px] px-[10px] py-[10px] ${rc("max-md:hidden")}`, children: [
2599
2605
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex min-w-0 flex-col", children: [
2600
2606
  /* @__PURE__ */ jsxRuntime.jsx(
2601
2607
  "span",
@@ -2640,7 +2646,7 @@ function NavSidebar({
2640
2646
  },
2641
2647
  disabled: !available,
2642
2648
  className: [
2643
- "flex flex-1 items-center justify-center rounded-[5px] px-[9px] py-[6px] transition",
2649
+ `flex flex-none items-center justify-center rounded-[5px] px-[9px] py-[6px] transition ${rc("max-md:flex-1")}`,
2644
2650
  !available ? "cursor-not-allowed text-[color:var(--sidebar-text-muted,var(--muted))] opacity-35" : selected ? "bg-[color:var(--sidebar-mode-selected-bg,var(--mode-accent,var(--color-accent)))] text-[color:var(--mode-on-accent,white)]" : "text-[color:var(--sidebar-text-muted,var(--muted))] hover:bg-[#FFFFFF]/5 hover:text-[color:var(--sidebar-text,var(--foreground))]"
2645
2651
  ].join(" "),
2646
2652
  children: OptIcon ? /* @__PURE__ */ jsxRuntime.jsx(OptIcon, { size: 15, className: "shrink-0" }) : null
@@ -2730,50 +2736,37 @@ function NavSidebar({
2730
2736
  onSignOut: footer.onSignOut
2731
2737
  }
2732
2738
  ) : null,
2733
- footer.links && footer.links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex flex-wrap items-center gap-[10px] text-[11px] leading-[1.2] ${footer.user ? "mt-3" : ""} ${rc("max-md:hidden")}`, children: footer.links.map((l) => /* @__PURE__ */ jsxRuntime.jsx(
2734
- "a",
2735
- {
2736
- href: safeHref(l.href),
2737
- className: "text-[color:var(--sidebar-caption,var(--sidebar-text-muted,var(--muted)))] hover:text-[color:var(--sidebar-text,var(--foreground))] hover:underline",
2738
- children: l.label
2739
- },
2740
- l.label
2741
- )) }) : null,
2742
- footer.envLabel && footer.envLabel.trim().toLowerCase() !== "production" ? /* @__PURE__ */ jsxRuntime.jsxs(
2739
+ footer.links && footer.links.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex flex-wrap items-center justify-center gap-[6px] text-[11px] leading-[1.2] ${footer.user ? "mt-3" : ""} ${rc("max-md:hidden")}`, children: footer.links.map((l, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
2740
+ i > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-[color:var(--sidebar-caption,var(--sidebar-text-muted,var(--muted)))]", children: "\xB7" }) : null,
2741
+ /* @__PURE__ */ jsxRuntime.jsx(
2742
+ "a",
2743
+ {
2744
+ href: safeHref(l.href),
2745
+ className: "text-[color:var(--sidebar-caption,var(--sidebar-text-muted,var(--muted)))] hover:text-[color:var(--sidebar-text,var(--foreground))] hover:underline",
2746
+ children: l.label
2747
+ }
2748
+ )
2749
+ ] }, l.label)) }) : null,
2750
+ footer.envLabel || footer.commit || footer.version ? /* @__PURE__ */ jsxRuntime.jsxs(
2743
2751
  "div",
2744
2752
  {
2745
2753
  "data-shell-meta": true,
2746
- className: `mt-1.5 flex flex-col items-start gap-0.5 font-[family-name:var(--font-plex-mono)] text-[10px] text-[color:var(--sidebar-meta-text,var(--sidebar-text))] ${rc("max-md:hidden")}`,
2754
+ className: `mt-1.5 flex flex-col items-center gap-0.5 font-[family-name:var(--font-plex-mono)] text-[11px] text-[color:var(--sidebar-meta-text,rgba(255,255,255,0.4))] ${rc("max-md:hidden")}`,
2747
2755
  children: [
2748
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
2749
- /* @__PURE__ */ jsxRuntime.jsx(
2750
- "span",
2751
- {
2752
- className: [
2753
- "rounded-md px-1.5 py-0.5 text-[10px] font-semibold",
2754
- envChipClasses(footer.envLabel)
2755
- ].join(" "),
2756
- children: footer.envLabel
2757
- }
2758
- ),
2759
- footer.commit ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2760
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[color:var(--muted)]", children: "|" }),
2761
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: footer.commit.slice(-4) })
2762
- ] }) : null,
2763
- footer.version ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2764
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[color:var(--muted)]", children: "|" }),
2765
- /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
2766
- "v",
2767
- footer.version
2768
- ] })
2769
- ] }) : null
2770
- ] }),
2756
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1.5", children: [
2757
+ footer.envLabel ? shortEnvLabel(footer.envLabel) : null,
2758
+ footer.commit ? footer.commit.slice(-4) : null,
2759
+ footer.version ? `v${footer.version.replace(/^v/, "")}` : null
2760
+ ].filter((v) => Boolean(v)).map((v, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
2761
+ i > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: "|" }) : null,
2762
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: v })
2763
+ ] }, i)) }),
2771
2764
  footer.commitDate || footer.commitAuthor ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
2772
2765
  footer.commitDate ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: new Date(footer.commitDate).toLocaleDateString(void 0, {
2773
2766
  month: "short",
2774
2767
  day: "numeric"
2775
2768
  }) }) : null,
2776
- footer.commitDate && footer.commitAuthor ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[color:var(--muted)]", children: "|" }) : null,
2769
+ footer.commitDate && footer.commitAuthor ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: "|" }) : null,
2777
2770
  footer.commitAuthor ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: footer.commitAuthor.split(/\s+/)[0] }) : null
2778
2771
  ] }) : null
2779
2772
  ]
@@ -3917,6 +3910,7 @@ exports.clearBetaBannerDismissal = clearBetaBannerDismissal;
3917
3910
  exports.envChipClasses = envChipClasses;
3918
3911
  exports.isNavItemActive = isNavItemActive;
3919
3912
  exports.resolveOrgLogoUrl = resolveOrgLogoUrl;
3913
+ exports.shortEnvLabel = shortEnvLabel;
3920
3914
  exports.standardPolitogyNav = standardPolitogyNav;
3921
3915
  exports.topBarIconButtonClass = topBarIconButtonClass;
3922
3916
  exports.useChromeMe = useChromeMe;