vrembem 1.36.1 → 1.40.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.
- package/dev/scripts.esm.js +236 -91
- package/dev/scripts.esm.js.map +1 -1
- package/dev/scripts.js +236 -91
- package/dev/scripts.js.map +1 -1
- package/dev/scripts.modern.js +228 -87
- package/dev/scripts.modern.js.map +1 -1
- package/dev/scripts.umd.js +236 -91
- package/dev/scripts.umd.js.map +1 -1
- package/dev/styles.css +54 -203
- package/dev/styles.css.map +1 -1
- package/dist/scripts.esm.js +1 -1
- package/dist/scripts.esm.js.map +1 -1
- package/dist/scripts.js +1 -1
- package/dist/scripts.js.map +1 -1
- package/dist/scripts.modern.js +1 -1
- package/dist/scripts.modern.js.map +1 -1
- package/dist/scripts.umd.js +1 -1
- package/dist/scripts.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/index.scss +0 -1
- package/package.json +26 -27
package/dev/scripts.umd.js
CHANGED
|
@@ -120,6 +120,28 @@
|
|
|
120
120
|
this.target = null;
|
|
121
121
|
};
|
|
122
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
|
+
|
|
123
145
|
_proto.handlerFocusTrap = function handlerFocusTrap(event) {
|
|
124
146
|
var isTab = event.key === 'Tab' || event.keyCode === 9;
|
|
125
147
|
if (!isTab) return;
|
|
@@ -334,14 +356,6 @@
|
|
|
334
356
|
});
|
|
335
357
|
};
|
|
336
358
|
|
|
337
|
-
var breakpoints = {
|
|
338
|
-
xs: '480px',
|
|
339
|
-
sm: '620px',
|
|
340
|
-
md: '760px',
|
|
341
|
-
lg: '990px',
|
|
342
|
-
xl: '1380px'
|
|
343
|
-
};
|
|
344
|
-
|
|
345
359
|
var index = {
|
|
346
360
|
__proto__: null,
|
|
347
361
|
setInert: setInert,
|
|
@@ -359,8 +373,7 @@
|
|
|
359
373
|
removeClass: removeClass,
|
|
360
374
|
toggleClass: toggleClass,
|
|
361
375
|
openTransition: openTransition,
|
|
362
|
-
closeTransition: closeTransition
|
|
363
|
-
breakpoints: breakpoints
|
|
376
|
+
closeTransition: closeTransition
|
|
364
377
|
};
|
|
365
378
|
|
|
366
379
|
function _extends() {
|
|
@@ -478,7 +491,7 @@
|
|
|
478
491
|
selectorInert: null,
|
|
479
492
|
selectorOverflow: null,
|
|
480
493
|
// Feature toggles
|
|
481
|
-
breakpoints:
|
|
494
|
+
breakpoints: null,
|
|
482
495
|
customEventPrefix: 'drawer:',
|
|
483
496
|
eventListeners: true,
|
|
484
497
|
stateSave: true,
|
|
@@ -540,6 +553,7 @@
|
|
|
540
553
|
function Breakpoint(parent) {
|
|
541
554
|
this.mediaQueryLists = [];
|
|
542
555
|
this.parent = parent;
|
|
556
|
+
this.prefix = this.getVariablePrefix();
|
|
543
557
|
this.__check = this.check.bind(this);
|
|
544
558
|
}
|
|
545
559
|
|
|
@@ -552,7 +566,9 @@
|
|
|
552
566
|
drawers.forEach(function (drawer) {
|
|
553
567
|
var id = drawer.getAttribute("data-" + _this.parent.settings.dataDrawer);
|
|
554
568
|
var key = drawer.getAttribute("data-" + _this.parent.settings.dataBreakpoint);
|
|
555
|
-
|
|
569
|
+
|
|
570
|
+
var bp = _this.getBreakpoint(key);
|
|
571
|
+
|
|
556
572
|
var mql = window.matchMedia('(min-width:' + bp + ')');
|
|
557
573
|
|
|
558
574
|
_this.match(mql, drawer);
|
|
@@ -608,6 +624,25 @@
|
|
|
608
624
|
}
|
|
609
625
|
};
|
|
610
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
|
+
|
|
611
646
|
return Breakpoint;
|
|
612
647
|
}();
|
|
613
648
|
|
|
@@ -881,6 +916,7 @@
|
|
|
881
916
|
|
|
882
917
|
focusTarget(drawer, _this4.settings);
|
|
883
918
|
drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
|
|
919
|
+
detail: _this4,
|
|
884
920
|
bubbles: true
|
|
885
921
|
}));
|
|
886
922
|
_this4.working = false;
|
|
@@ -919,6 +955,7 @@
|
|
|
919
955
|
_this6.focusTrap.destroy();
|
|
920
956
|
|
|
921
957
|
drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
|
|
958
|
+
detail: _this6,
|
|
922
959
|
bubbles: true
|
|
923
960
|
}));
|
|
924
961
|
_this6.working = false;
|
|
@@ -965,10 +1002,6 @@
|
|
|
965
1002
|
|
|
966
1003
|
var handlerClick$1 = function handlerClick(event) {
|
|
967
1004
|
try {
|
|
968
|
-
var _exit2;
|
|
969
|
-
|
|
970
|
-
var _this2 = this;
|
|
971
|
-
|
|
972
1005
|
var _temp3 = function _temp3(_result) {
|
|
973
1006
|
if (_exit2) return _result;
|
|
974
1007
|
|
|
@@ -987,6 +1020,10 @@
|
|
|
987
1020
|
}
|
|
988
1021
|
};
|
|
989
1022
|
|
|
1023
|
+
var _exit2;
|
|
1024
|
+
|
|
1025
|
+
var _this2 = this;
|
|
1026
|
+
|
|
990
1027
|
// Working catch
|
|
991
1028
|
if (_this2.working) return Promise.resolve(); // Trigger click
|
|
992
1029
|
|
|
@@ -1153,6 +1190,7 @@
|
|
|
1153
1190
|
focusTarget(modal, _this2.settings);
|
|
1154
1191
|
setInert(true, _this2.settings.selectorInert);
|
|
1155
1192
|
modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
|
|
1193
|
+
detail: _this2,
|
|
1156
1194
|
bubbles: true
|
|
1157
1195
|
}));
|
|
1158
1196
|
_this2.working = false;
|
|
@@ -1186,6 +1224,7 @@
|
|
|
1186
1224
|
_this4.focusTrap.destroy();
|
|
1187
1225
|
|
|
1188
1226
|
modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
|
|
1227
|
+
detail: _this4,
|
|
1189
1228
|
bubbles: true
|
|
1190
1229
|
}));
|
|
1191
1230
|
_this4.working = false;
|
|
@@ -1234,7 +1273,12 @@
|
|
|
1234
1273
|
var index = obj.collection.findIndex(function (item) {
|
|
1235
1274
|
return item.target === popover.target;
|
|
1236
1275
|
});
|
|
1237
|
-
obj.collection[index].state = 'hide'; //
|
|
1276
|
+
obj.collection[index].state = 'hide'; // Clear the memory if popover trigger matches the ones saved in memory
|
|
1277
|
+
|
|
1278
|
+
if (popover.trigger === obj.memory.trigger) {
|
|
1279
|
+
obj.memory.trigger = null;
|
|
1280
|
+
} // Return the popover
|
|
1281
|
+
|
|
1238
1282
|
|
|
1239
1283
|
return popover;
|
|
1240
1284
|
}
|
|
@@ -1248,7 +1292,9 @@
|
|
|
1248
1292
|
return obj.collection;
|
|
1249
1293
|
}
|
|
1250
1294
|
function hideCheck(popover, obj) {
|
|
1251
|
-
//
|
|
1295
|
+
// Only run hideCheck if provided popover is currently open
|
|
1296
|
+
if (popover.state != 'show') return; // Needed to correctly check which element is currently being focused
|
|
1297
|
+
|
|
1252
1298
|
setTimeout(function () {
|
|
1253
1299
|
// Check if trigger or target are being hovered
|
|
1254
1300
|
var isHovered = popover.target.closest(':hover') === popover.target || popover.trigger.closest(':hover') === popover.trigger; // Check if trigger or target are being focused
|
|
@@ -1280,7 +1326,8 @@
|
|
|
1280
1326
|
|
|
1281
1327
|
for (var prop in config) {
|
|
1282
1328
|
// Get the CSS variable property values
|
|
1283
|
-
var
|
|
1329
|
+
var prefix = getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
|
|
1330
|
+
var val = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
|
|
1284
1331
|
|
|
1285
1332
|
if (val) {
|
|
1286
1333
|
config[prop] = val;
|
|
@@ -1417,13 +1464,31 @@
|
|
|
1417
1464
|
if (popover.target.classList.contains(this.settings.stateActive)) {
|
|
1418
1465
|
hide$2(popover, this);
|
|
1419
1466
|
} else {
|
|
1467
|
+
this.memory.trigger = popover.trigger;
|
|
1420
1468
|
show(popover, this);
|
|
1421
1469
|
documentClick(popover, this);
|
|
1422
1470
|
}
|
|
1423
1471
|
}
|
|
1424
1472
|
function handlerKeydown(event) {
|
|
1425
|
-
|
|
1426
|
-
|
|
1473
|
+
var _this = this;
|
|
1474
|
+
|
|
1475
|
+
switch (event.key) {
|
|
1476
|
+
case 'Escape':
|
|
1477
|
+
if (this.memory.trigger) {
|
|
1478
|
+
this.memory.trigger.focus();
|
|
1479
|
+
}
|
|
1480
|
+
|
|
1481
|
+
hideAll(this);
|
|
1482
|
+
return;
|
|
1483
|
+
|
|
1484
|
+
case 'Tab':
|
|
1485
|
+
this.collection.forEach(function (popover) {
|
|
1486
|
+
hideCheck(popover, _this);
|
|
1487
|
+
});
|
|
1488
|
+
return;
|
|
1489
|
+
|
|
1490
|
+
default:
|
|
1491
|
+
return;
|
|
1427
1492
|
}
|
|
1428
1493
|
}
|
|
1429
1494
|
function documentClick(popover, obj) {
|
|
@@ -1601,17 +1666,42 @@
|
|
|
1601
1666
|
return placement.split('-')[0];
|
|
1602
1667
|
}
|
|
1603
1668
|
|
|
1604
|
-
|
|
1669
|
+
var max = Math.max;
|
|
1670
|
+
var min = Math.min;
|
|
1671
|
+
var round = Math.round;
|
|
1672
|
+
|
|
1673
|
+
function getBoundingClientRect(element, includeScale) {
|
|
1674
|
+
if (includeScale === void 0) {
|
|
1675
|
+
includeScale = false;
|
|
1676
|
+
}
|
|
1677
|
+
|
|
1605
1678
|
var rect = element.getBoundingClientRect();
|
|
1679
|
+
var scaleX = 1;
|
|
1680
|
+
var scaleY = 1;
|
|
1681
|
+
|
|
1682
|
+
if (isHTMLElement(element) && includeScale) {
|
|
1683
|
+
var offsetHeight = element.offsetHeight;
|
|
1684
|
+
var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
|
|
1685
|
+
// Fallback to 1 in case both values are `0`
|
|
1686
|
+
|
|
1687
|
+
if (offsetWidth > 0) {
|
|
1688
|
+
scaleX = round(rect.width) / offsetWidth || 1;
|
|
1689
|
+
}
|
|
1690
|
+
|
|
1691
|
+
if (offsetHeight > 0) {
|
|
1692
|
+
scaleY = round(rect.height) / offsetHeight || 1;
|
|
1693
|
+
}
|
|
1694
|
+
}
|
|
1695
|
+
|
|
1606
1696
|
return {
|
|
1607
|
-
width: rect.width,
|
|
1608
|
-
height: rect.height,
|
|
1609
|
-
top: rect.top,
|
|
1610
|
-
right: rect.right,
|
|
1611
|
-
bottom: rect.bottom,
|
|
1612
|
-
left: rect.left,
|
|
1613
|
-
x: rect.left,
|
|
1614
|
-
y: rect.top
|
|
1697
|
+
width: rect.width / scaleX,
|
|
1698
|
+
height: rect.height / scaleY,
|
|
1699
|
+
top: rect.top / scaleY,
|
|
1700
|
+
right: rect.right / scaleX,
|
|
1701
|
+
bottom: rect.bottom / scaleY,
|
|
1702
|
+
left: rect.left / scaleX,
|
|
1703
|
+
x: rect.left / scaleX,
|
|
1704
|
+
y: rect.top / scaleY
|
|
1615
1705
|
};
|
|
1616
1706
|
}
|
|
1617
1707
|
|
|
@@ -1756,13 +1846,13 @@
|
|
|
1756
1846
|
return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
|
|
1757
1847
|
}
|
|
1758
1848
|
|
|
1759
|
-
var max = Math.max;
|
|
1760
|
-
var min = Math.min;
|
|
1761
|
-
var round = Math.round;
|
|
1762
|
-
|
|
1763
1849
|
function within(min$1, value, max$1) {
|
|
1764
1850
|
return max(min$1, min(value, max$1));
|
|
1765
1851
|
}
|
|
1852
|
+
function withinMaxClamp(min, value, max) {
|
|
1853
|
+
var v = within(min, value, max);
|
|
1854
|
+
return v > max ? max : v;
|
|
1855
|
+
}
|
|
1766
1856
|
|
|
1767
1857
|
function getFreshSideObject() {
|
|
1768
1858
|
return {
|
|
@@ -1866,6 +1956,10 @@
|
|
|
1866
1956
|
requiresIfExists: ['preventOverflow']
|
|
1867
1957
|
};
|
|
1868
1958
|
|
|
1959
|
+
function getVariation(placement) {
|
|
1960
|
+
return placement.split('-')[1];
|
|
1961
|
+
}
|
|
1962
|
+
|
|
1869
1963
|
var unsetSides = {
|
|
1870
1964
|
top: 'auto',
|
|
1871
1965
|
right: 'auto',
|
|
@@ -1881,8 +1975,8 @@
|
|
|
1881
1975
|
var win = window;
|
|
1882
1976
|
var dpr = win.devicePixelRatio || 1;
|
|
1883
1977
|
return {
|
|
1884
|
-
x: round(
|
|
1885
|
-
y: round(
|
|
1978
|
+
x: round(x * dpr) / dpr || 0,
|
|
1979
|
+
y: round(y * dpr) / dpr || 0
|
|
1886
1980
|
};
|
|
1887
1981
|
}
|
|
1888
1982
|
|
|
@@ -1892,18 +1986,28 @@
|
|
|
1892
1986
|
var popper = _ref2.popper,
|
|
1893
1987
|
popperRect = _ref2.popperRect,
|
|
1894
1988
|
placement = _ref2.placement,
|
|
1989
|
+
variation = _ref2.variation,
|
|
1895
1990
|
offsets = _ref2.offsets,
|
|
1896
1991
|
position = _ref2.position,
|
|
1897
1992
|
gpuAcceleration = _ref2.gpuAcceleration,
|
|
1898
1993
|
adaptive = _ref2.adaptive,
|
|
1899
|
-
roundOffsets = _ref2.roundOffsets
|
|
1900
|
-
|
|
1901
|
-
var
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
|
|
1994
|
+
roundOffsets = _ref2.roundOffsets,
|
|
1995
|
+
isFixed = _ref2.isFixed;
|
|
1996
|
+
var _offsets$x = offsets.x,
|
|
1997
|
+
x = _offsets$x === void 0 ? 0 : _offsets$x,
|
|
1998
|
+
_offsets$y = offsets.y,
|
|
1999
|
+
y = _offsets$y === void 0 ? 0 : _offsets$y;
|
|
2000
|
+
|
|
2001
|
+
var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
|
|
2002
|
+
x: x,
|
|
2003
|
+
y: y
|
|
2004
|
+
}) : {
|
|
2005
|
+
x: x,
|
|
2006
|
+
y: y
|
|
2007
|
+
};
|
|
1906
2008
|
|
|
2009
|
+
x = _ref3.x;
|
|
2010
|
+
y = _ref3.y;
|
|
1907
2011
|
var hasX = offsets.hasOwnProperty('x');
|
|
1908
2012
|
var hasY = offsets.hasOwnProperty('y');
|
|
1909
2013
|
var sideX = left;
|
|
@@ -1918,7 +2022,7 @@
|
|
|
1918
2022
|
if (offsetParent === getWindow(popper)) {
|
|
1919
2023
|
offsetParent = getDocumentElement(popper);
|
|
1920
2024
|
|
|
1921
|
-
if (getComputedStyle$1(offsetParent).position !== 'static') {
|
|
2025
|
+
if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
|
|
1922
2026
|
heightProp = 'scrollHeight';
|
|
1923
2027
|
widthProp = 'scrollWidth';
|
|
1924
2028
|
}
|
|
@@ -1927,17 +2031,19 @@
|
|
|
1927
2031
|
|
|
1928
2032
|
offsetParent = offsetParent;
|
|
1929
2033
|
|
|
1930
|
-
if (placement === top) {
|
|
1931
|
-
sideY = bottom;
|
|
1932
|
-
|
|
1933
|
-
|
|
2034
|
+
if (placement === top || (placement === left || placement === right) && variation === end) {
|
|
2035
|
+
sideY = bottom;
|
|
2036
|
+
var offsetY = isFixed && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
|
|
2037
|
+
offsetParent[heightProp];
|
|
2038
|
+
y -= offsetY - popperRect.height;
|
|
1934
2039
|
y *= gpuAcceleration ? 1 : -1;
|
|
1935
2040
|
}
|
|
1936
2041
|
|
|
1937
|
-
if (placement === left) {
|
|
1938
|
-
sideX = right;
|
|
1939
|
-
|
|
1940
|
-
|
|
2042
|
+
if (placement === left || (placement === top || placement === bottom) && variation === end) {
|
|
2043
|
+
sideX = right;
|
|
2044
|
+
var offsetX = isFixed && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
|
|
2045
|
+
offsetParent[widthProp];
|
|
2046
|
+
x -= offsetX - popperRect.width;
|
|
1941
2047
|
x *= gpuAcceleration ? 1 : -1;
|
|
1942
2048
|
}
|
|
1943
2049
|
}
|
|
@@ -1946,18 +2052,29 @@
|
|
|
1946
2052
|
position: position
|
|
1947
2053
|
}, adaptive && unsetSides);
|
|
1948
2054
|
|
|
2055
|
+
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
|
|
2056
|
+
x: x,
|
|
2057
|
+
y: y
|
|
2058
|
+
}) : {
|
|
2059
|
+
x: x,
|
|
2060
|
+
y: y
|
|
2061
|
+
};
|
|
2062
|
+
|
|
2063
|
+
x = _ref4.x;
|
|
2064
|
+
y = _ref4.y;
|
|
2065
|
+
|
|
1949
2066
|
if (gpuAcceleration) {
|
|
1950
2067
|
var _Object$assign;
|
|
1951
2068
|
|
|
1952
|
-
return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1)
|
|
2069
|
+
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));
|
|
1953
2070
|
}
|
|
1954
2071
|
|
|
1955
2072
|
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
|
|
1956
2073
|
}
|
|
1957
2074
|
|
|
1958
|
-
function computeStyles(
|
|
1959
|
-
var state =
|
|
1960
|
-
options =
|
|
2075
|
+
function computeStyles(_ref5) {
|
|
2076
|
+
var state = _ref5.state,
|
|
2077
|
+
options = _ref5.options;
|
|
1961
2078
|
var _options$gpuAccelerat = options.gpuAcceleration,
|
|
1962
2079
|
gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
|
|
1963
2080
|
_options$adaptive = options.adaptive,
|
|
@@ -1967,9 +2084,11 @@
|
|
|
1967
2084
|
|
|
1968
2085
|
var commonStyles = {
|
|
1969
2086
|
placement: getBasePlacement(state.placement),
|
|
2087
|
+
variation: getVariation(state.placement),
|
|
1970
2088
|
popper: state.elements.popper,
|
|
1971
2089
|
popperRect: state.rects.popper,
|
|
1972
|
-
gpuAcceleration: gpuAcceleration
|
|
2090
|
+
gpuAcceleration: gpuAcceleration,
|
|
2091
|
+
isFixed: state.options.strategy === 'fixed'
|
|
1973
2092
|
};
|
|
1974
2093
|
|
|
1975
2094
|
if (state.modifiersData.popperOffsets != null) {
|
|
@@ -2227,7 +2346,7 @@
|
|
|
2227
2346
|
}
|
|
2228
2347
|
|
|
2229
2348
|
function getClientRectFromMixedType(element, clippingParent) {
|
|
2230
|
-
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) :
|
|
2349
|
+
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
2231
2350
|
} // A "clipping parent" is an overflowable container with the characteristic of
|
|
2232
2351
|
// clipping (or hiding) overflowing elements with a position different from
|
|
2233
2352
|
// `initial`
|
|
@@ -2269,10 +2388,6 @@
|
|
|
2269
2388
|
return clippingRect;
|
|
2270
2389
|
}
|
|
2271
2390
|
|
|
2272
|
-
function getVariation(placement) {
|
|
2273
|
-
return placement.split('-')[1];
|
|
2274
|
-
}
|
|
2275
|
-
|
|
2276
2391
|
function computeOffsets(_ref) {
|
|
2277
2392
|
var reference = _ref.reference,
|
|
2278
2393
|
element = _ref.element,
|
|
@@ -2358,11 +2473,10 @@
|
|
|
2358
2473
|
padding = _options$padding === void 0 ? 0 : _options$padding;
|
|
2359
2474
|
var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
|
|
2360
2475
|
var altContext = elementContext === popper ? reference : popper;
|
|
2361
|
-
var referenceElement = state.elements.reference;
|
|
2362
2476
|
var popperRect = state.rects.popper;
|
|
2363
2477
|
var element = state.elements[altBoundary ? altContext : elementContext];
|
|
2364
2478
|
var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
|
|
2365
|
-
var referenceClientRect = getBoundingClientRect(
|
|
2479
|
+
var referenceClientRect = getBoundingClientRect(state.elements.reference);
|
|
2366
2480
|
var popperOffsets = computeOffsets({
|
|
2367
2481
|
reference: referenceClientRect,
|
|
2368
2482
|
element: popperRect,
|
|
@@ -2745,6 +2859,14 @@
|
|
|
2745
2859
|
var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
|
|
2746
2860
|
placement: state.placement
|
|
2747
2861
|
})) : tetherOffset;
|
|
2862
|
+
var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
|
|
2863
|
+
mainAxis: tetherOffsetValue,
|
|
2864
|
+
altAxis: tetherOffsetValue
|
|
2865
|
+
} : Object.assign({
|
|
2866
|
+
mainAxis: 0,
|
|
2867
|
+
altAxis: 0
|
|
2868
|
+
}, tetherOffsetValue);
|
|
2869
|
+
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
|
|
2748
2870
|
var data = {
|
|
2749
2871
|
x: 0,
|
|
2750
2872
|
y: 0
|
|
@@ -2754,13 +2876,15 @@
|
|
|
2754
2876
|
return;
|
|
2755
2877
|
}
|
|
2756
2878
|
|
|
2757
|
-
if (checkMainAxis
|
|
2879
|
+
if (checkMainAxis) {
|
|
2880
|
+
var _offsetModifierState$;
|
|
2881
|
+
|
|
2758
2882
|
var mainSide = mainAxis === 'y' ? top : left;
|
|
2759
2883
|
var altSide = mainAxis === 'y' ? bottom : right;
|
|
2760
2884
|
var len = mainAxis === 'y' ? 'height' : 'width';
|
|
2761
2885
|
var offset = popperOffsets[mainAxis];
|
|
2762
|
-
var min$1 =
|
|
2763
|
-
var max$1 =
|
|
2886
|
+
var min$1 = offset + overflow[mainSide];
|
|
2887
|
+
var max$1 = offset - overflow[altSide];
|
|
2764
2888
|
var additive = tether ? -popperRect[len] / 2 : 0;
|
|
2765
2889
|
var minLen = variation === start ? referenceRect[len] : popperRect[len];
|
|
2766
2890
|
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
|
|
@@ -2780,36 +2904,45 @@
|
|
|
2780
2904
|
// width or height)
|
|
2781
2905
|
|
|
2782
2906
|
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
|
|
2783
|
-
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin -
|
|
2784
|
-
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax +
|
|
2907
|
+
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
|
|
2908
|
+
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
|
|
2785
2909
|
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
|
|
2786
2910
|
var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
|
|
2787
|
-
var offsetModifierValue =
|
|
2788
|
-
var tetherMin =
|
|
2789
|
-
var tetherMax =
|
|
2911
|
+
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
|
|
2912
|
+
var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
|
|
2913
|
+
var tetherMax = offset + maxOffset - offsetModifierValue;
|
|
2914
|
+
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
|
|
2915
|
+
popperOffsets[mainAxis] = preventedOffset;
|
|
2916
|
+
data[mainAxis] = preventedOffset - offset;
|
|
2917
|
+
}
|
|
2790
2918
|
|
|
2791
|
-
|
|
2792
|
-
|
|
2793
|
-
popperOffsets[mainAxis] = preventedOffset;
|
|
2794
|
-
data[mainAxis] = preventedOffset - offset;
|
|
2795
|
-
}
|
|
2919
|
+
if (checkAltAxis) {
|
|
2920
|
+
var _offsetModifierState$2;
|
|
2796
2921
|
|
|
2797
|
-
|
|
2798
|
-
var _mainSide = mainAxis === 'x' ? top : left;
|
|
2922
|
+
var _mainSide = mainAxis === 'x' ? top : left;
|
|
2799
2923
|
|
|
2800
|
-
|
|
2924
|
+
var _altSide = mainAxis === 'x' ? bottom : right;
|
|
2801
2925
|
|
|
2802
|
-
|
|
2926
|
+
var _offset = popperOffsets[altAxis];
|
|
2803
2927
|
|
|
2804
|
-
|
|
2928
|
+
var _len = altAxis === 'y' ? 'height' : 'width';
|
|
2805
2929
|
|
|
2806
|
-
|
|
2930
|
+
var _min = _offset + overflow[_mainSide];
|
|
2807
2931
|
|
|
2808
|
-
|
|
2932
|
+
var _max = _offset - overflow[_altSide];
|
|
2809
2933
|
|
|
2810
|
-
|
|
2811
|
-
|
|
2812
|
-
|
|
2934
|
+
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
|
|
2935
|
+
|
|
2936
|
+
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
|
|
2937
|
+
|
|
2938
|
+
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
|
|
2939
|
+
|
|
2940
|
+
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
|
|
2941
|
+
|
|
2942
|
+
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
|
|
2943
|
+
|
|
2944
|
+
popperOffsets[altAxis] = _preventedOffset;
|
|
2945
|
+
data[altAxis] = _preventedOffset - _offset;
|
|
2813
2946
|
}
|
|
2814
2947
|
|
|
2815
2948
|
state.modifiersData[name] = data;
|
|
@@ -2839,16 +2972,24 @@
|
|
|
2839
2972
|
}
|
|
2840
2973
|
}
|
|
2841
2974
|
|
|
2975
|
+
function isElementScaled(element) {
|
|
2976
|
+
var rect = element.getBoundingClientRect();
|
|
2977
|
+
var scaleX = round(rect.width) / element.offsetWidth || 1;
|
|
2978
|
+
var scaleY = round(rect.height) / element.offsetHeight || 1;
|
|
2979
|
+
return scaleX !== 1 || scaleY !== 1;
|
|
2980
|
+
} // Returns the composite rect of an element relative to its offsetParent.
|
|
2842
2981
|
// Composite means it takes into account transforms as well as layout.
|
|
2843
2982
|
|
|
2983
|
+
|
|
2844
2984
|
function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
2845
2985
|
if (isFixed === void 0) {
|
|
2846
2986
|
isFixed = false;
|
|
2847
2987
|
}
|
|
2848
2988
|
|
|
2849
|
-
var documentElement = getDocumentElement(offsetParent);
|
|
2850
|
-
var rect = getBoundingClientRect(elementOrVirtualElement);
|
|
2851
2989
|
var isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2990
|
+
var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
2991
|
+
var documentElement = getDocumentElement(offsetParent);
|
|
2992
|
+
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
|
|
2852
2993
|
var scroll = {
|
|
2853
2994
|
scrollLeft: 0,
|
|
2854
2995
|
scrollTop: 0
|
|
@@ -2865,7 +3006,7 @@
|
|
|
2865
3006
|
}
|
|
2866
3007
|
|
|
2867
3008
|
if (isHTMLElement(offsetParent)) {
|
|
2868
|
-
offsets = getBoundingClientRect(offsetParent);
|
|
3009
|
+
offsets = getBoundingClientRect(offsetParent, true);
|
|
2869
3010
|
offsets.x += offsetParent.clientLeft;
|
|
2870
3011
|
offsets.y += offsetParent.clientTop;
|
|
2871
3012
|
} else if (documentElement) {
|
|
@@ -3002,7 +3143,8 @@
|
|
|
3002
3143
|
var isDestroyed = false;
|
|
3003
3144
|
var instance = {
|
|
3004
3145
|
state: state,
|
|
3005
|
-
setOptions: function setOptions(
|
|
3146
|
+
setOptions: function setOptions(setOptionsAction) {
|
|
3147
|
+
var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
|
|
3006
3148
|
cleanupModifierEffects();
|
|
3007
3149
|
state.options = Object.assign({}, defaultOptions, state.options, options);
|
|
3008
3150
|
state.scrollParents = {
|
|
@@ -3314,6 +3456,9 @@
|
|
|
3314
3456
|
this.defaults = defaults;
|
|
3315
3457
|
this.settings = _extends({}, this.defaults, options);
|
|
3316
3458
|
this.collection = [];
|
|
3459
|
+
this.memory = {
|
|
3460
|
+
trigger: null
|
|
3461
|
+
};
|
|
3317
3462
|
this.__handlerKeydown = handlerKeydown.bind(this);
|
|
3318
3463
|
if (this.settings.autoInit) this.init();
|
|
3319
3464
|
}
|