@simplybusiness/mobius 6.4.4 → 6.4.5

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 6.4.5
+
+### Patch Changes
+
+- f655230: Enforce step increment for typed values in NumebrField
+
 ## 6.4.4
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -3313,9 +3313,9 @@ Modal2.displayName = "Modal";
 // src/components/NumberField/NumberField.tsx
 var import_dedupe36 = __toESM(require("classnames/dedupe"));
 var import_react57 = require("react");
-var import_react58 = require("react");
 var import_jsx_runtime45 = require("react/jsx-runtime");
-var NumberField = (0, import_react58.forwardRef)((props, ref) => {
+var SMALLEST_INCREMENT = 1e-3;
+var NumberField = (0, import_react57.forwardRef)((props, ref) => {
   const {
     minValue,
     maxValue,
@@ -3325,6 +3325,11 @@ var NumberField = (0, import_react58.forwardRef)((props, ref) => {
     className,
     ...otherProps
   } = props;
+  const {
+    onFocus: customOnFocus,
+    onBlur: customOnBlur,
+    ...rest
+  } = otherProps;
   const focusedInputRef = (0, import_react57.useRef)(null);
   const wheelHandler = (0, import_react57.useCallback)((ev) => ev.preventDefault(), []);
   (0, import_react57.useEffect)(() => {
@@ -3338,20 +3343,54 @@ var NumberField = (0, import_react58.forwardRef)((props, ref) => {
   });
   const handleBeforeInput = (event) => {
     const { data } = event.nativeEvent;
-    if (step != null && Number.isInteger(step) && data === ".") {
+    if (step && Number.isInteger(step) && data === ".") {
       event.preventDefault();
     }
-    if (minValue != null && minValue >= 0 && data === "-") {
+    if (minValue && minValue >= 0 && data === "-") {
       event.preventDefault();
     }
   };
-  const {
-    onFocus: customOnFocus,
-    onBlur: customOnBlur,
-    ...rest
-  } = otherProps;
+  const handleChange = (event) => {
+    const { value } = event.target;
+    const numValue = parseFloat(value);
+    if (value === "" || value === "-" || isNaN(numValue)) {
+      otherProps.onChange?.(event);
+      return;
+    }
+    if (step && step > 1) {
+      const baseValue = minValue ?? 0;
+      const remainder = (numValue - baseValue) % step;
+      if (Math.abs(remainder) > SMALLEST_INCREMENT && Math.abs(remainder - step) > SMALLEST_INCREMENT) {
+        event.preventDefault();
+        return;
+      }
+    }
+    otherProps.onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    const { value } = event.target;
+    const numValue = parseFloat(value);
+    if (step && step > 1 && !isNaN(numValue)) {
+      const baseValue = minValue ?? 0;
+      const steps = Math.round((numValue - baseValue) / step);
+      const snappedValue = baseValue + steps * step;
+      if (snappedValue !== numValue) {
+        event.target.value = snappedValue.toString();
+        const changeEvent = new Event("change", { bubbles: true });
+        event.target.dispatchEvent(changeEvent);
+        const syntheticChangeEvent = {
+          ...event,
+          target: event.target,
+          currentTarget: event.currentTarget
+        };
+        otherProps.onChange?.(syntheticChangeEvent);
+      }
+    }
+    customOnBlur?.(event);
+  };
   const forwardedProps = {
     ...rest,
+    onChange: handleChange,
     onFocus: (e) => {
       const el = e.currentTarget;
       focusedInputRef.current?.removeEventListener("wheel", wheelHandler);
@@ -3359,14 +3398,7 @@ var NumberField = (0, import_react58.forwardRef)((props, ref) => {
       el.addEventListener("wheel", wheelHandler, { passive: false });
       customOnFocus?.(e);
     },
-    onBlur: (e) => {
-      const el = e.currentTarget;
-      el.removeEventListener("wheel", wheelHandler);
-      if (focusedInputRef.current === el) {
-        focusedInputRef.current = null;
-      }
-      customOnBlur?.(e);
-    }
+    onBlur: (e) => handleBlur(e)
   };
   return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     TextField,
@@ -3386,9 +3418,9 @@ var NumberField = (0, import_react58.forwardRef)((props, ref) => {
 NumberField.displayName = "NumberField";
 
 // src/components/Option/Option.tsx
-var import_react59 = require("react");
+var import_react58 = require("react");
 var import_jsx_runtime46 = require("react/jsx-runtime");
-var Option2 = (0, import_react59.forwardRef)((props, ref) => {
+var Option2 = (0, import_react58.forwardRef)((props, ref) => {
   const { isDisabled, ...rest } = props;
   const mappedProps = {
     ...rest,
@@ -3400,7 +3432,7 @@ Option2.displayName = "Option";
 
 // src/components/PasswordField/PasswordField.tsx
 var import_dedupe37 = __toESM(require("classnames/dedupe"));
-var import_react60 = require("react");
+var import_react59 = require("react");
 
 // src/components/PasswordField/ShowHideButton.tsx
 var import_jsx_runtime47 = require("react/jsx-runtime");
@@ -3424,12 +3456,12 @@ var ShowHideButton = ({
 
 // src/components/PasswordField/PasswordField.tsx
 var import_jsx_runtime48 = require("react/jsx-runtime");
-var PasswordField = (0, import_react60.forwardRef)(
+var PasswordField = (0, import_react59.forwardRef)(
   ({ className, ...props }, ref) => {
-    const [show, setShow] = (0, import_react60.useState)(false);
+    const [show, setShow] = (0, import_react59.useState)(false);
     const type = show ? "text" : "password";
     const classes = (0, import_dedupe37.default)("mobius-password-field", className);
-    const localRef = (0, import_react60.useRef)(null);
+    const localRef = (0, import_react59.useRef)(null);
     const handleShowHideButtonClick = () => {
       setShow((oldShow) => !oldShow);
       localRef.current?.focus();
@@ -3449,30 +3481,30 @@ var PasswordField = (0, import_react60.forwardRef)(
 PasswordField.displayName = "PasswordField";
 
 // src/components/Popover/Popover.tsx
-var import_react61 = require("@floating-ui/react");
+var import_react60 = require("@floating-ui/react");
 var import_icons11 = require("@simplybusiness/icons");
 var import_classnames3 = __toESM(require("classnames"));
-var import_react62 = require("react");
+var import_react61 = require("react");
 var import_jsx_runtime49 = require("react/jsx-runtime");
 var OFFSET_FROM_CONTENT_DEFAULT = 10;
 var Popover = (props) => {
   const { trigger, children, onOpen, onClose, className } = props;
-  const arrowRef = (0, import_react62.useRef)(null);
-  const [isOpen, setIsOpen] = (0, import_react62.useState)(false);
-  const { refs, floatingStyles, context } = (0, import_react61.useFloating)({
+  const arrowRef = (0, import_react61.useRef)(null);
+  const [isOpen, setIsOpen] = (0, import_react61.useState)(false);
+  const { refs, floatingStyles, context } = (0, import_react60.useFloating)({
     open: isOpen,
     onOpenChange: setIsOpen,
-    whileElementsMounted: import_react61.autoUpdate,
+    whileElementsMounted: import_react60.autoUpdate,
     middleware: [
-      (0, import_react61.arrow)({
+      (0, import_react60.arrow)({
         element: arrowRef
       }),
-      (0, import_react61.offset)(OFFSET_FROM_CONTENT_DEFAULT),
-      (0, import_react61.shift)(),
-      (0, import_react61.flip)()
+      (0, import_react60.offset)(OFFSET_FROM_CONTENT_DEFAULT),
+      (0, import_react60.shift)(),
+      (0, import_react60.flip)()
     ]
   });
-  const dismiss = (0, import_react61.useDismiss)(context, {
+  const dismiss = (0, import_react60.useDismiss)(context, {
     bubbles: true,
     outsidePress: (event) => {
       const toggle = refs.reference.current;
@@ -3483,7 +3515,7 @@ var Popover = (props) => {
       return true;
     }
   });
-  const { getReferenceProps, getFloatingProps } = (0, import_react61.useInteractions)([dismiss]);
+  const { getReferenceProps, getFloatingProps } = (0, import_react60.useInteractions)([dismiss]);
   const containerClasses = (0, import_classnames3.default)(
     "mobius",
     "mobius-popover__container",
@@ -3498,7 +3530,7 @@ var Popover = (props) => {
     setIsOpen(true);
     onOpen?.();
   };
-  const triggerComponent = (0, import_react62.cloneElement)(trigger, {
+  const triggerComponent = (0, import_react61.cloneElement)(trigger, {
     ref: refs.setReference,
     className: (0, import_classnames3.default)(
       trigger.props.className,
@@ -3546,7 +3578,7 @@ var Popover = (props) => {
             /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: "mobius-popover__body", children })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
-            import_react61.FloatingArrow,
+            import_react60.FloatingArrow,
             {
               ref: arrowRef,
               context,
@@ -3562,7 +3594,7 @@ var Popover = (props) => {
 
 // src/components/Progress/Progress.tsx
 var import_dedupe38 = __toESM(require("classnames/dedupe"));
-var import_react63 = require("react");
+var import_react62 = require("react");
 var import_jsx_runtime50 = require("react/jsx-runtime");
 function warnAboutInvalidValues(value, minValue, maxValue) {
   if (minValue > maxValue) {
@@ -3604,9 +3636,9 @@ var getLabelComponent = (label, progressLabelId, showLabel) => {
 var DEFAULT_VALUE = 0;
 var DEFAULT_MIN_VALUE = 0;
 var DEFAULT_MAX_VALUE = 100;
-var Progress = (0, import_react63.forwardRef)((props, ref) => {
-  const progressId = (0, import_react63.useId)();
-  const progressLabelId = (0, import_react63.useId)();
+var Progress = (0, import_react62.forwardRef)((props, ref) => {
+  const progressId = (0, import_react62.useId)();
+  const progressLabelId = (0, import_react62.useId)();
   const {
     id,
     label,
@@ -3662,9 +3694,9 @@ Progress.displayName = "Progress";
 
 // src/components/Radio/Radio.tsx
 var import_dedupe39 = __toESM(require("classnames/dedupe"));
-var import_react64 = require("react");
+var import_react63 = require("react");
 var import_jsx_runtime51 = require("react/jsx-runtime");
-var Radio = (0, import_react64.forwardRef)(
+var Radio = (0, import_react63.forwardRef)(
   (props, ref) => {
     const {
       children,
@@ -3686,10 +3718,10 @@ var Radio = (0, import_react64.forwardRef)(
     const isMultiline = label && children;
     const isControlled = selected !== void 0;
     const isChecked = isControlled ? selected === value : defaultChecked;
-    const hasIconFirst = (0, import_react64.useMemo)(() => {
-      if (!children || import_react64.Children.count(children) === 0) return false;
-      const firstChild = import_react64.Children.toArray(children)[0];
-      if (!(0, import_react64.isValidElement)(firstChild)) return false;
+    const hasIconFirst = (0, import_react63.useMemo)(() => {
+      if (!children || import_react63.Children.count(children) === 0) return false;
+      const firstChild = import_react63.Children.toArray(children)[0];
+      if (!(0, import_react63.isValidElement)(firstChild)) return false;
       const props2 = firstChild.props;
       return "icon" in props2 && props2.icon !== void 0;
     }, [children]);
@@ -3756,7 +3788,7 @@ Radio.displayName = "Radio";
 
 // src/components/Radio/RadioGroup.tsx
 var import_dedupe40 = __toESM(require("classnames/dedupe"));
-var import_react65 = require("react");
+var import_react64 = require("react");
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var getDefaultVal = (children, defaultValue) => {
   if (Array.isArray(children) && defaultValue) {
@@ -3766,7 +3798,7 @@ var getDefaultVal = (children, defaultValue) => {
   }
   return "";
 };
-var RadioGroup = (0, import_react65.forwardRef)((props, ref) => {
+var RadioGroup = (0, import_react64.forwardRef)((props, ref) => {
   const {
     label,
     isDisabled = false,
@@ -3785,8 +3817,8 @@ var RadioGroup = (0, import_react65.forwardRef)((props, ref) => {
     ...rest
   } = props;
   const defaultSelected = getDefaultVal(children, value || defaultValue);
-  const [selected, setSelected] = (0, import_react65.useState)(defaultSelected);
-  (0, import_react65.useEffect)(() => {
+  const [selected, setSelected] = (0, import_react64.useState)(defaultSelected);
+  (0, import_react64.useEffect)(() => {
     if (value !== void 0) {
       setSelected(value);
     }
@@ -3812,15 +3844,15 @@ var RadioGroup = (0, import_react65.forwardRef)((props, ref) => {
     [`--is-${orientation}`]: true
   });
   const labelClasses = (0, import_dedupe40.default)(radioClasses, validationClasses);
-  const errorMessageId = (0, import_react65.useId)();
-  const defaultNameAttrId = (0, import_react65.useId)();
+  const errorMessageId = (0, import_react64.useId)();
+  const defaultNameAttrId = (0, import_react64.useId)();
   const nameAttribute = name || defaultNameAttrId;
   const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
   const describedBy = spaceDelimitedList([
     shouldErrorMessageShow,
     props["aria-describedby"]
   ]);
-  const labelId = (0, import_react65.useId)();
+  const labelId = (0, import_react64.useId)();
   return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     "div",
     {
@@ -3839,9 +3871,9 @@ var RadioGroup = (0, import_react65.forwardRef)((props, ref) => {
       role: "radiogroup",
       children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Stack, { gap: "xs", children: [
         label && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Label, { htmlFor: name, id: labelId, className: labelClasses, children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: radioWrapperClasses, children: import_react65.Children.map(children, (child) => {
-          if ((0, import_react65.isValidElement)(child)) {
-            return (0, import_react65.cloneElement)(
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: radioWrapperClasses, children: import_react64.Children.map(children, (child) => {
+          if ((0, import_react64.isValidElement)(child)) {
+            return (0, import_react64.cloneElement)(
               child,
               {
                 orientation,
@@ -3904,9 +3936,9 @@ Segment.displayName = "Segment";
 // src/components/Select/Select.tsx
 var import_icons12 = require("@simplybusiness/icons");
 var import_dedupe43 = __toESM(require("classnames/dedupe"));
-var import_react66 = require("react");
+var import_react65 = require("react");
 var import_jsx_runtime55 = require("react/jsx-runtime");
-var Select = (0, import_react66.forwardRef)((props, ref) => {
+var Select = (0, import_react65.forwardRef)((props, ref) => {
   const {
     label,
     onChange,
@@ -3947,7 +3979,7 @@ var Select = (0, import_react66.forwardRef)((props, ref) => {
     otherProps.className
   );
   const iconClasses = (0, import_dedupe43.default)("mobius-select__icon", sharedClasses);
-  const errorMessageId = (0, import_react66.useId)();
+  const errorMessageId = (0, import_react65.useId)();
   const shouldErrorMessageShow = errorMessage ? errorMessageId : void 0;
   const describedBy = spaceDelimitedList([
     shouldErrorMessageShow,
@@ -3986,10 +4018,10 @@ Select.displayName = "Select";
 
 // src/components/Slider/Slider.tsx
 var import_dedupe44 = __toESM(require("classnames/dedupe"));
-var import_react68 = require("react");
+var import_react67 = require("react");
 
 // src/components/Slider/helpers.ts
-var import_react67 = require("react");
+var import_react66 = require("react");
 function numberFormatter(value, formatOptions, locale = navigator.languages?.[0] || "en-GB") {
   if (!formatOptions) {
     return value?.toString() || "";
@@ -4019,11 +4051,11 @@ var Slider = (props) => {
     formatOptions,
     isDisabled = false
   } = props;
-  const trackRef = (0, import_react68.useRef)(null);
-  const [currentValue, setCurrentValue] = (0, import_react68.useState)(
+  const trackRef = (0, import_react67.useRef)(null);
+  const [currentValue, setCurrentValue] = (0, import_react67.useState)(
     value || defaultValue || 0
   );
-  const [isDragging, setIsDraggging] = (0, import_react68.useState)(false);
+  const [isDragging, setIsDraggging] = (0, import_react67.useState)(false);
   const { labelProps, fieldProps } = useLabel({
     id,
     label,
@@ -4085,14 +4117,14 @@ var Slider = (props) => {
 };
 
 // src/components/SVG/SVG.tsx
-var import_react69 = require("react");
+var import_react68 = require("react");
 var import_dedupe45 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime57 = require("react/jsx-runtime");
-var SVG = (0, import_react69.forwardRef)(
+var SVG = (0, import_react68.forwardRef)(
   (props, ref) => {
     const { children, className, ...otherProps } = props;
     const classes = (0, import_dedupe45.default)("mobius", "mobius-svg", className);
-    const svgNode = import_react69.Children.only(children);
+    const svgNode = import_react68.Children.only(children);
     const { children: svgChildren, viewBox, xmlns } = svgNode.props;
     return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
       "svg",
@@ -4110,10 +4142,10 @@ var SVG = (0, import_react69.forwardRef)(
 SVG.displayName = "SVG";
 
 // src/components/Switch/Switch.tsx
-var import_react70 = require("react");
+var import_react69 = require("react");
 var import_dedupe46 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime58 = require("react/jsx-runtime");
-var Switch = (0, import_react70.forwardRef)((props, ref) => {
+var Switch = (0, import_react69.forwardRef)((props, ref) => {
   const {
     checked = false,
     className,
@@ -4121,8 +4153,8 @@ var Switch = (0, import_react70.forwardRef)((props, ref) => {
     isDisabled = false,
     ...otherProps
   } = props;
-  const [enabled, setEnabled] = (0, import_react70.useState)(checked);
-  (0, import_react70.useEffect)(() => {
+  const [enabled, setEnabled] = (0, import_react69.useState)(checked);
+  (0, import_react69.useEffect)(() => {
     setEnabled(checked);
   }, [checked]);
   const classes = (0, import_dedupe46.default)(
@@ -4159,10 +4191,10 @@ var Switch = (0, import_react70.forwardRef)((props, ref) => {
 Switch.displayName = "Switch";
 
 // src/components/Table/Table.tsx
-var import_react71 = require("react");
+var import_react70 = require("react");
 var import_dedupe47 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime59 = require("react/jsx-runtime");
-var Table = (0, import_react71.forwardRef)(
+var Table = (0, import_react70.forwardRef)(
   (props, ref) => {
     const classes = (0, import_dedupe47.default)("mobius", "mobius-table", props.className);
     return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("table", { ref, ...props, className: classes });
@@ -4171,40 +4203,40 @@ var Table = (0, import_react71.forwardRef)(
 Table.displayName = "Table";
 
 // src/components/Table/Head.tsx
-var import_react72 = require("react");
+var import_react71 = require("react");
 var import_dedupe48 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime60 = require("react/jsx-runtime");
-var Head = (0, import_react72.forwardRef)((props, ref) => {
+var Head = (0, import_react71.forwardRef)((props, ref) => {
   const classes = (0, import_dedupe48.default)("mobius", "mobius-table__head", props.className);
   return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("thead", { ref, ...props, className: classes });
 });
 Head.displayName = "Table.Head";
 
 // src/components/Table/Body.tsx
-var import_react73 = require("react");
+var import_react72 = require("react");
 var import_dedupe49 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime61 = require("react/jsx-runtime");
-var Body = (0, import_react73.forwardRef)((props, ref) => {
+var Body = (0, import_react72.forwardRef)((props, ref) => {
   const classes = (0, import_dedupe49.default)("mobius", "mobius-table__body", props.className);
   return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("tbody", { ref, ...props, className: classes });
 });
 Body.displayName = "Table.Body";
 
 // src/components/Table/Foot.tsx
-var import_react74 = require("react");
+var import_react73 = require("react");
 var import_dedupe50 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime62 = require("react/jsx-runtime");
-var Foot = (0, import_react74.forwardRef)((props, ref) => {
+var Foot = (0, import_react73.forwardRef)((props, ref) => {
   const classes = (0, import_dedupe50.default)("mobius", "mobius-table__foot", props.className);
   return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("tfoot", { ref, ...props, className: classes });
 });
 Foot.displayName = "Table.Foot";
 
 // src/components/Table/Row.tsx
-var import_react75 = require("react");
+var import_react74 = require("react");
 var import_dedupe51 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime63 = require("react/jsx-runtime");
-var Row = (0, import_react75.forwardRef)(
+var Row = (0, import_react74.forwardRef)(
   (props, ref) => {
     const classes = (0, import_dedupe51.default)("mobius", "mobius-table__row", props.className);
     return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("tr", { ref, ...props, className: classes });
@@ -4213,10 +4245,10 @@ var Row = (0, import_react75.forwardRef)(
 Row.displayName = "Table.Row";
 
 // src/components/Table/HeaderCell.tsx
-var import_react76 = require("react");
+var import_react75 = require("react");
 var import_dedupe52 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime64 = require("react/jsx-runtime");
-var HeaderCell = (0, import_react76.forwardRef)((props, ref) => {
+var HeaderCell = (0, import_react75.forwardRef)((props, ref) => {
   const classes = (0, import_dedupe52.default)(
     "mobius",
     "mobius-table__head-cell",
@@ -4227,10 +4259,10 @@ var HeaderCell = (0, import_react76.forwardRef)((props, ref) => {
 HeaderCell.displayName = "Table.HeaderCell";
 
 // src/components/Table/Cell.tsx
-var import_react77 = require("react");
+var import_react76 = require("react");
 var import_dedupe53 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime65 = require("react/jsx-runtime");
-var Cell = (0, import_react77.forwardRef)(
+var Cell = (0, import_react76.forwardRef)(
   (props, ref) => {
     const classes = (0, import_dedupe53.default)(
       "mobius",
@@ -4255,13 +4287,13 @@ Table2.displayName = "Table";
 
 // src/components/TextArea/TextArea.tsx
 var import_dedupe55 = __toESM(require("classnames/dedupe"));
-var import_react79 = require("react");
+var import_react78 = require("react");
 
 // src/components/TextAreaInput/TextAreaInput.tsx
 var import_dedupe54 = __toESM(require("classnames/dedupe"));
-var import_react78 = require("react");
+var import_react77 = require("react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
-var TextAreaInput = (0, import_react78.forwardRef)((props, ref) => {
+var TextAreaInput = (0, import_react77.forwardRef)((props, ref) => {
   const { isSelected, isDisabled, isReadOnly, isRequired, ...otherProps } = props;
   const classes = (0, import_dedupe54.default)(
     "mobius",
@@ -4288,7 +4320,7 @@ TextAreaInput.displayName = "TextAreaInput";
 
 // src/components/TextArea/TextArea.tsx
 var import_jsx_runtime67 = require("react/jsx-runtime");
-var TextArea = (0, import_react79.forwardRef)((props, ref) => {
+var TextArea = (0, import_react78.forwardRef)((props, ref) => {
   const {
     isDisabled,
     className,
@@ -4333,10 +4365,10 @@ var TextArea = (0, import_react79.forwardRef)((props, ref) => {
 TextArea.displayName = "TextArea";
 
 // src/components/Title/Title.tsx
-var import_react80 = require("react");
+var import_react79 = require("react");
 var import_dedupe56 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime68 = require("react/jsx-runtime");
-var Title = (0, import_react80.forwardRef)(
+var Title = (0, import_react79.forwardRef)(
   (props, ref) => {
     const {
       elementType: Element = "div",
@@ -4358,7 +4390,7 @@ Title.displayName = "Title";
 
 // src/components/Trust/Trust.tsx
 var import_dedupe57 = __toESM(require("classnames/dedupe"));
-var import_react81 = require("react");
+var import_react80 = require("react");
 
 // src/components/Trust/constants.ts
 var REQUIRED_TRUSTPILOT_CLASS_NAME = "trustpilot-widget";
@@ -4417,7 +4449,7 @@ var TRUSTPILOT_WIDGET = {
 
 // src/components/Trust/Trust.tsx
 var import_jsx_runtime69 = require("react/jsx-runtime");
-var Trust = (0, import_react81.forwardRef)((props, ref) => {
+var Trust = (0, import_react80.forwardRef)((props, ref) => {
   const {
     elementType: Element = "div",
     variant,
@@ -4428,8 +4460,8 @@ var Trust = (0, import_react81.forwardRef)((props, ref) => {
     stars,
     className
   } = props;
-  const [isMounted, setIsMounted] = (0, import_react81.useState)(false);
-  const trustRef = (0, import_react81.useRef)(null);
+  const [isMounted, setIsMounted] = (0, import_react80.useState)(false);
+  const trustRef = (0, import_react80.useRef)(null);
   const {
     templateId,
     className: variantClassName,
@@ -4455,13 +4487,13 @@ var Trust = (0, import_react81.forwardRef)((props, ref) => {
     },
     className
   );
-  (0, import_react81.useEffect)(() => {
+  (0, import_react80.useEffect)(() => {
     const hasTrustpilotLoaded = trustRef.current && window?.Trustpilot && window?.Trustpilot.loadFromElement;
     if (isMounted && hasTrustpilotLoaded) {
       window.Trustpilot.loadFromElement(trustRef.current, true);
     }
   }, [isMounted]);
-  (0, import_react81.useEffect)(() => {
+  (0, import_react80.useEffect)(() => {
     setIsMounted(true);
   }, []);
   if (!isMounted) return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { style: styles });
@@ -4487,10 +4519,10 @@ var Trust = (0, import_react81.forwardRef)((props, ref) => {
 });
 
 // src/components/ExpandableText/ExpandableText.tsx
-var import_react82 = require("react");
+var import_react81 = require("react");
 var import_dedupe58 = __toESM(require("classnames/dedupe"));
 var import_jsx_runtime70 = require("react/jsx-runtime");
-var ExpandableText = (0, import_react82.forwardRef)((props, ref) => {
+var ExpandableText = (0, import_react81.forwardRef)((props, ref) => {
   const {
     text,
     maxLines = 3,
@@ -4503,14 +4535,14 @@ var ExpandableText = (0, import_react82.forwardRef)((props, ref) => {
     onToggle,
     ...otherProps
   } = props;
-  const [isExpanded, setIsExpanded] = (0, import_react82.useState)(false);
-  const [isCollapsed, setIsCollapsed] = (0, import_react82.useState)(false);
-  const textRef = (0, import_react82.useRef)(null);
+  const [isExpanded, setIsExpanded] = (0, import_react81.useState)(false);
+  const [isCollapsed, setIsCollapsed] = (0, import_react81.useState)(false);
+  const textRef = (0, import_react81.useRef)(null);
   const { down } = useBreakpoint();
-  const baseId = (0, import_react82.useId)();
+  const baseId = (0, import_react81.useId)();
   const expandButtonId = `expandable-text-expand-${baseId}`;
   const shouldCollapse = breakpoint ? down(breakpoint) : true;
-  (0, import_react82.useEffect)(() => {
+  (0, import_react81.useEffect)(() => {
     if (!shouldCollapse || !textRef.current) {
       setIsCollapsed(false);
       return;
@@ -4573,11 +4605,11 @@ var ExpandableText = (0, import_react82.forwardRef)((props, ref) => {
 ExpandableText.displayName = "ExpandableText";
 
 // src/components/MaskedField/MaskedField.tsx
-var import_react83 = require("react");
+var import_react82 = require("react");
 var import_react_imask = require("react-imask");
 var import_jsx_runtime71 = require("react/jsx-runtime");
 var useAcceptHandler = (onChange, useMaskedValue, name) => {
-  return (0, import_react83.useCallback)(
+  return (0, import_react82.useCallback)(
     (maskedValue, maskInstance) => {
       if (!onChange) {
         return;
@@ -4593,7 +4625,7 @@ var useAcceptHandler = (onChange, useMaskedValue, name) => {
   );
 };
 var useCombinedRef = (imaskRef, forwardedRef) => {
-  return (0, import_react83.useCallback)(
+  return (0, import_react82.useCallback)(
     (element) => {
       imaskRef.current = element;
       if (typeof forwardedRef === "function") {
@@ -4606,7 +4638,7 @@ var useCombinedRef = (imaskRef, forwardedRef) => {
   );
 };
 var useBlurHandler = (onBlur, maskRef, useMaskedValue, name) => {
-  return (0, import_react83.useCallback)(
+  return (0, import_react82.useCallback)(
     (event) => {
       if (!onBlur || !maskRef.current) {
         return;
@@ -4636,7 +4668,7 @@ var ControlledMaskedField = ({
   const { ref: imaskRef, maskRef, setValue } = (0, import_react_imask.useIMask)(mask, { onAccept });
   const combinedRef = useCombinedRef(imaskRef, forwardedRef);
   const handleBlur = useBlurHandler(onBlur, maskRef, useMaskedValue, name);
-  (0, import_react83.useEffect)(() => {
+  (0, import_react82.useEffect)(() => {
     if (!maskRef.current) {
       return;
     }
@@ -4682,7 +4714,7 @@ var UncontrolledMaskedField = ({
     }
   );
 };
-var MaskedField = (0, import_react83.forwardRef)((props, forwardedRef) => {
+var MaskedField = (0, import_react82.forwardRef)((props, forwardedRef) => {
   const { value, defaultValue, ...rest } = props;
   if ("value" in props) {
     return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(