@oliasoft-open-source/react-ui-library 4.8.0 → 4.9.0-beta-1

package/dist/index.js

@@ -16,7 +16,7 @@ import * as PropTypes from "prop-types";
 import PropTypes__default from "prop-types";
 import ReactDOM, { createPortal, unstable_batchedUpdates, render } from "react-dom";
 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";
+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";
 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;
@@ -199,27 +199,21 @@ function _objectWithoutPropertiesLoose$5(r2, e2) {
   }
   return t;
 }
-var _extends$6 = { exports: {} };
-var hasRequired_extends;
-function require_extends() {
-  if (hasRequired_extends) return _extends$6.exports;
-  hasRequired_extends = 1;
-  (function(module) {
-    function _extends3() {
-      return module.exports = _extends3 = Object.assign ? Object.assign.bind() : function(n2) {
-        for (var e2 = 1; e2 < arguments.length; e2++) {
-          var t = arguments[e2];
-          for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n2[r2] = t[r2]);
-        }
-        return n2;
-      }, module.exports.__esModule = true, module.exports["default"] = module.exports, _extends3.apply(null, arguments);
+function _extends$4() {
+  return _extends$4 = Object.assign ? Object.assign.bind() : function(n2) {
+    for (var e2 = 1; e2 < arguments.length; e2++) {
+      var t = arguments[e2];
+      for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n2[r2] = t[r2]);
     }
-    module.exports = _extends3, module.exports.__esModule = true, module.exports["default"] = module.exports;
-  })(_extends$6);
-  return _extends$6.exports;
+    return n2;
+  }, _extends$4.apply(null, arguments);
 }
