vrembem 1.36.0 → 1.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -66,6 +66,8 @@
66
66
  });
67
67
  };
68
68
 
69
+ 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^="-"])'];
70
+
69
71
  var focusTarget = function focusTarget(target, settings) {
70
72
  var innerFocus = target.querySelector("[data-" + settings.dataFocus + "]");
71
73
 
@@ -118,6 +120,28 @@
118
120
  this.target = null;
119
121
  };
120
122
 
123
+ _proto.refresh = function refresh() {
124
+ // Check if a target has been set
125
+ if (!this.target) return; // Remove existing events
126
+
127
+ this.target.removeEventListener('keydown', this.__handlerFocusTrap);
128
+ this.target.removeEventListener('keydown', this.handlerFocusLock); // Get the focusable elements
129
+
130
+ this.focusable = this.getFocusable(); // Setup the focus handlers based on focusable length
131
+
132
+ if (this.focusable.length) {
133
+ // If there are focusable elements, setup focus trap
134
+ this.focusableFirst = this.focusable[0];
135
+ this.focusableLast = this.focusable[this.focusable.length - 1];
136
+ this.target.addEventListener('keydown', this.__handlerFocusTrap);
137
+ } else {
138
+ // If there are no focusable elements, setup focus lock
139
+ this.focusableFirst = null;
140
+ this.focusableLast = null;
141
+ this.target.addEventListener('keydown', this.handlerFocusLock);
142
+ }
143
+ };
144
+
121
145
  _proto.handlerFocusTrap = function handlerFocusTrap(event) {
122
146
  var isTab = event.key === 'Tab' || event.keyCode === 9;
123
147
  if (!isTab) return;
@@ -144,7 +168,7 @@
144
168
  var focusable = [];
145
169
  var initFocus = document.activeElement;
146
170
  var initScrollTop = this.inner ? this.inner.scrollTop : 0;
147
- 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) {
171
+ this.target.querySelectorAll(focusableSelectors.join(',')).forEach(function (el) {
148
172
  el.focus();
149
173
 
150
174
  if (el === document.activeElement) {
@@ -332,14 +356,6 @@
332
356
  });
333
357
  };
334
358
 
335
- var breakpoints = {
336
- xs: '480px',
337
- sm: '620px',
338
- md: '760px',
339
- lg: '990px',
340
- xl: '1380px'
341
- };
342
-
343
359
  var index = {
344
360
  __proto__: null,
345
361
  setInert: setInert,
@@ -357,8 +373,7 @@
357
373
  removeClass: removeClass,
358
374
  toggleClass: toggleClass,
359
375
  openTransition: openTransition,
360
- closeTransition: closeTransition,
361
- breakpoints: breakpoints
376
+ closeTransition: closeTransition
362
377
  };
363
378
 
364
379
  function _extends() {
@@ -476,7 +491,7 @@
476
491
  selectorInert: null,
477
492
  selectorOverflow: null,
478
493
  // Feature toggles
479
- breakpoints: breakpoints,
494
+ breakpoints: null,
480
495
  customEventPrefix: 'drawer:',
481
496
  eventListeners: true,
482
497
  stateSave: true,
@@ -538,6 +553,7 @@
538
553
  function Breakpoint(parent) {
539
554
  this.mediaQueryLists = [];
540
555
  this.parent = parent;
556
+ this.prefix = this.getVariablePrefix();
541
557
  this.__check = this.check.bind(this);
542
558
  }
543
559
 
@@ -550,7 +566,9 @@
550
566
  drawers.forEach(function (drawer) {
551
567
  var id = drawer.getAttribute("data-" + _this.parent.settings.dataDrawer);
552
568
  var key = drawer.getAttribute("data-" + _this.parent.settings.dataBreakpoint);
553
- var bp = _this.parent.settings.breakpoints[key] ? _this.parent.settings.breakpoints[key] : key;
569
+
570
+ var bp = _this.getBreakpoint(key);
571
+
554
572
  var mql = window.matchMedia('(min-width:' + bp + ')');
555
573
 
556
574
  _this.match(mql, drawer);
@@ -606,6 +624,25 @@
606
624
  }
607
625
  };
608
626
 
627
+ _proto.getBreakpoint = function getBreakpoint(key) {
628
+ var breakpoint = key;
629
+
630
+ if (this.parent.settings.breakpoints && this.parent.settings.breakpoints[key]) {
631
+ breakpoint = this.parent.settings.breakpoints[key];
632
+ } else if (getComputedStyle(document.body).getPropertyValue(this.prefix + key)) {
633
+ breakpoint = getComputedStyle(document.body).getPropertyValue(this.prefix + key);
634
+ }
635
+
636
+ return breakpoint;
637
+ };
638
+
639
+ _proto.getVariablePrefix = function getVariablePrefix() {
640
+ var prefix = '--';
641
+ prefix += getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
642
+ prefix += 'breakpoint-';
643
+ return prefix;
644
+ };
645
+
609
646
  return Breakpoint;
610
647
  }();
611
648
 
@@ -879,6 +916,7 @@
879
916
 
880
917
  focusTarget(drawer, _this4.settings);
881
918
  drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
919
+ detail: _this4,
882
920
  bubbles: true
883
921
  }));
