@scripso-homepad/ui 0.4.13 → 0.4.14

package/dist/web/index.cjs

@@ -28870,6 +28870,7 @@ function Input({
   fieldClassName,
   fieldStyle,
   labelClassName,
+  labelStyles,
   inputClassName,
   errorClassName,
   hintClassName,
@@ -28931,7 +28932,15 @@ function Input({
     }
   ) : rightIcon ? renderInputIcon(rightIcon, iconColor) : null;
   return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { ref: wrapperRef, style: [styles2.wrapper, containerStyle], children: [
-    label ? /* @__PURE__ */ jsxRuntime.jsx(Label, { disabled: isDisabled, className: labelClassName, children: label }) : null,
+    label ? /* @__PURE__ */ jsxRuntime.jsx(
+      Label,
+      {
+        disabled: isDisabled,
+        className: labelClassName,
+        style: labelStyles,
+        children: label
+      }
+    ) : null,
     /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: fieldStyles.outline, children: /* @__PURE__ */ jsxRuntime.jsxs(
       reactNative.View,
       {
@@ -29295,6 +29304,7 @@ function AppHeader({
   title,
   labels,
   hasBuildingSelect = false,
+  showSearch = true,
   buildingOptions = [],
   selectedBuildingId = "",
   className,
@@ -29337,7 +29347,7 @@ function AppHeader({
               chevronIcon: buildingChevronIcon
             }
           ) : null,
-          /* @__PURE__ */ jsxRuntime.jsx(
+          showSearch ? /* @__PURE__ */ jsxRuntime.jsx(
             Input,
             {
               leftIcon: searchIcon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { strokeWidth: 1.75 }),
@@ -29350,7 +29360,7 @@ function AppHeader({
               fieldStyle: searchFieldStyle ?? defaultSearchFieldStyle,
               accessibilityLabel: labels.searchPlaceholder
             }
-          ),
+          ) : null,
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {
@@ -30389,12 +30399,12 @@ var MENU_WIDTH_PX = 231;
 var MENU_OFFSET_PX = 4;
 var MENU_VIEWPORT_MARGIN_PX = 8;
 var useIsomorphicLayoutEffect = typeof window === "undefined" ? react.useEffect : react.useLayoutEffect;
-function clampMenuLeft(left) {
+function clampMenuLeft(left, menuWidth) {
   if (typeof window === "undefined") {
     return left;
   }
   const minLeft = MENU_VIEWPORT_MARGIN_PX;
-  const maxLeft = Math.max(minLeft, window.innerWidth - MENU_WIDTH_PX - MENU_VIEWPORT_MARGIN_PX);
+  const maxLeft = Math.max(minLeft, window.innerWidth - menuWidth - MENU_VIEWPORT_MARGIN_PX);
   return Math.min(Math.max(left, minLeft), maxLeft);
 }
 function resolveMenuItemIcon(item) {
@@ -30414,7 +30424,9 @@ function TableActionsMenu({
   items,
   triggerAriaLabel,
   className,
-  menuClassName
+  menuClassName,
+  menuWidth = MENU_WIDTH_PX,
+  menuFitContent = false
 }) {
   const [open, setOpen] = react.useState(false);
   const [menuPosition, setMenuPosition] = react.useState(null);
@@ -30431,11 +30443,12 @@ function TableActionsMenu({
       return;
     }
     const rect = trigger.getBoundingClientRect();
+    const resolvedMenuWidth = menuFitContent ? menuRef.current?.getBoundingClientRect().width ?? menuWidth : menuWidth;
     setMenuPosition({
       top: rect.bottom + MENU_OFFSET_PX,
-      left: clampMenuLeft(rect.right - MENU_WIDTH_PX)
+      left: clampMenuLeft(rect.right - resolvedMenuWidth, resolvedMenuWidth)
     });
-  }, []);
+  }, [menuFitContent, menuWidth]);
   useOnClickOutside([rootRef, menuRef], closeMenu, open);
   useIsomorphicLayoutEffect(() => {
     if (!open) {
@@ -30444,6 +30457,12 @@ function TableActionsMenu({
     }
     updateMenuPosition();
   }, [open, updateMenuPosition]);
+  useIsomorphicLayoutEffect(() => {
+    if (!open || !menuFitContent) {
+      return;
+    }
+    updateMenuPosition();
+  }, [items, menuFitContent, open, updateMenuPosition]);
   react.useEffect(() => {
     if (!open) {
       return;
@@ -30479,7 +30498,7 @@ function TableActionsMenu({
         position: "fixed",
         top: menuPosition.top,
         left: menuPosition.left,
-        width: MENU_WIDTH_PX
+        ...menuFitContent ? { width: "max-content" } : { width: menuWidth }
       },
       className: cn(
         "z-50 overflow-hidden rounded-2xl border border-storm-gray-50 bg-white shadow-[0_4px_20px_0_rgba(0,0,0,0.05)]",
@@ -30501,7 +30520,8 @@ function TableActionsMenu({
               item.onSelect();
             },
             className: cn(
-              "flex h-[51px] w-full cursor-pointer items-center gap-2.5 px-3 text-left typography-14 font-medium text-storm-gray-900 transition-colors hover:bg-storm-gray-0",
+              "flex h-[51px] cursor-pointer items-center gap-2.5 px-3 text-left typography-14 font-medium text-storm-gray-900 transition-colors hover:bg-storm-gray-0",
+              menuFitContent ? "w-auto" : "w-full",
               index > 0 && "border-t border-storm-gray-50",
               item.disabled && "cursor-not-allowed opacity-50"
             ),