@homebound/beam 3.31.1 → 3.32.0

package/dist/index.d.cts

@@ -6205,11 +6205,20 @@ type ImpersonatedUser = {
 type EnvironmentBannerProps = {
     env: AppEnvironment;
     impersonating?: ImpersonatedUser;
+    /**
+     * Shows the production warning banner; typically set to `true` only for developers in the consuming app.
+     * Its styling takes precedence over impersonation (red fill + prod warning copy, with impersonation still
+     * shown on the right).
+     */
+    showProdWarning?: boolean;
 };
 /** Environment banner; horizontal/vertical pinning is owned by {@link EnvironmentBannerLayout}. */
 declare function EnvironmentBanner(props: EnvironmentBannerProps): JSX.Element | null;
-/** True when {@link EnvironmentBanner} should display: `dev`, `qa`, `local-prod`, or `prod` while impersonating. */
-declare function shouldShowEnvironmentBanner(env: AppEnvironment, impersonating: ImpersonatedUser | undefined): boolean;
+/**
+ * True when {@link EnvironmentBanner} should display: `dev`, `qa`, `local-prod`, or `prod` while impersonating
+ * or when `showProdWarning` is set (typically only for developers in the consuming app).
+ */
+declare function shouldShowEnvironmentBanner(env: AppEnvironment, impersonating: ImpersonatedUser | undefined, showProdWarning: boolean): boolean;
 /** Fixed banner height (px); {@link EnvironmentBannerLayout} reads this for spacer/CSS var offsets. */
 declare const environmentBannerSizePx = 34;
 

package/dist/index.d.ts

@@ -6205,11 +6205,20 @@ type ImpersonatedUser = {
 type EnvironmentBannerProps = {
     env: AppEnvironment;
     impersonating?: ImpersonatedUser;
+    /**
+     * Shows the production warning banner; typically set to `true` only for developers in the consuming app.
+     * Its styling takes precedence over impersonation (red fill + prod warning copy, with impersonation still
+     * shown on the right).
+     */
+    showProdWarning?: boolean;
 };
 /** Environment banner; horizontal/vertical pinning is owned by {@link EnvironmentBannerLayout}. */
 declare function EnvironmentBanner(props: EnvironmentBannerProps): JSX.Element | null;
-/** True when {@link EnvironmentBanner} should display: `dev`, `qa`, `local-prod`, or `prod` while impersonating. */
-declare function shouldShowEnvironmentBanner(env: AppEnvironment, impersonating: ImpersonatedUser | undefined): boolean;
+/**
+ * True when {@link EnvironmentBanner} should display: `dev`, `qa`, `local-prod`, or `prod` while impersonating
+ * or when `showProdWarning` is set (typically only for developers in the consuming app).
+ */
+declare function shouldShowEnvironmentBanner(env: AppEnvironment, impersonating: ImpersonatedUser | undefined, showProdWarning: boolean): boolean;
 /** Fixed banner height (px); {@link EnvironmentBannerLayout} reads this for spacer/CSS var offsets. */
 declare const environmentBannerSizePx = 34;
 

package/dist/index.js

@@ -4434,7 +4434,14 @@ var Icons = {
     /* @__PURE__ */ jsx3("path", { d: "M12 4.929L11.293 5.636L12.707 7.05L13.414 6.343C14.583 5.176 16.486 5.174 17.657 6.343C18.826 7.513 18.826 9.416 17.657 10.586L15.535 12.707C14.402 13.84 12.426 13.84 11.293 12.707L10.586 12L9.172 13.414L9.879 14.121C10.822 15.065 12.078 15.586 13.414 15.586C14.75 15.586 16.006 15.065 16.949 14.121L19.071 12C21.019 10.051 21.019 6.878 19.071 4.929C17.121 2.979 13.948 2.98 12 4.929Z" })
   ] }),
   // FIXME: This is not an "official" design approved icon. It should be replaced
