@homebound/beam 4.57.1 → 4.57.2

package/dist/index.js

@@ -15358,16 +15358,21 @@ function AiPanel(props) {
     ...others
   } = props;
   const tid = useTestIds(others, "aiPanel");
-  return /* @__PURE__ */ jsx61("div", { ...trussProps40({
-    ...{
-      width: "w100",
-      backgroundImage: "aiBackground",
-      ...rounded ? {
-        borderRadius: "br12"
-      } : {}
-    },
-    ...aiBackgroundPaddingCss[padding]
-  }), ...others, ...tid, children });
+  return (
+    // Capped to the visible column so a page widened by an open right pane doesn't stretch it
+    /* @__PURE__ */ jsx61("div", { ...trussProps40({
+      ...{
+        backgroundImage: "aiBackground",
+        width: "w_min_100_calc_calc_var_beam_layout_viewport_width_100vw_var_beam_side_nav_layout_width_0px_2_var_beam_layout_content_padding_x_0px",
+        left: "l_calc_var_beam_side_nav_layout_width_0px_var_beam_layout_content_padding_x_0px",
+        position: "sticky",
+        ...rounded ? {
+          borderRadius: "br12"
+        } : {}
+      },
+      ...aiBackgroundPaddingCss[padding]
+    }), ...others, ...tid, children })
+  );
 }
 function AiCard(props) {
   const {
@@ -15381,34 +15386,39 @@ function AiCard(props) {
     gapCss
   } = aiCardChrome[size];
   const tid = useTestIds(others, "aiCard");
-  return /* @__PURE__ */ jsxs38("div", { ...trussProps40({
-    ...{
-      display: "df",
-      flexDirection: "fdc",
-      alignItems: "aifs",
-      width: "w100",
-      ...!fullWidth ? {
-        width: "wfc",
-        maxWidth: "maxw100",
-        marginLeft: "mla",
-        marginRight: "mra"
-      } : {}
-    },
-    ...gapCss
-  }), ...tid.column, children: [
-    /* @__PURE__ */ jsx61(BlueprintAiLogo, { height: logoHeight }),
-    /* @__PURE__ */ jsx61("div", { ...trussProps40({
-      display: "df",
-      flexDirection: "fdc",
-      width: "w100",
-      minWidth: "mw0",
-      borderRadius: "br12",
-      backgroundColor: ["bgColor_var", {
-        "--backgroundColor": "var(--b-surface)"
-      }],
-      boxShadow: "bshBasic"
-    }), ...others, ...tid.card, children })
-  ] });
+  return (
+    // Same cap as `AiPanel`, so a wide page does not stretch the card column
+    /* @__PURE__ */ jsxs38("div", { ...trussProps40({
+      ...{
+        display: "df",
+        flexDirection: "fdc",
+        alignItems: "aifs",
+        width: "w_min_100_calc_calc_var_beam_layout_viewport_width_100vw_var_beam_side_nav_layout_width_0px_2_var_beam_layout_content_padding_x_0px",
+        left: "l_calc_var_beam_side_nav_layout_width_0px_var_beam_layout_content_padding_x_0px",
+        position: "sticky",
+        ...!fullWidth ? {
+          width: "wfc",
+          maxWidth: "maxw100",
+          marginLeft: "mla",
+          marginRight: "mra"
+        } : {}
+      },
+      ...gapCss
+    }), ...tid.column, children: [
+      /* @__PURE__ */ jsx61(BlueprintAiLogo, { height: logoHeight }),
+      /* @__PURE__ */ jsx61("div", { ...trussProps40({
+        display: "df",
+        flexDirection: "fdc",
+        width: "w100",
+        minWidth: "mw0",
+        borderRadius: "br12",
+        backgroundColor: ["bgColor_var", {
+          "--backgroundColor": "var(--b-surface)"
+        }],
+        boxShadow: "bshBasic"
+      }), ...others, ...tid.card, children })
+    ] })
+  );
 }
 var aiBackgroundPaddingCss = {
   lg: {