884
922
  _this4.working = false;
@@ -917,6 +955,7 @@
917
955
  _this6.focusTrap.destroy();
918
956
 
919
957
  drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
958
+ detail: _this6,
920
959
  bubbles: true
921
960
  }));
922
961
  _this6.working = false;
@@ -963,10 +1002,6 @@
963
1002
 
964
1003
  var handlerClick$1 = function handlerClick(event) {
965
1004
  try {
966
- var _exit2;
967
-
968
- var _this2 = this;
969
-
970
1005
  var _temp3 = function _temp3(_result) {
971
1006
  if (_exit2) return _result;
972
1007
 
@@ -985,6 +1020,10 @@
985
1020
  }
986
1021
  };
987
1022
 
1023
+ var _exit2;
1024
+
1025
+ var _this2 = this;
1026
+
988
1027
  // Working catch
989
1028
  if (_this2.working) return Promise.resolve(); // Trigger click
990
1029
 
@@ -1151,6 +1190,7 @@
1151
1190
  focusTarget(modal, _this2.settings);
1152
1191
  setInert(true, _this2.settings.selectorInert);
1153
1192
  modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
1193
+ detail: _this2,
1154
1194
  bubbles: true
1155
1195
  }));
1156
1196
  _this2.working = false;
@@ -1184,6 +1224,7 @@
1184
1224
  _this4.focusTrap.destroy();
1185
1225
 
1186
1226
  modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
1227
+ detail: _this4,
1187
1228
  bubbles: true
1188
1229
  }));
1189
1230
  _this4.working = false;
@@ -1278,7 +1319,8 @@
1278
1319
 
