@oliasoft-open-source/react-ui-library 4.8.0-beta-4 → 4.8.0-beta-6

package/dist/index.js

@@ -15,8 +15,8 @@ import React__default, { useContext, isValidElement, useState, useRef, useEffect
 import * as PropTypes from "prop-types";
 import PropTypes__default from "prop-types";
 import ReactDOM, { createPortal, unstable_batchedUpdates, render } from "react-dom";
-import _$1, { set, get as get$2, isString as isString$3, isNumber as isNumber$1, isBoolean as isBoolean$2, isFunction as isFunction$3, isEmpty, isArray as isArray$1, toNumber, debounce as debounce$2, isObject as isObject$5, isEqual as isEqual$4 } from "lodash";
-import { isScientificStringNum, roundToPrecision, roundToFixed, toString as toString$1, validateNumber, stripLeadingZeros, cleanNumStr, unitFromQuantity, isValueWithUnit, withUnit, convertSamePrecision, getValue as getValue$1, getUnit, KNOWN_UNITS, split as split$1, label as label$b, altUnitsList, convertAndGetValue, getUnitsForQuantity, roundByMagnitudeToFixed } from "@oliasoft-open-source/units";
+import { noop as noop$3, set, get as get$2, isString as isString$3, isNumber as isNumber$1, isBoolean as isBoolean$2, isFunction as isFunction$3, isEmpty, isArray as isArray$1, toNumber, debounce as debounce$2, isObject as isObject$5, isEqual as isEqual$4 } from "lodash";
+import { roundToFixed, validateNumber, cleanNumStr, unitFromQuantity, isValueWithUnit, withUnit, convertSamePrecision, getValue as getValue$1, getUnit, KNOWN_UNITS, split as split$1, label as label$b, altUnitsList, getUnitsForQuantity, convertAndGetValue, isScientificStringNum, roundToPrecision, roundByMagnitudeToFixed } from "@oliasoft-open-source/units";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x2) {
   return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
@@ -2207,7 +2207,7 @@ var index = function() {
   return ResizeObserver$2;
 }();
 var isProduction$3 = process.env.NODE_ENV === "production";
-function warning$d(condition, message2) {
+function warning$i(condition, message2) {
   if (!isProduction$3) {
     if (condition) {
       return;
@@ -2465,7 +2465,7 @@ function useTrackElements(_ref) {
   var enabled = _ref.enabled, onChange = _ref.onChange, environment2 = _ref.environment, ResizeObserverPolyfill = _ref.ResizeObserverPolyfill, overflowContainer = _ref.overflowContainer, triggerOption = _ref.triggerOption;
   var ResizeObserver2 = getResizeObserver(environment2, ResizeObserverPolyfill);
   useEffect(function() {
-    process.env.NODE_ENV !== "production" ? warning$d(ResizeObserver2, "This browser does not support ResizeObserver out of the box. We recommend to add a polyfill in order to utilize the full capabilities of react-laag. See: https://github.com/everweij/react-laag#resize-observer") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$i(ResizeObserver2, "This browser does not support ResizeObserver out of the box. We recommend to add a polyfill in order to utilize the full capabilities of react-laag. See: https://github.com/everweij/react-laag#resize-observer") : void 0;
   }, [ResizeObserver2]);
   var arrowRef = useRef(null);
   var hasTriggerOption = Boolean(triggerOption);
@@ -2586,7 +2586,7 @@ function useTrackElements(_ref) {
       if (!closestScrollContainerHasCorrectStyling) {
         closestScrollContainer.style.position = "relative";
       }
-      process.env.NODE_ENV !== "production" ? warning$d(closestScrollContainerHasCorrectStyling, `react-laag: Set the 'position' style of the nearest scroll-container to 'relative', 'absolute' or 'fixed', or set the 'overflowContainer' prop to true. This is needed in order to position the layer properly. Currently the scroll-container is positioned: "` + position3 + '". For now, "position: relative;" is added for you, but this behavior might be removed in the future. Visit https://react-laag.com/docs/#position-relative for more info.') : void 0;
+      process.env.NODE_ENV !== "production" ? warning$i(closestScrollContainerHasCorrectStyling, `react-laag: Set the 'position' style of the nearest scroll-container to 'relative', 'absolute' or 'fixed', or set the 'overflowContainer' prop to true. This is needed in order to position the layer properly. Currently the scroll-container is positioned: "` + position3 + '". For now, "position: relative;" is added for you, but this behavior might be removed in the future. Visit https://react-laag.com/docs/#position-relative for more info.') : void 0;
     }
     return scrollContainers;
   }, [environment2, overflowContainer]);
@@ -2684,7 +2684,7 @@ function useGroup(_ref2) {
     return possibleRegisterFn({
       shouldCloseWhenClickedOutside,
       closeChild: function closeChild() {
-        process.env.NODE_ENV !== "production" ? warning$d(onParentClose, "react-laag: You are using useLayer() in a nested setting but forgot to set the 'onParentClose()' callback in the options. This could lead to unexpected behavior.") : void 0;
+        process.env.NODE_ENV !== "production" ? warning$i(onParentClose, "react-laag: You are using useLayer() in a nested setting but forgot to set the 'onParentClose()' callback in the options. This could lead to unexpected behavior.") : void 0;
         if (onParentClose) {
           onParentClose();
         }
@@ -3709,12 +3709,12 @@ function useHover(_temp) {
   }];
 }
 const tooltip = "_tooltip_wli9z_1";
-const error$9 = "_error_wli9z_15";
-const warning$c = "_warning_wli9z_19";
+const error$e = "_error_wli9z_15";
+const warning$h = "_warning_wli9z_19";
 const styles$Q = {
   tooltip,
-  error: error$9,
-  warning: warning$c
+  error: error$e,
+  warning: warning$h
 };
 const TooltipLayer = ({
   text: text2 = "",
@@ -3989,34 +3989,36 @@ const AccordionWithDefaultToggle = ({
     /* @__PURE__ */ jsx("div", { className: cx$2(styles$O.bordered, padding2 ? styles$O.padding : ""), children: content2 })
   ] });
 };
-const inputInTable$b = "_inputInTable_1rzkf_1";
-const inputHover$b = "_inputHover_1rzkf_13";
-const inputFocus$b = "_inputFocus_1rzkf_18";
-const inputError$b = "_inputError_1rzkf_25";
-const inputWarning$b = "_inputWarning_1rzkf_26";
-const inputDisabled$b = "_inputDisabled_1rzkf_61";
-const hideScrollbars$b = "_hideScrollbars_1rzkf_67";
-const button$3 = "_button_1rzkf_100";
-const active$8 = "_active_1rzkf_135";
-const green$1 = "_green_1rzkf_135";
-const red$1 = "_red_1rzkf_135";
-const orange$1 = "_orange_1rzkf_135";
-const icon$5 = "_icon_1rzkf_147";
-const iconOnly = "_iconOnly_1rzkf_153";
-const basic = "_basic_1rzkf_163";
-const muted$2 = "_muted_1rzkf_169";
-const disabled$9 = "_disabled_1rzkf_188";
-const small$c = "_small_1rzkf_198";
-const pill = "_pill_1rzkf_203";
-const round = "_round_1rzkf_204";
-const error$8 = "_error_1rzkf_276";
-const warning$b = "_warning_1rzkf_293";
-const inverted$1 = "_inverted_1rzkf_310";
-const groupOrderFirst$4 = "_groupOrderFirst_1rzkf_340";
-const groupOrderMiddle$4 = "_groupOrderMiddle_1rzkf_341";
-const groupOrderLast$4 = "_groupOrderLast_1rzkf_342";
+const inputInTable$b = "_inputInTable_1k3a0_1";
+const error$d = "_error_1k3a0_7";
+const warning$g = "_warning_1k3a0_7";
+const inputHover$b = "_inputHover_1k3a0_13";
+const inputFocus$b = "_inputFocus_1k3a0_18";
+const inputError$b = "_inputError_1k3a0_25";
+const inputWarning$b = "_inputWarning_1k3a0_26";
+const inputDisabled$b = "_inputDisabled_1k3a0_61";
+const hideScrollbars$b = "_hideScrollbars_1k3a0_67";
+const button$3 = "_button_1k3a0_100";
+const active$8 = "_active_1k3a0_135";
+const green$1 = "_green_1k3a0_135";
+const red$1 = "_red_1k3a0_135";
+const orange$1 = "_orange_1k3a0_135";
+const icon$5 = "_icon_1k3a0_147";
+const iconOnly = "_iconOnly_1k3a0_153";
+const basic = "_basic_1k3a0_163";
+const muted$2 = "_muted_1k3a0_169";
+const disabled$9 = "_disabled_1k3a0_188";
+const small$c = "_small_1k3a0_198";
+const pill = "_pill_1k3a0_203";
+const round = "_round_1k3a0_204";
+const inverted$1 = "_inverted_1k3a0_310";
+const groupOrderFirst$4 = "_groupOrderFirst_1k3a0_340";
+const groupOrderMiddle$4 = "_groupOrderMiddle_1k3a0_341";
+const groupOrderLast$4 = "_groupOrderLast_1k3a0_342";
 const buttonStyles = {
   inputInTable: inputInTable$b,
+  error: error$d,
+  warning: warning$g,
   inputHover: inputHover$b,
   inputFocus: inputFocus$b,
   inputError: inputError$b,
@@ -4036,8 +4038,6 @@ const buttonStyles = {
   small: small$c,
   pill,
   round,
-  error: error$8,
-  warning: warning$b,
   inverted: inverted$1,
   groupOrderFirst: groupOrderFirst$4,
   groupOrderMiddle: groupOrderMiddle$4,
@@ -4269,7 +4269,7 @@ const Option$2 = ({
   inline: inline2,
   title: title2,
   upload,
-  onChange,
+  onChange = noop$3,
   testId,
   component: Component2 = "a"
 }) => {
@@ -4285,6 +4285,22 @@ const Option$2 = ({
     }
     onClick == null ? void 0 : onClick(evt);
   };
+  const handleFileChange = (evt) => {
+    const { files } = (evt == null ? void 0 : evt.target) ?? {};
+    if (files) {
+      const customEvent = {
+        ...evt,
+        target: {
+          ...evt.target,
+          value: files,
+          name: evt.target.name,
+          files
+        }
+      };
+      onChange == null ? void 0 : onChange(customEvent);
+      close2 == null ? void 0 : close2();
+    }
+  };
   return /* @__PURE__ */ jsxs(
     Component2,
     {
@@ -4306,10 +4322,7 @@ const Option$2 = ({
             {
               type: "file",
               className: styles$L.fileInput,
-              onChange: (evt) => {
-                onChange == null ? void 0 : onChange(evt.target.files);
-                close2 == null ? void 0 : close2();
-              }
+              onChange: handleFileChange
             }
           ),
           /* @__PURE__ */ jsx("span", { className: styles$L.label, title: `${title2 || label2}`, children: label2 }),
@@ -6478,8 +6491,8 @@ const center = "_center_11ofj_4";
 const muted$1 = "_muted_11ofj_7";
 const faint = "_faint_11ofj_10";
 const success$1 = "_success_11ofj_13";
-const warning$a = "_warning_11ofj_16";
-const error$7 = "_error_11ofj_19";
+const warning$f = "_warning_11ofj_16";
+const error$c = "_error_11ofj_19";
 const small$9 = "_small_11ofj_22";
 const link$1 = "_link_11ofj_25";
 const styles$F = {
@@ -6488,8 +6501,8 @@ const styles$F = {
   muted: muted$1,
   faint,
   success: success$1,
-  warning: warning$a,
-  error: error$7,
+  warning: warning$f,
+  error: error$c,
   small: small$9,
   link: link$1
 };
@@ -6684,33 +6697,37 @@ const Dialog = ({ dialog: dialog2 }) => {
     }
   );
 };
-const inputInTable$a = "_inputInTable_khmhl_1";
-const inputHover$a = "_inputHover_khmhl_13";
-const inputFocus$a = "_inputFocus_khmhl_18";
-const inputError$a = "_inputError_khmhl_25";
-const inputWarning$a = "_inputWarning_khmhl_26";
-const inputDisabled$a = "_inputDisabled_khmhl_61";
-const hideScrollbars$a = "_hideScrollbars_khmhl_67";
-const inline$2 = "_inline_khmhl_90";
-const left$2 = "_left_khmhl_93";
-const right$6 = "_right_khmhl_96";
-const fixed$1 = "_fixed_khmhl_99";
-const border$1 = "_border_khmhl_111";
-const shadow = "_shadow_khmhl_117";
-const drawerContent = "_drawerContent_khmhl_120";
-const isResizing = "_isResizing_khmhl_132";
-const toggleButton = "_toggleButton_khmhl_143";
-const top = "_top_khmhl_156";
-const bottom = "_bottom_khmhl_159";
-const toggleButtonOpen = "_toggleButtonOpen_khmhl_162";
-const tabs$1 = "_tabs_khmhl_165";
-const tab$1 = "_tab_khmhl_165";
-const active$4 = "_active_khmhl_197";
-const disabled$6 = "_disabled_khmhl_222";
-const tabsContent = "_tabsContent_khmhl_229";
-const resizeHandle = "_resizeHandle_khmhl_235";
+const inputInTable$a = "_inputInTable_13n8n_1";
+const error$b = "_error_13n8n_7";
+const warning$e = "_warning_13n8n_7";
+const inputHover$a = "_inputHover_13n8n_13";
+const inputFocus$a = "_inputFocus_13n8n_18";
+const inputError$a = "_inputError_13n8n_25";
+const inputWarning$a = "_inputWarning_13n8n_26";
+const inputDisabled$a = "_inputDisabled_13n8n_61";
+const hideScrollbars$a = "_hideScrollbars_13n8n_67";
+const inline$2 = "_inline_13n8n_90";
+const left$2 = "_left_13n8n_93";
+const right$6 = "_right_13n8n_96";
+const fixed$1 = "_fixed_13n8n_99";
+const border$1 = "_border_13n8n_111";
+const shadow = "_shadow_13n8n_117";
+const drawerContent = "_drawerContent_13n8n_120";
+const isResizing = "_isResizing_13n8n_132";
+const toggleButton = "_toggleButton_13n8n_143";
+const top = "_top_13n8n_156";
+const bottom = "_bottom_13n8n_159";
+const toggleButtonOpen = "_toggleButtonOpen_13n8n_162";
+const tabs$1 = "_tabs_13n8n_165";
+const tab$1 = "_tab_13n8n_165";
+const active$4 = "_active_13n8n_197";
+const disabled$6 = "_disabled_13n8n_222";
+const tabsContent = "_tabsContent_13n8n_229";
+const resizeHandle = "_resizeHandle_13n8n_235";
 const styles$C = {
   inputInTable: inputInTable$a,
+  error: error$b,
+  warning: warning$e,
   inputHover: inputHover$a,
   inputFocus: inputFocus$a,
   inputError: inputError$a,
@@ -8932,8 +8949,7 @@ const FileButton = ({
   multi,
   name: name2,
   disabled: disabled2,
-  onChange = () => {
-  },
+  onChange = noop$3,
   ...buttonProps
 }) => {
   const disabledContext = useContext(DisabledContext);
@@ -8945,7 +8961,15 @@ const FileButton = ({
   const handleChange = (evt) => {
     var _a2;
     const files = multi ? evt.target.files : (_a2 = evt.target.files) == null ? void 0 : _a2[0];
-    onChange({ ...evt, target: { ...evt.target, value: files } });
+    const customEvent = {
+      ...evt,
+      target: {
+        ...evt.target,
+        value: files,
+        name: evt.target.name
+      }
+    };
+    onChange(customEvent);
     if (inputRef.current) {
       inputRef.current.value = "";
     }
@@ -8998,24 +9022,26 @@ const InputGroup = ({
     }
   );
 };
-const inputInTable$9 = "_inputInTable_jnwnh_1";
-const inputHover$9 = "_inputHover_jnwnh_13";
-const inputFocus$9 = "_inputFocus_jnwnh_18";
-const inputError$9 = "_inputError_jnwnh_25";
-const inputWarning$9 = "_inputWarning_jnwnh_26";
-const inputDisabled$9 = "_inputDisabled_jnwnh_61";
-const hideScrollbars$9 = "_hideScrollbars_jnwnh_67";
-const input$1 = "_input_jnwnh_1";
-const isInTable$3 = "_isInTable_jnwnh_100";
-const small$8 = "_small_jnwnh_124";
-const error$6 = "_error_jnwnh_130";
-const warning$9 = "_warning_jnwnh_147";
-const right$5 = "_right_jnwnh_170";
-const groupOrderFirst$3 = "_groupOrderFirst_jnwnh_173";
-const groupOrderMiddle$3 = "_groupOrderMiddle_jnwnh_174";
-const groupOrderLast$3 = "_groupOrderLast_jnwnh_175";
+const inputInTable$9 = "_inputInTable_rhzw6_1";
+const error$a = "_error_rhzw6_7";
+const warning$d = "_warning_rhzw6_7";
+const inputHover$9 = "_inputHover_rhzw6_13";
+const inputFocus$9 = "_inputFocus_rhzw6_18";
+const inputError$9 = "_inputError_rhzw6_25";
+const inputWarning$9 = "_inputWarning_rhzw6_26";
+const inputDisabled$9 = "_inputDisabled_rhzw6_61";
+const hideScrollbars$9 = "_hideScrollbars_rhzw6_67";
+const input$1 = "_input_rhzw6_1";
+const isInTable$3 = "_isInTable_rhzw6_100";
+const small$8 = "_small_rhzw6_124";
+const right$5 = "_right_rhzw6_170";
+const groupOrderFirst$3 = "_groupOrderFirst_rhzw6_173";
+const groupOrderMiddle$3 = "_groupOrderMiddle_rhzw6_174";
+const groupOrderLast$3 = "_groupOrderLast_rhzw6_175";
 const styles$z = {
   inputInTable: inputInTable$9,
+  error: error$a,
+  warning: warning$d,
   inputHover: inputHover$9,
   inputFocus: inputFocus$9,
   inputError: inputError$9,
@@ -9025,8 +9051,6 @@ const styles$z = {
   input: input$1,
   isInTable: isInTable$3,
   small: small$8,
-  error: error$6,
-  warning: warning$9,
   right: right$5,
   groupOrderFirst: groupOrderFirst$3,
   groupOrderMiddle: groupOrderMiddle$3,
@@ -9039,8 +9063,7 @@ const Input$1 = forwardRef(
     isInTable: isInTable2,
     width: propWidth = void 0,
     small: small2 = false,
-    onChange = () => {
-    },
+    onChange = noop$3,
     placeholder: placeholder3 = "",
     value = "",
     onKeyPress = () => {
@@ -9172,8 +9195,7 @@ const FileInput = ({
   multi,
   name: name2,
   width: width2,
-  onChange = () => {
-  },
+  onChange = noop$3,
   testId
 }) => {
   const disabledContext = useContext(DisabledContext);
@@ -9186,7 +9208,15 @@ const FileInput = ({
   const handleChange = (evt) => {
     var _a2, _b, _c;
     const files = multi ? (_a2 = evt == null ? void 0 : evt.target) == null ? void 0 : _a2.files : (_c = (_b = evt == null ? void 0 : evt.target) == null ? void 0 : _b.files) == null ? void 0 : _c[0];
-    onChange({ ...evt, target: { ...evt.target, value: files } });
+    const customEvent = {
+      ...evt,
+      target: {
+        ...evt.target,
+        value: files,
+        name: evt.target.name
+      }
+    };
+    onChange(customEvent);
     if (inputRef.current) {
       inputRef.current.value = "";
     }
@@ -10856,7 +10886,7 @@ function isPlainObject$3(obj) {
   }
   return proto === baseProto;
 }
-function warning$8(message2) {
+function warning$c(message2) {
   if (typeof console !== "undefined" && typeof console.error === "function") {
     console.error(message2);
   }
@@ -10867,7 +10897,7 @@ function warning$8(message2) {
 }
 function verifyPlainObject(value, displayName, methodName) {
   if (!isPlainObject$3(value)) {
-    warning$8(methodName + "() in " + displayName + " must return a plain object. Instead received " + value + ".");
+    warning$c(methodName + "() in " + displayName + " must return a plain object. Instead received " + value + ".");
   }
 }
 function wrapMapToPropsConstant(getConstant) {
@@ -10965,7 +10995,7 @@ function verify(selector, methodName, displayName) {
     throw new Error("Unexpected value for " + methodName + " in " + displayName + ".");
   } else if (methodName === "mapStateToProps" || methodName === "mapDispatchToProps") {
     if (!Object.prototype.hasOwnProperty.call(selector, "dependsOnOwnProps")) {
-      warning$8("The selector for " + methodName + " of " + displayName + " did not specify a value for dependsOnOwnProps.");
+      warning$c("The selector for " + methodName + " of " + displayName + " did not specify a value for dependsOnOwnProps.");
     }
   }
 }
@@ -11358,8 +11388,8 @@ function log(type, message2) {
   }
   (_console = console)[type].apply(_console, getFormattedMessage(message2));
 }
-var warning$7 = log.bind(null, "warn");
-var error$5 = log.bind(null, "error");
+var warning$b = log.bind(null, "warn");
+var error$9 = log.bind(null, "error");
 function noop$1() {
 }
 function getOptions(shared2, fromBinding) {
@@ -11408,13 +11438,13 @@ var ErrorBoundary = function(_React$Component) {
       var callbacks2 = _this.getCallbacks();
       if (callbacks2.isDragging()) {
         callbacks2.tryAbort();
-        process.env.NODE_ENV !== "production" ? warning$7("\n        An error was caught by our window 'error' event listener while a drag was occurring.\n        The active drag has been aborted.\n      ") : void 0;
+        process.env.NODE_ENV !== "production" ? warning$b("\n        An error was caught by our window 'error' event listener while a drag was occurring.\n        The active drag has been aborted.\n      ") : void 0;
       }
       var err = event.error;
       if (err instanceof RbdInvariant) {
         event.preventDefault();
         if (process.env.NODE_ENV !== "production") {
-          error$5(err.message);
+          error$9(err.message);
         }
       }
     };
@@ -11439,7 +11469,7 @@ var ErrorBoundary = function(_React$Component) {
   _proto.componentDidCatch = function componentDidCatch(err) {
     if (err instanceof RbdInvariant) {
       if (process.env.NODE_ENV !== "production") {
-        error$5(err.message);
+        error$9(err.message);
       }
       this.setState({});
       return;
@@ -13718,7 +13748,7 @@ function checkIndexes(insideDestination) {
     var hasError = Boolean(errors2[index2]);
     return hasError ? "[🔥" + index2 + "]" : "" + index2;
   }).join(", ");
-  process.env.NODE_ENV !== "production" ? warning$7("\n    Detected non-consecutive <Draggable /> indexes.\n\n    (This can cause unexpected bugs)\n\n    " + formatted + "\n  ") : void 0;
+  process.env.NODE_ENV !== "production" ? warning$b("\n    Detected non-consecutive <Draggable /> indexes.\n\n    (This can cause unexpected bugs)\n\n    " + formatted + "\n  ") : void 0;
 }
 function validateDimensions(critical, dimensions) {
   if (process.env.NODE_ENV !== "production") {
@@ -14057,11 +14087,11 @@ var getExpiringAnnounce = function(announce) {
   });
   var result = function result2(message2) {
     if (wasCalled) {
-      process.env.NODE_ENV !== "production" ? warning$7("Announcement already made. Not making a second announcement") : void 0;
+      process.env.NODE_ENV !== "production" ? warning$b("Announcement already made. Not making a second announcement") : void 0;
       return;
     }
     if (isExpired) {
-      process.env.NODE_ENV !== "production" ? warning$7("\n        Announcements cannot be made asynchronously.\n        Default message has already been announced.\n      ") : void 0;
+      process.env.NODE_ENV !== "production" ? warning$b("\n        Announcements cannot be made asynchronously.\n        Default message has already been announced.\n      ") : void 0;
       return;
     }
     wasCalled = true;
@@ -14625,7 +14655,7 @@ function shouldPublishUpdate(registry, dragging, entry) {
   }
   var home2 = registry.droppable.getById(entry.descriptor.droppableId);
   if (home2.descriptor.mode !== "virtual") {
-    process.env.NODE_ENV !== "production" ? warning$7("\n      You are attempting to add or remove a Draggable [id: " + entry.descriptor.id + "]\n      while a drag is occurring. This is only supported for virtual lists.\n\n      See https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/patterns/virtual-lists.md\n    ") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("\n      You are attempting to add or remove a Draggable [id: " + entry.descriptor.id + "]\n      while a drag is occurring. This is only supported for virtual lists.\n\n      See https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/patterns/virtual-lists.md\n    ") : void 0;
     return false;
   }
   return true;
@@ -14800,7 +14830,7 @@ var getPercentage = function(_ref) {
   var startOfRange = _ref.startOfRange, endOfRange = _ref.endOfRange, current = _ref.current;
   var range2 = endOfRange - startOfRange;
   if (range2 === 0) {
-    process.env.NODE_ENV !== "production" ? warning$7("\n      Detected distance range of 0 in the fluid auto scroller\n      This is unexpected and would cause a divide by 0 issue.\n      Not allowing an auto scroll\n    ") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("\n      Detected distance range of 0 in the fluid auto scroller\n      This is unexpected and would cause a divide by 0 issue.\n      Not allowing an auto scroll\n    ") : void 0;
     return 0;
   }
   var currentInRange = current - startOfRange;
@@ -15416,18 +15446,18 @@ function findDragHandle(contextId, draggableId) {
   var selector = "[" + dragHandle.contextId + '="' + contextId + '"]';
   var possible = toArray(document.querySelectorAll(selector));
   if (!possible.length) {
-    process.env.NODE_ENV !== "production" ? warning$7('Unable to find any drag handles in the context "' + contextId + '"') : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b('Unable to find any drag handles in the context "' + contextId + '"') : void 0;
     return null;
   }
   var handle = find(possible, function(el2) {
     return el2.getAttribute(dragHandle.draggableId) === draggableId;
   });
   if (!handle) {
-    process.env.NODE_ENV !== "production" ? warning$7('Unable to find drag handle with id "' + draggableId + '" as no handle with a matching id was found') : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b('Unable to find drag handle with id "' + draggableId + '" as no handle with a matching id was found') : void 0;
     return null;
   }
   if (!isHtmlElement(handle)) {
-    process.env.NODE_ENV !== "production" ? warning$7("drag handle needs to be a HTMLElement") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("drag handle needs to be a HTMLElement") : void 0;
     return null;
   }
   return handle;
@@ -15689,7 +15719,7 @@ function useAnnouncer(contextId) {
       el2.textContent = message2;
       return;
     }
-    process.env.NODE_ENV !== "production" ? warning$7('\n      A screen reader message was trying to be announced but it was unable to do so.\n      This can occur if you unmount your <DragDropContext /> in your onDragEnd.\n      Consider calling provided.announce() before the unmount so that the instruction will\n      not be lost for users relying on a screen reader.\n\n      Message not passed to screen reader:\n\n      "' + message2 + '"\n    ') : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b('\n      A screen reader message was trying to be announced but it was unable to do so.\n      This can occur if you unmount your <DragDropContext /> in your onDragEnd.\n      Consider calling provided.announce() before the unmount so that the instruction will\n      not be lost for users relying on a screen reader.\n\n      Message not passed to screen reader:\n\n      "' + message2 + '"\n    ') : void 0;
   }, []);
   return announce;
 }
@@ -15775,20 +15805,20 @@ var checkReactVersion = function(peerDepValue, actualValue) {
   if (isSatisfied(peerDep, actual)) {
     return;
   }
-  process.env.NODE_ENV !== "production" ? warning$7("\n    React version: [" + actual.raw + "]\n    does not satisfy expected peer dependency version: [" + peerDep.raw + "]\n\n    This can result in run time bugs, and even fatal crashes\n  ") : void 0;
+  process.env.NODE_ENV !== "production" ? warning$b("\n    React version: [" + actual.raw + "]\n    does not satisfy expected peer dependency version: [" + peerDep.raw + "]\n\n    This can result in run time bugs, and even fatal crashes\n  ") : void 0;
 };
 var suffix = "\n  We expect a html5 doctype: <!doctype html>\n  This is to ensure consistent browser layout and measurement\n\n  More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/doctype.md\n";
 var checkDoctype = function(doc2) {
   var doctype = doc2.doctype;
   if (!doctype) {
-    process.env.NODE_ENV !== "production" ? warning$7("\n      No <!doctype html> found.\n\n      " + suffix + "\n    ") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("\n      No <!doctype html> found.\n\n      " + suffix + "\n    ") : void 0;
     return;
   }
   if (doctype.name.toLowerCase() !== "html") {
-    process.env.NODE_ENV !== "production" ? warning$7("\n      Unexpected <!doctype> found: (" + doctype.name + ")\n\n      " + suffix + "\n    ") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("\n      Unexpected <!doctype> found: (" + doctype.name + ")\n\n      " + suffix + "\n    ") : void 0;
   }
   if (doctype.publicId !== "") {
-    process.env.NODE_ENV !== "production" ? warning$7("\n      Unexpected <!doctype> publicId found: (" + doctype.publicId + ")\n      A html5 doctype does not have a publicId\n\n      " + suffix + "\n    ") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("\n      Unexpected <!doctype> publicId found: (" + doctype.publicId + ")\n      A html5 doctype does not have a publicId\n\n      " + suffix + "\n    ") : void 0;
   }
 };
 function useDev(useHook) {
@@ -15802,7 +15832,7 @@ function useDevSetupWarning(fn, inputs) {
       try {
         fn();
       } catch (e2) {
-        error$5("\n          A setup problem was encountered.\n\n          > " + e2.message + "\n        ");
+        error$9("\n          A setup problem was encountered.\n\n          > " + e2.message + "\n        ");
       }
     }, inputs);
   });
@@ -16569,7 +16599,7 @@ function getSelector(contextId) {
 function findClosestDragHandleFromEvent(contextId, event) {
   var target = event.target;
   if (!isElement$1(target)) {
-    process.env.NODE_ENV !== "production" ? warning$7("event.target must be a Element") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("event.target must be a Element") : void 0;
     return null;
   }
   var selector = getSelector(contextId);
@@ -16578,7 +16608,7 @@ function findClosestDragHandleFromEvent(contextId, event) {
     return null;
   }
   if (!isHtmlElement(handle)) {
-    process.env.NODE_ENV !== "production" ? warning$7("drag handle must be a HTMLElement") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("drag handle must be a HTMLElement") : void 0;
     return null;
   }
   return handle;
@@ -16600,7 +16630,7 @@ function findDraggable(contextId, draggableId) {
     return null;
   }
   if (!isHtmlElement(draggable$1)) {
-    process.env.NODE_ENV !== "production" ? warning$7("Draggable element is not a HTMLElement") : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("Draggable element is not a HTMLElement") : void 0;
     return null;
   }
   return draggable$1;
@@ -16612,13 +16642,13 @@ function _isActive(_ref) {
   var expected = _ref.expected, phase = _ref.phase, isLockActive = _ref.isLockActive, shouldWarn = _ref.shouldWarn;
   if (!isLockActive()) {
     if (shouldWarn) {
-      process.env.NODE_ENV !== "production" ? warning$7("\n        Cannot perform action.\n        The sensor no longer has an action lock.\n\n        Tips:\n\n        - Throw away your action handlers when forceStop() is called\n        - Check actions.isActive() if you really need to\n      ") : void 0;
+      process.env.NODE_ENV !== "production" ? warning$b("\n        Cannot perform action.\n        The sensor no longer has an action lock.\n\n        Tips:\n\n        - Throw away your action handlers when forceStop() is called\n        - Check actions.isActive() if you really need to\n      ") : void 0;
     }
     return false;
   }
   if (expected !== phase) {
     if (shouldWarn) {
-      process.env.NODE_ENV !== "production" ? warning$7("\n        Cannot perform action.\n        The actions you used belong to an outdated phase\n\n        Current phase: " + expected + "\n        You called an action from outdated phase: " + phase + "\n\n        Tips:\n\n        - Do not use preDragActions actions after calling preDragActions.lift()\n      ") : void 0;
+      process.env.NODE_ENV !== "production" ? warning$b("\n        Cannot perform action.\n        The actions you used belong to an outdated phase\n\n        Current phase: " + expected + "\n        You called an action from outdated phase: " + phase + "\n\n        Tips:\n\n        - Do not use preDragActions actions after calling preDragActions.lift()\n      ") : void 0;
     }
     return false;
   }
@@ -16631,7 +16661,7 @@ function canStart(_ref2) {
   }
   var entry = registry.draggable.findById(draggableId);
   if (!entry) {
-    process.env.NODE_ENV !== "production" ? warning$7("Unable to find draggable with id: " + draggableId) : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("Unable to find draggable with id: " + draggableId) : void 0;
     return false;
   }
   if (!entry.options.isEnabled) {
@@ -16656,7 +16686,7 @@ function tryStart(_ref3) {
   var entry = registry.draggable.getById(draggableId);
   var el2 = findDraggable(contextId, entry.descriptor.id);
   if (!el2) {
-    process.env.NODE_ENV !== "production" ? warning$7("Unable to find draggable element with id: " + draggableId) : void 0;
+    process.env.NODE_ENV !== "production" ? warning$b("Unable to find draggable element with id: " + draggableId) : void 0;
     return null;
   }
   if (sourceEvent && !entry.options.canDragInteractiveElements && isEventInInteractiveElement(el2, sourceEvent)) {
@@ -16950,7 +16980,7 @@ function App(props) {
   }, [announce, autoScroller, dimensionMarshal, focusMarshal, getResponders, styleMarshal]);
   if (process.env.NODE_ENV !== "production") {
     if (lazyStoreRef.current && lazyStoreRef.current !== store) {
-      process.env.NODE_ENV !== "production" ? warning$7("unexpected store change") : void 0;
+      process.env.NODE_ENV !== "production" ? warning$b("unexpected store change") : void 0;
     }
   }
   lazyStoreRef.current = store;
@@ -17071,7 +17101,7 @@ var isBodyScrollable = function isBodyScrollable2() {
   if (isBoth(htmlOverflow, isVisible$1)) {
     return false;
   }
-  process.env.NODE_ENV !== "production" ? warning$7("\n    We have detected that your <body> element might be a scroll container.\n    We have found no reliable way of detecting whether the <body> element is a scroll container.\n    Under most circumstances a <body> scroll bar will be on the <html> element (document.documentElement)\n\n    Because we cannot determine if the <body> is a scroll container, and generally it is not one,\n    we will be treating the <body> as *not* a scroll container\n\n    More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/how-we-detect-scroll-containers.md\n  ") : void 0;
+  process.env.NODE_ENV !== "production" ? warning$b("\n    We have detected that your <body> element might be a scroll container.\n    We have found no reliable way of detecting whether the <body> element is a scroll container.\n    Under most circumstances a <body> scroll bar will be on the <html> element (document.documentElement)\n\n    Because we cannot determine if the <body> is a scroll container, and generally it is not one,\n    we will be treating the <body> as *not* a scroll container\n\n    More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/guides/how-we-detect-scroll-containers.md\n  ") : void 0;
   return false;
 };
 var getClosestScrollable = function getClosestScrollable2(el2) {
@@ -17097,7 +17127,7 @@ var checkForNestedScrollContainers = function(scrollable) {
   if (!anotherScrollParent) {
     return;
   }
-  process.env.NODE_ENV !== "production" ? warning$7("\n    Droppable: unsupported nested scroll container detected.\n    A Droppable can only have one scroll parent (which can be itself)\n    Nested scroll containers are currently not supported.\n\n    We hope to support nested scroll containers soon: https://github.com/atlassian/react-beautiful-dnd/issues/131\n  ") : void 0;
+  process.env.NODE_ENV !== "production" ? warning$b("\n    Droppable: unsupported nested scroll container detected.\n    A Droppable can only have one scroll parent (which can be itself)\n    Nested scroll containers are currently not supported.\n\n    We hope to support nested scroll containers soon: https://github.com/atlassian/react-beautiful-dnd/issues/131\n  ") : void 0;
 };
 var getScroll$1 = function(el2) {
   return {
@@ -17378,7 +17408,7 @@ function useDroppablePublisher(args) {
     registry.droppable.register(entry);
     return function() {
       if (whileDraggingRef.current) {
-        process.env.NODE_ENV !== "production" ? warning$7("Unsupported: changing the droppableId or type of a Droppable during a drag") : void 0;
+        process.env.NODE_ENV !== "production" ? warning$b("Unsupported: changing the droppableId or type of a Droppable during a drag") : void 0;
         dragStopped();
       }
       registry.droppable.unregister(entry);
@@ -17525,7 +17555,7 @@ var standard = [function placeholder(_ref4) {
   if (ref2) {
     return;
   }
-  process.env.NODE_ENV !== "production" ? warning$7('\n      Droppable setup issue [droppableId: "' + props.droppableId + '"]:\n      DroppableProvided > placeholder could not be found.\n\n      Please be sure to add the {provided.placeholder} React Node as a child of your Droppable.\n      More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/api/droppable.md\n    ') : void 0;
+  process.env.NODE_ENV !== "production" ? warning$b('\n      Droppable setup issue [droppableId: "' + props.droppableId + '"]:\n      DroppableProvided > placeholder could not be found.\n\n      Please be sure to add the {provided.placeholder} React Node as a child of your Droppable.\n      More information: https://github.com/atlassian/react-beautiful-dnd/blob/master/docs/api/droppable.md\n    ') : void 0;
 }];
 var virtual = [function hasClone(_ref5) {
   var props = _ref5.props;
@@ -18638,47 +18668,51 @@ var InfiniteScroll = (
     return InfiniteScroll2;
   }(Component$1)
 );
-const inputInTable$8 = "_inputInTable_tn20e_1";
-const inputHover$8 = "_inputHover_tn20e_13";
-const inputFocus$8 = "_inputFocus_tn20e_18";
-const inputError$8 = "_inputError_tn20e_25";
-const inputWarning$8 = "_inputWarning_tn20e_26";
-const inputDisabled$8 = "_inputDisabled_tn20e_61";
-const hideScrollbars$8 = "_hideScrollbars_tn20e_67";
-const header$1 = "_header_tn20e_77";
-const headerTitle = "_headerTitle_tn20e_77";
-const heading$3 = "_heading_tn20e_78";
-const itemHeader = "_itemHeader_tn20e_78";
-const narrow = "_narrow_tn20e_81";
-const stickyHeader = "_stickyHeader_tn20e_85";
-const title$3 = "_title_tn20e_96";
-const name = "_name_tn20e_102";
-const iconTooltipMargin = "_iconTooltipMargin_tn20e_105";
-const bold = "_bold_tn20e_108";
-const toggleNarrow = "_toggleNarrow_tn20e_117";
-const drag$1 = "_drag_tn20e_135";
-const list$1 = "_list_tn20e_155";
-const bordered$1 = "_bordered_tn20e_159";
-const item$4 = "_item_tn20e_78";
-const action = "_action_tn20e_192";
-const active$3 = "_active_tn20e_195";
-const indented = "_indented_tn20e_202";
-const disabled$5 = "_disabled_tn20e_215";
-const label$6 = "_label_tn20e_226";
-const details$2 = "_details_tn20e_237";
-const metadata = "_metadata_tn20e_238";
-const itemContent = "_itemContent_tn20e_246";
-const indentIcon = "_indentIcon_tn20e_253";
-const expandIcon = "_expandIcon_tn20e_258";
-const expanded = "_expanded_tn20e_265";
-const right$4 = "_right_tn20e_268";
-const actions = "_actions_tn20e_276";
-const scrollableList = "_scrollableList_tn20e_281";
-const infiniteScrollContainer = "_infiniteScrollContainer_tn20e_286";
-const hideScrollbar = "_hideScrollbar_tn20e_67";
-const noPointerEvents = "_noPointerEvents_tn20e_303";
+const inputInTable$8 = "_inputInTable_dlqxe_1";
+const error$8 = "_error_dlqxe_7";
+const warning$a = "_warning_dlqxe_7";
+const inputHover$8 = "_inputHover_dlqxe_13";
+const inputFocus$8 = "_inputFocus_dlqxe_18";
+const inputError$8 = "_inputError_dlqxe_25";
+const inputWarning$8 = "_inputWarning_dlqxe_26";
+const inputDisabled$8 = "_inputDisabled_dlqxe_61";
+const hideScrollbars$8 = "_hideScrollbars_dlqxe_67";
+const header$1 = "_header_dlqxe_77";
+const headerTitle = "_headerTitle_dlqxe_77";
+const heading$3 = "_heading_dlqxe_78";
+const itemHeader = "_itemHeader_dlqxe_78";
+const narrow = "_narrow_dlqxe_81";
+const stickyHeader = "_stickyHeader_dlqxe_85";
+const title$3 = "_title_dlqxe_96";
+const name = "_name_dlqxe_102";
+const iconTooltipMargin = "_iconTooltipMargin_dlqxe_105";
+const bold = "_bold_dlqxe_108";
+const toggleNarrow = "_toggleNarrow_dlqxe_117";
+const drag$1 = "_drag_dlqxe_135";
+const list$1 = "_list_dlqxe_155";
+const bordered$1 = "_bordered_dlqxe_159";
+const item$4 = "_item_dlqxe_78";
+const action = "_action_dlqxe_192";
+const active$3 = "_active_dlqxe_195";
+const indented = "_indented_dlqxe_202";
+const disabled$5 = "_disabled_dlqxe_215";
+const label$6 = "_label_dlqxe_226";
+const details$2 = "_details_dlqxe_237";
+const metadata = "_metadata_dlqxe_238";
+const itemContent = "_itemContent_dlqxe_246";
+const indentIcon = "_indentIcon_dlqxe_253";
+const expandIcon = "_expandIcon_dlqxe_258";
+const expanded = "_expanded_dlqxe_265";
+const right$4 = "_right_dlqxe_268";
+const actions = "_actions_dlqxe_276";
+const scrollableList = "_scrollableList_dlqxe_281";
+const infiniteScrollContainer = "_infiniteScrollContainer_dlqxe_286";
+const hideScrollbar = "_hideScrollbar_dlqxe_67";
+const noPointerEvents = "_noPointerEvents_dlqxe_303";
 const listStyles = {
   inputInTable: inputInTable$8,
+  error: error$8,
+  warning: warning$a,
   inputHover: inputHover$8,
   inputFocus: inputFocus$8,
   inputError: inputError$8,
@@ -19169,29 +19203,31 @@ const List = ({
     }
   );
 };
-const inputInTable$7 = "_inputInTable_s49vk_1";
-const inputHover$7 = "_inputHover_s49vk_13";
-const inputFocus$7 = "_inputFocus_s49vk_18";
-const inputError$7 = "_inputError_s49vk_25";
-const inputWarning$7 = "_inputWarning_s49vk_26";
-const inputDisabled$7 = "_inputDisabled_s49vk_61";
-const hideScrollbars$7 = "_hideScrollbars_s49vk_67";
-const container$1 = "_container_s49vk_83";
-const block$1 = "_block_s49vk_101";
-const info = "_info_s49vk_104";
-const success = "_success_s49vk_108";
-const warning$6 = "_warning_s49vk_112";
-const error$4 = "_error_s49vk_116";
-const content$1 = "_content_s49vk_120";
-const heading$2 = "_heading_s49vk_124";
-const icon$3 = "_icon_s49vk_131";
-const dismiss$1 = "_dismiss_s49vk_139";
-const absolute = "_absolute_s49vk_143";
-const legendToggle = "_legendToggle_s49vk_155";
-const detailsText = "_detailsText_s49vk_165";
-const footer$1 = "_footer_s49vk_169";
+const inputInTable$7 = "_inputInTable_1q2d1_1";
+const error$7 = "_error_1q2d1_7";
+const warning$9 = "_warning_1q2d1_7";
+const inputHover$7 = "_inputHover_1q2d1_13";
+const inputFocus$7 = "_inputFocus_1q2d1_18";
+const inputError$7 = "_inputError_1q2d1_25";
+const inputWarning$7 = "_inputWarning_1q2d1_26";
+const inputDisabled$7 = "_inputDisabled_1q2d1_61";
+const hideScrollbars$7 = "_hideScrollbars_1q2d1_67";
+const container$1 = "_container_1q2d1_83";
+const block$1 = "_block_1q2d1_101";
+const info = "_info_1q2d1_104";
+const success = "_success_1q2d1_108";
+const content$1 = "_content_1q2d1_120";
+const heading$2 = "_heading_1q2d1_124";
+const icon$3 = "_icon_1q2d1_131";
+const dismiss$1 = "_dismiss_1q2d1_139";
+const absolute = "_absolute_1q2d1_143";
+const legendToggle = "_legendToggle_1q2d1_155";
+const detailsText = "_detailsText_1q2d1_165";
+const footer$1 = "_footer_1q2d1_169";
 const styles$s = {
   inputInTable: inputInTable$7,
+  error: error$7,
+  warning: warning$9,
   inputHover: inputHover$7,
   inputFocus: inputFocus$7,
   inputError: inputError$7,
@@ -19202,8 +19238,6 @@ const styles$s = {
   block: block$1,
   info,
   success,
-  warning: warning$6,
-  error: error$4,
   content: content$1,
   heading: heading$2,
   icon: icon$3,
@@ -19571,25 +19605,27 @@ const Page = ({
     }
   );
 };
-const inputInTable$6 = "_inputInTable_2ynxq_1";
-const inputHover$6 = "_inputHover_2ynxq_13";
-const inputFocus$6 = "_inputFocus_2ynxq_18";
-const inputError$6 = "_inputError_2ynxq_25";
-const inputWarning$6 = "_inputWarning_2ynxq_26";
-const inputDisabled$6 = "_inputDisabled_2ynxq_61";
-const hideScrollbars$6 = "_hideScrollbars_2ynxq_67";
-const select = "_select_2ynxq_77";
-const isInTable$2 = "_isInTable_2ynxq_121";
-const unSelected = "_unSelected_2ynxq_133";
-const error$3 = "_error_2ynxq_140";
-const warning$5 = "_warning_2ynxq_157";
-const small$6 = "_small_2ynxq_174";
-const right$3 = "_right_2ynxq_182";
-const groupOrderFirst$1 = "_groupOrderFirst_2ynxq_193";
-const groupOrderMiddle$1 = "_groupOrderMiddle_2ynxq_194";
-const groupOrderLast$1 = "_groupOrderLast_2ynxq_198";
+const inputInTable$6 = "_inputInTable_1nzfr_1";
+const error$6 = "_error_1nzfr_7";
+const warning$8 = "_warning_1nzfr_7";
+const inputHover$6 = "_inputHover_1nzfr_13";
+const inputFocus$6 = "_inputFocus_1nzfr_18";
+const inputError$6 = "_inputError_1nzfr_25";
+const inputWarning$6 = "_inputWarning_1nzfr_26";
+const inputDisabled$6 = "_inputDisabled_1nzfr_61";
+const hideScrollbars$6 = "_hideScrollbars_1nzfr_67";
+const select = "_select_1nzfr_77";
+const isInTable$2 = "_isInTable_1nzfr_121";
+const unSelected = "_unSelected_1nzfr_133";
+const small$6 = "_small_1nzfr_174";
+const right$3 = "_right_1nzfr_182";
+const groupOrderFirst$1 = "_groupOrderFirst_1nzfr_193";
+const groupOrderMiddle$1 = "_groupOrderMiddle_1nzfr_194";
+const groupOrderLast$1 = "_groupOrderLast_1nzfr_198";
 const styles$o = {
   inputInTable: inputInTable$6,
+  error: error$6,
+  warning: warning$8,
   inputHover: inputHover$6,
   inputFocus: inputFocus$6,
   inputError: inputError$6,
@@ -19599,8 +19635,6 @@ const styles$o = {
   select,
   isInTable: isInTable$2,
   unSelected,
-  error: error$3,
-  warning: warning$5,
   small: small$6,
   right: right$3,
   groupOrderFirst: groupOrderFirst$1,
@@ -19613,12 +19647,9 @@ const NativeSelect = ({
   warning: warning2 = null,
   tooltip: tooltip2 = null,
   options,
-  onChange = () => {
-  },
-  onFocus = () => {
-  },
-  onBlur = () => {
-  },
+  onChange = noop$3,
+  onFocus = noop$3,
+  onBlur = noop$3,
   right: right2 = false,
   small: small2 = false,
   tabIndex = 0,
@@ -20658,39 +20689,41 @@ const Layer = ({
     }
   );
 };
-const inputInTable$5 = "_inputInTable_1qfoj_1";
-const inputHover$5 = "_inputHover_1qfoj_13";
-const inputFocus$5 = "_inputFocus_1qfoj_18";
-const inputError$5 = "_inputError_1qfoj_25";
-const inputWarning$5 = "_inputWarning_1qfoj_26";
-const inputDisabled$5 = "_inputDisabled_1qfoj_61";
-const hideScrollbars$5 = "_hideScrollbars_1qfoj_67";
-const trigger$1 = "_trigger_1qfoj_77";
-const isInTable$1 = "_isInTable_1qfoj_93";
-const input = "_input_1qfoj_1";
-const isOpen = "_isOpen_1qfoj_114";
-const error$2 = "_error_1qfoj_122";
-const warning$4 = "_warning_1qfoj_139";
-const disabled$3 = "_disabled_1qfoj_156";
-const icons = "_icons_1qfoj_162";
-const clearAll = "_clearAll_1qfoj_169";
-const iconOpen = "_iconOpen_1qfoj_170";
-const small$4 = "_small_1qfoj_181";
-const triggerInputContainer = "_triggerInputContainer_1qfoj_189";
-const right$2 = "_right_1qfoj_198";
-const multiOptions = "_multiOptions_1qfoj_211";
-const multiOption = "_multiOption_1qfoj_211";
-const label$4 = "_label_1qfoj_239";
-const closeMultiOption = "_closeMultiOption_1qfoj_242";
-const focus = "_focus_1qfoj_253";
-const selectedSingleValue = "_selectedSingleValue_1qfoj_257";
-const placeHolder = "_placeHolder_1qfoj_258";
-const groupOrderFirst = "_groupOrderFirst_1qfoj_297";
-const groupOrderMiddle = "_groupOrderMiddle_1qfoj_298";
-const groupOrderLast = "_groupOrderLast_1qfoj_302";
-const detailedLabel = "_detailedLabel_1qfoj_307";
+const inputInTable$5 = "_inputInTable_nec64_1";
+const error$5 = "_error_nec64_7";
+const warning$7 = "_warning_nec64_7";
+const inputHover$5 = "_inputHover_nec64_13";
+const inputFocus$5 = "_inputFocus_nec64_18";
+const inputError$5 = "_inputError_nec64_25";
+const inputWarning$5 = "_inputWarning_nec64_26";
+const inputDisabled$5 = "_inputDisabled_nec64_61";
+const hideScrollbars$5 = "_hideScrollbars_nec64_67";
+const trigger$1 = "_trigger_nec64_77";
+const isInTable$1 = "_isInTable_nec64_93";
+const input = "_input_nec64_1";
+const isOpen = "_isOpen_nec64_114";
+const disabled$3 = "_disabled_nec64_156";
+const icons = "_icons_nec64_162";
+const clearAll = "_clearAll_nec64_169";
+const iconOpen = "_iconOpen_nec64_170";
+const small$4 = "_small_nec64_181";
+const triggerInputContainer = "_triggerInputContainer_nec64_189";
+const right$2 = "_right_nec64_198";
+const multiOptions = "_multiOptions_nec64_211";
+const multiOption = "_multiOption_nec64_211";
+const label$4 = "_label_nec64_239";
+const closeMultiOption = "_closeMultiOption_nec64_242";
+const focus = "_focus_nec64_253";
+const selectedSingleValue = "_selectedSingleValue_nec64_257";
+const placeHolder = "_placeHolder_nec64_258";
+const groupOrderFirst = "_groupOrderFirst_nec64_297";
+const groupOrderMiddle = "_groupOrderMiddle_nec64_298";
+const groupOrderLast = "_groupOrderLast_nec64_302";
+const detailedLabel = "_detailedLabel_nec64_307";
 const styles$m = {
   inputInTable: inputInTable$5,
+  error: error$5,
+  warning: warning$7,
   inputHover: inputHover$5,
   inputFocus: inputFocus$5,
   inputError: inputError$5,
@@ -20701,8 +20734,6 @@ const styles$m = {
   isInTable: isInTable$1,
   input,
   isOpen,
-  error: error$2,
-  warning: warning$4,
   disabled: disabled$3,
   icons,
   clearAll,
@@ -20781,8 +20812,7 @@ const Input = ({
   selectedOptions,
   searchable = false,
   searchValue,
-  onChange = () => {
-  },
+  onChange = noop$3,
   inputRef,
   error: error2,
   placeholder: placeholder3 = "Select...",
@@ -21507,8 +21537,8 @@ const CustomSelect = (props) => {
     }
   ) });
 };
-const isMulti = (selectedOptions) => selectedOptions instanceof Array;
 const isEmptyNullOrUndefined = (value) => value === null || value === void 0 || value === "";
+const isMulti = (selectedOptions) => selectedOptions instanceof Array;
 const standardizeOptions = (options, simple) => {
   return simple && Array.isArray(options) ? options.map(
     (o) => typeof o === "string" || typeof o === "number" ? { label: o, value: o } : o
@@ -21596,8 +21626,7 @@ const Select = (props) => {
     options: rawOptions = [],
     value: rawSelectedOptions,
     native = false,
-    onChange = () => {
-    },
+    onChange = noop$3,
     deprecatedEventHandler = false,
     autoScroll: autoScroll2 = true,
     warning: warning2,
@@ -21640,7 +21669,9 @@ const Select = (props) => {
       const newSelectedOptions = multi ? selectedOptions2.map(
         (o) => simpleInputs ? o.value : o
       ) : simpleInputs ? selectedOptions2.value : selectedOptions2;
-      onChange(newSelectedOptions);
+      if (newSelectedOptions) {
+        onChange(newSelectedOptions);
+      }
     } else {
       const isSyntheticEvent = !(evt instanceof Event);
       const value = multi ? selectedOptions2 : selectedOptions2.value;
@@ -21652,17 +21683,16 @@ const Select = (props) => {
         }
         onChange(evt);
       } else {
-        onChange({
+        const customEvent = {
           ...evt,
           target: {
             ...evt.target,
             name: name2,
             value,
-            ...!multi && {
-              label: selectedOptions2.label
-            }
+            label: !multi ? selectedOptions2.label : void 0
           }
-        });
+        };
+        onChange(customEvent);
       }
     }
   };
@@ -37504,7 +37534,7 @@ let createNanoEvents = () => ({
     return () => this.events[event] = (this.events[event] || []).filter((i) => i !== cb2);
   }
 });
-var __defProp$h = Object.defineProperty;
+var __defProp$i = Object.defineProperty;
 var __getOwnPropDesc$g = Object.getOwnPropertyDescriptor;
 var __decorateClass$f = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key2) : target;
@@ -37512,7 +37542,7 @@ var __decorateClass$f = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$h(target, key2, result);
+    __defProp$i(target, key2, result);
   return result;
 };
 var __accessCheck$3 = (obj, member, msg2) => {
@@ -41483,7 +41513,7 @@ function gatherRawExtensions(config2, props) {
     return;
   }
   if (names2.includes(extension2.name)) {
-    warning$d(
+    warning$i(
       false,
       `Circular dependency encountered when loading extensions: ${names2.join(" > ")} > ${extension2.name}`
     );
@@ -42530,7 +42560,7 @@ const hoverColorTheme = {
     3: `0 1px 1px ${shadow3}`
   }
 });
-var __defProp$g = Object.defineProperty;
+var __defProp$h = Object.defineProperty;
 var __getOwnPropDesc$f = Object.getOwnPropertyDescriptor;
 var __decorateClass$e = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key2) : target;
@@ -42538,7 +42568,7 @@ var __decorateClass$e = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$g(target, key2, result);
+    __defProp$h(target, key2, result);
   return result;
 };
 var __accessCheck$2 = (obj, member, msg2) => {
@@ -42997,7 +43027,7 @@ PositionerExtension = __decorateClass$e([
     staticKeys: ["scrollDebounce"]
   })
 ], PositionerExtension);
-var __defProp$f = Object.defineProperty;
+var __defProp$g = Object.defineProperty;
 var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
 var __decorateClass$d = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key2) : target;
@@ -43005,7 +43035,7 @@ var __decorateClass$d = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$f(target, key2, result);
+    __defProp$g(target, key2, result);
   return result;
 };
 var toggleBoldOptions = {
@@ -43102,7 +43132,7 @@ BoldExtension = __decorateClass$d([
     staticKeys: ["weight"]
   })
 ], BoldExtension);
-var __defProp$e = Object.defineProperty;
+var __defProp$f = Object.defineProperty;
 var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
 var __decorateClass$c = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key2) : target;
@@ -43110,7 +43140,7 @@ var __decorateClass$c = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$e(target, key2, result);
+    __defProp$f(target, key2, result);
   return result;
 };
 var { DESCRIPTION, LABEL } = extensionCodeMessages;
@@ -43704,7 +43734,7 @@ function redoDepth(state) {
   let hist = historyKey.getState(state);
   return hist ? hist.undone.eventCount : 0;
 }
-var __defProp$d = Object.defineProperty;
+var __defProp$e = Object.defineProperty;
 var __getOwnPropDesc$c = Object.getOwnPropertyDescriptor;
 var __decorateClass$b = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key2) : target;
@@ -43712,7 +43742,7 @@ var __decorateClass$b = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$d(target, key2, result);
+    __defProp$e(target, key2, result);
   return result;
 };
 var DocExtension = class extends NodeExtension {
@@ -43978,7 +44008,7 @@ function requireObjectWithoutProperties() {
   })(objectWithoutProperties);
   return objectWithoutProperties.exports;
 }
-var __defProp$c = Object.defineProperty;
+var __defProp$d = Object.defineProperty;
 var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
 var __decorateClass$a = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key2) : target;
@@ -43986,7 +44016,7 @@ var __decorateClass$a = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$c(target, key2, result);
+    __defProp$d(target, key2, result);
   return result;
 };
 function posAtDOM(view, node2, offset3, bias) {
@@ -44522,7 +44552,7 @@ function drawGapCursor(state) {
   node2.className = "ProseMirror-gapcursor";
   return DecorationSet.create(state.doc, [Decoration.widget(state.selection.head, node2, { key: "gapcursor" })]);
 }
-var __defProp$b = Object.defineProperty;
+var __defProp$c = Object.defineProperty;
 var __getOwnPropDesc$a = Object.getOwnPropertyDescriptor;
 var __decorateClass$9 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key2) : target;
@@ -44530,7 +44560,7 @@ var __decorateClass$9 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$b(target, key2, result);
+    __defProp$c(target, key2, result);
   return result;
 };
 var GapCursorExtension = class extends PlainExtension {
@@ -44544,7 +44574,7 @@ var GapCursorExtension = class extends PlainExtension {
 GapCursorExtension = __decorateClass$9([
   extension({})
 ], GapCursorExtension);
-var __defProp$a = Object.defineProperty;
+var __defProp$b = Object.defineProperty;
 var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
 var __decorateClass$8 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key2) : target;
@@ -44552,7 +44582,7 @@ var __decorateClass$8 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$a(target, key2, result);
+    __defProp$b(target, key2, result);
   return result;
 };
 var HistoryExtension = class extends PlainExtension {
@@ -44648,7 +44678,7 @@ HistoryExtension = __decorateClass$8([
     handlerKeys: ["onUndo", "onRedo"]
   })
 ], HistoryExtension);
-var __defProp$9 = Object.defineProperty;
+var __defProp$a = Object.defineProperty;
 var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
 var __decorateClass$7 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key2) : target;
@@ -44656,7 +44686,7 @@ var __decorateClass$7 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$9(target, key2, result);
+    __defProp$a(target, key2, result);
   return result;
 };
 var toggleItalicOptions = {
@@ -44820,7 +44850,7 @@ function liftOutOfList$1(state, dispatch, range2) {
   dispatch(tr2.scrollIntoView());
   return true;
 }
-var __defProp$8 = Object.defineProperty;
+var __defProp$9 = Object.defineProperty;
 var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
 var __decorateClass$6 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key2) : target;
@@ -44828,7 +44858,7 @@ var __decorateClass$6 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$8(target, key2, result);
+    __defProp$9(target, key2, result);
   return result;
 };
 function isList(type) {
@@ -48838,7 +48868,7 @@ marked.walkTokens;
 marked.parseInline;
 Parser$1.parse;
 Lexer.lex;
-var __defProp$7 = Object.defineProperty;
+var __defProp$8 = Object.defineProperty;
 var __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor;
 var __decorateClass$5 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(target, key2) : target;
@@ -48846,7 +48876,7 @@ var __decorateClass$5 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$7(target, key2, result);
+    __defProp$8(target, key2, result);
   return result;
 };
 var TurndownService = defaultImport(TurndownService$1);
@@ -49115,7 +49145,7 @@ MarkdownExtension = __decorateClass$5([
     staticKeys: ["htmlToMarkdown", "markdownToHtml", "htmlSanitizer"]
   })
 ], MarkdownExtension);
-var __defProp$6 = Object.defineProperty;
+var __defProp$7 = Object.defineProperty;
 var __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor;
 var __decorateClass$4 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key2) : target;
@@ -49123,7 +49153,7 @@ var __decorateClass$4 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$6(target, key2, result);
+    __defProp$7(target, key2, result);
   return result;
 };
 var insertParagraphOptions = {
@@ -49201,7 +49231,7 @@ ParagraphExtension = __decorateClass$4([
     defaultPriority: ExtensionPriority.Medium
   })
 ], ParagraphExtension);
-var __defProp$5 = Object.defineProperty;
+var __defProp$6 = Object.defineProperty;
 var __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor;
 var __decorateClass$3 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key2) : target;
@@ -49209,7 +49239,7 @@ var __decorateClass$3 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$5(target, key2, result);
+    __defProp$6(target, key2, result);
   return result;
 };
 var PlaceholderExtension = class extends PlainExtension {
@@ -49276,7 +49306,7 @@ function createDecorationSet(props) {
   });
   return DecorationSet.create(state.doc, decorations);
 }
-var __defProp$4 = Object.defineProperty;
+var __defProp$5 = Object.defineProperty;
 var __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor;
 var __decorateClass$2 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(target, key2) : target;
@@ -49284,7 +49314,7 @@ var __decorateClass$2 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$4(target, key2, result);
+    __defProp$5(target, key2, result);
   return result;
 };
 var TextExtension = class extends NodeExtension {
@@ -49342,7 +49372,7 @@ function corePreset(options = {}) {
   }
   return coreExtensions;
 }
-var __defProp$3 = Object.defineProperty;
+var __defProp$4 = Object.defineProperty;
 var __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor;
 var __decorateClass$1 = (decorators, target, key2, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key2) : target;
@@ -49350,7 +49380,7 @@ var __decorateClass$1 = (decorators, target, key2, kind) => {
     if (decorator = decorators[i])
       result = (kind ? decorator(target, key2, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$3(target, key2, result);
+    __defProp$4(target, key2, result);
   return result;
 };
 var __accessCheck$1 = (obj, member, msg2) => {
@@ -49789,6 +49819,22 @@ ReactComponentExtension = __decorateClass$1([
     staticKeys: ["defaultBlockNode", "defaultInlineNode", "defaultContentNode", "defaultEnvironment"]
   })
 ], ReactComponentExtension);
+var __defProp$3 = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$2 = (obj, key2, value) => key2 in obj ? __defProp$3(obj, key2, { enumerable: true, configurable: true, writable: true, value }) : obj[key2] = value;
+var __spreadValues = (a2, b2) => {
+  for (var prop in b2 || (b2 = {}))
+    if (__hasOwnProp$1.call(b2, prop))
+      __defNormalProp$2(a2, prop, b2[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b2)) {
+      if (__propIsEnum.call(b2, prop))
+        __defNormalProp$2(a2, prop, b2[prop]);
+    }
+  return a2;
+};
 function createContextHook(useHook) {
   const DefaultContext2 = createContext(null);
   const useHookContext = contextHookFactory(DefaultContext2);
@@ -49836,29 +49882,29 @@ function createContextState(creator, hook) {
     const contextRef = useRef(null);
     const setContextRef = useRef();
     const state = void 0;
-    const [context2, setContext] = useState(() => {
-      return creator({
+    const [context2, setContext] = useState(
+      () => creator({
         get: createGet(contextRef),
         set: createSet(setContextRef),
         previousContext: void 0,
         props,
         state
-      });
-    });
+      })
+    );
     const dependencies = [...Object.values(props), state];
     useEffect(() => {
       if (dependencies.length === 0) {
         return;
       }
-      setContext((previousContext) => {
-        return creator({
+      setContext(
+        (previousContext) => creator({
           get: createGet(contextRef),
           set: createSet(setContextRef),
           previousContext,
           props,
           state
-        });
-      });
+        })
+      );
     }, dependencies);
     contextRef.current = context2;
     setContextRef.current = setContext;
@@ -49890,10 +49936,7 @@ function createSet(ref2) {
         "`set` called outside of function scope. `set` can only be called within a function."
       );
     }
-    ref2.current((context2) => ({
-      ...context2,
-      ...typeof partial === "function" ? partial(context2) : partial
-    }));
+    ref2.current((context2) => __spreadValues(__spreadValues({}, context2), typeof partial === "function" ? partial(context2) : partial));
   };
 }
 var dist = {};
@@ -52454,16 +52497,20 @@ const RichTextToolbar = ({
     toolbarComponent
   ] });
 };
-const inputInTable$4 = "_inputInTable_ta5ga_1";
-const inputHover$4 = "_inputHover_ta5ga_13";
-const inputFocus$4 = "_inputFocus_ta5ga_18";
-const inputError$4 = "_inputError_ta5ga_25";
-const inputWarning$4 = "_inputWarning_ta5ga_26";
-const inputDisabled$4 = "_inputDisabled_ta5ga_61";
-const hideScrollbars$4 = "_hideScrollbars_ta5ga_67";
-const richTextInput = "_richTextInput_ta5ga_77";
+const inputInTable$4 = "_inputInTable_19adc_1";
+const error$4 = "_error_19adc_7";
+const warning$6 = "_warning_19adc_7";
+const inputHover$4 = "_inputHover_19adc_13";
+const inputFocus$4 = "_inputFocus_19adc_18";
+const inputError$4 = "_inputError_19adc_25";
+const inputWarning$4 = "_inputWarning_19adc_26";
+const inputDisabled$4 = "_inputDisabled_19adc_61";
+const hideScrollbars$4 = "_hideScrollbars_19adc_67";
+const richTextInput = "_richTextInput_19adc_77";
 const styles$f = {
   inputInTable: inputInTable$4,
+  error: error$4,
+  warning: warning$6,
   inputHover: inputHover$4,
   inputFocus: inputFocus$4,
   inputError: inputError$4,
@@ -52632,26 +52679,30 @@ var reactFastCompare = function isEqual3(a2, b2) {
   }
 };
 const isEqual$1 = /* @__PURE__ */ getDefaultExportFromCjs(reactFastCompare);
-const inputInTable$3 = "_inputInTable_1ube5_1";
-const inputHover$3 = "_inputHover_1ube5_13";
-const inputFocus$3 = "_inputFocus_1ube5_18";
-const inputError$3 = "_inputError_1ube5_25";
-const inputWarning$3 = "_inputWarning_1ube5_26";
-const inputDisabled$3 = "_inputDisabled_1ube5_61";
-const hideScrollbars$3 = "_hideScrollbars_1ube5_67";
-const sidebar = "_sidebar_1ube5_82";
-const inner = "_inner_1ube5_93";
-const title$2 = "_title_1ube5_103";
-const subtitle = "_subtitle_1ube5_104";
-const label$2 = "_label_1ube5_105";
-const collapsed = "_collapsed_1ube5_109";
-const list = "_list_1ube5_134";
-const item$2 = "_item_1ube5_140";
-const experimental = "_experimental_1ube5_155";
-const active$2 = "_active_1ube5_159";
-const icon$1 = "_icon_1ube5_163";
+const inputInTable$3 = "_inputInTable_16jgo_1";
+const error$3 = "_error_16jgo_7";
+const warning$5 = "_warning_16jgo_7";
+const inputHover$3 = "_inputHover_16jgo_13";
+const inputFocus$3 = "_inputFocus_16jgo_18";
+const inputError$3 = "_inputError_16jgo_25";
+const inputWarning$3 = "_inputWarning_16jgo_26";
+const inputDisabled$3 = "_inputDisabled_16jgo_61";
+const hideScrollbars$3 = "_hideScrollbars_16jgo_67";
+const sidebar = "_sidebar_16jgo_82";
+const inner = "_inner_16jgo_93";
+const title$2 = "_title_16jgo_103";
+const subtitle = "_subtitle_16jgo_104";
+const label$2 = "_label_16jgo_105";
+const collapsed = "_collapsed_16jgo_109";
+const list = "_list_16jgo_134";
+const item$2 = "_item_16jgo_140";
+const experimental = "_experimental_16jgo_155";
+const active$2 = "_active_16jgo_159";
+const icon$1 = "_icon_16jgo_163";
 const styles$d = {
   inputInTable: inputInTable$3,
+  error: error$3,
+  warning: warning$5,
   inputHover: inputHover$3,
   inputFocus: inputFocus$3,
   inputError: inputError$3,
@@ -52863,7 +52914,7 @@ var preWarningFns = [];
 var preMessage = function preMessage2(fn) {
   preWarningFns.push(fn);
 };
-function warning$3(valid, message2) {
+function warning$4(valid, message2) {
   if (process.env.NODE_ENV !== "production" && !valid && console !== void 0) {
     var finalMessage = preWarningFns.reduce(function(msg2, preMessageFn) {
       return preMessageFn(msg2 !== null && msg2 !== void 0 ? msg2 : "", "warning");
@@ -52893,7 +52944,7 @@ function call(method, valid, message2) {
   }
 }
 function warningOnce(valid, message2) {
-  call(warning$3, valid, message2);
+  call(warning$4, valid, message2);
 }
 function noteOnce(valid, message2) {
   call(note, valid, message2);
@@ -55236,16 +55287,18 @@ const Slider = ({
     width: "100px",
     height: "400px"
   },
-  onChange
+  onChange = noop$3
 }) => {
   const disabledContext = useContext(DisabledContext);
   const formattedMarks = memoizedFormatMarkers(marks);
   const onChangeValue = (value2) => {
+    const eventLabel = typeof label2 === "string" ? label2 : String(label2);
+    const eventName = name2 ?? "";
     onChange({
       target: {
-        name: name2,
+        name: eventName,
         value: value2,
-        label: label2
+        label: eventLabel
       }
     });
   };
@@ -55286,7 +55339,7 @@ const Slider = ({
         styles$c.container,
         small2 ? styles$c.small : "",
         vertical2.enabled ? styles$c.vertical : "",
-        !_$1.isEmpty(marks) ? styles$c.hasMarks : ""
+        !isEmpty(marks) ? styles$c.hasMarks : ""
       ),
       style: vertical2.enabled ? { width: vertical2.width, height: vertical2.height } : { width: width2 },
       children: [
@@ -55333,20 +55386,24 @@ const Spacer = ({
     }
   }
 );
-const inputInTable$2 = "_inputInTable_y9car_1";
-const inputHover$2 = "_inputHover_y9car_13";
-const inputFocus$2 = "_inputFocus_y9car_18";
-const inputError$2 = "_inputError_y9car_25";
-const inputWarning$2 = "_inputWarning_y9car_26";
-const inputDisabled$2 = "_inputDisabled_y9car_61";
-const hideScrollbars$2 = "_hideScrollbars_y9car_67";
-const wrapper = "_wrapper_y9car_85";
-const bordered = "_bordered_y9car_93";
-const scroll2 = "_scroll_y9car_98";
-const table = "_table_y9car_108";
-const striped = "_striped_y9car_188";
+const inputInTable$2 = "_inputInTable_k0mvt_1";
+const error$2 = "_error_k0mvt_7";
+const warning$3 = "_warning_k0mvt_7";
+const inputHover$2 = "_inputHover_k0mvt_13";
+const inputFocus$2 = "_inputFocus_k0mvt_18";
+const inputError$2 = "_inputError_k0mvt_25";
+const inputWarning$2 = "_inputWarning_k0mvt_26";
+const inputDisabled$2 = "_inputDisabled_k0mvt_61";
+const hideScrollbars$2 = "_hideScrollbars_k0mvt_67";
+const wrapper = "_wrapper_k0mvt_85";
+const bordered = "_bordered_k0mvt_93";
+const scroll2 = "_scroll_k0mvt_98";
+const table = "_table_k0mvt_108";
+const striped = "_striped_k0mvt_188";
 const styles$b = {
   inputInTable: inputInTable$2,
+  error: error$2,
+  warning: warning$3,
   inputHover: inputHover$2,
   inputFocus: inputFocus$2,
   inputError: inputError$2,
@@ -55544,37 +55601,39 @@ const getHeaderAlignment = (alignments, isHeader = false, rowIndex = 0) => {
     return [];
   }
 };
-const inputInTable$1 = "_inputInTable_u3xdj_1";
-const inputHover$1 = "_inputHover_u3xdj_13";
-const inputFocus$1 = "_inputFocus_u3xdj_18";
-const inputError$1 = "_inputError_u3xdj_25";
-const inputWarning$1 = "_inputWarning_u3xdj_26";
-const inputDisabled$1 = "_inputDisabled_u3xdj_61";
-const hideScrollbars$1 = "_hideScrollbars_u3xdj_67";
-const cell = "_cell_u3xdj_77";
-const disabledLink = "_disabledLink_u3xdj_87";
-const inputWrapper$1 = "_inputWrapper_u3xdj_91";
-const breakWord = "_breakWord_u3xdj_106";
-const inputCell = "_inputCell_u3xdj_109";
-const sliderCell = "_sliderCell_u3xdj_112";
-const staticCell = "_staticCell_u3xdj_116";
-const staticCellContent = "_staticCellContent_u3xdj_119";
-const error$1 = "_error_u3xdj_131";
-const warning$2 = "_warning_u3xdj_132";
-const unit = "_unit_u3xdj_141";
-const sortingCell = "_sortingCell_u3xdj_144";
-const sortingCellIcon = "_sortingCellIcon_u3xdj_155";
-const icon = "_icon_u3xdj_166";
-const checkBoxCell = "_checkBoxCell_u3xdj_170";
-const iconCellWrapper = "_iconCellWrapper_u3xdj_174";
-const actionsCell = "_actionsCell_u3xdj_178";
-const rightAligned = "_rightAligned_u3xdj_186";
-const centerAligned = "_centerAligned_u3xdj_192";
-const leftAligned = "_leftAligned_u3xdj_198";
-const popover = "_popover_u3xdj_201";
-const disabledPointerEvents = "_disabledPointerEvents_u3xdj_204";
+const inputInTable$1 = "_inputInTable_1rtjr_1";
+const error$1 = "_error_1rtjr_7";
+const warning$2 = "_warning_1rtjr_7";
+const inputHover$1 = "_inputHover_1rtjr_13";
+const inputFocus$1 = "_inputFocus_1rtjr_18";
+const inputError$1 = "_inputError_1rtjr_25";
+const inputWarning$1 = "_inputWarning_1rtjr_26";
+const inputDisabled$1 = "_inputDisabled_1rtjr_61";
+const hideScrollbars$1 = "_hideScrollbars_1rtjr_67";
+const cell = "_cell_1rtjr_77";
+const disabledLink = "_disabledLink_1rtjr_87";
+const inputWrapper$1 = "_inputWrapper_1rtjr_91";
+const breakWord = "_breakWord_1rtjr_106";
+const inputCell = "_inputCell_1rtjr_109";
+const sliderCell = "_sliderCell_1rtjr_112";
+const staticCell = "_staticCell_1rtjr_116";
+const staticCellContent = "_staticCellContent_1rtjr_119";
+const unit = "_unit_1rtjr_141";
+const sortingCell = "_sortingCell_1rtjr_144";
+const sortingCellIcon = "_sortingCellIcon_1rtjr_155";
+const icon = "_icon_1rtjr_166";
+const checkBoxCell = "_checkBoxCell_1rtjr_170";
+const iconCellWrapper = "_iconCellWrapper_1rtjr_174";
+const actionsCell = "_actionsCell_1rtjr_178";
+const rightAligned = "_rightAligned_1rtjr_186";
+const centerAligned = "_centerAligned_1rtjr_192";
+const leftAligned = "_leftAligned_1rtjr_198";
+const popover = "_popover_1rtjr_201";
+const disabledPointerEvents = "_disabledPointerEvents_1rtjr_204";
 const styles$7 = {
   inputInTable: inputInTable$1,
+  error: error$1,
+  warning: warning$2,
   inputHover: inputHover$1,
   inputFocus: inputFocus$1,
   inputError: inputError$1,
@@ -55589,8 +55648,6 @@ const styles$7 = {
   sliderCell,
   staticCell,
   staticCellContent,
-  error: error$1,
-  warning: warning$2,
   unit,
   sortingCell,
   sortingCellIcon,
@@ -55639,12 +55696,6 @@ const InputCell = ({
     }
   );
 };
-const COSMETIC_ROUNDING_DEFAULT_PRECISION = 14;
-const roundNumberCosmetic = (value) => {
-  const isScientific = isScientificStringNum(value);
-  return !isScientific ? roundToPrecision(value, COSMETIC_ROUNDING_DEFAULT_PRECISION) : value;
-};
-const safeToString = (value) => String(toString$1(value));
 const getStringName$1 = (name2) => {
   if (!name2) return "";
   if (typeof name2 === "string") {
@@ -55678,65 +55729,68 @@ const NumberInput = ({
   allowEmpty = false,
   isInTable: isInTable2,
   groupOrder,
-  enableCosmeticRounding = true,
   enableDisplayRounding = false,
   roundDisplayValue,
   disableInternalErrorValidationMessages = false
 }) => {
   const inputRef = useRef(null);
-  const [displayValue, setDisplayValue] = useState(safeToString(value));
+  const [displayValue, setDisplayValue] = useState(value);
+  const [validationError, setValidationError] = useState(null);
   const [focus2, setFocus] = useState(false);
-  const [pristine, setPristine] = useState(true);
   const stringName = getStringName$1(name2);
   const validateInputValue = (value2) => {
-    const validation = validateNumber(value2);
+    let validation = validateNumber(value2);
     if (allowEmpty && value2 === "" || validation.valid) {
       return { ...validation, valid: true, errors: void 0 };
     } else {
       return validation;
     }
   };
-  const { valid, errors: errors2 } = validateInputValue(displayValue);
-  const firstError = errors2 && errors2.length && !disableInternalErrorValidationMessages ? errors2[0] : null;
-  useEffect(() => {
-    setDisplayValue(safeToString(value));
-    setPristine(true);
-  }, [value, enableCosmeticRounding, enableDisplayRounding]);
   useEffect(() => {
-    if (!focus2 && !valid) {
-      validationCallback(stringName, firstError);
-    } else {
+    const { valid, errors: errors2 } = validateInputValue(value);
+    setDisplayValue(value);
+    if (valid) {
+      setValidationError(null);
       validationCallback(stringName, null);
+    } else {
+      const firstError = errors2 && errors2.length ? errors2[0] : null;
+      setValidationError(firstError);
+      validationCallback(stringName, firstError);
     }
-  }, [focus2, valid, error2]);
-  const onChangeValue = (evt) => {
-    if (valid && !pristine) {
-      const event = {
+  }, [value, error2]);
+  const onSetValue = (evt) => {
+    const input2 = evt.target;
+    const { value: value2 } = input2;
+    const inputValue = cleanNumStr(
+      value2.replaceAll(" ", "").replaceAll("|", "")
+    );
+    const { valid, errors: errors2 } = validateInputValue(inputValue);
+    if (valid) {
+      const newEvent = {
         ...evt,
         target: {
           ...evt.target,
-          value: stripLeadingZeros(safeToString(displayValue)),
+          value: inputValue,
           name: stringName
         }
       };
-      onChange(event);
+      onChange(newEvent);
+      setDisplayValue(inputValue);
+      setValidationError(null);
+      validationCallback(stringName, null);
+    } else {
+      setDisplayValue(inputValue);
+      const firstError = errors2 && errors2.length ? errors2[0] : null;
+      setValidationError(firstError);
+      validationCallback(stringName, firstError);
     }
   };
-  const onSetValue = (evt) => {
-    const input2 = evt.target;
-    const { value: value2 } = input2;
-    const inputValue = cleanNumStr(
-      value2.replaceAll(" ", "").replaceAll("|", "")
-    );
-    setDisplayValue(inputValue);
-    setPristine(false);
-  };
   useEffect(() => {
     if (inputRef && (inputRef == null ? void 0 : inputRef.current) && enableDisplayRounding && focus2) {
       const textInput = inputRef.current;
       if (textInput) {
         setTimeout(() => {
-          const { length: length2 } = safeToString(displayValue);
+          const { length: length2 } = String(displayValue);
           textInput.setSelectionRange(length2, length2);
         }, 0);
       }
@@ -55748,48 +55802,33 @@ const NumberInput = ({
   };
   const onInputBlur = (evt) => {
     setFocus(false);
-    onChangeValue(evt);
     onBlur(evt);
   };
-  const shouldDisplayRound = enableDisplayRounding && !focus2 && valid;
-  const valueWithDisplayRounding = shouldDisplayRound ? roundDisplayValue ? safeToString(roundDisplayValue(displayValue)) : roundToFixed(displayValue, 2) : displayValue;
-  const displayValueEndsWithZero = !!(valueWithDisplayRounding == null ? void 0 : valueWithDisplayRounding.endsWith("0"));
-  const shouldCosmeticallyRound = enableCosmeticRounding && // only when prop is enabled
-  valueWithDisplayRounding && // not when empty typed value
-  !displayValueEndsWithZero && // not when intentionally trying to type trailing zeros as interim values (OW-17109)
-  valid;
-  const valueWithCosmeticRounding = shouldCosmeticallyRound ? roundNumberCosmetic(valueWithDisplayRounding) : valueWithDisplayRounding;
+  const roundedDisplayValue = !focus2 && enableDisplayRounding ? roundDisplayValue ? roundDisplayValue(displayValue) : roundToFixed(displayValue, 2) : displayValue;
   return /* @__PURE__ */ jsx(
-    KeyboardEventHandler,
+    Input$1,
     {
-      handleKeys: [EventKey.ENTER],
-      onKeyEvent: (_key, evt) => onChangeValue(evt),
-      children: /* @__PURE__ */ jsx(
-        Input$1,
-        {
-          type: "text",
-          name: stringName,
-          testId,
-          disabled: disabled2,
-          placeholder: placeholder3,
-          value: valueWithCosmeticRounding,
-          onChange: onSetValue,
-          onFocus: onInputFocus,
-          onBlur: onInputBlur,
-          error: !focus2 && (firstError || error2),
-          warning: warning2,
-          right: !left2,
-          small: small2,
-          width: width2,
-          isInTable: isInTable2,
-          groupOrder,
-          tabIndex,
-          tooltip: tooltip2,
-          ref: inputRef
-        },
-        stringName
-      )
-    }
+      type: "text",
+      name: stringName,
+      testId,
+      disabled: disabled2,
+      placeholder: placeholder3,
+      value: roundedDisplayValue,
+      onChange: onSetValue,
+      onFocus: onInputFocus,
+      onBlur: onInputBlur,
+      error: error2 || validationError,
+      warning: warning2,
+      right: !left2,
+      small: small2,
+      width: width2,
+      isInTable: isInTable2,
+      groupOrder,
+      tabIndex,
+      tooltip: tooltip2,
+      ref: inputRef
+    },
+    stringName
   );
 };
 const NumberInputCell = ({ cell: cell2, testId }) => {
@@ -55815,7 +55854,6 @@ const NumberInputCell = ({ cell: cell2, testId }) => {
       tooltip: cell2.tooltip,
       validationCallback: cell2.validationCallback,
       allowEmpty: cell2.allowEmpty,
-      enableCosmeticRounding: cell2.enableCosmeticRounding,
       enableDisplayRounding: cell2.enableDisplayRounding,
       roundDisplayValue: cell2.roundDisplayValue
     }
@@ -56584,8 +56622,7 @@ const Tabs = ({
   options: rawOptions = null,
   children = null,
   value: rawValue = void 0,
-  onChange = () => {
-  },
+  onChange = noop$3,
   padding: padding2 = false,
   margin: margin2 = true,
   contentPadding: contentPadding2 = true,
@@ -56621,6 +56658,18 @@ const Tabs = ({
   const selectedValue = isDeprecated || value === void 0 || value === null ? void 0 : simpleInputs ? value : value.value;
   const activeTabIndexBase = rawActiveTabIndex !== void 0 ? rawActiveTabIndex : tabs2 == null ? void 0 : tabs2.findIndex((t) => t.value === selectedValue);
   const activeTabIndex = activeTabIndexBase === -1 ? 0 : activeTabIndexBase;
+  const handleTabClick = (index2, tab2, event) => {
+    if (isDeprecated) {
+      const value2 = tab2.key || tab2.label || null;
+      onChangeTab(index2, value2);
+    } else {
+      const target = event.target;
+      target.name = name2;
+      target.value = tab2.value;
+      target.label = tab2.label;
+      onChange(event);
+    }
+  };
   const renderTab = (tab2, index2) => {
     const {
       label: label2,
@@ -56644,16 +56693,7 @@ const Tabs = ({
         badge: badge2,
         right: right2,
         active: isDeprecated ? index2 === activeTabIndex : value2 === selectedValue,
-        onClick: isDeprecated ? () => {
-          const value3 = tab2.key || label2 || null;
-          onChangeTab(index2, value3);
-        } : (evt) => {
-          const target = evt.target;
-          target.name = name2;
-          target.value = tab2.value;
-          target.label = label2;
-          onChange(evt);
-        },
+        onClick: (event) => handleTabClick(index2, tab2, event),
         testId: testId2
       },
       index2
@@ -56705,20 +56745,22 @@ const TextLink = ({
     }
   );
 };
-const inputInTable = "_inputInTable_66zck_1";
-const inputHover = "_inputHover_66zck_13";
-const inputFocus = "_inputFocus_66zck_18";
-const inputError = "_inputError_66zck_25";
-const inputWarning = "_inputWarning_66zck_26";
-const inputDisabled = "_inputDisabled_66zck_61";
-const hideScrollbars = "_hideScrollbars_66zck_67";
-const textarea = "_textarea_66zck_77";
-const small$1 = "_small_66zck_116";
-const error = "_error_66zck_121";
-const warning$1 = "_warning_66zck_138";
-const monospace = "_monospace_66zck_155";
+const inputInTable = "_inputInTable_9svgh_1";
+const error = "_error_9svgh_7";
+const warning$1 = "_warning_9svgh_7";
+const inputHover = "_inputHover_9svgh_13";
+const inputFocus = "_inputFocus_9svgh_18";
+const inputError = "_inputError_9svgh_25";
+const inputWarning = "_inputWarning_9svgh_26";
+const inputDisabled = "_inputDisabled_9svgh_61";
+const hideScrollbars = "_hideScrollbars_9svgh_67";
+const textarea = "_textarea_9svgh_77";
+const small$1 = "_small_9svgh_116";
+const monospace = "_monospace_9svgh_155";
 const styles$5 = {
   inputInTable,
+  error,
+  warning: warning$1,
   inputHover,
   inputFocus,
   inputError,
@@ -56727,8 +56769,6 @@ const styles$5 = {
   hideScrollbars,
   textarea,
   small: small$1,
-  error,
-  warning: warning$1,
   monospace
 };
 const TextArea = ({
@@ -56738,14 +56778,10 @@ const TextArea = ({
   cols,
   rows,
   disabled: disabled2 = false,
-  onChange = () => {
-  },
-  onKeyPress = () => {
-  },
-  onFocus = () => {
-  },
-  onBlur = () => {
-  },
+  onChange = noop$3,
+  onKeyPress = noop$3,
+  onFocus = noop$3,
+  onBlur = noop$3,
   tabIndex = 0,
   error: error2 = null,
   warning: warning2 = null,
@@ -70232,14 +70268,10 @@ const UnitInput = ({
   unitkey = "",
   initUnit,
   noConversion = false,
-  onChange = () => {
-  },
-  onClick = () => {
-  },
-  onFocus = () => {
-  },
-  onSwitchUnit = () => {
-  },
+  onChange = noop$3,
+  onClick = noop$3,
+  onFocus = noop$3,
+  onSwitchUnit = noop$3,
   unitTemplate,
   doNotConvertValue = false,
   testId,
@@ -70251,10 +70283,7 @@ const UnitInput = ({
   validationCallback = () => ({ name: "", error: null }),
   disabledValidation = false,
   allowEmpty = false,
-  autoValue,
-  convertBackToStorageUnit = false,
-  enableCosmeticRounding = true,
-  enableDisplayRounding = false
+  autoValue
 }) => {
   const context2 = useUnitContext();
   const runAfterUpdate = useRunAfterUpdate();
@@ -70288,7 +70317,7 @@ const UnitInput = ({
     initialPredefinedOption ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM
   );
   const isAutoValue = propValue === "" && autoValue;
-  const disableInternalErrorValidationMessages = !!(disabledValidation || autoValue || placeholder3);
+  const disableInternalErrorValidationMessages = !!(disabledValidation || autoValue || placeholder3 && isEmptyNullOrUndefined(value));
   const foundPredefinedMenuOption = predefinedOptions && predefinedOptions.find((el2) => {
     if (!(el2 == null ? void 0 : el2.value)) return;
     if (selectedPredefinedOptionKey) {
@@ -70319,10 +70348,9 @@ const UnitInput = ({
     const input2 = evt.target;
     const { value: inputValue, selectionStart: currentCursorPosition } = input2;
     const newValue = withUnit(inputValue, (displayLayer == null ? void 0 : displayLayer.unit) || "");
-    const returnValue = convertBackToStorageUnit ? withUnit(convertAndGetValue(newValue, propUnit), propUnit) : newValue;
     onChange({
       target: {
-        value: returnValue,
+        value: newValue,
         name: stringName2
       }
     });
@@ -70483,8 +70511,6 @@ const UnitInput = ({
             left: left2,
             allowEmpty,
             validationCallback: (_name, error22) => validationCallback(stringName, error22),
-            enableCosmeticRounding,
-            enableDisplayRounding,
             groupOrder: predefinedOptions ? "middle" : "first",
             disableInternalErrorValidationMessages
           },
@@ -70504,7 +70530,7 @@ const UnitInput = ({
               sections: alternativeUnits.map(([value2, altUnit, label2]) => {
                 const displayUnit = label2 || altUnit || "";
                 const safeValue = !isNaN(Number(value2)) ? value2 : "";
-                const displayValue = enableCosmeticRounding ? roundNumberCosmetic(safeValue) : safeValue;
+                const displayValue = safeValue;
                 return {
                   type: "Option",
                   label: displayValue,
@@ -70575,12 +70601,22 @@ const convertVisibleRows = ({
         const storageUnit = storageUnits[unitKey];
         const unitChanged = selectedUnit !== storageUnit;
         const convertedValue = unitChanged ? convertAndGetValue(value, selectedUnit, storageUnit) : cell2.value;
-        const formattedDisplayValue = formatDisplayValue ? formatDisplayValue(convertedValue) : convertedValue;
+        const isScientific = isScientificStringNum(value);
+        const displayValue = enableCosmeticRounding && (unitChanged || !isScientific) ? (
+          /*
+           Optionally do Excel-style "cosmetic rounding" of display values (only if enableCosmeticRounding prop on)
+           This means rounding to slightly less precision than the underlying floating-point number type, to
+           resolve floating-point "rounding noise" associated with storing values in one unit but converting
+           and displaying them in another unit. This solution was evaluated by Tools Team in relation to
+           tickets OW-10614 and OW-15745.
+          */
+          roundToPrecision(convertedValue, 14)
+        ) : convertedValue;
+        const formattedDisplayValue = formatDisplayValue ? formatDisplayValue(displayValue) : displayValue;
         return {
           ...cell2,
           value: formattedDisplayValue,
-          enableCosmeticRounding: enableCosmeticRounding && unitChanged,
-          //todo: why did we need to check unitChanged here? (original rationale)
+          enableCosmeticRounding,
           enableDisplayRounding,
           roundDisplayValue,
           onChange: (evt) => {