Pull request #212085: Final/11.0

Merge in DEC/fineui from ~IMP/dec-fineui:final/11.0 to final/11.0

* commit '64cf3d7e92b7b1071855e151c8b83df3823294b1':
  BI-118659 fix: belowMouse的实现
  无JIRA "bi.number_editor" 支持水印
  BI-118917 fix: bi.switcher这种利用Masker遮罩的场景处理
  auto upgrade version to 2.0.20221214115751
  BI-118849 fix: 适配 offsetStyle center和middle问题
  auto upgrade version to 2.0.20221214104244
  KERNEL-11877 fix: supportCSSTransform 默认改为true
  KERNEL-11877 fix: 关掉BI.BubblesController的
  BI-118754 fix(getMinimumFontSize): 获取最小字号无效
  KERNEL-11877 feat: 升级popperjs 解决scale问题
  auto upgrade version to 2.0.20221213152248

demo/js/widget/numbereditor/demo.number_editor.js

@@ -14,7 +14,8 @@ Demo.FileManager = BI.inherit(BI.Widget, {
             },
             height: 24,
             width: 150,
-            errorText: "hahah"
+            errorText: "hahah",
+            watermark: "每个人都是自己健康的第一责任人",
         });
         editor1.on(BI.NumberEditor.EVENT_CHANGE, function () {
             if (BI.parseFloat(this.getValue()) < 1) {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fineui",
-  "version": "2.0.20221210193709",
+  "version": "2.0.20221214115751",
   "description": "fineui",
   "main": "dist/fineui_without_conflict.min.js",
   "types": "dist/lib/index.d.ts",

src/base/combination/combo.js

@@ -38,9 +38,9 @@
                 adjustLength: 0, // 调整的距离
                 adjustXOffset: 0,
                 adjustYOffset: 0,
-                supportCSSTransform: false,
+                supportCSSTransform: true,
                 hideChecker: BI.emptyFn,
-                offsetStyle: "left", // left,right,center
+                offsetStyle: "", // "",center,middle
                 el: {},
                 popup: {},
                 comboClass: "bi-combo-popup",
@@ -196,28 +196,22 @@
             this.popupView.visible();
             var combo = (o.belowMouse && BI.isNotNull(e)) ? {
                 element: {
-                    0: e.target,
-                    offset: function () {
+                    0: BI.extend({}, e.target, {
+                        getBoundingClientRect: function () {
                             return {
                                 left: e.pageX,
                                 top: e.pageY,
+                                width: 0,
+                                height: 0,
                             };
-                    },
-                    bounds: function () {
-                        // offset为其相对于父定位元素的偏移
+                        }
+                    }),
+                    offset: function () {
                         return {
-                            x: e.offsetX,
-                            y: e.offsetY,
-                            width: 0,
-                            height: 24,
+                            left: e.pageX,
+                            top: e.pageY,
                         };
                     },
-                    outerWidth: function () {
-                        return 0;
-                    },
-                    outerHeight: function () {
-                        return 24;
-                    },
                 },
             } : this.combo;
             var positionRelativeElement = BI.DOM.getPositionRelativeContainingBlock(BI.isNull(o.container) ? this.element[0] : BI.Widget._renderEngine.createElement(BI.isFunction(o.container) ? o.container() : o.container)[0]);
@@ -308,10 +302,10 @@
                 var scaleX = positonedRect.width / positionRelativeElement.offsetWidth;
                 var scaleY = positonedRect.height / positionRelativeElement.offsetHeight;
 
-                p.top && (p.top = p.top / scaleY);
-                p.left && (p.left = p.left / scaleX);
+                p.top && (p.top = Math.round(p.top / scaleY));
+                p.left && (p.left = Math.round(p.left / scaleX));
 
-                p.adaptHeight && (p.adaptHeight = p.adaptHeight / scaleY);
+                p.adaptHeight && (p.adaptHeight = Math.round(p.adaptHeight / scaleY));
             }
 
             if ("adaptHeight" in p) {

src/core/controller/controller.bubbles.js

@@ -45,9 +45,11 @@ BI.BubblesController = BI.inherit(BI.Controller, {
         BI.createWidget({
             type: "bi.default",
             element: container,
-            items: [{
+            items: [
+                {
                     el: bubble
-            }]
+                }
+            ]
         });
         if (this.storePoppers[name]) {
             this.storePoppers[name].destroy();
@@ -65,7 +67,14 @@ BI.BubblesController = BI.inherit(BI.Controller, {
                     options: {
                         offset: [adjustXOffset, adjustYOffset]
                     }
-                }
+                },
+                {
+                    name: "preventOverflow",
+                    enabled: false
+                }, {
+                    name: "flip",
+                    enabled: false
+                },
             ]
         });
         return this;

src/core/controller/controller.layer.js

@@ -63,41 +63,54 @@ BI.LayerController = BI.inherit(BI.Controller, {
         var layout = BI.createWidget({
             type: "bi.absolute",
             invisible: true,
-            items: [{
+            items: [
+                {
                     el: widget,
                     left: 0,
                     right: 0,
                     top: 0,
                     bottom: 0
-            }]
+                }
+            ]
         }, context);
         BI.createWidget({
             type: "bi.absolute",
             element: op.container || this.options.render,
-            items: [{
+            items: [
+                {
                     el: layout,
                     left: offset.left || 0,
                     right: offset.right || 0,
                     top: offset.top || 0,
                     bottom: offset.bottom || 0
-            }]
+                }
+            ]
         });
         if (w) {
             layout.element.addClass("bi-popup-view");
-            layout.element.css({
+
+            function getComputedPosition() {
+
+                var css = {
                     left: w.offset().left + (offset.left || 0),
                     top: w.offset().top + (offset.top || 0),
                     width: offset.width || (w.outerWidth() - (offset.left || 0) - (offset.right || 0)) || "",
                     height: offset.height || (w.outerHeight() - (offset.top || 0) - (offset.bottom || 0)) || ""
-            });
+                };
+
+                const { top, left, scaleY, scaleX } = BI.DOM.getPositionRelativeContainingBlockRect(layout.element[0]);
+
+                css.top = (css.top - top) / scaleY;
+                css.left = (css.left - left) / scaleX;
+
+                return css;
+            }
+
+
+            layout.element.css(getComputedPosition());
             layout.element.on("__resize__", function () {
                 w.is(":visible") &&
-                layout.element.css({
-                    left: w.offset().left + (offset.left || 0),
-                    top: w.offset().top + (offset.top || 0),
-                    width: offset.width || (w.outerWidth() - (offset.left || 0) - (offset.right || 0)) || "",
-                    height: offset.height || (w.outerHeight() - (offset.top || 0) - (offset.bottom || 0)) || ""
-                });
+                layout.element.css(getComputedPosition());
             });
         }
         this.add(name, widget, layout);

src/core/controller/popper.js

@@ -1,24 +1,11 @@
 /**
- * @popperjs/core v2.9.2 - MIT License
+ * @popperjs/core v2.11.6 - MIT License
  */
 
 (function (global, factory) {
-  factory(BI.Popper = {});
-}(this, (function (exports) { 'use strict';
-
-  function getBoundingClientRect(element) {
-    var rect = element.getBoundingClientRect();
-    return {
-      width: rect.width,
-      height: rect.height,
-      top: rect.top,
-      right: rect.right,
-      bottom: rect.bottom,
-      left: rect.left,
-      x: rect.left,
-      y: rect.top
-    };
-  }
+    factory(global.Popper = {});
+}(BI, (function (exports) {
+    'use strict';
 
     function getWindow(node) {
         if (node == null) {
@@ -33,16 +20,6 @@
         return node;
     }
 
-  function getWindowScroll(node) {
-    var win = getWindow(node);
-    var scrollLeft = win.pageXOffset;
-    var scrollTop = win.pageYOffset;
-    return {
-      scrollLeft: scrollLeft,
-      scrollTop: scrollTop
-    };
-  }
-
     function isElement(node) {
         var OwnElement = getWindow(node).Element;
         return node instanceof OwnElement || node instanceof Element;
@@ -63,6 +40,74 @@
         return node instanceof OwnElement || node instanceof ShadowRoot;
     }
 
+    var max = Math.max;
+    var min = Math.min;
+    var round = Math.round;
+
+    function getUAString() {
+        var uaData = navigator.userAgentData;
+
+        if (uaData != null && uaData.brands && Array.isArray(uaData.brands)) {
+            return uaData.brands.map(function (item) {
+                return item.brand + "/" + item.version;
+            }).join(' ');
+        }
+
+        return navigator.userAgent;
+    }
+
+    function isLayoutViewport() {
+        return !/^((?!chrome|android).)*safari/i.test(getUAString());
+    }
+
+    function getBoundingClientRect(element, includeScale, isFixedStrategy) {
+        if (includeScale === void 0) {
+            includeScale = false;
+        }
+
+        if (isFixedStrategy === void 0) {
+            isFixedStrategy = false;
+        }
+
+        var clientRect = element.getBoundingClientRect();
+        var scaleX = 1;
+        var scaleY = 1;
+
+        if (includeScale && isHTMLElement(element)) {
+            scaleX = element.offsetWidth > 0 ? round(clientRect.width) / element.offsetWidth || 1 : 1;
+            scaleY = element.offsetHeight > 0 ? round(clientRect.height) / element.offsetHeight || 1 : 1;
+        }
+
+        var _ref = isElement(element) ? getWindow(element) : window,
+            visualViewport = _ref.visualViewport;
+
+        var addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
+        var x = (clientRect.left + (addVisualOffsets && visualViewport ? visualViewport.offsetLeft : 0)) / scaleX;
+        var y = (clientRect.top + (addVisualOffsets && visualViewport ? visualViewport.offsetTop : 0)) / scaleY;
+        var width = clientRect.width / scaleX;
+        var height = clientRect.height / scaleY;
+        return {
+            width: width,
+            height: height,
+            top: y,
+            right: x + width,
+            bottom: y + height,
+            left: x,
+            x: x,
+            y: y
+        };
+    }
+
+    function getWindowScroll(node) {
+        var win = getWindow(node);
+        var scrollLeft = win.pageXOffset;
+        var scrollTop = win.pageYOffset;
+        return {
+            scrollLeft: scrollLeft,
+            scrollTop: scrollTop
+        };
+    }
+
     function getHTMLElementScroll(element) {
         return {
             scrollLeft: element.scrollLeft,
@@ -113,16 +158,24 @@
         return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
     }
 
+    function isElementScaled(element) {
+        var rect = element.getBoundingClientRect();
+        var scaleX = round(rect.width) / element.offsetWidth || 1;
+        var scaleY = round(rect.height) / element.offsetHeight || 1;
+        return scaleX !== 1 || scaleY !== 1;
+    } // Returns the composite rect of an element relative to its offsetParent.
     // Composite means it takes into account transforms as well as layout.
 
+
     function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
         if (isFixed === void 0) {
             isFixed = false;
         }
 
-    var documentElement = getDocumentElement(offsetParent);
-    var rect = getBoundingClientRect(elementOrVirtualElement);
         var isOffsetParentAnElement = isHTMLElement(offsetParent);
+        var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
+        var documentElement = getDocumentElement(offsetParent);
+        var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
         var scroll = {
             scrollLeft: 0,
             scrollTop: 0
@@ -139,7 +192,7 @@
             }
 
             if (isHTMLElement(offsetParent)) {
-        offsets = getBoundingClientRect(offsetParent);
+                offsets = getBoundingClientRect(offsetParent, true);
                 offsets.x += offsetParent.clientLeft;
                 offsets.y += offsetParent.clientTop;
             } else if (documentElement) {
@@ -249,8 +302,8 @@
 
 
     function getContainingBlock(element) {
-    var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
-    var isIE = navigator.userAgent.indexOf('Trident') !== -1;
+        var isFirefox = /firefox/i.test(getUAString());
+        var isIE = /Trident/i.test(getUAString());
 
         if (isIE && isHTMLElement(element)) {
             // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
@@ -263,6 +316,10 @@
 
         var currentNode = getParentNode(element);
 
+        if (isShadowRoot(currentNode)) {
+            currentNode = currentNode.host;
+        }
+
         while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
             var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
             // create a containing block.
@@ -399,9 +456,13 @@
     var INVALID_MODIFIER_ERROR = 'Popper: modifier "%s" provided an invalid %s property, expected %s but got %s';
     var MISSING_DEPENDENCY_ERROR = 'Popper: modifier "%s" requires "%s", but "%s" modifier is not available';
     var VALID_PROPERTIES = ['name', 'enabled', 'phase', 'fn', 'effect', 'requires', 'options'];
+
     function validateModifiers(modifiers) {
         modifiers.forEach(function (modifier) {
-      Object.keys(modifier).forEach(function (key) {
+            [].concat(Object.keys(modifier), VALID_PROPERTIES) // IE11-compatible replacement for `new Set(iterable)`
+                .filter(function (value, index, self) {
+                    return self.indexOf(value) === index;
+                }).forEach(function (key) {
                 switch (key) {
                     case 'name':
                         if (typeof modifier.name !== 'string') {
@@ -415,6 +476,8 @@
                             console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"enabled"', '"boolean"', "\"" + String(modifier.enabled) + "\""));
                         }
 
+                        break;
+
                     case 'phase':
                         if (modifierPhases.indexOf(modifier.phase) < 0) {
                             console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"phase"', "either " + modifierPhases.join(', '), "\"" + String(modifier.phase) + "\""));
@@ -430,14 +493,14 @@
                         break;
 
                     case 'effect':
-            if (typeof modifier.effect !== 'function') {
+                        if (modifier.effect != null && typeof modifier.effect !== 'function') {
                             console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"effect"', '"function"', "\"" + String(modifier.fn) + "\""));
                         }
 
                         break;
 
                     case 'requires':
-            if (!Array.isArray(modifier.requires)) {
+                        if (modifier.requires != null && !Array.isArray(modifier.requires)) {
                             console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"requires"', '"array"', "\"" + String(modifier.requires) + "\""));
                         }
 
@@ -502,31 +565,21 @@
         });
     }
 
-  function getViewportRect(element) {
+    function getViewportRect(element, strategy) {
         var win = getWindow(element);
         var html = getDocumentElement(element);
         var visualViewport = win.visualViewport;
         var width = html.clientWidth;
         var height = html.clientHeight;
         var x = 0;
-    var y = 0; // NB: This isn't supported on iOS <= 12. If the keyboard is open, the popper
-    // can be obscured underneath it.
-    // Also, `html.clientHeight` adds the bottom bar height in Safari iOS, even
-    // if it isn't open, so if this isn't available, the popper will be detected
-    // to overflow the bottom of the screen too early.
+        var y = 0;
 
         if (visualViewport) {
             width = visualViewport.width;
-      height = visualViewport.height; // Uses Layout Viewport (like Chrome; Safari does not currently)
-      // In Chrome, it returns a value very close to 0 (+/-) but contains rounding
-      // errors due to floating point numbers, so we need to check precision.
-      // Safari returns a number <= 0, usually < -1 when pinch-zoomed
-      // Feature detection fails in mobile emulation mode in Chrome.
-      // Math.abs(win.innerWidth / visualViewport.scale - visualViewport.width) <
-      // 0.001
-      // Fallback here: "Not Safari" userAgent
-
-      if (!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
+            height = visualViewport.height;
+            var layoutViewport = isLayoutViewport();
+
+            if (layoutViewport || !layoutViewport && strategy === 'fixed') {
                 x = visualViewport.offsetLeft;
                 y = visualViewport.offsetTop;
             }
@@ -540,10 +593,6 @@
         };
     }
 
-  var max = Math.max;
-  var min = Math.min;
-  var round = Math.round;
-
     // of the `<html>` and `<body>` rect bounds if horizontally scrollable
 
     function getDocumentRect(element) {
@@ -601,8 +650,8 @@
         });
     }
 
-  function getInnerBoundingClientRect(element) {
-    var rect = getBoundingClientRect(element);
+    function getInnerBoundingClientRect(element, strategy) {
+        var rect = getBoundingClientRect(element, false, strategy === 'fixed');
         rect.top = rect.top + element.clientTop;
         rect.left = rect.left + element.clientLeft;
         rect.bottom = rect.top + element.clientHeight;
@@ -614,8 +663,8 @@
         return rect;
     }
 
-  function getClientRectFromMixedType(element, clippingParent) {
-    return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isHTMLElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
+    function getClientRectFromMixedType(element, clippingParent, strategy) {
+        return clippingParent === viewport ? rectToClientRect(getViewportRect(element, strategy)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent, strategy) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
     } // A "clipping parent" is an overflowable container with the characteristic of
     // clipping (or hiding) overflowing elements with a position different from
     // `initial`
@@ -638,18 +687,18 @@
     // clipping parents
 
 
-  function getClippingRect(element, boundary, rootBoundary) {
+    function getClippingRect(element, boundary, rootBoundary, strategy) {
         var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
         var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
         var firstClippingParent = clippingParents[0];
         var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
-      var rect = getClientRectFromMixedType(element, clippingParent);
+            var rect = getClientRectFromMixedType(element, clippingParent, strategy);
             accRect.top = max(rect.top, accRect.top);
             accRect.right = min(rect.right, accRect.right);
             accRect.bottom = min(rect.bottom, accRect.bottom);
             accRect.left = max(rect.left, accRect.left);
             return accRect;
-    }, getClientRectFromMixedType(element, firstClippingParent));
+        }, getClientRectFromMixedType(element, firstClippingParent, strategy));
         clippingRect.width = clippingRect.right - clippingRect.left;
         clippingRect.height = clippingRect.bottom - clippingRect.top;
         clippingRect.x = clippingRect.left;
@@ -758,6 +807,8 @@
         var _options = options,
             _options$placement = _options.placement,
             placement = _options$placement === void 0 ? state.placement : _options$placement,
+            _options$strategy = _options.strategy,
+            strategy = _options$strategy === void 0 ? state.strategy : _options$strategy,
             _options$boundary = _options.boundary,
             boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
             _options$rootBoundary = _options.rootBoundary,
@@ -770,11 +821,10 @@
             padding = _options$padding === void 0 ? 0 : _options$padding;
         var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
         var altContext = elementContext === popper ? reference : popper;
-    var referenceElement = state.elements.reference;
         var popperRect = state.rects.popper;
         var element = state.elements[altBoundary ? altContext : elementContext];
-    var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
-    var referenceClientRect = getBoundingClientRect(referenceElement);
+        var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary, strategy);
+        var referenceClientRect = getBoundingClientRect(state.elements.reference);
         var popperOffsets = computeOffsets({
             reference: referenceClientRect,
             element: popperRect,
@@ -854,7 +904,8 @@
             var isDestroyed = false;
             var instance = {
                 state: state,
-        setOptions: function setOptions(options) {
+                setOptions: function setOptions(setOptionsAction) {
+                    var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
                     cleanupModifierEffects();
                     state.options = Object.assign({}, defaultOptions, state.options, options);
                     state.scrollParents = {
@@ -1029,7 +1080,8 @@
                             options: options
                         });
 
-            var noopFn = function noopFn() {};
+                        var noopFn = function noopFn() {
+                        };
 
                         effectCleanupFns.push(cleanupFn || noopFn);
                     }
@@ -1090,7 +1142,8 @@
         name: 'eventListeners',
         enabled: true,
         phase: 'write',
-    fn: function fn() {},
+        fn: function fn() {
+        },
         effect: effect$2,
         data: {}
     };
@@ -1134,8 +1187,8 @@
         var win = window;
         var dpr = win.devicePixelRatio || 1;
         return {
-      x: round(round(x * dpr) / dpr) || 0,
-      y: round(round(y * dpr) / dpr) || 0
+            x: round(x * dpr) / dpr || 0,
+            y: round(y * dpr) / dpr || 0
         };
     }
 
@@ -1145,18 +1198,28 @@
         var popper = _ref2.popper,
             popperRect = _ref2.popperRect,
             placement = _ref2.placement,
+            variation = _ref2.variation,
             offsets = _ref2.offsets,
             position = _ref2.position,
             gpuAcceleration = _ref2.gpuAcceleration,
             adaptive = _ref2.adaptive,
-        roundOffsets = _ref2.roundOffsets;
-
-    var _ref3 = roundOffsets === true ? roundOffsetsByDPR(offsets) : typeof roundOffsets === 'function' ? roundOffsets(offsets) : offsets,
-        _ref3$x = _ref3.x,
-        x = _ref3$x === void 0 ? 0 : _ref3$x,
-        _ref3$y = _ref3.y,
-        y = _ref3$y === void 0 ? 0 : _ref3$y;
+            roundOffsets = _ref2.roundOffsets,
+            isFixed = _ref2.isFixed;
+        var _offsets$x = offsets.x,
+            x = _offsets$x === void 0 ? 0 : _offsets$x,
+            _offsets$y = offsets.y,
+            y = _offsets$y === void 0 ? 0 : _offsets$y;
+
+        var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
+            x: x,
+            y: y
+        }) : {
+            x: x,
+            y: y
+        };
 
+        x = _ref3.x;
+        y = _ref3.y;
         var hasX = offsets.hasOwnProperty('x');
         var hasY = offsets.hasOwnProperty('y');
         var sideX = left;
@@ -1171,7 +1234,7 @@
             if (offsetParent === getWindow(popper)) {
                 offsetParent = getDocumentElement(popper);
 
-        if (getComputedStyle(offsetParent).position !== 'static') {
+                if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {
                     heightProp = 'scrollHeight';
                     widthProp = 'scrollWidth';
                 }
@@ -1180,17 +1243,19 @@
 
             offsetParent = offsetParent;
 
-      if (placement === top) {
-        sideY = bottom; // $FlowFixMe[prop-missing]
-
-        y -= offsetParent[heightProp] - popperRect.height;
+            if (placement === top || (placement === left || placement === right) && variation === end) {
+                sideY = bottom;
+                var offsetY = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
+                    offsetParent[heightProp];
+                y -= offsetY - popperRect.height;
                 y *= gpuAcceleration ? 1 : -1;
             }
 
-      if (placement === left) {
-        sideX = right; // $FlowFixMe[prop-missing]
-
-        x -= offsetParent[widthProp] - popperRect.width;
+            if (placement === left || (placement === top || placement === bottom) && variation === end) {
+                sideX = right;
+                var offsetX = isFixed && offsetParent === win && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
+                    offsetParent[widthProp];
+                x -= offsetX - popperRect.width;
                 x *= gpuAcceleration ? 1 : -1;
             }
         }
@@ -1199,18 +1264,29 @@
             position: position
         }, adaptive && unsetSides);
 
+        var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
+            x: x,
+            y: y
+        }) : {
+            x: x,
+            y: y
+        };
+
+        x = _ref4.x;
+        y = _ref4.y;
+
         if (gpuAcceleration) {
             var _Object$assign;
 
-      return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) < 2 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
+            return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
         }
 
         return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
     }
 
-  function computeStyles(_ref4) {
-    var state = _ref4.state,
-        options = _ref4.options;
+    function computeStyles(_ref5) {
+        var state = _ref5.state,
+            options = _ref5.options;
         var _options$gpuAccelerat = options.gpuAcceleration,
             gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
             _options$adaptive = options.adaptive,
@@ -1230,9 +1306,11 @@
 
         var commonStyles = {
             placement: getBasePlacement(state.placement),
+            variation: getVariation(state.placement),
             popper: state.elements.popper,
             popperRect: state.rects.popper,
-      gpuAcceleration: gpuAcceleration
+            gpuAcceleration: gpuAcceleration,
+            isFixed: state.options.strategy === 'fixed'
         };
 
         if (state.modifiersData.popperOffsets != null) {
@@ -1408,6 +1486,7 @@
         bottom: 'top',
         top: 'bottom'
     };
+
     function getOppositePlacement(placement) {
         return placement.replace(/left|right|bottom|top/g, function (matched) {
             return hash$1[matched];
@@ -1418,6 +1497,7 @@
         start: 'end',
         end: 'start'
     };
+
     function getOppositeVariationPlacement(placement) {
         return placement.replace(/start|end/g, function (matched) {
             return hash[matched];
@@ -1616,6 +1696,11 @@
         return max(min$1, min(value, max$1));
     }
 
+    function withinMaxClamp(min, value, max) {
+        var v = within(min, value, max);
+        return v > max ? max : v;
+    }
+
     function preventOverflow(_ref) {
         var state = _ref.state,
             options = _ref.options,
@@ -1649,6 +1734,14 @@
         var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
             placement: state.placement
         })) : tetherOffset;
+        var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
+            mainAxis: tetherOffsetValue,
+            altAxis: tetherOffsetValue
+        } : Object.assign({
+            mainAxis: 0,
+            altAxis: 0
+        }, tetherOffsetValue);
+        var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
         var data = {
             x: 0,
             y: 0
@@ -1658,13 +1751,15 @@
             return;
         }
 
-    if (checkMainAxis || checkAltAxis) {
+        if (checkMainAxis) {
+            var _offsetModifierState$;
+
             var mainSide = mainAxis === 'y' ? top : left;
             var altSide = mainAxis === 'y' ? bottom : right;
             var len = mainAxis === 'y' ? 'height' : 'width';
             var offset = popperOffsets[mainAxis];
-      var min$1 = popperOffsets[mainAxis] + overflow[mainSide];
-      var max$1 = popperOffsets[mainAxis] - overflow[altSide];
+            var min$1 = offset + overflow[mainSide];
+            var max$1 = offset - overflow[altSide];
             var additive = tether ? -popperRect[len] / 2 : 0;
             var minLen = variation === start ? referenceRect[len] : popperRect[len];
             var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
@@ -1684,37 +1779,46 @@
             // width or height)
 
             var arrowLen = within(0, referenceRect[len], arrowRect[len]);
-      var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - tetherOffsetValue : minLen - arrowLen - arrowPaddingMin - tetherOffsetValue;
-      var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + tetherOffsetValue : maxLen + arrowLen + arrowPaddingMax + tetherOffsetValue;
+            var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
+            var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
             var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
             var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
-      var offsetModifierValue = state.modifiersData.offset ? state.modifiersData.offset[state.placement][mainAxis] : 0;
-      var tetherMin = popperOffsets[mainAxis] + minOffset - offsetModifierValue - clientOffset;
-      var tetherMax = popperOffsets[mainAxis] + maxOffset - offsetModifierValue;
-
-      if (checkMainAxis) {
+            var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
+            var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
+            var tetherMax = offset + maxOffset - offsetModifierValue;
             var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
             popperOffsets[mainAxis] = preventedOffset;
             data[mainAxis] = preventedOffset - offset;
         }
 
         if (checkAltAxis) {
+            var _offsetModifierState$2;
+
             var _mainSide = mainAxis === 'x' ? top : left;
 
             var _altSide = mainAxis === 'x' ? bottom : right;
 
             var _offset = popperOffsets[altAxis];
 
+            var _len = altAxis === 'y' ? 'height' : 'width';
+
             var _min = _offset + overflow[_mainSide];
 
             var _max = _offset - overflow[_altSide];
 
-        var _preventedOffset = within(tether ? min(_min, tetherMin) : _min, _offset, tether ? max(_max, tetherMax) : _max);
+            var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
+
+            var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
+
+            var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
+
+            var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
+
+            var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
 
             popperOffsets[altAxis] = _preventedOffset;
             data[altAxis] = _preventedOffset - _offset;
         }
-    }
 
         state.modifiersData[name] = data;
     } // eslint-disable-next-line import/no-unused-modules

src/core/platform/web/dom.js

@@ -249,12 +249,14 @@
         },
 
         _getLeftAlignPosition: function (combo, popup, extraWidth, container) {
-            var viewBounds = popup.element.bounds(),
-                windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
-            var left = combo.element.offset().left - (container ? container.getBoundingClientRect().left : 0) + extraWidth;
+            var comboRect = combo.element[0].getBoundingClientRect(),
+                popupRect = popup.element.bounds(),
+                viewportRect = document.documentElement.getBoundingClientRect(),
+                containerRect = container ? container.getBoundingClientRect() : { left: 0 };
+            var left = comboRect.left - containerRect.left + extraWidth;
 
-            if (left + viewBounds.width > windowBounds.width) {
-                left = windowBounds.width - viewBounds.width;
+            if (left + popupRect.width - containerRect.left > viewportRect.width) {
+                left = viewportRect.width - popupRect.width - containerRect.left;
             }
             return left;
         },
@@ -285,17 +287,19 @@
             };
         },
 
-        _getRightAlignPosition: function (combo, popup, extraWidth) {
-            var comboBounds = combo.element.bounds(), viewBounds = popup.element.bounds();
-            return combo.element.offset().left + comboBounds.width - viewBounds.width - extraWidth;
+        _getRightAlignPosition: function (combo, popup, extraWidth, container) {
+            var comboBounds = combo.element[0].getBoundingClientRect(),
+                viewBounds = popup.element[0].getBoundingClientRect(),
+                containerRect = container ? container.getBoundingClientRect() : { left: 0 };
+            return comboBounds.left + comboBounds.width - viewBounds.width - extraWidth - containerRect.left;
         },
 
-        getRightAlignPosition: function (combo, popup, extraWidth) {
-            var left = this._getRightAlignPosition(combo, popup, extraWidth);
+        getRightAlignPosition: function (combo, popup, extraWidth, container) {
+            var left = this._getRightAlignPosition(combo, popup, extraWidth, container);
             var dir = "";
             // 如果放不下，优先使用LeftAlign, 如果LeftAlign也放不下, 再使用left=0
             if (left < 0) {
-                left = this._getLeftAlignPosition(combo, popup, extraWidth);
+                left = this._getLeftAlignPosition(combo, popup, extraWidth, container);
                 dir = "right";
             }
             if (left < 0) {
@@ -317,14 +321,13 @@
         },
 
         getTopAlignPosition: function (combo, popup, extraHeight, needAdaptHeight, container) {
-            var comboOffset = combo.element.offset();
             var comboBounds = combo.element[0].getBoundingClientRect(),
                 popupBounds = popup.element[0].getBoundingClientRect(),
                 viewportBounds = document.documentElement.getBoundingClientRect(),
                 containerBounds = container ? container.getBoundingClientRect() : { top: 0 };
             var top, adaptHeight, dir;
             if (BI.DOM.isBottomSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
-                top = comboOffset.top - containerBounds.top + extraHeight;
+                top = comboBounds.top - containerBounds.top + extraHeight;
             } else if (needAdaptHeight) {
                 top = comboBounds.top - containerBounds.top + extraHeight;
                 adaptHeight = viewportBounds.height - comboBounds.top;
@@ -375,20 +378,19 @@
         },
 
         getBottomAlignPosition: function (combo, popup, extraHeight, needAdaptHeight, container) {
-            var comboOffset = combo.element.offset();
             var comboBounds = combo.element[0].getBoundingClientRect(),
                 popupBounds = popup.element[0].getBoundingClientRect(),
                 windowBounds = BI.Widget._renderEngine.createElement("body").bounds(),
                 containerBounds = container ? container.getBoundingClientRect() : { top: 0 };
             var top, adaptHeight, dir;
             if (BI.DOM.isTopSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
-                top = comboOffset.top + comboBounds.height - containerBounds.top - popupBounds.height;
+                top = comboBounds.top + comboBounds.height - containerBounds.top - popupBounds.height;
             } else if (needAdaptHeight) {
                 top = 0 - containerBounds.top;
                 adaptHeight = comboBounds.top + comboBounds.height - extraHeight;
             } else if (BI.DOM.isBottomSpaceEnough(combo, popup, -1 * comboBounds.height + extraHeight)) {
                 // 上方空间不足且不允许调整高度的情况下，优先使用下对齐
-                top = comboOffset.top - containerBounds.top + extraHeight;
+                top = comboBounds.top - containerBounds.top + extraHeight;
                 dir = "bottom";
             } else {
                 top = 0;
@@ -410,7 +412,6 @@
         },
 
         getBottomAdaptPosition: function (combo, popup, extraHeight, needAdaptHeight) {
-            var comboOffset = combo.element.offset();
             var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(),
                 windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
             if (BI.DOM.isBottomSpaceEnough(combo, popup, extraHeight)) {
@@ -418,8 +419,8 @@
             }
             if (needAdaptHeight) {
                 return {
-                    top: comboOffset.top + comboBounds.height + extraHeight,
-                    adaptHeight: windowBounds.height - comboOffset.top - comboBounds.height - extraHeight
+                    top: comboBounds.top + comboBounds.height + extraHeight,
+                    adaptHeight: windowBounds.height - comboBounds.top - comboBounds.height - extraHeight
                 };
             }
             if (popupBounds.height + extraHeight > windowBounds.height) {
@@ -433,17 +434,18 @@
             };
         },
 
-        getCenterAdaptPosition: function (combo, popup) {
-            var comboOffset = combo.element.offset();
-            var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(),
-                windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
+        getCenterAdaptPosition: function (combo, popup, positionRelativeElement) {
+            var comboRect = combo.element[0].getBoundingClientRect(),
+                popupRect = popup.element[0].getBoundingClientRect(),
+                positionRelativeElementRect = positionRelativeElement.getBoundingClientRect(),
+                viewportBounds = document.documentElement.getBoundingClientRect();
             var left;
-            if (comboOffset.left + comboBounds.width / 2 + popupBounds.width / 2 > windowBounds.width) {
-                left = windowBounds.width - popupBounds.width;
+            if (comboRect.left + comboRect.width / 2 + popupRect.width / 2 > viewportBounds.width) {
+                left = viewportBounds.width - comboRect.width - positionRelativeElementRect.left;
             } else {
-                left = comboOffset.left + comboBounds.width / 2 - popupBounds.width / 2;
+                left = comboRect.left + (comboRect.width - popupRect.width) / 2 - positionRelativeElementRect.left;
             }
-            if (left < 0) {
+            if (left + positionRelativeElementRect.left < 0) {
                 left = 0;
             }
             return {
@@ -451,17 +453,19 @@
             };
         },
 
-        getMiddleAdaptPosition: function (combo, popup) {
-            var comboOffset = combo.element.offset();
-            var comboBounds = combo.element.bounds(), popupBounds = popup.element.bounds(),
-                windowBounds = BI.Widget._renderEngine.createElement("body").bounds();
+        getMiddleAdaptPosition: function (combo, popup, positionRelativeElement) {
+            var comboRect = combo.element[0].getBoundingClientRect(),
+                popupRect = popup.element[0].getBoundingClientRect(),
+                positionRelativeElementRect = positionRelativeElement.getBoundingClientRect(),
+                viewportBounds = document.documentElement.getBoundingClientRect();
+
             var top;
-            if (comboOffset.top + comboBounds.height / 2 + popupBounds.height / 2 > windowBounds.height) {
-                top = windowBounds.height - popupBounds.height;
+            if (comboRect.top + comboRect.height / 2 + popupRect.height / 2 > viewportBounds.height) {
+                top = viewportBounds.height - popupRect.height - positionRelativeElementRect.top;
             } else {
-                top = comboOffset.top + comboBounds.height / 2 - popupBounds.height / 2;
+                top = comboRect.top + (comboRect.height - popupRect.height) / 2 - positionRelativeElementRect.top;
             }
-            if (top < 0) {
+            if (top + positionRelativeElementRect.top < 0) {
                 top = 0;
             }
             return {
@@ -681,19 +685,19 @@
             switch (offsetStyle) {
                 case "center":
                     if (position.change) {
-                        var p = BI.DOM.getMiddleAdaptPosition(combo, popup);
+                        var p = BI.DOM.getMiddleAdaptPosition(combo, popup, positionRelativeElement);
                         position.top = p.top;
                     } else {
-                        var p = BI.DOM.getCenterAdaptPosition(combo, popup);
+                        var p = BI.DOM.getCenterAdaptPosition(combo, popup, positionRelativeElement);
                         position.left = p.left;
                     }
                     break;
                 case "middle":
                     if (position.change) {
-                        var p = BI.DOM.getCenterAdaptPosition(combo, popup);
+                        var p = BI.DOM.getCenterAdaptPosition(combo, popup, positionRelativeElement);
                         position.left = p.left;
                     } else {
-                        var p = BI.DOM.getMiddleAdaptPosition(combo, popup);
+                        var p = BI.DOM.getMiddleAdaptPosition(combo, popup, positionRelativeElement);
                         position.top = p.top;
                     }
                     break;
@@ -729,5 +733,19 @@
 
             return BI.DOM.getPositionRelativeContainingBlock(element.parentNode);
         },
+
+        /**
+         * 获取position:fixed相对定位的元素的clientRect
+         */
+        getPositionRelativeContainingBlockRect: function (element) {
+            var positionRelativeElement = BI.DOM.getPositionRelativeContainingBlock(element);
+            var rect = positionRelativeElement.getBoundingClientRect();
+
+            return {
+                ...rect.toJSON(),
+                scaleX: rect.width / positionRelativeElement.offsetWidth,
+                scaleY: rect.height / positionRelativeElement.offsetHeight
+            };
+        },
     });
 })();

src/core/platform/web/function.js

@@ -140,8 +140,9 @@ BI._.extend(BI, {
     },
 
     getMinimumFontSize: function () {
+        // not work for firefox
         const el = document.createElement('div');
-        el.style.fontSize = "0px";
+        el.style.fontSize = "1px";
         document.body.appendChild(el);
         const size = getComputedStyle(el).fontSize;
         el.remove();

src/widget/numbereditor/number.editor.js

@@ -18,7 +18,8 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
             errorText: "",
             step: 1,
             min: BI.MIN,
-            max: BI.MAX
+            max: BI.MAX,
+            watermark: "",
         });
     },
 
@@ -30,6 +31,7 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
             height: BI.toPix(o.height, 2),
             simple: o.simple,
             allowBlank: o.allowBlank,
+            watermark: o.watermark,
             value: o.valueFormatter(o.value),
             validationChecker: function (v) {
                 // 不设置validationChecker就自动检测
@@ -89,12 +91,14 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
             type: "bi.htape",
             height: BI.toPix(o.height, 2),
             element: this,
-            items: [this.editor, {
+            items: [
+                this.editor, {
                     el: {
                         type: "bi.grid",
                         columns: 1,
                         rows: 2,
-                    items: [{
+                        items: [
+                            {
                                 column: 0,
                                 row: 0,
                                 el: this.topBtn
@@ -102,10 +106,12 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
                                 column: 0,
                                 row: 1,
                                 el: this.bottomBtn
-                    }]
+                            }
+                        ]
                     },
                     width: 23
-            }]
+                }
+            ]
         });
     },
 
@@ -117,13 +123,13 @@ BI.NumberEditor = BI.inherit(BI.Widget, {
         return this.editor.isEditing();
     },
 
-    _checkValueInRange: function(v) {
+    _checkValueInRange: function (v) {
         var o = this.options;
         return !!(BI.isNumeric(v) && BI.parseFloat(v) >= o.min && BI.parseFloat(v) <= o.max);
     },
 
-    _checkAdjustDisabled: function(v) {
-        if(this.options.validationChecker === BI.emptyFn) {
+    _checkAdjustDisabled: function (v) {
+        if (this.options.validationChecker === BI.emptyFn) {
             this.bottomBtn.setEnable(BI.parseFloat(v) > this.options.min);
             this.topBtn.setEnable(BI.parseFloat(v) < this.options.max);
         }