1279
1320
  for (var prop in config) {
1280
1321
  // Get the CSS variable property values
1281
- var val = styles.getPropertyValue("--popover-" + prop).trim(); // If a value was found, replace the default in config obj
1322
+ var prefix = getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
1323
+ var val = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
1282
1324
 
1283
1325
  if (val) {
1284
1326
  config[prop] = val;
@@ -1599,17 +1641,42 @@
1599
1641
  return placement.split('-')[0];
1600
1642
  }
1601
1643
 
1602
- function getBoundingClientRect(element) {
1644
+ var max = Math.max;
1645
+ var min = Math.min;
1646
+ var round = Math.round;
1647
+
1648
+ function getBoundingClientRect(element, includeScale) {
1649
+ if (includeScale === void 0) {
1650
+ includeScale = false;
1651
+ }
1652
+
1603
1653
  var rect = element.getBoundingClientRect();
1654
+ var scaleX = 1;
1655
+ var scaleY = 1;
1656
+
1657
+ if (isHTMLElement(element) && includeScale) {
1658
+ var offsetHeight = element.offsetHeight;
1659
+ var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
1660
+ // Fallback to 1 in case both values are `0`
1661
+
1662
+ if (offsetWidth > 0) {
1663
+ scaleX = round(rect.width) / offsetWidth || 1;
1664
+ }
1665
+
1666
+ if (offsetHeight > 0) {
1667
+ scaleY = round(rect.height) / offsetHeight || 1;
1668
+ }
1669
+ }
1670
+
1604
1671
  return {
1605
- width: rect.width,
1606
- height: rect.height,
1607
- top: rect.top,
1608
- right: rect.right,
1609
- bottom: rect.bottom,
1610
- left: rect.left,
1611
- x: rect.left,
1612
- y: rect.top
1672
+ width: rect.width / scaleX,
1673
+ height: rect.height / scaleY,
1674
+ top: rect.top / scaleY,
1675
+ right: rect.right / scaleX,
1676
+ bottom: rect.bottom / scaleY,
1677
+ left: rect.left / scaleX,
1678
+ x: rect.left / scaleX,
1679
+ y: rect.top / scaleY
1613
1680
  };
1614
1681
  }
1615
1682
 
@@ -1754,13 +1821,13 @@
1754
1821
  return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
1755
1822
  }
1756
1823
 
1757
- var max = Math.max;
1758
- var min = Math.min;
1759
- var round = Math.round;
1760
-
1761
1824
  function within(min$1, value, max$1) {
1762
1825
  return max(min$1, min(value, max$1));
1763
1826
  }
1827
+ function withinMaxClamp(min, value, max) {
1828
+ var v = within(min, value, max);
1829
+ return v > max ? max : v;
1830
+ }
1764
1831
 
1765
1832
  function getFreshSideObject() {
1766
1833
  return {
@@ -1864,6 +1931,10 @@
1864
1931
  requiresIfExists: ['preventOverflow']
1865
1932
  };
1866
1933
 
1934
+ function getVariation(placement) {
1935
+ return placement.split('-')[1];
1936
+ }
1937
+
1867
1938
  var unsetSides = {
1868
1939
  top: 'auto',
1869
1940
  right: 'auto',
@@ -1879,8 +1950,8 @@
1879
1950
  var win = window;
1880
1951
  var dpr = win.devicePixelRatio || 1;
1881
1952
  return {
1882
- x: round(round(x * dpr) / dpr) || 0,
1883
- y: round(round(y * dpr) / dpr) || 0
1953
+ x: round(x * dpr) / dpr || 0,
1954
+ y: round(y * dpr) / dpr || 0
1884
1955
  };
1885
1956
  }
1886
1957
 
@@ -1890,18 +1961,28 @@
1890
1961
  var popper = _ref2.popper,
1891
1962
  popperRect = _ref2.popperRect,
1892
1963
  placement = _ref2.placement,
1964
+ variation = _ref2.variation,
1893
1965
  offsets = _ref2.offsets,
1894
1966
  position = _ref2.position,
1895
1967
  gpuAcceleration = _ref2.gpuAcceleration,
1896
1968
  adaptive = _ref2.adaptive,
1897
- roundOffsets = _ref2.roundOffsets;
1898
-
1899
- var _ref3 = roundOffsets === true ? roundOffsetsByDPR(offsets) : typeof roundOffsets === 'function' ? roundOffsets(offsets) : offsets,
1900
- _ref3$x = _ref3.x,
1901
- x = _ref3$x === void 0 ? 0 : _ref3$x,
1902
- _ref3$y = _ref3.y,
1903
- y = _ref3$y === void 0 ? 0 : _ref3$y;
1969
+ roundOffsets = _ref2.roundOffsets,
1970
+ isFixed = _ref2.isFixed;
1971
+ var _offsets$x = offsets.x,
1972
+ x = _offsets$x === void 0 ? 0 : _offsets$x,
1973
+ _offsets$y = offsets.y,
1974
+ y = _offsets$y === void 0 ? 0 : _offsets$y;
1975
+
1976
+ var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
1977
+ x: x,
1978
+ y: y
1979
+ }) : {
1980
+ x: x,
1981
+ y: y
1982
+ };
1904
1983
 
