@homebound/beam 4.3.1 → 4.4.0

package/dist/index.cjs

@@ -5858,10 +5858,10 @@ function Loader({
     borderWidth: ["bw_var", {
       "--borderWidth": (0, import_runtime8.maybeCssVar)(`${borderSize}px`)
     }],
-    height: ["h_var", {
+    height: ["sq_var", {
       "--height": `${dimensions}px`
     }],
-    width: ["w_var", {
+    width: ["sq_var", {
       "--width": `${dimensions}px`
     }],
     borderColor: ["bc_var", {
@@ -6156,8 +6156,8 @@ var variantStyles = {
     // Blue100/200 hover fills have no semantic tokens — keep palette for those.
     base: {
       borderRadius: "br100",
-      width: "w_48px",
       height: "h_48px",
+      width: "w_48px",
       borderColor: ["bc_var", {
         "--borderColor": "var(--b-field-border-default)"
       }],
@@ -10564,12 +10564,12 @@ function Avatar({
   const [showFallback, setShowFallback] = (0, import_react33.useState)(src === void 0);
   const styles = {
     borderRadius: "br100",
-    width: ["w_var", {
-      "--width": `${px2}px`
-    }],
-    height: ["h_var", {
+    height: ["sq_var", {
       "--height": `${px2}px`
     }],
+    width: ["sq_var", {
+      "--width": `${px2}px`
+    }],
     minWidth: ["mw_var", {
       "--minWidth": `${px2}px`
     }],
@@ -15233,8 +15233,8 @@ function Day(props) {
           ...(0, import_runtime56.trussProps)({
             position: "absolute",
             bottom: "bot_4px",
-            width: "w_4px",
             height: "h_4px",
+            width: "w_4px",
             backgroundColor: ["bgColor_var", {
               "--backgroundColor": "var(--b-primary)"
             }],
@@ -25963,9 +25963,9 @@ function StepIcon({
   if (state === "complete") {
     return /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(Icon, { icon: "check" });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime195.jsx)("div", { className: "w_24px h_24px df aic jcc", children: /* @__PURE__ */ (0, import_jsx_runtime195.jsx)("div", { ...(0, import_runtime128.trussProps)({
-    width: "w_10px",
+  return /* @__PURE__ */ (0, import_jsx_runtime195.jsx)("div", { className: "h_24px w_24px df aic jcc", children: /* @__PURE__ */ (0, import_jsx_runtime195.jsx)("div", { ...(0, import_runtime128.trussProps)({
     height: "h_10px",
+    width: "w_10px",
     borderStyle: "bss",
     borderWidth: "bw2",
     borderRadius: "br100",
@@ -28920,9 +28920,11 @@ function PageHeader2(props) {
     ...otherProps
   } = props;
   const tid = useTestIds(otherProps, "header");
-  return /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(BaseHeader, { ...otherProps, rightSlot: /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)(import_jsx_runtime231.Fragment, { children: [
+  const hasActions = !!actions && actions.length > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(BaseHeader, { ...otherProps, rightSlot: /* @__PURE__ */ (0, import_jsx_runtime231.jsxs)("div", { className: "df gap1 fs0", ...tid.actions, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(AutoSaveIndicator, { hideOnIdle: true }),
     rightSlot,
-    actions && actions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(HeaderActions, { actions, collapseOnSm: true })
+    hasActions && /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(HeaderActions, { actions, collapseOnSm: true })
   ] }), bottomSlot: tabs && /* @__PURE__ */ (0, import_jsx_runtime231.jsx)("div", { ...(0, import_runtime151.trussProps)(pageContentPaddingX), children: /* @__PURE__ */ (0, import_jsx_runtime231.jsx)(Tabs, { ...tabs, ...tid.tabs }) }) });
 }