@northlight/ui 2.35.0 → 2.35.2

package/dist/umd/northlight.cjs

@@ -2108,6 +2108,24 @@
           }
         }
       }),
+      light: ({ theme: { colors: color }, sx }) => ({
+        container: ramda.merge({
+          bgColor: color["base-alt"]
+        }, sx),
+        button: {
+          bgColor: "mono.transparent",
+          _hover: {
+            bgColor: color.background.button["ghost-hover"]
+          },
+          _checked: {
+            color: color.text["flip-button"].default,
+            bgColor: "bg.base",
+            _hover: {
+              bgColor: "bg.base"
+            }
+          }
+        }
+      }),
       ai: ({ theme: { colors: color }, sx }) => ({
         container: ramda.merge({
           bgColor: color.background["flip-button"]["default-deselected-brand"]
@@ -14479,7 +14497,7 @@
       "max",
       "min"
     ]);
-    var _a2;
+    var _a2, _b2, _c;
     const { isOpen, onToggle, onClose } = react.useDisclosure();
     const [inputValueState, setInputValueState] = React.useState(valueProp == null ? void 0 : valueProp.input);
     const [selectOptionState, setselectOptionState] = React.useState(valueProp == null ? void 0 : valueProp.option);
@@ -14541,9 +14559,10 @@
         onChange == null ? void 0 : onChange(getNewValue(option, input));
       }
     }, [inputValue, defaultToZeroIfEmpty]);
+    const buttonWidth = (_b2 = (_a2 = buttonRef.current) == null ? void 0 : _a2.offsetWidth) != null ? _b2 : 0;
     return /* @__PURE__ */ React.createElement(react.InputGroup, null, /* @__PURE__ */ React.createElement(
       FormattedNumberInput,
-      __spreadValues$1({
+      __spreadProps(__spreadValues$1({
         width: "100%",
         onChange: (values) => handleInputChange(values.floatValue),
         value: inputValue,
@@ -14555,7 +14574,9 @@
         readOnly: isReadOnly,
         min,
         max
-      }, rest)
+      }, rest), {
+        pr: `${buttonWidth >= 0 ? buttonWidth + 10 : 0}px`
+      })
     ), /* @__PURE__ */ React.createElement(
       react.InputRightElement,
       {
@@ -14573,7 +14594,7 @@
           flexShrink: "0",
           height: "100%"
         },
-        (_a2 = selectOption == null ? void 0 : selectOption.label) != null ? _a2 : ""
+        (_c = selectOption == null ? void 0 : selectOption.label) != null ? _c : ""
       )
     ), /* @__PURE__ */ React.createElement(react.Box, { position: "absolute", width: "100%" }, /* @__PURE__ */ React.createElement(
       Select,