1984
+ x = _ref3.x;
1985
+ y = _ref3.y;
1905
1986
  var hasX = offsets.hasOwnProperty('x');
1906
1987
  var hasY = offsets.hasOwnProperty('y');
1907
1988
  var sideX = left;
@@ -1916,7 +1997,7 @@
1916
1997
  if (offsetParent === getWindow(popper)) {
1917
1998
  offsetParent = getDocumentElement(popper);
1918
1999
 
1919
- if (getComputedStyle$1(offsetParent).position !== 'static') {
2000
+ if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
1920
2001
  heightProp = 'scrollHeight';
1921
2002
  widthProp = 'scrollWidth';
1922
2003
  }
@@ -1925,17 +2006,19 @@
1925
2006
 
1926
2007
  offsetParent = offsetParent;
1927
2008
 
1928
- if (placement === top) {
1929
- sideY = bottom; // $FlowFixMe[prop-missing]
1930
-
1931
- y -= offsetParent[heightProp] - popperRect.height;
2009
+ if (placement === top || (placement === left || placement === right) && variation === end) {
2010
+ sideY = bottom;
2011
+ var offsetY = isFixed && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
2012
+ offsetParent[heightProp];
2013
+ y -= offsetY - popperRect.height;
1932
2014
  y *= gpuAcceleration ? 1 : -1;
1933
2015
  }
1934
2016
 
1935
- if (placement === left) {
1936
- sideX = right; // $FlowFixMe[prop-missing]
1937
-
1938
- x -= offsetParent[widthProp] - popperRect.width;
2017
+ if (placement === left || (placement === top || placement === bottom) && variation === end) {
2018
+ sideX = right;
2019
+ var offsetX = isFixed && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
2020
+ offsetParent[widthProp];
2021
+ x -= offsetX - popperRect.width;
1939
2022
  x *= gpuAcceleration ? 1 : -1;
1940
2023
  }
1941
2024
  }
@@ -1944,18 +2027,29 @@
1944
2027
  position: position
1945
2028
  }, adaptive && unsetSides);
1946
2029
 
2030
+ var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
2031
+ x: x,
2032
+ y: y
2033
+ }) : {
2034
+ x: x,
2035
+ y: y
2036
+ };
2037
+
2038
+ x = _ref4.x;
2039
+ y = _ref4.y;
2040
+
1947
2041
  if (gpuAcceleration) {
1948
2042
  var _Object$assign;
1949
2043
 
1950
- 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));
2044
+ 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));
1951
2045
  }
1952
2046
 
1953
2047
  return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
1954
2048
  }
1955
2049
 
