@redis-ui/components 42.7.0 → 43.0.2

package/dist/Checkbox/components/Label/Label.style.cjs

@@ -11,8 +11,16 @@ const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
 const maps = [Button_style_utils.textColorMap];
 const getStateStyles = (tokens) => {
-  const getLabelStateSelector = (state, stateTokens, fallbackTokens) => `${css_utils.getRelatedStateSelector(Indicator_style.CheckboxIndicator, state, Compose_style.CheckboxCompose)} {
-    ${css_utils.styleFromTokens(maps, stateTokens, fallbackTokens)};
+  const getLabelStateSelector = (state, stateTokens, fallbackTokens) => `${css_utils.getRelatedStateSelector({
+    inputSelector: Indicator_style.CheckboxIndicator,
+    inputStateSelector: state,
+    commonContainer: Compose_style.CheckboxCompose
+  })} {
+    ${css_utils.styleFromTokens({
+    tokenMaps: maps,
+    tokens: stateTokens,
+    fallbackTokens
+  })};
   }`;
   return _styled.css`
     ${getLabelStateSelector("", tokens.normal)};
@@ -20,7 +28,11 @@ const getStateStyles = (tokens) => {
     ${getLabelStateSelector(":active", tokens.active, tokens.normal)};
     ${getLabelStateSelector(":disabled", tokens.disabled)};
 
-    ${css_utils.getRelatedStateSelector(Indicator_style.CheckboxIndicator, ":disabled", Compose_style.CheckboxCompose)} {
+    ${css_utils.getRelatedStateSelector({
+    inputSelector: Indicator_style.CheckboxIndicator,
+    inputStateSelector: ":disabled",
+    commonContainer: Compose_style.CheckboxCompose
+  })} {
       pointer-events: none;
     }
   `;

package/dist/Checkbox/components/Label/Label.style.js

@@ -7,8 +7,16 @@ import { CheckboxIndicator } from "../Indicator/Indicator.style.js";
 import Typography from "../../../Typography/Typography.js";
 const maps = [textColorMap];
 const getStateStyles = (tokens) => {
-  const getLabelStateSelector = (state, stateTokens, fallbackTokens) => `${getRelatedStateSelector(CheckboxIndicator, state, CheckboxCompose)} {
-    ${styleFromTokens(maps, stateTokens, fallbackTokens)};
+  const getLabelStateSelector = (state, stateTokens, fallbackTokens) => `${getRelatedStateSelector({
+    inputSelector: CheckboxIndicator,
+    inputStateSelector: state,
+    commonContainer: CheckboxCompose
+  })} {
+    ${styleFromTokens({
+    tokenMaps: maps,
+    tokens: stateTokens,
+    fallbackTokens
+  })};
   }`;
   return css`
     ${getLabelStateSelector("", tokens.normal)};
@@ -16,7 +24,11 @@ const getStateStyles = (tokens) => {
     ${getLabelStateSelector(":active", tokens.active, tokens.normal)};
     ${getLabelStateSelector(":disabled", tokens.disabled)};
 
-    ${getRelatedStateSelector(CheckboxIndicator, ":disabled", CheckboxCompose)} {
+    ${getRelatedStateSelector({
+    inputSelector: CheckboxIndicator,
+    inputStateSelector: ":disabled",
+    commonContainer: CheckboxCompose
+  })} {
       pointer-events: none;
     }
   `;

package/dist/Chip/components/CloseButton/CloseButton.cjs

@@ -19,7 +19,9 @@ const CloseButton = ({
     variant,
     disabled
   } = Chip_context.useChipContext();
-  if (!onClose || disabled) return null;
+  if (!onClose || disabled) {
+    return null;
+  }
   const handleRemoveChip = (e) => {
     e.stopPropagation();
     onClose();

package/dist/Chip/components/CloseButton/CloseButton.js

@@ -17,7 +17,9 @@ const CloseButton = ({
     variant,
     disabled
   } = useChipContext();
-  if (!onClose || disabled) return null;
+  if (!onClose || disabled) {
+    return null;
+  }
   const handleRemoveChip = (e) => {
     e.stopPropagation();
     onClose();

package/dist/Chip/components/Compose/Compose.style.cjs

@@ -14,7 +14,10 @@ const ChipContainer = _styled__default.default.span.withConfig({
   $disabled
 }) => {
   const variantStyle = redisUiStyles.useTheme().components.chip.variant[$variant][$disabled ? "disabled" : "normal"];
-  return css_utils.styleFromTokens([Button_style_utils.bgColorMap, Button_style_utils.textColorMap], variantStyle);
+  return css_utils.styleFromTokens({
+    tokenMaps: [Button_style_utils.bgColorMap, Button_style_utils.textColorMap],
+    tokens: variantStyle
+  });
 }, ({
   $size
 }) => {

package/dist/Chip/components/Compose/Compose.style.js

@@ -10,7 +10,10 @@ const ChipContainer = _styled.span.withConfig({
   $disabled
 }) => {
   const variantStyle = useTheme().components.chip.variant[$variant][$disabled ? "disabled" : "normal"];
-  return styleFromTokens([bgColorMap, textColorMap], variantStyle);
+  return styleFromTokens({
+    tokenMaps: [bgColorMap, textColorMap],
+    tokens: variantStyle
+  });
 }, ({
   $size
 }) => {

package/dist/Drawer/components/Description/Description.cjs

@@ -13,7 +13,9 @@ const Description = Object.assign(({
 }) => {
   var _a;
   const emptyContent = !((_a = react_utils.childrenToString(children)) == null ? void 0 : _a.trim());
-  if (emptyContent) return null;
+  if (emptyContent) {
+    return null;
+  }
   const mainElement = jsxRuntime.jsxRuntimeExports.jsx(index.Description, {
     asChild: true,
     children: jsxRuntime.jsxRuntimeExports.jsx(Description_style.DescriptionContainer, {

package/dist/Drawer/components/Description/Description.js

@@ -11,7 +11,9 @@ const Description = Object.assign(({
 }) => {
   var _a;
   const emptyContent = !((_a = childrenToString(children)) == null ? void 0 : _a.trim());
-  if (emptyContent) return null;
+  if (emptyContent) {
+    return null;
+  }
   const mainElement = jsxRuntimeExports.jsx(Description$1, {
     asChild: true,
     children: jsxRuntimeExports.jsx(DescriptionContainer, {

package/dist/Helpers/contexts/Popper/PopperCollisionBoundaryManager.cjs

@@ -12,7 +12,9 @@ const PopperCollisionBoundaryManager = ({
   const [resetBoundary, setResetBoundary] = React.useState(false);
   React.useEffect(() => {
     function doesBoundaryContainTrigger() {
-      if (!triggerRef.current) return false;
+      if (!triggerRef.current) {
+        return false;
+      }
       const boundaries = Array.isArray(popperContext.collisionBoundary) ? popperContext.collisionBoundary : [popperContext.collisionBoundary];
       return boundaries.some((boundary) => boundary == null ? void 0 : boundary.contains(triggerRef.current));
     }

package/dist/Helpers/contexts/Popper/PopperCollisionBoundaryManager.js

@@ -10,7 +10,9 @@ const PopperCollisionBoundaryManager = ({
   const [resetBoundary, setResetBoundary] = useState(false);
   useEffect(() => {
     function doesBoundaryContainTrigger() {
-      if (!triggerRef.current) return false;
+      if (!triggerRef.current) {
+        return false;
+      }
       const boundaries = Array.isArray(popperContext.collisionBoundary) ? popperContext.collisionBoundary : [popperContext.collisionBoundary];
       return boundaries.some((boundary) => boundary == null ? void 0 : boundary.contains(triggerRef.current));
     }

package/dist/Helpers/contexts/PrimitiveContextState.cjs

@@ -14,7 +14,9 @@ const createPrimitiveContextState = () => {
       setState
     }), [state]);
     React.useLayoutEffect(() => {
-      if (value !== void 0) setState(value);
+      if (value !== void 0) {
+        setState(value);
+      }
     }, [value]);
     return jsxRuntime.jsxRuntimeExports.jsx(Context.Provider, {
       value: context,
@@ -27,7 +29,9 @@ const createPrimitiveContextState = () => {
       setState
     } = React.useContext(Context) ?? {};
     React.useLayoutEffect(() => {
-      if (value !== void 0) setState == null ? void 0 : setState(value);
+      if (value !== void 0) {
+        setState == null ? void 0 : setState(value);
+      }
     }, [setState, value]);
     return state ?? value;
   };
@@ -48,7 +52,9 @@ const createPrimitiveContextState = () => {
     var _a;
     const [state, setState] = React.useState(value);
     React.useLayoutEffect(() => {
-      if (value !== void 0) setState(value);
+      if (value !== void 0) {
+        setState(value);
+      }
     }, [value]);
     const contextState = (_a = React.useContext(Context)) == null ? void 0 : _a.state;
     const mergedState = contextState !== void 0 && (passOnlyStateDown === contextState || typeof passOnlyStateDown === "function" && passOnlyStateDown(contextState)) ? contextState : state;
@@ -67,19 +73,25 @@ const createPrimitiveContextState = () => {
     children
   }) => {
     const context = React.useContext(Context);
-    if (!context) return jsxRuntime.jsxRuntimeExports.jsx(StateProvider, {
-      value,
-      children
-    });
-    if (passOnlyStateDown !== void 0) return jsxRuntime.jsxRuntimeExports.jsx(OverridingStateProvider, {
-      passOnlyStateDown,
-      value,
-      children
-    });
-    if (value !== void 0) return jsxRuntime.jsxRuntimeExports.jsx(ValueUpdater, {
-      value,
-      children
-    });
+    if (!context) {
+      return jsxRuntime.jsxRuntimeExports.jsx(StateProvider, {
+        value,
+        children
+      });
+    }
+    if (passOnlyStateDown !== void 0) {
+      return jsxRuntime.jsxRuntimeExports.jsx(OverridingStateProvider, {
+        passOnlyStateDown,
+        value,
+        children
+      });
+    }
+    if (value !== void 0) {
+      return jsxRuntime.jsxRuntimeExports.jsx(ValueUpdater, {
+        value,
+        children
+      });
+    }
     return jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, {
       children
     });

package/dist/Helpers/contexts/PrimitiveContextState.js

@@ -12,7 +12,9 @@ const createPrimitiveContextState = () => {
       setState
     }), [state]);
     useLayoutEffect(() => {
-      if (value !== void 0) setState(value);
+      if (value !== void 0) {
+        setState(value);
+      }
     }, [value]);
     return jsxRuntimeExports.jsx(Context.Provider, {
       value: context,
@@ -25,7 +27,9 @@ const createPrimitiveContextState = () => {
       setState
     } = useContext(Context) ?? {};
     useLayoutEffect(() => {
-      if (value !== void 0) setState == null ? void 0 : setState(value);
+      if (value !== void 0) {
+        setState == null ? void 0 : setState(value);
+      }
     }, [setState, value]);
     return state ?? value;
   };
@@ -46,7 +50,9 @@ const createPrimitiveContextState = () => {
     var _a;
     const [state, setState] = useState(value);
     useLayoutEffect(() => {
-      if (value !== void 0) setState(value);
+      if (value !== void 0) {
+        setState(value);
+      }
     }, [value]);
     const contextState = (_a = useContext(Context)) == null ? void 0 : _a.state;
     const mergedState = contextState !== void 0 && (passOnlyStateDown === contextState || typeof passOnlyStateDown === "function" && passOnlyStateDown(contextState)) ? contextState : state;
@@ -65,19 +71,25 @@ const createPrimitiveContextState = () => {
     children
   }) => {
     const context = useContext(Context);
-    if (!context) return jsxRuntimeExports.jsx(StateProvider, {
-      value,
-      children
-    });
-    if (passOnlyStateDown !== void 0) return jsxRuntimeExports.jsx(OverridingStateProvider, {
-      passOnlyStateDown,
-      value,
-      children
-    });
-    if (value !== void 0) return jsxRuntimeExports.jsx(ValueUpdater, {
-      value,
-      children
-    });
+    if (!context) {
+      return jsxRuntimeExports.jsx(StateProvider, {
+        value,
+        children
+      });
+    }
+    if (passOnlyStateDown !== void 0) {
+      return jsxRuntimeExports.jsx(OverridingStateProvider, {
+        passOnlyStateDown,
+        value,
+        children
+      });
+    }
+    if (value !== void 0) {
+      return jsxRuntimeExports.jsx(ValueUpdater, {
+        value,
+        children
+      });
+    }
     return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
       children
     });

package/dist/Helpers/contexts/SharedId.context.cjs

@@ -28,7 +28,9 @@ const useSharedId = (customId) => {
     setId
   } = React.useContext(Context) || {};
   React.useLayoutEffect(() => {
-    if (customId) setId == null ? void 0 : setId((origId) => origId ?? customId);
+    if (customId) {
+      setId == null ? void 0 : setId((origId) => origId ?? customId);
+    }
   }, [setId, customId]);
   return id || customId;
 };
@@ -43,10 +45,12 @@ const Updater = ({
 };
 const SharedIdTransProvider = (props) => {
   const context = React.useContext(Context);
-  if (!context) return jsxRuntime.jsxRuntimeExports.jsx(SharedIdProvider, {
-    ...props,
-    noDefaultId: true
-  });
+  if (!context) {
+    return jsxRuntime.jsxRuntimeExports.jsx(SharedIdProvider, {
+      ...props,
+      noDefaultId: true
+    });
+  }
   const {
     customId,
     children

package/dist/Helpers/contexts/SharedId.context.js

@@ -26,7 +26,9 @@ const useSharedId = (customId) => {
     setId
   } = useContext(Context) || {};
   useLayoutEffect(() => {
-    if (customId) setId == null ? void 0 : setId((origId) => origId ?? customId);
+    if (customId) {
+      setId == null ? void 0 : setId((origId) => origId ?? customId);
+    }
   }, [setId, customId]);
   return id || customId;
 };
@@ -41,10 +43,12 @@ const Updater = ({
 };
 const SharedIdTransProvider = (props) => {
   const context = useContext(Context);
-  if (!context) return jsxRuntimeExports.jsx(SharedIdProvider, {
-    ...props,
-    noDefaultId: true
-  });
+  if (!context) {
+    return jsxRuntimeExports.jsx(SharedIdProvider, {
+      ...props,
+      noDefaultId: true
+    });
+  }
   const {
     customId,
     children

package/dist/Helpers/css.utils.cjs

@@ -5,7 +5,12 @@ const numToUnit = (value = 0, toRem = false) => toRem ? `${pxToRem(value)}rem` :
 const calcSize = (size, defaultSize = "", toRem = false) => {
   return typeof size === "number" ? numToUnit(size, toRem) : size || (typeof defaultSize === "number" ? numToUnit(defaultSize, toRem) : defaultSize);
 };
-const styleFromTokens = (tokenMaps2, tokens, fallbackTokens, customData) => tokenMaps2.map(({
+const styleFromTokens = ({
+  tokenMaps: tokenMaps2,
+  tokens,
+  fallbackTokens,
+  customData
+}) => tokenMaps2.map(({
   cssProp,
   token,
   transformValue,
@@ -110,10 +115,17 @@ const tokenMapMod = (tokenMap, token) => ({
   ...tokenMap,
   token
 });
-const getRelatedStateSelector = (inputSelector, inputStateSelector, commonContainer, ownSelectorInContainer = ":where(&&)") => `${commonContainer}:has(:where(${inputSelector})${inputStateSelector}) ${ownSelectorInContainer}`;
+const getRelatedStateSelector = ({
+  inputSelector,
+  inputStateSelector,
+  commonContainer,
+  ownSelectorInContainer = ":where(&&)"
+}) => `${commonContainer}:has(:where(${inputSelector})${inputStateSelector}) ${ownSelectorInContainer}`;
 const splitDimensionsX2 = (dimensions) => {
   const split = dimensions == null ? void 0 : dimensions.trim().split(/\s+/g);
-  if (!(split == null ? void 0 : split.length) || !split[0]) return {};
+  if (!(split == null ? void 0 : split.length) || !split[0]) {
+    return {};
+  }
   if (split.length > 2) {
     console.warn('Error: splitting dimensions "', dimensions, '" contains incorrect number of entries. Expecting 2, received', split.length);
     return {};
@@ -125,7 +137,9 @@ const splitDimensionsX2 = (dimensions) => {
 };
 const splitDimensionsX4 = (dimensions) => {
   const split = dimensions == null ? void 0 : dimensions.trim().split(/\s+/g);
-  if (!(split == null ? void 0 : split.length) || !split[0]) return {};
+  if (!(split == null ? void 0 : split.length) || !split[0]) {
+    return {};
+  }
   if (split.length > 4) {
     console.warn('Error: splitting dimensions "', dimensions, '" contains incorrect number of entries. Expecting 1-4, received', split.length);
     return {};

package/dist/Helpers/css.utils.d.ts

@@ -24,6 +24,12 @@ export type TokenMap<T extends string = string> = {
     attendantCss?: string;
 };
 export type ThemeTokens<T extends string> = Partial<Record<T, unknown>>;
+interface StyleFromTokensParams<T extends string> {
+    tokenMaps: TokenMap<T>[];
+    tokens: ThemeTokens<T> | undefined;
+    fallbackTokens?: ThemeTokens<T> | undefined;
+    customData?: unknown;
+}
 /**
  * generates style entries, using tokens and token-to-css map
  * @param tokenMaps - token-to-css map defines token, css property and optional transform function
@@ -31,7 +37,7 @@ export type ThemeTokens<T extends string> = Partial<Record<T, unknown>>;
  * @param fallbackTokens - optional list of fallback tokens. I will be used, if main tokens have falsy value
  * @param customData - optional data, that will be passed to token value transform functions
  */
-export declare const styleFromTokens: <T extends string>(tokenMaps: TokenMap<T>[], tokens: ThemeTokens<T> | undefined, fallbackTokens?: ThemeTokens<T> | undefined, customData?: unknown) => string[];
+export declare const styleFromTokens: <T extends string>({ tokenMaps, tokens, fallbackTokens, customData }: StyleFromTokensParams<T>) => string[];
 export declare const tokenMaps: Record<string, TokenMap>;
 export declare const tokenMapMod: <T extends string>(tokenMap: TokenMap, token: T) => TokenMap<T>;
 /**
@@ -39,6 +45,12 @@ export declare const tokenMapMod: <T extends string>(tokenMap: TokenMap, token:
  * @param id - original id - any valid unescaped html id
  */
 export declare const getIdSelector: (id: string) => string;
+interface GetRelatedStateSelectorParams {
+    inputSelector: string;
+    inputStateSelector: string;
+    commonContainer: StyledComponent<never, never> | string;
+    ownSelectorInContainer?: string;
+}
 /**
  * create selector, using state of associated input.
  *
@@ -51,13 +63,13 @@ export declare const getIdSelector: (id: string) => string;
  *        | Note: we use double && to allow styled-components use unique component class instead of common one
  * @example
  *     styled.label`
- *       ${() => getRelatedStateSelector(CheckIndicator, ':disabled', CheckboxWrapper)} {
+ *       ${() => getRelatedStateSelector({ inputSelector: CheckIndicator, inputStateSelector: ':disabled', commonContainer: CheckboxWrapper })} {
  *         pointer-events: none;
  *       }
  *     ....
  *     `
  */
-export declare const getRelatedStateSelector: (inputSelector: string, inputStateSelector: string, commonContainer: StyledComponent<never, never> | string, ownSelectorInContainer?: string) => string;
+export declare const getRelatedStateSelector: ({ inputSelector, inputStateSelector, commonContainer, ownSelectorInContainer }: GetRelatedStateSelectorParams) => string;
 type DimensionsX2 = {
     start?: string;
     end?: string;

package/dist/Helpers/css.utils.js

@@ -3,7 +3,12 @@ const numToUnit = (value = 0, toRem = false) => toRem ? `${pxToRem(value)}rem` :
 const calcSize = (size, defaultSize = "", toRem = false) => {
   return typeof size === "number" ? numToUnit(size, toRem) : size || (typeof defaultSize === "number" ? numToUnit(defaultSize, toRem) : defaultSize);
 };
-const styleFromTokens = (tokenMaps2, tokens, fallbackTokens, customData) => tokenMaps2.map(({
+const styleFromTokens = ({
+  tokenMaps: tokenMaps2,
+  tokens,
+  fallbackTokens,
+  customData
+}) => tokenMaps2.map(({
   cssProp,
   token,
   transformValue,
@@ -108,10 +113,17 @@ const tokenMapMod = (tokenMap, token) => ({
   ...tokenMap,
   token
 });
-const getRelatedStateSelector = (inputSelector, inputStateSelector, commonContainer, ownSelectorInContainer = ":where(&&)") => `${commonContainer}:has(:where(${inputSelector})${inputStateSelector}) ${ownSelectorInContainer}`;
+const getRelatedStateSelector = ({
+  inputSelector,
+  inputStateSelector,
+  commonContainer,
+  ownSelectorInContainer = ":where(&&)"
+}) => `${commonContainer}:has(:where(${inputSelector})${inputStateSelector}) ${ownSelectorInContainer}`;
 const splitDimensionsX2 = (dimensions) => {
   const split = dimensions == null ? void 0 : dimensions.trim().split(/\s+/g);
-  if (!(split == null ? void 0 : split.length) || !split[0]) return {};
+  if (!(split == null ? void 0 : split.length) || !split[0]) {
+    return {};
+  }
   if (split.length > 2) {
     console.warn('Error: splitting dimensions "', dimensions, '" contains incorrect number of entries. Expecting 2, received', split.length);
     return {};
@@ -123,7 +135,9 @@ const splitDimensionsX2 = (dimensions) => {
 };
 const splitDimensionsX4 = (dimensions) => {
   const split = dimensions == null ? void 0 : dimensions.trim().split(/\s+/g);
-  if (!(split == null ? void 0 : split.length) || !split[0]) return {};
+  if (!(split == null ? void 0 : split.length) || !split[0]) {
+    return {};
+  }
   if (split.length > 4) {
     console.warn('Error: splitting dimensions "', dimensions, '" contains incorrect number of entries. Expecting 1-4, received', split.length);
     return {};

package/dist/Helpers/hooks/useScrollable.cjs

@@ -8,7 +8,9 @@ const useScrollable = (ref) => {
   const [scrollable, setScrollable] = React.useState(false);
   React.useEffect(() => {
     const el = ref.current;
-    if (!el) return void 0;
+    if (!el) {
+      return void 0;
+    }
     const update = () => setScrollable(isScrollable(el));
     const resizeObserver = new ResizeObserver(update);
     resizeObserver.observe(el);

package/dist/Helpers/hooks/useScrollable.js

@@ -6,7 +6,9 @@ const useScrollable = (ref) => {
   const [scrollable, setScrollable] = useState(false);
   useEffect(() => {
     const el = ref.current;
-    if (!el) return void 0;
+    if (!el) {
+      return void 0;
+    }
     const update = () => setScrollable(isScrollable(el));
     const resizeObserver = new ResizeObserver(update);
     resizeObserver.observe(el);

package/dist/Helpers/react.utils.cjs

@@ -8,8 +8,12 @@ const handleStopPropagation = (e) => e.stopPropagation();
 const childrenToString = onlyText.default;
 const combineHandlers = (...handlers) => {
   const validHandlers = handlers.filter((handler) => typeof handler === "function");
-  if (!validHandlers.length) return void 0;
-  if (validHandlers.length === 1) return validHandlers[0];
+  if (!validHandlers.length) {
+    return void 0;
+  }
+  if (validHandlers.length === 1) {
+    return validHandlers[0];
+  }
   return (...params) => validHandlers.forEach((handler) => handler(...params));
 };
 const isFragmentElement = (el) => el.type === React.Fragment;

package/dist/Helpers/react.utils.js

@@ -6,8 +6,12 @@ const handleStopPropagation = (e) => e.stopPropagation();
 const childrenToString = onlyText;
 const combineHandlers = (...handlers) => {
   const validHandlers = handlers.filter((handler) => typeof handler === "function");
-  if (!validHandlers.length) return void 0;
-  if (validHandlers.length === 1) return validHandlers[0];
+  if (!validHandlers.length) {
+    return void 0;
+  }
+  if (validHandlers.length === 1) {
+    return validHandlers[0];
+  }
   return (...params) => validHandlers.forEach((handler) => handler(...params));
 };
 const isFragmentElement = (el) => el.type === Fragment;

package/dist/Inputs/QuantityCounter/components/InputGroup/components/ValueLabel/ValueLabel.cjs

@@ -10,11 +10,15 @@ const ValueLabel = ({
   const {
     value
   } = InputValue_context.useInputValueApi();
-  if (!children || !value) return null;
-  if (typeof children === "string") return jsxRuntime.jsxRuntimeExports.jsx(ValueLabel_style.ValueLabel, {
-    component: "span",
-    children
-  });
+  if (!children || !value) {
+    return null;
+  }
+  if (typeof children === "string") {
+    return jsxRuntime.jsxRuntimeExports.jsx(ValueLabel_style.ValueLabel, {
+      component: "span",
+      children
+    });
+  }
   return React.Children.only(children);
 };
 exports.ValueLabel = ValueLabel;

package/dist/Inputs/QuantityCounter/components/InputGroup/components/ValueLabel/ValueLabel.js

@@ -8,11 +8,15 @@ const ValueLabel = ({
   const {
     value
   } = useInputValueApi();
-  if (!children || !value) return null;
-  if (typeof children === "string") return jsxRuntimeExports.jsx(ValueLabel$1, {
-    component: "span",
-    children
-  });
+  if (!children || !value) {
+    return null;
+  }
+  if (typeof children === "string") {
+    return jsxRuntimeExports.jsx(ValueLabel$1, {
+      component: "span",
+      children
+    });
+  }
   return Children.only(children);
 };
 export {