-  unlink: /* @__PURE__ */ jsx3(Fragment2, { children: /* @__PURE__ */ jsx3("path", { "fill-rule": "evenodd", d: "M5.63603897,5.63603897 L11.289,11.289 L13.4213562,9.15728753 C13.8138529,8.76479084 14.4502158,8.76479084 14.8427125,9.15728753 C15.2352092,9.54978421 15.2352092,10.1861471 14.8427125,10.5786438 L12.71,12.71 L18.363961,18.363961 C18.7544853,18.7544853 18.7544853,19.3876503 18.363961,19.7781746 C17.9734367,20.1686989 17.3402718,20.1686989 16.9497475,19.7781746 L14.139,16.968 L10.5786438,20.5281374 C8.61616033,22.4906209 5.43434601,22.4906209 3.47186258,20.5281374 C1.56102344,18.6172983 1.5107382,15.5504592 3.32100685,13.5787779 L3.47186258,13.4213562 L7.032,9.861 L4.22182541,7.05025253 C3.83130112,6.65972824 3.83130112,6.02656326 4.22182541,5.63603897 C4.6123497,5.24551468 5.24551468,5.24551468 5.63603897,5.63603897 Z M8.453,11.282 L4.89321881,14.8427125 C3.71572875,16.0202025 3.71572875,17.9292911 4.89321881,19.1067812 C6.02865566,20.242218 7.84436716,20.2827693 9.02839505,19.2284351 L9.15728753,19.1067812 L12.717,15.546 L11.296,14.125 L10.5786438,14.8427125 C10.1861471,15.2352092 9.54978421,15.2352092 9.15728753,14.8427125 C8.76479084,14.4502158 8.76479084,13.8138529 9.15728753,13.4213562 L9.875,12.704 L8.453,11.282 Z M20.5281374,3.47186258 C22.4906209,5.43434601 22.4906209,8.61616033 20.5281374,10.5786438 L17.6854249,13.4213562 C17.2929283,13.8138529 16.6565654,13.8138529 16.2640687,13.4213562 C15.871572,13.0288596 15.871572,12.3924967 16.2640687,12 L19.1067812,9.15728753 C20.2842712,7.97979746 20.2842712,6.07070887 19.1067812,4.89321881 C17.9292911,3.71572875 16.0202025,3.71572875 14.8427125,4.89321881 L12,7.73593129 C11.6075033,8.12842798 10.9711404,8.12842798 10.5786438,7.73593129 C10.1861471,7.3434346 10.1861471,6.70707174 10.5786438,6.31457505 L13.4213562,3.47186258 C15.3838397,1.50937914 18.565654,1.50937914 20.5281374,3.47186258 Z M12.7071068,9.87867966 L11.2928932,11.2928932 L12.7071068,12.7071068 L14.1213203,11.2928932 L12.7071068,9.87867966 Z" }) }),
+  unlink: /* @__PURE__ */ jsxs2(Fragment2, { children: [
+    /* @__PURE__ */ jsx3("path", { d: "M8.465 11.293C9.598 10.16 11.574 10.16 12.707 11.293L13.414 12L14.828 10.586L14.121 9.879C13.178 8.935 11.922 8.414 10.586 8.414C9.25 8.414 7.994 8.935 7.051 9.879L4.929 12C2.981 13.949 2.981 17.122 4.929 19.071C5.904 20.046 7.184 20.533 8.464 20.533C9.745 20.533 11.026 20.046 12 19.071L12.707 18.364L11.293 16.95L10.586 17.657C9.416 18.824 7.513 18.826 6.343 17.657C5.174 16.487 5.174 14.584 6.343 13.414L8.465 11.293Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M12 4.92898L11.293 5.63598L12.707 7.04998L13.414 6.34298C14.583 5.17598 16.486 5.17398 17.657 6.34298C18.826 7.51298 18.826 9.41598 17.657 10.586L15.535 12.707C14.402 13.84 12.426 13.84 11.293 12.707L10.586 12L9.172 13.414L9.879 14.121C10.822 15.065 12.078 15.586 13.414 15.586C14.75 15.586 16.006 15.065 16.949 14.121L19.071 12C21.019 10.051 21.019 6.87798 19.071 4.92898C17.121 2.97898 13.948 2.97998 12 4.92898Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M1 7L5 7V9L1 9L1 7Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M23.5 17H19.5V15H23.5V17Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M15 23V19H17V23H15Z" }),
+    /* @__PURE__ */ jsx3("path", { d: "M9 1V5H7V1H9Z" })
+  ] }),
   linkExternal: /* @__PURE__ */ jsxs2(Fragment2, { children: [
     /* @__PURE__ */ jsx3("path", { d: "M13 3L16.293 6.293L9.29297 13.293L10.707 14.707L17.707 7.707L21 11V3H13Z" }),
     /* @__PURE__ */ jsx3("path", { d: "M19 19H5V5H12L10 3H5C3.897 3 3 3.897 3 5V19C3 20.103 3.897 21 5 21H19C20.103 21 21 20.103 21 19V14L19 12V19Z" })
@@ -21838,10 +21845,11 @@ function EnvironmentBanner(props) {
   const {
     env,
     impersonating,
+    showProdWarning = false,
     ...others
   } = props;
   const tid = useTestIds(others, "environmentBanner");
-  if (!shouldShowEnvironmentBanner(env, impersonating)) {
+  if (!shouldShowEnvironmentBanner(env, impersonating, showProdWarning)) {
     return null;
   }
   const {
@@ -21849,7 +21857,7 @@ function EnvironmentBanner(props) {
     badgeLabel,
     message,
     tooltip
-  } = getEnvironmentBannerConfig(env, impersonating);
+  } = getEnvironmentBannerConfig(env, impersonating, showProdWarning);
   const bgColorVar = maybeCssVar(bgColor);
   return /* @__PURE__ */ jsxs84("div", { ...trussProps83({
     flexShrink: "fs0",
@@ -21892,7 +21900,7 @@ function EnvironmentBanner(props) {
         ] })
       ] }),
       impersonating != null && /* @__PURE__ */ jsxs84("span", { className: "df aic gap2 fw6 fz_12px lh_16px white fs0", ...tid.impersonating, children: [
-        env !== "prod" && /* @__PURE__ */ jsxs84("span", { children: [
+        (env !== "prod" || showProdWarning) && /* @__PURE__ */ jsxs84("span", { children: [
           /* @__PURE__ */ jsx166("span", { className: "dn mdandup_dib", children: "Impersonating \xA0" }),
           impersonating.name
         ] }),
@@ -21901,10 +21909,10 @@ function EnvironmentBanner(props) {
     ] })
   ] });
 }
-function shouldShowEnvironmentBanner(env, impersonating) {
-  return env === "dev" || env === "qa" || env === "local-prod" || env === "prod" && isDefined(impersonating);
+function shouldShowEnvironmentBanner(env, impersonating, showProdWarning) {
+  return env === "dev" || env === "qa" || env === "local-prod" || env === "prod" && (isDefined(impersonating) || showProdWarning);
 }
-function getEnvironmentBannerConfig(env, impersonating) {
+function getEnvironmentBannerConfig(env, impersonating, showProdWarning) {
   switch (env) {
     case "dev":
       return {
@@ -21920,9 +21928,16 @@ function getEnvironmentBannerConfig(env, impersonating) {
         message: "You are in the QA Environment",
         tooltip: "You are in the QA Environment. Any changes here will not be reflected in live production data."
       };
-    // Prod env banner should only be displayed when impersonating
+    // Prod banner shows when impersonating or when `showProdWarning` is set. The prod warning takes precedence:
+    // it reuses the red local-prod fill for "live prod data" urgency, while impersonation (if any) still shows
+    // on the right. Impersonation alone keeps its own prod fill and copy.
     case "prod":
-      return {
+      return showProdWarning ? {
+        bgColor: "--b-env-brand-local-prod" /* EnvBrandLocalProd */,
+        badgeLabel: "PROD",
+        message: "You are in the Production Environment",
+        tooltip: "You are in the Production Environment. Any changes here WILL be reflected in live production data."
+      } : {
         bgColor: "--b-env-brand-prod" /* EnvBrandProd */,
         badgeLabel: "PROD",
         message: `You are impersonating ${impersonating?.name}`,
@@ -24153,7 +24168,7 @@ function EnvironmentBannerLayout(props) {
     children
   } = props;
   const tid = useTestIds(props, "environmentBannerLayout");
-  const showBanner = environmentBanner != null && shouldShowEnvironmentBanner(environmentBanner.env, environmentBanner.impersonating);
+  const showBanner = environmentBanner != null && shouldShowEnvironmentBanner(environmentBanner.env, environmentBanner.impersonating, environmentBanner.showProdWarning ?? false);
   const bannerHeightPx = showBanner ? environmentBannerSizePx : 0;
   const style = {
     [beamEnvironmentBannerLayoutHeightVar]: `${bannerHeightPx}px`