1956
- function computeStyles(_ref4) {
1957
- var state = _ref4.state,
1958
- options = _ref4.options;
2050
+ function computeStyles(_ref5) {
2051
+ var state = _ref5.state,
2052
+ options = _ref5.options;
1959
2053
  var _options$gpuAccelerat = options.gpuAcceleration,
1960
2054
  gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
1961
2055
  _options$adaptive = options.adaptive,
@@ -1965,9 +2059,11 @@
1965
2059
 
1966
2060
  var commonStyles = {
1967
2061
  placement: getBasePlacement(state.placement),
2062
+ variation: getVariation(state.placement),
1968
2063
  popper: state.elements.popper,
1969
2064
  popperRect: state.rects.popper,
1970
- gpuAcceleration: gpuAcceleration
2065
+ gpuAcceleration: gpuAcceleration,
2066
+ isFixed: state.options.strategy === 'fixed'
1971
2067
  };
1972
2068
 
1973
2069
  if (state.modifiersData.popperOffsets != null) {
@@ -2225,7 +2321,7 @@
2225
2321
  }
2226
2322
 
2227
2323
  function getClientRectFromMixedType(element, clippingParent) {
2228
- return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isHTMLElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
2324
+ return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
2229
2325
  } // A "clipping parent" is an overflowable container with the characteristic of
2230
2326
  // clipping (or hiding) overflowing elements with a position different from
2231
2327
  // `initial`
@@ -2267,10 +2363,6 @@
2267
2363
  return clippingRect;
2268
2364
  }
2269
2365
 
2270
- function getVariation(placement) {
2271
- return placement.split('-')[1];
2272
- }
2273
-
2274
2366
  function computeOffsets(_ref) {
2275
2367
  var reference = _ref.reference,
2276
2368
  element = _ref.element,
@@ -2356,11 +2448,10 @@
2356
2448
  padding = _options$padding === void 0 ? 0 : _options$padding;
2357
2449
  var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
2358
2450
  var altContext = elementContext === popper ? reference : popper;
2359
- var referenceElement = state.elements.reference;
2360
2451
  var popperRect = state.rects.popper;
2361
2452
  var element = state.elements[altBoundary ? altContext : elementContext];
2362
2453
  var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
2363
- var referenceClientRect = getBoundingClientRect(referenceElement);
2454
+ var referenceClientRect = getBoundingClientRect(state.elements.reference);
2364
2455
  var popperOffsets = computeOffsets({
2365
2456
  reference: referenceClientRect,
2366
2457
  element: popperRect,
@@ -2743,6 +2834,14 @@
2743
2834
  var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
2744
2835
  placement: state.placement
2745
2836
  })) : tetherOffset;
2837
+ var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
2838
+ mainAxis: tetherOffsetValue,
2839
+ altAxis: tetherOffsetValue
2840
+ } : Object.assign({
2841
+ mainAxis: 0,
2842
+ altAxis: 0
2843
+ }, tetherOffsetValue);
2844
+ var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
2746
2845
  var data = {
2747
2846
  x: 0,
2748
2847
  y: 0
@@ -2752,13 +2851,15 @@
2752
2851
  return;
2753
2852
  }
2754
2853
 
2755
- if (checkMainAxis || checkAltAxis) {
2854
+ if (checkMainAxis) {
2855
+ var _offsetModifierState$;
2856
+
2756
2857
  var mainSide = mainAxis === 'y' ? top : left;
2757
2858
  var altSide = mainAxis === 'y' ? bottom : right;
2758
2859
  var len = mainAxis === 'y' ? 'height' : 'width';
2759
2860
  var offset = popperOffsets[mainAxis];
2760
- var min$1 = popperOffsets[mainAxis] + overflow[mainSide];
2761
- var max$1 = popperOffsets[mainAxis] - overflow[altSide];
2861
+ var min$1 = offset + overflow[mainSide];
2862
+ var max$1 = offset - overflow[altSide];
2762
2863
  var additive = tether ? -popperRect[len] / 2 : 0;
2763
2864
  var minLen = variation === start ? referenceRect[len] : popperRect[len];
2764
2865
  var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
@@ -2778,36 +2879,45 @@
2778
2879
  // width or height)
2779
2880
 
2780
2881
  var arrowLen = within(0, referenceRect[len], arrowRect[len]);
2781
- var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - tetherOffsetValue : minLen - arrowLen - arrowPaddingMin - tetherOffsetValue;
2782
- var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + tetherOffsetValue : maxLen + arrowLen + arrowPaddingMax + tetherOffsetValue;
2882
+ var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
2883
+ var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
2783
2884
  var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
2784
2885
  var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
2785
- var offsetModifierValue = state.modifiersData.offset ? state.modifiersData.offset[state.placement][mainAxis] : 0;
2786
- var tetherMin = popperOffsets[mainAxis] + minOffset - offsetModifierValue - clientOffset;
2787
- var tetherMax = popperOffsets[mainAxis] + maxOffset - offsetModifierValue;
2886
+ var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
2887
+ var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
2888
+ var tetherMax = offset + maxOffset - offsetModifierValue;
2889
+ var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
2890
+ popperOffsets[mainAxis] = preventedOffset;
2891
+ data[mainAxis] = preventedOffset - offset;
2892
+ }
2788
2893
 
2789
- if (checkMainAxis) {
2790
- var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
2791
- popperOffsets[mainAxis] = preventedOffset;
2792
- data[mainAxis] = preventedOffset - offset;
2793
- }
2894
+ if (checkAltAxis) {
2895
+ var _offsetModifierState$2;
2794
2896
 
2795
- if (checkAltAxis) {
2796
- var _mainSide = mainAxis === 'x' ? top : left;
2897
+ var _mainSide = mainAxis === 'x' ? top : left;
2797
2898
 
2798
- var _altSide = mainAxis === 'x' ? bottom : right;
2899
+ var _altSide = mainAxis === 'x' ? bottom : right;
2799
2900
 
2800
- var _offset = popperOffsets[altAxis];
2901
+ var _offset = popperOffsets[altAxis];
2801
2902
 
2802
- var _min = _offset + overflow[_mainSide];
2903
+ var _len = altAxis === 'y' ? 'height' : 'width';
2803
2904
 
2804
- var _max = _offset - overflow[_altSide];
2905
+ var _min = _offset + overflow[_mainSide];
2805
2906
 
2806
- var _preventedOffset = within(tether ? min(_min, tetherMin) : _min, _offset, tether ? max(_max, tetherMax) : _max);
2907
+ var _max = _offset - overflow[_altSide];
2807
2908
 
2808
- popperOffsets[altAxis] = _preventedOffset;
2809
- data[altAxis] = _preventedOffset - _offset;
2810
- }
2909
+ var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
2910
+
2911
+ var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
2912
+
2913
+ var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
2914
+
2915
+ var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
2916
+
2917
+ var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
2918
+
2919
+ popperOffsets[altAxis] = _preventedOffset;
2920
+ data[altAxis] = _preventedOffset - _offset;
2811
2921
  }
2812
2922
 
2813
2923
  state.modifiersData[name] = data;
@@ -2837,16 +2947,24 @@
2837
2947
  }
