@homebound/beam 4.3.1 → 4.4.0

package/dist/index.js

@@ -5439,10 +5439,10 @@ function Loader({
     borderWidth: ["bw_var", {
       "--borderWidth": maybeCssVar6(`${borderSize}px`)
     }],
-    height: ["h_var", {
+    height: ["sq_var", {
       "--height": `${dimensions}px`
     }],
-    width: ["w_var", {
+    width: ["sq_var", {
       "--width": `${dimensions}px`
     }],
     borderColor: ["bc_var", {
@@ -5688,8 +5688,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)"
       }],
@@ -10096,12 +10096,12 @@ function Avatar({
   const [showFallback, setShowFallback] = useState10(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`
     }],
@@ -14765,8 +14765,8 @@ function Day(props) {
           ...trussProps47({
             position: "absolute",
             bottom: "bot_4px",
-            width: "w_4px",
             height: "h_4px",
+            width: "w_4px",
             backgroundColor: ["bgColor_var", {
               "--backgroundColor": "var(--b-primary)"
             }],
@@ -25509,9 +25509,9 @@ function StepIcon({
   if (state === "complete") {
     return /* @__PURE__ */ jsx195(Icon, { icon: "check" });
   }
-  return /* @__PURE__ */ jsx195("div", { className: "w_24px h_24px df aic jcc", children: /* @__PURE__ */ jsx195("div", { ...trussProps113({
-    width: "w_10px",
+  return /* @__PURE__ */ jsx195("div", { className: "h_24px w_24px df aic jcc", children: /* @__PURE__ */ jsx195("div", { ...trussProps113({
     height: "h_10px",
+    width: "w_10px",
     borderStyle: "bss",
     borderWidth: "bw2",
     borderRadius: "br100",
@@ -28457,7 +28457,7 @@ function BaseHeader(props) {
 
 // src/components/Headers/PageHeader.tsx
 import { trussProps as trussProps133 } from "@homebound/truss/runtime";
-import { Fragment as Fragment52, jsx as jsx231, jsxs as jsxs123 } from "react/jsx-runtime";
+import { jsx as jsx231, jsxs as jsxs123 } from "react/jsx-runtime";
 function PageHeader2(props) {
   const {
     tabs,
@@ -28466,9 +28466,11 @@ function PageHeader2(props) {
     ...otherProps
   } = props;
   const tid = useTestIds(otherProps, "header");
-  return /* @__PURE__ */ jsx231(BaseHeader, { ...otherProps, rightSlot: /* @__PURE__ */ jsxs123(Fragment52, { children: [
+  const hasActions = !!actions && actions.length > 0;
+  return /* @__PURE__ */ jsx231(BaseHeader, { ...otherProps, rightSlot: /* @__PURE__ */ jsxs123("div", { className: "df gap1 fs0", ...tid.actions, children: [
+    /* @__PURE__ */ jsx231(AutoSaveIndicator, { hideOnIdle: true }),
     rightSlot,
-    actions && actions.length > 0 && /* @__PURE__ */ jsx231(HeaderActions, { actions, collapseOnSm: true })
+    hasActions && /* @__PURE__ */ jsx231(HeaderActions, { actions, collapseOnSm: true })
   ] }), bottomSlot: tabs && /* @__PURE__ */ jsx231("div", { ...trussProps133(pageContentPaddingX), children: /* @__PURE__ */ jsx231(Tabs, { ...tabs, ...tid.tabs }) }) });
 }
 
@@ -29015,7 +29017,7 @@ function useFilter4({ filterDefs }) {
 import { useCallback as useCallback44, useRef as useRef75 } from "react";
 import { useComboBox as useComboBox3, useOverlayPosition as useOverlayPosition6 } from "react-aria";
 import { Item as Item5, useComboBoxState as useComboBoxState3 } from "react-stately";
-import { Fragment as Fragment53, jsx as jsx243, jsxs as jsxs129 } from "react/jsx-runtime";
+import { Fragment as Fragment52, jsx as jsx243, jsxs as jsxs129 } from "react/jsx-runtime";
 function Autocomplete(props) {
   const {
     onSelect,
@@ -29086,7 +29088,7 @@ function Autocomplete(props) {
     // Ensures the menu never gets too small.
     minWidth: 200
   };
-  return /* @__PURE__ */ jsxs129(Fragment53, { children: [
+  return /* @__PURE__ */ jsxs129(Fragment52, { children: [
     /* @__PURE__ */ jsx243(
       TextFieldBase,
       {