vrembem 1.35.1 → 1.37.0

package/dev/scripts.umd.js

@@ -66,6 +66,8 @@
     });
   };
 
+  var focusableSelectors = ['a[href]:not([tabindex^="-"])', 'area[href]:not([tabindex^="-"])', 'input:not([type="hidden"]):not([type="radio"]):not([disabled]):not([tabindex^="-"])', 'input[type="radio"]:not([disabled]):not([tabindex^="-"])', 'select:not([disabled]):not([tabindex^="-"])', 'textarea:not([disabled]):not([tabindex^="-"])', 'button:not([disabled]):not([tabindex^="-"])', 'iframe:not([tabindex^="-"])', 'audio[controls]:not([tabindex^="-"])', 'video[controls]:not([tabindex^="-"])', '[contenteditable]:not([tabindex^="-"])', '[tabindex]:not([tabindex^="-"])'];
+
   var focusTarget = function focusTarget(target, settings) {
     var innerFocus = target.querySelector("[data-" + settings.dataFocus + "]");
 
@@ -118,6 +120,28 @@
       this.target = null;
     };
 
+    _proto.refresh = function refresh() {
+      // Check if a target has been set
+      if (!this.target) return; // Remove existing  events
+
+      this.target.removeEventListener('keydown', this.__handlerFocusTrap);
+      this.target.removeEventListener('keydown', this.handlerFocusLock); // Get the focusable elements
+
+      this.focusable = this.getFocusable(); // Setup the focus handlers based on focusable length
+
+      if (this.focusable.length) {
+        // If there are focusable elements, setup focus trap
+        this.focusableFirst = this.focusable[0];
+        this.focusableLast = this.focusable[this.focusable.length - 1];
+        this.target.addEventListener('keydown', this.__handlerFocusTrap);
+      } else {
+        // If there are no focusable elements, setup focus lock
+        this.focusableFirst = null;
+        this.focusableLast = null;
+        this.target.addEventListener('keydown', this.handlerFocusLock);
+      }
+    };
+
     _proto.handlerFocusTrap = function handlerFocusTrap(event) {
       var isTab = event.key === 'Tab' || event.keyCode === 9;
       if (!isTab) return;
@@ -144,7 +168,7 @@
       var focusable = [];
       var initFocus = document.activeElement;
       var initScrollTop = this.inner ? this.inner.scrollTop : 0;
-      this.target.querySelectorAll('a[href]:not([disabled]),button:not([disabled]),textarea:not([disabled]),input[type="text"]:not([disabled]),input[type="radio"]:not([disabled]),input[type="checkbox"]:not([disabled]),select:not([disabled]),[tabindex]:not([tabindex="-1"])').forEach(function (el) {
+      this.target.querySelectorAll(focusableSelectors.join(',')).forEach(function (el) {
         el.focus();
 
         if (el === document.activeElement) {
@@ -879,6 +903,7 @@
 
             focusTarget(drawer, _this4.settings);
             drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
+              detail: _this4,
               bubbles: true
             }));
             _this4.working = false;
@@ -917,6 +942,7 @@
             _this6.focusTrap.destroy();
 
             drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
+              detail: _this6,
               bubbles: true
             }));
             _this6.working = false;
@@ -963,10 +989,6 @@
 
   var handlerClick$1 = function handlerClick(event) {
     try {
-      var _exit2;
-
-      var _this2 = this;
-
       var _temp3 = function _temp3(_result) {
         if (_exit2) return _result;
 
@@ -985,6 +1007,10 @@
         }
       };
 
+      var _exit2;
+
+      var _this2 = this;
+
       // Working catch
       if (_this2.working) return Promise.resolve(); // Trigger click
 
@@ -1151,6 +1177,7 @@
             focusTarget(modal, _this2.settings);
             setInert(true, _this2.settings.selectorInert);
             modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
+              detail: _this2,
               bubbles: true
             }));
             _this2.working = false;
@@ -1184,6 +1211,7 @@
             _this4.focusTrap.destroy();
 
             modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
+              detail: _this4,
               bubbles: true
             }));
             _this4.working = false;
@@ -1599,17 +1627,39 @@
     return placement.split('-')[0];
   }
 