2838
2948
  }
2839
2949
 
2950
+ function isElementScaled(element) {
2951
+ var rect = element.getBoundingClientRect();
2952
+ var scaleX = round(rect.width) / element.offsetWidth || 1;
2953
+ var scaleY = round(rect.height) / element.offsetHeight || 1;
2954
+ return scaleX !== 1 || scaleY !== 1;
2955
+ } // Returns the composite rect of an element relative to its offsetParent.
2840
2956
  // Composite means it takes into account transforms as well as layout.
2841
2957
 
2958
+
2842
2959
  function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
2843
2960
  if (isFixed === void 0) {
2844
2961
  isFixed = false;
2845
2962
  }
2846
2963
 
2847
- var documentElement = getDocumentElement(offsetParent);
2848
- var rect = getBoundingClientRect(elementOrVirtualElement);
2849
2964
  var isOffsetParentAnElement = isHTMLElement(offsetParent);
2965
+ var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
2966
+ var documentElement = getDocumentElement(offsetParent);
2967
+ var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
2850
2968
  var scroll = {
2851
2969
  scrollLeft: 0,
2852
2970
  scrollTop: 0
@@ -2863,7 +2981,7 @@
2863
2981
  }
2864
2982
 
2865
2983
  if (isHTMLElement(offsetParent)) {
2866
- offsets = getBoundingClientRect(offsetParent);
2984
+ offsets = getBoundingClientRect(offsetParent, true);
2867
2985
  offsets.x += offsetParent.clientLeft;
2868
2986
  offsets.y += offsetParent.clientTop;
2869
2987
  } else if (documentElement) {
@@ -3000,7 +3118,8 @@
3000
3118
  var isDestroyed = false;
3001
3119
  var instance = {
3002
3120
  state: state,
3003
- setOptions: function setOptions(options) {
3121
+ setOptions: function setOptions(setOptionsAction) {
3122
+ var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
3004
3123
  cleanupModifierEffects();
3005
3124
  state.options = Object.assign({}, defaultOptions, state.options, options);
3006
3125
  state.scrollParents = {