-var _extendsExports = require_extends();
-const _extends$5 = /* @__PURE__ */ getDefaultExportFromCjs(_extendsExports);
+const _extends$5 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  get default() {
+    return _extends$4;
+  }
+}, Symbol.toStringTag, { value: "Module" }));
 function _setPrototypeOf$3(t, e2) {
   return _setPrototypeOf$3 = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t2, e3) {
     return t2.__proto__ = e3, t2;
@@ -798,7 +792,7 @@ var ReactSVG = /* @__PURE__ */ function(_React$Component) {
   };
   _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
     var _this3 = this;
-    if (shallowDiffers(_extends$5({}, prevProps), this.props)) {
+    if (shallowDiffers(_extends$4({}, prevProps), this.props)) {
       this.setState(function() {
         return _this3.initialState;
       }, function() {
@@ -826,7 +820,7 @@ var ReactSVG = /* @__PURE__ */ function(_React$Component) {
     _this$props2.useRequestCache;
     var wrapper2 = _this$props2.wrapper, rest = _objectWithoutPropertiesLoose$5(_this$props2, _excluded$b);
     var Wrapper2 = wrapper2;
-    return /* @__PURE__ */ React$4.createElement(Wrapper2, _extends$5({}, rest, {
+    return /* @__PURE__ */ React$4.createElement(Wrapper2, _extends$4({}, rest, {
       ref: this.refCallback
     }, wrapper2 === "svg" ? {
       xmlns: svgNamespace,
@@ -2241,8 +2235,8 @@ function _createClass(Constructor, protoProps, staticProps) {
   if (protoProps) _defineProperties(Constructor.prototype, protoProps);
   return Constructor;
 }
-function _extends$4() {
-  _extends$4 = Object.assign || function(target) {
+function _extends$3() {
+  _extends$3 = Object.assign || function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key2 in source) {
@@ -2253,7 +2247,7 @@ function _extends$4() {
     }
     return target;
   };
-  return _extends$4.apply(this, arguments);
+  return _extends$3.apply(this, arguments);
 }
 function _inheritsLoose$2(subClass, superClass) {
   subClass.prototype = Object.create(superClass.prototype);
@@ -2577,7 +2571,7 @@ function useTrackElements(_ref) {
   var layerRef = useTrackRef(useCallback$1(function(layer2) {
     var _get3 = get4(), previousLayer = _get3.layer;
     set2(function(state) {
-      return _extends$4({}, state, {
+      return _extends$3({}, state, {
         layer: layer2
       });
     });
@@ -2600,7 +2594,7 @@ function useTrackElements(_ref) {
     var scrollContainers = getScrollContainers(trigger2);
     var _get4 = get4(), previousTrigger = _get4.trigger;
     set2(function(state) {
-      return _extends$4({}, state, {
+      return _extends$3({}, state, {
         trigger: trigger2,
         scrollContainers
       });
@@ -2613,7 +2607,7 @@ function useTrackElements(_ref) {
       return;
     }
     set2(function(state) {
-      return _extends$4({}, state, {
+      return _extends$3({}, state, {
         scrollContainers: getScrollContainers(triggerOptionParent)
       });
     });
@@ -2780,7 +2774,7 @@ var BoundSide = {
   left: /* @__PURE__ */ createSide("left"),
   right: /* @__PURE__ */ createSide("right")
 };
-var Side = /* @__PURE__ */ _extends$4({}, BoundSide, {
+var Side = /* @__PURE__ */ _extends$3({}, BoundSide, {
   center: /* @__PURE__ */ createSide("center")
 });
 var SIDES = ["top", "left", "bottom", "right"];
@@ -2876,7 +2870,7 @@ var Bounds = /* @__PURE__ */ function() {
       var _environment$getCompu = environment2.getComputedStyle(element), width2 = _environment$getCompu.width, height2 = _environment$getCompu.height, boxSizing = _environment$getCompu.boxSizing, borderLeft = _environment$getCompu.borderLeft, borderRight = _environment$getCompu.borderRight, borderTop = _environment$getCompu.borderTop, borderBottom = _environment$getCompu.borderBottom, paddingLeft = _environment$getCompu.paddingLeft, paddingRight = _environment$getCompu.paddingRight, paddingTop = _environment$getCompu.paddingTop, paddingBottom = _environment$getCompu.paddingBottom;
       var boxWidth = boxSizing === "border-box" ? getPixelValue(width2) : sumOfPropertyValues(width2, borderLeft, borderRight, paddingLeft, paddingRight);
       var boxHeight = boxSizing === "border-box" ? getPixelValue(height2) : sumOfPropertyValues(height2, borderTop, borderBottom, paddingTop, paddingBottom);
-      bounds = new Bounds2(_extends$4({}, bounds, {
+      bounds = new Bounds2(_extends$3({}, bounds, {
         width: boxWidth,
         height: boxHeight
       }));
@@ -2923,7 +2917,7 @@ var Bounds = /* @__PURE__ */ function() {
   };
   _proto.merge = function merge(partialBoundsOrMergeFn) {
     var current = this.toObject();
-    return new Bounds2(_extends$4({}, current, typeof partialBoundsOrMergeFn === "function" ? partialBoundsOrMergeFn(current) : partialBoundsOrMergeFn));
+    return new Bounds2(_extends$3({}, current, typeof partialBoundsOrMergeFn === "function" ? partialBoundsOrMergeFn(current) : partialBoundsOrMergeFn));
   };
   _proto.substract = function substract(bounds) {
     var result = this.toObject();
@@ -2990,7 +2984,7 @@ var Placement = /* @__PURE__ */ function() {
       typeof layerDimensions === "function" ? layerDimensions(this.primary.prop) : layerDimensions
     );
     this.subjectsBounds = subjectBounds.merge({
-      layer: _extends$4({}, subjectBounds.layer, dimensions)
+      layer: _extends$3({}, subjectBounds.layer, dimensions)
     });
   };
   _proto.getLayerBounds = function getLayerBounds(secondaryOffset) {
@@ -3165,7 +3159,7 @@ function getArrowStyle(subjectsBounds, placement, arrowOffset) {
   var primarySide = placement.primary.prop;
   var secondarySide = placement.primary.oppositeCssProp;
   var secondaryValue = triggerIsBigger ? layer2[sizeProperty] / 2 + negativeOffset : trigger2[secondarySide] + trigger2[sizeProperty] / 2 - layer2[secondarySide];
-  return _extends$4({}, STYLE_BASE, (_extends22 = {}, _extends22[primarySide] = "100%", _extends22[secondarySide] = limit(secondaryValue, min, max), _extends22));
+  return _extends$3({}, STYLE_BASE, (_extends22 = {}, _extends22[primarySide] = "100%", _extends22[secondarySide] = limit(secondaryValue, min, max), _extends22));
 }
 var Placements = /* @__PURE__ */ function() {
   function Placements2(placements, config2, subjectsBounds) {
@@ -3294,11 +3288,11 @@ var Placements = /* @__PURE__ */ function() {
     var arrow2 = getArrowStyle(this.subjectsBounds.merge({
       layer: layerBounds
     }), placement, this.config.arrowOffset);
-    var layer2 = this.config.overflowContainer ? _extends$4({}, layerStyleBase, {
+    var layer2 = this.config.overflowContainer ? _extends$3({}, layerStyleBase, {
       position: "fixed",
       top: layerBounds.top,
       left: layerBounds.left
-    }) : _extends$4({}, layerStyleBase, {
+    }) : _extends$3({}, layerStyleBase, {
       position: "absolute",
       top: layerBounds.top - this.subjectsBounds.parent.top + scrollOffsets.top - borderOffsets.top,
       left: layerBounds.left - this.subjectsBounds.parent.left + scrollOffsets.left - borderOffsets.left
@@ -3373,7 +3367,7 @@ var SubjectsBounds = /* @__PURE__ */ function() {
   };
   var _proto = SubjectsBounds2.prototype;
   _proto.merge = function merge(subjectsBounds) {
-    return new SubjectsBounds2(_extends$4({}, this, subjectsBounds), this.overflowContainer);
+    return new SubjectsBounds2(_extends$3({}, this, subjectsBounds), this.overflowContainer);
   };
   _proto.offsetsToScrollContainers = function offsetsToScrollContainers(subject, allContainers) {
     if (allContainers === void 0) {
@@ -3608,10 +3602,10 @@ var Arrow = /* @__PURE__ */ forwardRef(function Arrow2(_ref2, ref2) {
   var sizeA = size2;
   var sizeB = getWidthBasedOnAngle(angle, size2) * 2;
   var maxSize = Math.max(sizeA, sizeB);
-  return createElement("svg", _extends$4({
+  return createElement("svg", _extends$3({
     ref: ref2
   }, rest, {
-    style: _extends$4({}, style2, {
+    style: _extends$3({}, style2, {
       transform: "translate" + (side.isHorizontal ? "Y" : "X") + "(-50%)"
     }),
     width: maxSize,
@@ -8261,8 +8255,8 @@ function _interopRequireWildcard$2(obj, nodeInterop) {
   }
   return newObj;
 }
-function _extends$3() {
-  _extends$3 = Object.assign ? Object.assign.bind() : function(target) {
+function _extends$2() {
+  _extends$2 = Object.assign ? Object.assign.bind() : function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key2 in source) {
@@ -8273,7 +8267,7 @@ function _extends$3() {
     }
     return target;
   };
-  return _extends$3.apply(this, arguments);
+  return _extends$2.apply(this, arguments);
 }
 function _objectWithoutPropertiesLoose$3(source, excluded) {
   if (source == null) return {};
@@ -8478,7 +8472,7 @@ var Resizable$1 = /* @__PURE__ */ function(_React$Component) {
       children: [].concat(children.props.children, resizeHandles.map(function(handleAxis) {
         var _this3$handleRefs$han;
         var ref2 = (_this3$handleRefs$han = _this3.handleRefs[handleAxis]) != null ? _this3$handleRefs$han : _this3.handleRefs[handleAxis] = /* @__PURE__ */ React$2.createRef();
-        return /* @__PURE__ */ React$2.createElement(_reactDraggable.DraggableCore, _extends$3({}, draggableOpts, {
+        return /* @__PURE__ */ React$2.createElement(_reactDraggable.DraggableCore, _extends$2({}, draggableOpts, {
           nodeRef: ref2,
           key: "resizableHandle-" + handleAxis,
           onStop: _this3.resizeHandler("onResizeStop", handleAxis),
@@ -8549,8 +8543,8 @@ function _interopRequireWildcard$1(obj, nodeInterop) {
   }
   return newObj;
 }
-function _extends$2() {
-  _extends$2 = Object.assign ? Object.assign.bind() : function(target) {
+function _extends$1() {
+  _extends$1 = Object.assign ? Object.assign.bind() : function(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
       for (var key2 in source) {
@@ -8561,7 +8555,7 @@ function _extends$2() {
     }
     return target;
   };
-  return _extends$2.apply(this, arguments);
+  return _extends$1.apply(this, arguments);
 }
 function ownKeys$1(object2, enumerableOnly) {
   var keys2 = Object.keys(object2);
@@ -8692,7 +8686,7 @@ var ResizableBox = /* @__PURE__ */ function(_React$Component) {
       resizeHandles,
       transformScale,
       width: this.state.width
-    }, /* @__PURE__ */ React$1.createElement("div", _extends$2({}, props, {
+    }, /* @__PURE__ */ React$1.createElement("div", _extends$1({}, props, {
       style: _objectSpread$5(_objectSpread$5({}, style2), {}, {
         width: this.state.width + "px",
         height: this.state.height + "px"
@@ -9488,15 +9482,6 @@ const InputGroupAddon = ({
   })();
   return /* @__PURE__ */ jsx("span", { className: cx$2(styles$u.addon, order2, small2 ? styles$u.small : ""), children });
 };
-function _extends$1() {
-  return _extends$1 = Object.assign ? Object.assign.bind() : function(n2) {
-    for (var e2 = 1; e2 < arguments.length; e2++) {
-      var t = arguments[e2];
-      for (var r2 in t) ({}).hasOwnProperty.call(t, r2) && (n2[r2] = t[r2]);
-    }
-    return n2;
-  }, _extends$1.apply(null, arguments);
-}
 function _typeof$2(o) {
   "@babel/helpers - typeof";
   return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o2) {
@@ -10758,7 +10743,7 @@ function connectAdvanced(selectorFactory, _ref) {
     }
     var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || "Component";
     var displayName = getDisplayName(wrappedComponentName);
-    var selectorFactoryOptions = _extends$1({}, connectOptions, {
+    var selectorFactoryOptions = _extends$4({}, connectOptions, {
       getDisplayName,
       methodName,
       renderCountProp,
@@ -10803,7 +10788,7 @@ function connectAdvanced(selectorFactory, _ref) {
         if (didStoreComeFromProps) {
           return contextValue;
         }
-        return _extends$1({}, contextValue, {
+        return _extends$4({}, contextValue, {
           subscription
         });
       }, [didStoreComeFromProps, contextValue, subscription]);
@@ -10824,7 +10809,7 @@ function connectAdvanced(selectorFactory, _ref) {
       useIsomorphicLayoutEffectWithArgs(captureWrapperProps, [lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, actualChildProps, childPropsFromStoreUpdate, notifyNestedSubs]);
       useIsomorphicLayoutEffectWithArgs(subscribeUpdates, [shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, childPropsFromStoreUpdate, notifyNestedSubs, forceComponentUpdateDispatch], [store, subscription, childPropsSelector]);
       var renderedWrappedComponent = useMemo$1(function() {
-        return /* @__PURE__ */ React__default.createElement(WrappedComponent, _extends$1({}, actualChildProps, {
+        return /* @__PURE__ */ React__default.createElement(WrappedComponent, _extends$4({}, actualChildProps, {
           ref: reactReduxForwardedRef
         }));
       }, [reactReduxForwardedRef, WrappedComponent, actualChildProps]);
@@ -10843,7 +10828,7 @@ function connectAdvanced(selectorFactory, _ref) {
     Connect.displayName = ConnectFunction.displayName = displayName;
     if (forwardRef2) {
       var forwarded = React__default.forwardRef(function forwardConnectRef(props, ref2) {
-        return /* @__PURE__ */ React__default.createElement(Connect, _extends$1({}, props, {
+        return /* @__PURE__ */ React__default.createElement(Connect, _extends$4({}, props, {
           reactReduxForwardedRef: ref2
         }));
       });
@@ -10976,7 +10961,7 @@ function whenMapStateToPropsIsMissing(mapStateToProps) {
 }
 const defaultMapStateToPropsFactories = [whenMapStateToPropsIsFunction, whenMapStateToPropsIsMissing];
 function defaultMergeProps(stateProps, dispatchProps, ownProps) {
-  return _extends$1({}, ownProps, stateProps, dispatchProps);
+  return _extends$4({}, ownProps, stateProps, dispatchProps);
 }
 function wrapMergePropsFunc(mergeProps) {
   return function initMergePropsProxy(dispatch, _ref) {
@@ -11109,7 +11094,7 @@ function createConnect(_temp) {
     var initMapStateToProps = match(mapStateToProps, mapStateToPropsFactories, "mapStateToProps");
     var initMapDispatchToProps = match(mapDispatchToProps2, mapDispatchToPropsFactories, "mapDispatchToProps");
     var initMergeProps = match(mergeProps, mergePropsFactories, "mergeProps");
-    return connectHOC(selectorFactory, _extends$1({
+    return connectHOC(selectorFactory, _extends$4({
       // used in error messages
       methodName: "connect",
       // used to compute Connect's displayName from the wrapped component's displayName.
@@ -11408,7 +11393,7 @@ var error$9 = log.bind(null, "error");
 function noop$1() {
 }
 function getOptions(shared2, fromBinding) {
-  return _extends$1({}, shared2, {}, fromBinding);
+  return _extends$4({}, shared2, {}, fromBinding);
 }
 function bindEvents(el2, bindings, sharedOptions) {
   var unbindings = bindings.map(function(binding) {
@@ -11654,7 +11639,7 @@ var scroll$2 = function scroll(target, frame2) {
 var increase = function increase2(target, axis, withPlaceholder) {
   if (withPlaceholder && withPlaceholder.increasedBy) {
     var _extends22;
-    return _extends$1({}, target, (_extends22 = {}, _extends22[axis.end] = target[axis.end] + withPlaceholder.increasedBy[axis.line], _extends22));
+    return _extends$4({}, target, (_extends22 = {}, _extends22[axis.end] = target[axis.end] + withPlaceholder.increasedBy[axis.line], _extends22));
   }
   return target;
 };
@@ -11680,7 +11665,7 @@ var scrollDroppable = function(droppable2, newScroll) {
   var scrollable = droppable2.frame;
   var scrollDiff = subtract$1(newScroll, scrollable.scroll.initial);
   var scrollDisplacement = negate(scrollDiff);
-  var frame2 = _extends$1({}, scrollable, {
+  var frame2 = _extends$4({}, scrollable, {
     scroll: {
       initial: scrollable.scroll.initial,
       current: newScroll,
@@ -11697,7 +11682,7 @@ var scrollDroppable = function(droppable2, newScroll) {
     axis: droppable2.axis,
     frame: frame2
   });
-  var result = _extends$1({}, droppable2, {
+  var result = _extends$4({}, droppable2, {
     frame: frame2,
     subject
   });
@@ -11801,7 +11786,7 @@ var moveToNextCombine = function(_ref) {
         droppableId: destination.descriptor.id
       }
     };
-    return _extends$1({}, previousImpact, {
+    return _extends$4({}, previousImpact, {
       at: at2
     });
   }
@@ -11936,17 +11921,17 @@ var isVisible = function isVisible2(_ref) {
   return isVisibleInDroppable(displacedTarget, destination, isVisibleThroughFrameFn) && isVisibleInViewport(displacedTarget, viewport, isVisibleThroughFrameFn);
 };
 var isPartiallyVisible = function isPartiallyVisible2(args) {
-  return isVisible(_extends$1({}, args, {
+  return isVisible(_extends$4({}, args, {
     isVisibleThroughFrameFn: isPartiallyVisibleThroughFrame
   }));
 };
 var isTotallyVisible = function isTotallyVisible2(args) {
-  return isVisible(_extends$1({}, args, {
+  return isVisible(_extends$4({}, args, {
     isVisibleThroughFrameFn: isTotallyVisibleThroughFrame
   }));
 };
 var isTotallyVisibleOnAxis = function isTotallyVisibleOnAxis2(args) {
-  return isVisible(_extends$1({}, args, {
+  return isVisible(_extends$4({}, args, {
     isVisibleThroughFrameFn: isTotallyVisibleThroughFrameOnAxis(args.destination.axis)
   }));
 };
@@ -12356,7 +12341,7 @@ var speculativelyIncrease = function(_ref) {
     }
     invisible[id2] = true;
   });
-  var newImpact = _extends$1({}, impact, {
+  var newImpact = _extends$4({}, impact, {
     displaced: {
       all: last.all,
       invisible,
@@ -12577,8 +12562,8 @@ var getRequiredGrowthForPlaceholder = function getRequiredGrowthForPlaceholder2(
   return patch(axis.line, needsToGrowBy);
 };
 var withMaxScroll = function withMaxScroll2(frame2, max) {
-  return _extends$1({}, frame2, {
-    scroll: _extends$1({}, frame2.scroll, {
+  return _extends$4({}, frame2, {
+    scroll: _extends$4({}, frame2.scroll, {
       max
     })
   });
@@ -12601,7 +12586,7 @@ var addPlaceholder = function addPlaceholder2(droppable2, draggable2, draggables
       axis: droppable2.axis,
       frame: droppable2.frame
     });
-    return _extends$1({}, droppable2, {
+    return _extends$4({}, droppable2, {
       subject: _subject
     });
   }
@@ -12613,7 +12598,7 @@ var addPlaceholder = function addPlaceholder2(droppable2, draggable2, draggables
     axis: droppable2.axis,
     frame: newFrame
   });
-  return _extends$1({}, droppable2, {
+  return _extends$4({}, droppable2, {
     subject,
     frame: newFrame
   });
@@ -12629,7 +12614,7 @@ var removePlaceholder = function removePlaceholder2(droppable2) {
       frame: null,
       withPlaceholder: null
     });
-    return _extends$1({}, droppable2, {
+    return _extends$4({}, droppable2, {
       subject: _subject2
     });
   }
@@ -12642,7 +12627,7 @@ var removePlaceholder = function removePlaceholder2(droppable2) {
     frame: newFrame,
     withPlaceholder: null
   });
-  return _extends$1({}, droppable2, {
+  return _extends$4({}, droppable2, {
     subject,
     frame: newFrame
   });
@@ -13027,7 +13012,7 @@ var getDragImpact = function(_ref) {
 };
 var patchDroppableMap = function(droppables, updated) {
   var _extends22;
-  return _extends$1({}, droppables, (_extends22 = {}, _extends22[updated.descriptor.id] = updated, _extends22));
+  return _extends$4({}, droppables, (_extends22 = {}, _extends22[updated.descriptor.id] = updated, _extends22));
 };
 var clearUnusedPlaceholder = function clearUnusedPlaceholder2(_ref) {
   var previousImpact = _ref.previousImpact, impact = _ref.impact, droppables = _ref.droppables;
@@ -13088,7 +13073,7 @@ var update = function(_ref) {
     page: page2
   };
   if (state.phase === "COLLECTING") {
-    return _extends$1({
+    return _extends$4({
       phase: "COLLECTING"
     }, state, {
       dimensions,
@@ -13113,7 +13098,7 @@ var update = function(_ref) {
     draggables: dimensions.draggables,
     droppables: dimensions.droppables
   });
-  var result = _extends$1({}, state, {
+  var result = _extends$4({}, state, {
     current,
     dimensions: {
       draggables: dimensions.draggables,
@@ -13143,7 +13128,7 @@ var recompute = function(_ref) {
     forceShouldAnimate,
     last
   });
-  return _extends$1({}, impact, {
+  return _extends$4({}, impact, {
     displaced
   });
 };
@@ -13262,8 +13247,8 @@ var offsetDraggable = function(_ref) {
   var draggable2 = _ref.draggable, offset$1 = _ref.offset, initialWindowScroll = _ref.initialWindowScroll;
   var client = offset(draggable2.client, offset$1);
   var page2 = withScroll(client, initialWindowScroll);
-  var moved = _extends$1({}, draggable2, {
-    placeholder: _extends$1({}, draggable2.placeholder, {
+  var moved = _extends$4({}, draggable2, {
+    placeholder: _extends$4({}, draggable2.placeholder, {
       client
     }),
     client,
@@ -13301,13 +13286,13 @@ var publishWhileDraggingInVirtual = function(_ref) {
     var scrolled = scrollDroppable(existing, update2.scroll);
     return scrolled;
   });
-  var droppables = _extends$1({}, state.dimensions.droppables, {}, toDroppableMap(withScrollChange));
+  var droppables = _extends$4({}, state.dimensions.droppables, {}, toDroppableMap(withScrollChange));
   var updatedAdditions = toDraggableMap(adjustAdditionsForScrollChanges({
     additions: published.additions,
     updatedDroppables: droppables,
     viewport: state.viewport
   }));
-  var draggables = _extends$1({}, state.dimensions.draggables, {}, updatedAdditions);
+  var draggables = _extends$4({}, state.dimensions.draggables, {}, updatedAdditions);
   published.removals.forEach(function(id2) {
     delete draggables[id2];
   });
@@ -13336,7 +13321,7 @@ var publishWhileDraggingInVirtual = function(_ref) {
     afterCritical
   });
   finish();
-  var draggingState = _extends$1({
+  var draggingState = _extends$4({
     phase: "DRAGGING"
   }, state, {
     phase: "DRAGGING",
@@ -13349,7 +13334,7 @@ var publishWhileDraggingInVirtual = function(_ref) {
   if (state.phase === "COLLECTING") {
     return draggingState;
   }
-  var dropPending3 = _extends$1({
+  var dropPending3 = _extends$4({
     phase: "DROP_PENDING"
   }, draggingState, {
     phase: "DROP_PENDING",
@@ -13376,7 +13361,7 @@ var postDroppableChange = function postDroppableChange2(state, updated, isEnable
 };
 function removeScrollJumpRequest(state) {
   if (state.isDragging && state.movementMode === "SNAP") {
-    return _extends$1({
+    return _extends$4({
       phase: "DRAGGING"
     }, state, {
       scrollJumpRequest: null
@@ -13394,7 +13379,7 @@ var reducer$2 = function(state, action2) {
     state = idle;
   }
   if (action2.type === "FLUSH") {
-    return _extends$1({}, idle, {
+    return _extends$4({}, idle, {
       shouldFlush: true
     });
   }
@@ -13448,7 +13433,7 @@ var reducer$2 = function(state, action2) {
       return state;
     }
     !(state.phase === "DRAGGING") ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Collection cannot start from phase " + state.phase) : invariant$3() : void 0;
-    var _result = _extends$1({
+    var _result = _extends$4({
       phase: "COLLECTING"
     }, state, {
       phase: "COLLECTING"
@@ -13502,7 +13487,7 @@ var reducer$2 = function(state, action2) {
     var _target = state.dimensions.droppables[_id];
     !_target ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Cannot find Droppable[id: " + _id + "] to toggle its enabled state") : invariant$3() : void 0;
     !(_target.isEnabled !== isEnabled) ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Trying to set droppable isEnabled to " + String(isEnabled) + "\n      but it is already " + String(_target.isEnabled)) : invariant$3() : void 0;
-    var updated = _extends$1({}, _target, {
+    var updated = _extends$4({}, _target, {
       isEnabled
     });
     return postDroppableChange(state, updated, true);
@@ -13516,7 +13501,7 @@ var reducer$2 = function(state, action2) {
     var _target2 = state.dimensions.droppables[_id2];
     !_target2 ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Cannot find Droppable[id: " + _id2 + "] to toggle its isCombineEnabled state") : invariant$3() : void 0;
     !(_target2.isCombineEnabled !== isCombineEnabled) ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Trying to set droppable isCombineEnabled to " + String(isCombineEnabled) + "\n      but it is already " + String(_target2.isCombineEnabled)) : invariant$3() : void 0;
-    var _updated2 = _extends$1({}, _target2, {
+    var _updated2 = _extends$4({}, _target2, {
       isCombineEnabled
     });
     return postDroppableChange(state, _updated2, true);
@@ -13551,12 +13536,12 @@ var reducer$2 = function(state, action2) {
     if (isEqual$2(maxScroll, state.viewport.scroll.max)) {
       return state;
     }
-    var withMaxScroll3 = _extends$1({}, state.viewport, {
-      scroll: _extends$1({}, state.viewport.scroll, {
+    var withMaxScroll3 = _extends$4({}, state.viewport, {
+      scroll: _extends$4({}, state.viewport.scroll, {
         max: maxScroll
       })
     });
-    return _extends$1({
+    return _extends$4({
       phase: "DRAGGING"
     }, state, {
       viewport: withMaxScroll3
@@ -13584,7 +13569,7 @@ var reducer$2 = function(state, action2) {
   if (action2.type === "DROP_PENDING") {
     var reason = action2.payload.reason;
     !(state.phase === "COLLECTING") ? process.env.NODE_ENV !== "production" ? invariant$3(false, "Can only move into the DROP_PENDING phase from the COLLECTING phase") : invariant$3() : void 0;
-    var newState = _extends$1({
+    var newState = _extends$4({
       phase: "DROP_PENDING"
     }, state, {
       phase: "DROP_PENDING",
@@ -13932,7 +13917,7 @@ var getDropImpact = function(_ref) {
       didDropInsideDroppable: true
     };
   }
-  var withoutMovement = _extends$1({}, lastImpact, {
+  var withoutMovement = _extends$4({}, lastImpact, {
     displaced: emptyGroups
   });
   return {
@@ -14269,7 +14254,7 @@ var getPublisher = function(getResponders, announce) {
     if (!hasCriticalChanged && !hasLocationChanged && !hasGroupingChanged) {
       return;
     }
-    var data = _extends$1({}, getDragStart(critical, dragging.mode), {
+    var data = _extends$4({}, getDragStart(critical, dragging.mode), {
       combine: combine2,
       destination: location
     });
@@ -14294,7 +14279,7 @@ var getPublisher = function(getResponders, announce) {
     if (!dragging) {
       return;
     }
-    var result = _extends$1({}, getDragStart(dragging.lastCritical, dragging.mode), {
+    var result = _extends$4({}, getDragStart(dragging.lastCritical, dragging.mode), {
       combine: null,
       destination: null,
       reason: "CANCEL"
@@ -15714,7 +15699,7 @@ function useAnnouncer(contextId) {
     el2.id = id2;
     el2.setAttribute("aria-live", "assertive");
     el2.setAttribute("aria-atomic", "true");
-    _extends$1(el2.style, visuallyHidden);
+    _extends$4(el2.style, visuallyHidden);
     getBodyElement().appendChild(el2);
     return function cleanup() {
       setTimeout(function remove2() {
@@ -16761,7 +16746,7 @@ function tryStart(_ref3) {
         reason
       }));
     }
-    return _extends$1({
+    return _extends$4({
       isActive: function isActive() {
         return _isActive({
           expected: "DRAGGING",
@@ -16800,7 +16785,7 @@ function tryStart(_ref3) {
         move: move$1
       }
     });
-    return _extends$1({}, api, {
+    return _extends$4({}, api, {
       move: move$1
     });
   }
@@ -16975,7 +16960,7 @@ function App(props) {
     return createDimensionMarshal(registry, marshalCallbacks);
   }, [registry, marshalCallbacks]);
   var autoScroller = useMemo(function() {
-    return createAutoScroller(_extends$1({
+    return createAutoScroller(_extends$4({
       scrollWindow,
       scrollDroppable: dimensionMarshal.scrollDroppable
     }, bindActionCreators$1({
@@ -18109,7 +18094,7 @@ function PublicDraggable(props) {
   var isEnabled = typeof props.isDragDisabled === "boolean" ? !props.isDragDisabled : true;
   var canDragInteractiveElements = Boolean(props.disableInteractiveElementBlocking);
   var shouldRespectForcePress = Boolean(props.shouldRespectForcePress);
-  return React__default.createElement(PrivateDraggable, _extends$1({}, props, {
+  return React__default.createElement(PrivateDraggable, _extends$4({}, props, {
     isClone: false,
     isEnabled,
     canDragInteractiveElements,
@@ -18228,7 +18213,7 @@ var makeMapStateToProps$1 = function makeMapStateToProps3() {
     },
     useClone: null
   };
-  var idleWithoutAnimation = _extends$1({}, idleWithAnimation, {
+  var idleWithoutAnimation = _extends$4({}, idleWithAnimation, {
     shouldAnimatePlaceholder: false
   });
   var getDraggableRubric = memoizeOne(function(descriptor) {
@@ -20314,7 +20299,7 @@ function createListComponent(_ref) {
         className,
         onScroll,
         ref: this._outerRefSetter,
-        style: _extends$1({
+        style: _extends$4({
           position: "relative",
           height: height2,
           width: width2,
@@ -52436,6 +52421,7 @@ var interopRequireDefault = { exports: {} };
   module.exports = _interopRequireDefault2, module.exports.__esModule = true, module.exports["default"] = module.exports;
 })(interopRequireDefault);
 var interopRequireDefaultExports = interopRequireDefault.exports;
+const require$$2 = /* @__PURE__ */ getAugmentedNamespace(_extends$5);
 const richTextToolbar = "_richTextToolbar_1gbkk_1";
 const richTextToolbarContainer = "_richTextToolbarContainer_1gbkk_5";
 const styles$g = {
@@ -53715,7 +53701,7 @@ var Handle$2 = /* @__PURE__ */ React$4.forwardRef(function(props, ref2) {
     }
   };
   var positionStyle = getDirectionStyle(direction, value, min, max);
-  var handleNode = /* @__PURE__ */ React$4.createElement("div", _extends$1({
+  var handleNode = /* @__PURE__ */ React$4.createElement("div", _extends$4({
     ref: ref2,
     className: cx$2(handlePrefixCls, (_classNames = {}, _defineProperty$7(_classNames, "".concat(handlePrefixCls, "-").concat(valueIndex + 1), range2), _defineProperty$7(_classNames, "".concat(handlePrefixCls, "-dragging"), dragging), _classNames)),
     style: _objectSpread2$1(_objectSpread2$1({}, positionStyle), style2),
@@ -53759,7 +53745,7 @@ var Handles = /* @__PURE__ */ React$4.forwardRef(function(props, ref2) {
     };
   });
   return /* @__PURE__ */ React$4.createElement(React$4.Fragment, null, values2.map(function(value, index2) {
-    return /* @__PURE__ */ React$4.createElement(Handle$2, _extends$1({
+    return /* @__PURE__ */ React$4.createElement(Handle$2, _extends$4({
       ref: function ref3(node2) {
         if (!node2) {
           delete handlesRef.current[index2];
@@ -55129,7 +55115,7 @@ Object.defineProperty(Handle$1, "__esModule", {
   value: true
 });
 var default_1 = Handle$1.default = void 0;
-var _extends2 = _interopRequireDefault(require_extends());
+var _extends2 = _interopRequireDefault(require$$2);
 var _objectSpread2 = _interopRequireDefault(requireObjectSpread2());
 var _defineProperty2 = _interopRequireDefault(requireDefineProperty());
 var _objectWithoutProperties2 = _interopRequireDefault(requireObjectWithoutProperties());
@@ -55710,6 +55696,12 @@ 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") {
@@ -55743,68 +55735,65 @@ const NumberInput = ({
   allowEmpty = false,
   isInTable: isInTable2,
   groupOrder,
+  enableCosmeticRounding = true,
   enableDisplayRounding = false,
   roundDisplayValue,
   disableInternalErrorValidationMessages = false
 }) => {
   const inputRef = useRef(null);
-  const [displayValue, setDisplayValue] = useState(value);
-  const [validationError, setValidationError] = useState(null);
+  const [displayValue, setDisplayValue] = useState(safeToString(value));
   const [focus2, setFocus] = useState(false);
+  const [pristine, setPristine] = useState(true);
   const stringName = getStringName$1(name2);
   const validateInputValue = (value2) => {
-    let validation = validateNumber(value2);
+    const 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(() => {
-    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);
+    setDisplayValue(safeToString(value));
+    setPristine(true);
+  }, [value, enableCosmeticRounding, enableDisplayRounding]);
+  useEffect(() => {
+    if (!focus2 && !valid) {
       validationCallback(stringName, firstError);
+    } else {
+      validationCallback(stringName, null);
     }
-  }, [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 = {
+  }, [focus2, valid, error2]);
+  const onChangeValue = (evt) => {
+    if (valid && !pristine) {
+      const event = {
         ...evt,
         target: {
           ...evt.target,
-          value: inputValue,
+          value: stripLeadingZeros(safeToString(displayValue)),
           name: stringName
         }
       };
-      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);
+      onChange(event);
     }
   };
+  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 } = String(displayValue);
+          const { length: length2 } = safeToString(displayValue);
           textInput.setSelectionRange(length2, length2);
         }, 0);
       }
@@ -55816,33 +55805,48 @@ const NumberInput = ({
   };
   const onInputBlur = (evt) => {
     setFocus(false);
+    onChangeValue(evt);
     onBlur(evt);
   };
-  const roundedDisplayValue = !focus2 && enableDisplayRounding ? roundDisplayValue ? roundDisplayValue(displayValue) : roundToFixed(displayValue, 2) : displayValue;
+  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;
   return /* @__PURE__ */ jsx(
-    Input$1,
+    KeyboardEventHandler,
     {
-      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
+      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
+      )
+    }
   );
 };
 const NumberInputCell = ({ cell: cell2, testId }) => {
@@ -55868,6 +55872,7 @@ const NumberInputCell = ({ cell: cell2, testId }) => {
       tooltip: cell2.tooltip,
       validationCallback: cell2.validationCallback,
       allowEmpty: cell2.allowEmpty,
+      enableCosmeticRounding: cell2.enableCosmeticRounding,
       enableDisplayRounding: cell2.enableDisplayRounding,
       roundDisplayValue: cell2.roundDisplayValue
     }
@@ -70297,7 +70302,10 @@ const UnitInput = ({
   validationCallback = () => ({ name: "", error: null }),
   disabledValidation = false,
   allowEmpty = false,
-  autoValue
+  autoValue,
+  convertBackToStorageUnit = false,
+  enableCosmeticRounding = true,
+  enableDisplayRounding = false
 }) => {
   const context2 = useUnitContext();
   const runAfterUpdate = useRunAfterUpdate();
@@ -70362,9 +70370,10 @@ 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: newValue,
+        value: returnValue,
         name: stringName2
       }
     });
@@ -70525,6 +70534,8 @@ const UnitInput = ({
             left: left2,
             allowEmpty,
             validationCallback: (_name, error22) => validationCallback(stringName, error22),
+            enableCosmeticRounding,
+            enableDisplayRounding,
             groupOrder: predefinedOptions ? "middle" : "first",
             disableInternalErrorValidationMessages
           },
@@ -70544,7 +70555,7 @@ const UnitInput = ({
               sections: alternativeUnits.map(([value2, altUnit, label2]) => {
                 const displayUnit = label2 || altUnit || "";
                 const safeValue = !isNaN(Number(value2)) ? value2 : "";
-                const displayValue = safeValue;
+                const displayValue = enableCosmeticRounding ? roundNumberCosmetic(safeValue) : safeValue;
                 return {
                   type: "Option",
                   label: displayValue,
@@ -70615,22 +70626,12 @@ const convertVisibleRows = ({
         const storageUnit = storageUnits[unitKey];
         const unitChanged = selectedUnit !== storageUnit;
         const convertedValue = unitChanged ? convertAndGetValue(value, selectedUnit, storageUnit) : cell2.value;
-        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;
+        const formattedDisplayValue = formatDisplayValue ? formatDisplayValue(convertedValue) : convertedValue;
         return {
           ...cell2,
           value: formattedDisplayValue,
-          enableCosmeticRounding,
+          enableCosmeticRounding: enableCosmeticRounding && unitChanged,
+          //todo: why did we need to check unitChanged here? (original rationale)
           enableDisplayRounding,
           roundDisplayValue,
           onChange: (evt) => {