-  function getBoundingClientRect(element) {
+  // import { isHTMLElement } from './instanceOf';
+  function getBoundingClientRect(element, // eslint-disable-next-line unused-imports/no-unused-vars
+  includeScale) {
+
     var rect = element.getBoundingClientRect();
+    var scaleX = 1;
+    var scaleY = 1; // FIXME:
+    // `offsetWidth` returns an integer while `getBoundingClientRect`
+    // returns a float. This results in `scaleX` or `scaleY` being
+    // non-1 when it should be for elements that aren't a full pixel in
+    // width or height.
+    // if (isHTMLElement(element) && includeScale) {
+    //   const offsetHeight = element.offsetHeight;
+    //   const offsetWidth = element.offsetWidth;
+    //   // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
+    //   // Fallback to 1 in case both values are `0`
+    //   if (offsetWidth > 0) {
+    //     scaleX = rect.width / offsetWidth || 1;
+    //   }
+    //   if (offsetHeight > 0) {
+    //     scaleY = rect.height / offsetHeight || 1;
+    //   }
+    // }
+
     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
+      width: rect.width / scaleX,
+      height: rect.height / scaleY,
+      top: rect.top / scaleY,
+      right: rect.right / scaleX,
+      bottom: rect.bottom / scaleY,
+      left: rect.left / scaleX,
+      x: rect.left / scaleX,
+      y: rect.top / scaleY
     };
   }
 
@@ -1864,6 +1914,10 @@
     requiresIfExists: ['preventOverflow']
   };
 
+  function getVariation(placement) {
+    return placement.split('-')[1];
+  }
+
   var unsetSides = {
     top: 'auto',
     right: 'auto',
@@ -1890,6 +1944,7 @@
     var popper = _ref2.popper,
         popperRect = _ref2.popperRect,
         placement = _ref2.placement,
+        variation = _ref2.variation,
         offsets = _ref2.offsets,
         position = _ref2.position,
         gpuAcceleration = _ref2.gpuAcceleration,
@@ -1916,7 +1971,7 @@
       if (offsetParent === getWindow(popper)) {
         offsetParent = getDocumentElement(popper);
 
-        if (getComputedStyle$1(offsetParent).position !== 'static') {
+        if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
           heightProp = 'scrollHeight';
           widthProp = 'scrollWidth';
         }
@@ -1925,14 +1980,14 @@
 
       offsetParent = offsetParent;
 
-      if (placement === top) {
+      if (placement === top || (placement === left || placement === right) && variation === end) {
         sideY = bottom; // $FlowFixMe[prop-missing]
 
         y -= offsetParent[heightProp] - popperRect.height;
         y *= gpuAcceleration ? 1 : -1;
       }
 
-      if (placement === left) {
+      if (placement === left || (placement === top || placement === bottom) && variation === end) {
         sideX = right; // $FlowFixMe[prop-missing]
 
         x -= offsetParent[widthProp] - popperRect.width;
@@ -1947,7 +2002,7 @@
     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));
@@ -1965,6 +2020,7 @@
 
     var commonStyles = {
       placement: getBasePlacement(state.placement),
+      variation: getVariation(state.placement),
       popper: state.elements.popper,
       popperRect: state.rects.popper,
       gpuAcceleration: gpuAcceleration
@@ -2267,10 +2323,6 @@
     return clippingRect;
   }
 
-  function getVariation(placement) {
-    return placement.split('-')[1];
-  }
-
   function computeOffsets(_ref) {
     var reference = _ref.reference,
         element = _ref.element,
@@ -2356,11 +2408,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 referenceClientRect = getBoundingClientRect(state.elements.reference);
     var popperOffsets = computeOffsets({
       reference: referenceClientRect,
       element: popperRect,
@@ -2837,16 +2888,24 @@
     }
   }
 
+  function isElementScaled(element) {
+    var rect = element.getBoundingClientRect();
+    var scaleX = rect.width / element.offsetWidth || 1;
+    var scaleY = 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 isOffsetParentAnElement = isHTMLElement(offsetParent);
+    isHTMLElement(offsetParent) && isElementScaled(offsetParent);
     var documentElement = getDocumentElement(offsetParent);
     var rect = getBoundingClientRect(elementOrVirtualElement);
-    var isOffsetParentAnElement = isHTMLElement(offsetParent);
     var scroll = {
       scrollLeft: 0,
       scrollTop: 0
@@ -3000,7 +3059,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 = {