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.esm.js
CHANGED
|
@@ -115,6 +115,28 @@ var FocusTrap = /*#__PURE__*/function () {
|
|
|
115
115
|
this.target = null;
|
|
116
116
|
};
|
|
117
117
|
|
|
118
|
+
_proto.refresh = function refresh() {
|
|
119
|
+
// Check if a target has been set
|
|
120
|
+
if (!this.target) return; // Remove existing events
|
|
121
|
+
|
|
122
|
+
this.target.removeEventListener('keydown', this.__handlerFocusTrap);
|
|
123
|
+
this.target.removeEventListener('keydown', this.handlerFocusLock); // Get the focusable elements
|
|
124
|
+
|
|
125
|
+
this.focusable = this.getFocusable(); // Setup the focus handlers based on focusable length
|
|
126
|
+
|
|
127
|
+
if (this.focusable.length) {
|
|
128
|
+
// If there are focusable elements, setup focus trap
|
|
129
|
+
this.focusableFirst = this.focusable[0];
|
|
130
|
+
this.focusableLast = this.focusable[this.focusable.length - 1];
|
|
131
|
+
this.target.addEventListener('keydown', this.__handlerFocusTrap);
|
|
132
|
+
} else {
|
|
133
|
+
// If there are no focusable elements, setup focus lock
|
|
134
|
+
this.focusableFirst = null;
|
|
135
|
+
this.focusableLast = null;
|
|
136
|
+
this.target.addEventListener('keydown', this.handlerFocusLock);
|
|
137
|
+
}
|
|
138
|
+
};
|
|
139
|
+
|
|
118
140
|
_proto.handlerFocusTrap = function handlerFocusTrap(event) {
|
|
119
141
|
var isTab = event.key === 'Tab' || event.keyCode === 9;
|
|
120
142
|
if (!isTab) return;
|
|
@@ -329,14 +351,6 @@ var closeTransition = function closeTransition(el, settings) {
|
|
|
329
351
|
});
|
|
330
352
|
};
|
|
331
353
|
|
|
332
|
-
var breakpoints = {
|
|
333
|
-
xs: '480px',
|
|
334
|
-
sm: '620px',
|
|
335
|
-
md: '760px',
|
|
336
|
-
lg: '990px',
|
|
337
|
-
xl: '1380px'
|
|
338
|
-
};
|
|
339
|
-
|
|
340
354
|
var index = {
|
|
341
355
|
__proto__: null,
|
|
342
356
|
setInert: setInert,
|
|
@@ -354,8 +368,7 @@ var index = {
|
|
|
354
368
|
removeClass: removeClass,
|
|
355
369
|
toggleClass: toggleClass,
|
|
356
370
|
openTransition: openTransition,
|
|
357
|
-
closeTransition: closeTransition
|
|
358
|
-
breakpoints: breakpoints
|
|
371
|
+
closeTransition: closeTransition
|
|
359
372
|
};
|
|
360
373
|
|
|
361
374
|
function _extends() {
|
|
@@ -473,7 +486,7 @@ var defaults$2 = {
|
|
|
473
486
|
selectorInert: null,
|
|
474
487
|
selectorOverflow: null,
|
|
475
488
|
// Feature toggles
|
|
476
|
-
breakpoints:
|
|
489
|
+
breakpoints: null,
|
|
477
490
|
customEventPrefix: 'drawer:',
|
|
478
491
|
eventListeners: true,
|
|
479
492
|
stateSave: true,
|
|
@@ -535,6 +548,7 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
535
548
|
function Breakpoint(parent) {
|
|
536
549
|
this.mediaQueryLists = [];
|
|
537
550
|
this.parent = parent;
|
|
551
|
+
this.prefix = this.getVariablePrefix();
|
|
538
552
|
this.__check = this.check.bind(this);
|
|
539
553
|
}
|
|
540
554
|
|
|
@@ -547,7 +561,9 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
547
561
|
drawers.forEach(function (drawer) {
|
|
548
562
|
var id = drawer.getAttribute("data-" + _this.parent.settings.dataDrawer);
|
|
549
563
|
var key = drawer.getAttribute("data-" + _this.parent.settings.dataBreakpoint);
|
|
550
|
-
|
|
564
|
+
|
|
565
|
+
var bp = _this.getBreakpoint(key);
|
|
566
|
+
|
|
551
567
|
var mql = window.matchMedia('(min-width:' + bp + ')');
|
|
552
568
|
|
|
553
569
|
_this.match(mql, drawer);
|
|
@@ -603,6 +619,25 @@ var Breakpoint = /*#__PURE__*/function () {
|
|
|
603
619
|
}
|
|
604
620
|
};
|
|
605
621
|
|
|
622
|
+
_proto.getBreakpoint = function getBreakpoint(key) {
|
|
623
|
+
var breakpoint = key;
|
|
624
|
+
|
|
625
|
+
if (this.parent.settings.breakpoints && this.parent.settings.breakpoints[key]) {
|
|
626
|
+
breakpoint = this.parent.settings.breakpoints[key];
|
|
627
|
+
} else if (getComputedStyle(document.body).getPropertyValue(this.prefix + key)) {
|
|
628
|
+
breakpoint = getComputedStyle(document.body).getPropertyValue(this.prefix + key);
|
|
629
|
+
}
|
|
630
|
+
|
|
631
|
+
return breakpoint;
|
|
632
|
+
};
|
|
633
|
+
|
|
634
|
+
_proto.getVariablePrefix = function getVariablePrefix() {
|
|
635
|
+
var prefix = '--';
|
|
636
|
+
prefix += getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
|
|
637
|
+
prefix += 'breakpoint-';
|
|
638
|
+
return prefix;
|
|
639
|
+
};
|
|
640
|
+
|
|
606
641
|
return Breakpoint;
|
|
607
642
|
}();
|
|
608
643
|
|
|
@@ -876,6 +911,7 @@ var Drawer = /*#__PURE__*/function () {
|
|
|
876
911
|
|
|
877
912
|
focusTarget(drawer, _this4.settings);
|
|
878
913
|
drawer.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'opened', {
|
|
914
|
+
detail: _this4,
|
|
879
915
|
bubbles: true
|
|
880
916
|
}));
|
|
881
917
|
_this4.working = false;
|
|
@@ -914,6 +950,7 @@ var Drawer = /*#__PURE__*/function () {
|
|
|
914
950
|
_this6.focusTrap.destroy();
|
|
915
951
|
|
|
916
952
|
drawer.dispatchEvent(new CustomEvent(_this6.settings.customEventPrefix + 'closed', {
|
|
953
|
+
detail: _this6,
|
|
917
954
|
bubbles: true
|
|
918
955
|
}));
|
|
919
956
|
_this6.working = false;
|
|
@@ -960,10 +997,6 @@ var defaults$1 = {
|
|
|
960
997
|
|
|
961
998
|
var handlerClick$1 = function handlerClick(event) {
|
|
962
999
|
try {
|
|
963
|
-
var _exit2;
|
|
964
|
-
|
|
965
|
-
var _this2 = this;
|
|
966
|
-
|
|
967
1000
|
var _temp3 = function _temp3(_result) {
|
|
968
1001
|
if (_exit2) return _result;
|
|
969
1002
|
|
|
@@ -982,6 +1015,10 @@ var handlerClick$1 = function handlerClick(event) {
|
|
|
982
1015
|
}
|
|
983
1016
|
};
|
|
984
1017
|
|
|
1018
|
+
var _exit2;
|
|
1019
|
+
|
|
1020
|
+
var _this2 = this;
|
|
1021
|
+
|
|
985
1022
|
// Working catch
|
|
986
1023
|
if (_this2.working) return Promise.resolve(); // Trigger click
|
|
987
1024
|
|
|
@@ -1148,6 +1185,7 @@ var Modal = /*#__PURE__*/function () {
|
|
|
1148
1185
|
focusTarget(modal, _this2.settings);
|
|
1149
1186
|
setInert(true, _this2.settings.selectorInert);
|
|
1150
1187
|
modal.dispatchEvent(new CustomEvent(_this2.settings.customEventPrefix + 'opened', {
|
|
1188
|
+
detail: _this2,
|
|
1151
1189
|
bubbles: true
|
|
1152
1190
|
}));
|
|
1153
1191
|
_this2.working = false;
|
|
@@ -1181,6 +1219,7 @@ var Modal = /*#__PURE__*/function () {
|
|
|
1181
1219
|
_this4.focusTrap.destroy();
|
|
1182
1220
|
|
|
1183
1221
|
modal.dispatchEvent(new CustomEvent(_this4.settings.customEventPrefix + 'closed', {
|
|
1222
|
+
detail: _this4,
|
|
1184
1223
|
bubbles: true
|
|
1185
1224
|
}));
|
|
1186
1225
|
_this4.working = false;
|
|
@@ -1229,7 +1268,12 @@ function hide$2(popover, obj) {
|
|
|
1229
1268
|
var index = obj.collection.findIndex(function (item) {
|
|
1230
1269
|
return item.target === popover.target;
|
|
1231
1270
|
});
|
|
1232
|
-
obj.collection[index].state = 'hide'; //
|
|
1271
|
+
obj.collection[index].state = 'hide'; // Clear the memory if popover trigger matches the ones saved in memory
|
|
1272
|
+
|
|
1273
|
+
if (popover.trigger === obj.memory.trigger) {
|
|
1274
|
+
obj.memory.trigger = null;
|
|
1275
|
+
} // Return the popover
|
|
1276
|
+
|
|
1233
1277
|
|
|
1234
1278
|
return popover;
|
|
1235
1279
|
}
|
|
@@ -1243,7 +1287,9 @@ function hideAll(obj) {
|
|
|
1243
1287
|
return obj.collection;
|
|
1244
1288
|
}
|
|
1245
1289
|
function hideCheck(popover, obj) {
|
|
1246
|
-
//
|
|
1290
|
+
// Only run hideCheck if provided popover is currently open
|
|
1291
|
+
if (popover.state != 'show') return; // Needed to correctly check which element is currently being focused
|
|
1292
|
+
|
|
1247
1293
|
setTimeout(function () {
|
|
1248
1294
|
// Check if trigger or target are being hovered
|
|
1249
1295
|
var isHovered = popover.target.closest(':hover') === popover.target || popover.trigger.closest(':hover') === popover.trigger; // Check if trigger or target are being focused
|
|
@@ -1275,7 +1321,8 @@ function getConfig(el, settings) {
|
|
|
1275
1321
|
|
|
1276
1322
|
for (var prop in config) {
|
|
1277
1323
|
// Get the CSS variable property values
|
|
1278
|
-
var
|
|
1324
|
+
var prefix = getComputedStyle(document.body).getPropertyValue('--vrembem-variable-prefix');
|
|
1325
|
+
var val = styles.getPropertyValue("--" + prefix + "popover-" + prop).trim(); // If a value was found, replace the default in config obj
|
|
1279
1326
|
|
|
1280
1327
|
if (val) {
|
|
1281
1328
|
config[prop] = val;
|
|
@@ -1412,13 +1459,31 @@ function handlerClick(popover) {
|
|
|
1412
1459
|
if (popover.target.classList.contains(this.settings.stateActive)) {
|
|
1413
1460
|
hide$2(popover, this);
|
|
1414
1461
|
} else {
|
|
1462
|
+
this.memory.trigger = popover.trigger;
|
|
1415
1463
|
show(popover, this);
|
|
1416
1464
|
documentClick(popover, this);
|
|
1417
1465
|
}
|
|
1418
1466
|
}
|
|
1419
1467
|
function handlerKeydown(event) {
|
|
1420
|
-
|
|
1421
|
-
|
|
1468
|
+
var _this = this;
|
|
1469
|
+
|
|
1470
|
+
switch (event.key) {
|
|
1471
|
+
case 'Escape':
|
|
1472
|
+
if (this.memory.trigger) {
|
|
1473
|
+
this.memory.trigger.focus();
|
|
1474
|
+
}
|
|
1475
|
+
|
|
1476
|
+
hideAll(this);
|
|
1477
|
+
return;
|
|
1478
|
+
|
|
1479
|
+
case 'Tab':
|
|
1480
|
+
this.collection.forEach(function (popover) {
|
|
1481
|
+
hideCheck(popover, _this);
|
|
1482
|
+
});
|
|
1483
|
+
return;
|
|
1484
|
+
|
|
1485
|
+
default:
|
|
1486
|
+
return;
|
|
1422
1487
|
}
|
|
1423
1488
|
}
|
|
1424
1489
|
function documentClick(popover, obj) {
|
|
@@ -1596,17 +1661,42 @@ function getBasePlacement(placement) {
|
|
|
1596
1661
|
return placement.split('-')[0];
|
|
1597
1662
|
}
|
|
1598
1663
|
|
|
1599
|
-
|
|
1664
|
+
var max = Math.max;
|
|
1665
|
+
var min = Math.min;
|
|
1666
|
+
var round = Math.round;
|
|
1667
|
+
|
|
1668
|
+
function getBoundingClientRect(element, includeScale) {
|
|
1669
|
+
if (includeScale === void 0) {
|
|
1670
|
+
includeScale = false;
|
|
1671
|
+
}
|
|
1672
|
+
|
|
1600
1673
|
var rect = element.getBoundingClientRect();
|
|
1674
|
+
var scaleX = 1;
|
|
1675
|
+
var scaleY = 1;
|
|
1676
|
+
|
|
1677
|
+
if (isHTMLElement(element) && includeScale) {
|
|
1678
|
+
var offsetHeight = element.offsetHeight;
|
|
1679
|
+
var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
|
|
1680
|
+
// Fallback to 1 in case both values are `0`
|
|
1681
|
+
|
|
1682
|
+
if (offsetWidth > 0) {
|
|
1683
|
+
scaleX = round(rect.width) / offsetWidth || 1;
|
|
1684
|
+
}
|
|
1685
|
+
|
|
1686
|
+
if (offsetHeight > 0) {
|
|
1687
|
+
scaleY = round(rect.height) / offsetHeight || 1;
|
|
1688
|
+
}
|
|
1689
|
+
}
|
|
1690
|
+
|
|
1601
1691
|
return {
|
|
1602
|
-
width: rect.width,
|
|
1603
|
-
height: rect.height,
|
|
1604
|
-
top: rect.top,
|
|
1605
|
-
right: rect.right,
|
|
1606
|
-
bottom: rect.bottom,
|
|
1607
|
-
left: rect.left,
|
|
1608
|
-
x: rect.left,
|
|
1609
|
-
y: rect.top
|
|
1692
|
+
width: rect.width / scaleX,
|
|
1693
|
+
height: rect.height / scaleY,
|
|
1694
|
+
top: rect.top / scaleY,
|
|
1695
|
+
right: rect.right / scaleX,
|
|
1696
|
+
bottom: rect.bottom / scaleY,
|
|
1697
|
+
left: rect.left / scaleX,
|
|
1698
|
+
x: rect.left / scaleX,
|
|
1699
|
+
y: rect.top / scaleY
|
|
1610
1700
|
};
|
|
1611
1701
|
}
|
|
1612
1702
|
|
|
@@ -1751,13 +1841,13 @@ function getMainAxisFromPlacement(placement) {
|
|
|
1751
1841
|
return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
|
|
1752
1842
|
}
|
|
1753
1843
|
|
|
1754
|
-
var max = Math.max;
|
|
1755
|
-
var min = Math.min;
|
|
1756
|
-
var round = Math.round;
|
|
1757
|
-
|
|
1758
1844
|
function within(min$1, value, max$1) {
|
|
1759
1845
|
return max(min$1, min(value, max$1));
|
|
1760
1846
|
}
|
|
1847
|
+
function withinMaxClamp(min, value, max) {
|
|
1848
|
+
var v = within(min, value, max);
|
|
1849
|
+
return v > max ? max : v;
|
|
1850
|
+
}
|
|
1761
1851
|
|
|
1762
1852
|
function getFreshSideObject() {
|
|
1763
1853
|
return {
|
|
@@ -1861,6 +1951,10 @@ var arrow$1 = {
|
|
|
1861
1951
|
requiresIfExists: ['preventOverflow']
|
|
1862
1952
|
};
|
|
1863
1953
|
|
|
1954
|
+
function getVariation(placement) {
|
|
1955
|
+
return placement.split('-')[1];
|
|
1956
|
+
}
|
|
1957
|
+
|
|
1864
1958
|
var unsetSides = {
|
|
1865
1959
|
top: 'auto',
|
|
1866
1960
|
right: 'auto',
|
|
@@ -1876,8 +1970,8 @@ function roundOffsetsByDPR(_ref) {
|
|
|
1876
1970
|
var win = window;
|
|
1877
1971
|
var dpr = win.devicePixelRatio || 1;
|
|
1878
1972
|
return {
|
|
1879
|
-
x: round(
|
|
1880
|
-
y: round(
|
|
1973
|
+
x: round(x * dpr) / dpr || 0,
|
|
1974
|
+
y: round(y * dpr) / dpr || 0
|
|
1881
1975
|
};
|
|
1882
1976
|
}
|
|
1883
1977
|
|
|
@@ -1887,18 +1981,28 @@ function mapToStyles(_ref2) {
|
|
|
1887
1981
|
var popper = _ref2.popper,
|
|
1888
1982
|
popperRect = _ref2.popperRect,
|
|
1889
1983
|
placement = _ref2.placement,
|
|
1984
|
+
variation = _ref2.variation,
|
|
1890
1985
|
offsets = _ref2.offsets,
|
|
1891
1986
|
position = _ref2.position,
|
|
1892
1987
|
gpuAcceleration = _ref2.gpuAcceleration,
|
|
1893
1988
|
adaptive = _ref2.adaptive,
|
|
1894
|
-
roundOffsets = _ref2.roundOffsets
|
|
1895
|
-
|
|
1896
|
-
var
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1989
|
+
roundOffsets = _ref2.roundOffsets,
|
|
1990
|
+
isFixed = _ref2.isFixed;
|
|
1991
|
+
var _offsets$x = offsets.x,
|
|
1992
|
+
x = _offsets$x === void 0 ? 0 : _offsets$x,
|
|
1993
|
+
_offsets$y = offsets.y,
|
|
1994
|
+
y = _offsets$y === void 0 ? 0 : _offsets$y;
|
|
1995
|
+
|
|
1996
|
+
var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
|
|
1997
|
+
x: x,
|
|
1998
|
+
y: y
|
|
1999
|
+
}) : {
|
|
2000
|
+
x: x,
|
|
2001
|
+
y: y
|
|
2002
|
+
};
|
|
1901
2003
|
|
|
2004
|
+
x = _ref3.x;
|
|
2005
|
+
y = _ref3.y;
|
|
1902
2006
|
var hasX = offsets.hasOwnProperty('x');
|
|
1903
2007
|
var hasY = offsets.hasOwnProperty('y');
|
|
1904
2008
|
var sideX = left;
|
|
@@ -1913,7 +2017,7 @@ function mapToStyles(_ref2) {
|
|
|
1913
2017
|
if (offsetParent === getWindow(popper)) {
|
|
1914
2018
|
offsetParent = getDocumentElement(popper);
|
|
1915
2019
|
|
|
1916
|
-
if (getComputedStyle$1(offsetParent).position !== 'static') {
|
|
2020
|
+
if (getComputedStyle$1(offsetParent).position !== 'static' && position === 'absolute') {
|
|
1917
2021
|
heightProp = 'scrollHeight';
|
|
1918
2022
|
widthProp = 'scrollWidth';
|
|
1919
2023
|
}
|
|
@@ -1922,17 +2026,19 @@ function mapToStyles(_ref2) {
|
|
|
1922
2026
|
|
|
1923
2027
|
offsetParent = offsetParent;
|
|
1924
2028
|
|
|
1925
|
-
if (placement === top) {
|
|
1926
|
-
sideY = bottom;
|
|
1927
|
-
|
|
1928
|
-
|
|
2029
|
+
if (placement === top || (placement === left || placement === right) && variation === end) {
|
|
2030
|
+
sideY = bottom;
|
|
2031
|
+
var offsetY = isFixed && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
|
|
2032
|
+
offsetParent[heightProp];
|
|
2033
|
+
y -= offsetY - popperRect.height;
|
|
1929
2034
|
y *= gpuAcceleration ? 1 : -1;
|
|
1930
2035
|
}
|
|
1931
2036
|
|
|
1932
|
-
if (placement === left) {
|
|
1933
|
-
sideX = right;
|
|
1934
|
-
|
|
1935
|
-
|
|
2037
|
+
if (placement === left || (placement === top || placement === bottom) && variation === end) {
|
|
2038
|
+
sideX = right;
|
|
2039
|
+
var offsetX = isFixed && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
|
|
2040
|
+
offsetParent[widthProp];
|
|
2041
|
+
x -= offsetX - popperRect.width;
|
|
1936
2042
|
x *= gpuAcceleration ? 1 : -1;
|
|
1937
2043
|
}
|
|
1938
2044
|
}
|
|
@@ -1941,18 +2047,29 @@ function mapToStyles(_ref2) {
|
|
|
1941
2047
|
position: position
|
|
1942
2048
|
}, adaptive && unsetSides);
|
|
1943
2049
|
|
|
2050
|
+
var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
|
|
2051
|
+
x: x,
|
|
2052
|
+
y: y
|
|
2053
|
+
}) : {
|
|
2054
|
+
x: x,
|
|
2055
|
+
y: y
|
|
2056
|
+
};
|
|
2057
|
+
|
|
2058
|
+
x = _ref4.x;
|
|
2059
|
+
y = _ref4.y;
|
|
2060
|
+
|
|
1944
2061
|
if (gpuAcceleration) {
|
|
1945
2062
|
var _Object$assign;
|
|
1946
2063
|
|
|
1947
|
-
return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1)
|
|
2064
|
+
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));
|
|
1948
2065
|
}
|
|
1949
2066
|
|
|
1950
2067
|
return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
|
|
1951
2068
|
}
|
|
1952
2069
|
|
|
1953
|
-
function computeStyles(
|
|
1954
|
-
var state =
|
|
1955
|
-
options =
|
|
2070
|
+
function computeStyles(_ref5) {
|
|
2071
|
+
var state = _ref5.state,
|
|
2072
|
+
options = _ref5.options;
|
|
1956
2073
|
var _options$gpuAccelerat = options.gpuAcceleration,
|
|
1957
2074
|
gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
|
|
1958
2075
|
_options$adaptive = options.adaptive,
|
|
@@ -1962,9 +2079,11 @@ function computeStyles(_ref4) {
|
|
|
1962
2079
|
|
|
1963
2080
|
var commonStyles = {
|
|
1964
2081
|
placement: getBasePlacement(state.placement),
|
|
2082
|
+
variation: getVariation(state.placement),
|
|
1965
2083
|
popper: state.elements.popper,
|
|
1966
2084
|
popperRect: state.rects.popper,
|
|
1967
|
-
gpuAcceleration: gpuAcceleration
|
|
2085
|
+
gpuAcceleration: gpuAcceleration,
|
|
2086
|
+
isFixed: state.options.strategy === 'fixed'
|
|
1968
2087
|
};
|
|
1969
2088
|
|
|
1970
2089
|
if (state.modifiersData.popperOffsets != null) {
|
|
@@ -2222,7 +2341,7 @@ function getInnerBoundingClientRect(element) {
|
|
|
2222
2341
|
}
|
|
2223
2342
|
|
|
2224
2343
|
function getClientRectFromMixedType(element, clippingParent) {
|
|
2225
|
-
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) :
|
|
2344
|
+
return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
2226
2345
|
} // A "clipping parent" is an overflowable container with the characteristic of
|
|
2227
2346
|
// clipping (or hiding) overflowing elements with a position different from
|
|
2228
2347
|
// `initial`
|
|
@@ -2264,10 +2383,6 @@ function getClippingRect(element, boundary, rootBoundary) {
|
|
|
2264
2383
|
return clippingRect;
|
|
2265
2384
|
}
|
|
2266
2385
|
|
|
2267
|
-
function getVariation(placement) {
|
|
2268
|
-
return placement.split('-')[1];
|
|
2269
|
-
}
|
|
2270
|
-
|
|
2271
2386
|
function computeOffsets(_ref) {
|
|
2272
2387
|
var reference = _ref.reference,
|
|
2273
2388
|
element = _ref.element,
|
|
@@ -2353,11 +2468,10 @@ function detectOverflow(state, options) {
|
|
|
2353
2468
|
padding = _options$padding === void 0 ? 0 : _options$padding;
|
|
2354
2469
|
var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
|
|
2355
2470
|
var altContext = elementContext === popper ? reference : popper;
|
|
2356
|
-
var referenceElement = state.elements.reference;
|
|
2357
2471
|
var popperRect = state.rects.popper;
|
|
2358
2472
|
var element = state.elements[altBoundary ? altContext : elementContext];
|
|
2359
2473
|
var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
|
|
2360
|
-
var referenceClientRect = getBoundingClientRect(
|
|
2474
|
+
var referenceClientRect = getBoundingClientRect(state.elements.reference);
|
|
2361
2475
|
var popperOffsets = computeOffsets({
|
|
2362
2476
|
reference: referenceClientRect,
|
|
2363
2477
|
element: popperRect,
|
|
@@ -2740,6 +2854,14 @@ function preventOverflow(_ref) {
|
|
|
2740
2854
|
var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
|
|
2741
2855
|
placement: state.placement
|
|
2742
2856
|
})) : tetherOffset;
|
|
2857
|
+
var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
|
|
2858
|
+
mainAxis: tetherOffsetValue,
|
|
2859
|
+
altAxis: tetherOffsetValue
|
|
2860
|
+
} : Object.assign({
|
|
2861
|
+
mainAxis: 0,
|
|
2862
|
+
altAxis: 0
|
|
2863
|
+
}, tetherOffsetValue);
|
|
2864
|
+
var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
|
|
2743
2865
|
var data = {
|
|
2744
2866
|
x: 0,
|
|
2745
2867
|
y: 0
|
|
@@ -2749,13 +2871,15 @@ function preventOverflow(_ref) {
|
|
|
2749
2871
|
return;
|
|
2750
2872
|
}
|
|
2751
2873
|
|
|
2752
|
-
if (checkMainAxis
|
|
2874
|
+
if (checkMainAxis) {
|
|
2875
|
+
var _offsetModifierState$;
|
|
2876
|
+
|
|
2753
2877
|
var mainSide = mainAxis === 'y' ? top : left;
|
|
2754
2878
|
var altSide = mainAxis === 'y' ? bottom : right;
|
|
2755
2879
|
var len = mainAxis === 'y' ? 'height' : 'width';
|
|
2756
2880
|
var offset = popperOffsets[mainAxis];
|
|
2757
|
-
var min$1 =
|
|
2758
|
-
var max$1 =
|
|
2881
|
+
var min$1 = offset + overflow[mainSide];
|
|
2882
|
+
var max$1 = offset - overflow[altSide];
|
|
2759
2883
|
var additive = tether ? -popperRect[len] / 2 : 0;
|
|
2760
2884
|
var minLen = variation === start ? referenceRect[len] : popperRect[len];
|
|
2761
2885
|
var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
|
|
@@ -2775,36 +2899,45 @@ function preventOverflow(_ref) {
|
|
|
2775
2899
|
// width or height)
|
|
2776
2900
|
|
|
2777
2901
|
var arrowLen = within(0, referenceRect[len], arrowRect[len]);
|
|
2778
|
-
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin -
|
|
2779
|
-
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax +
|
|
2902
|
+
var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
|
|
2903
|
+
var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
|
|
2780
2904
|
var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
|
|
2781
2905
|
var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
|
|
2782
|
-
var offsetModifierValue =
|
|
2783
|
-
var tetherMin =
|
|
2784
|
-
var tetherMax =
|
|
2906
|
+
var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
|
|
2907
|
+
var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
|
|
2908
|
+
var tetherMax = offset + maxOffset - offsetModifierValue;
|
|
2909
|
+
var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
|
|
2910
|
+
popperOffsets[mainAxis] = preventedOffset;
|
|
2911
|
+
data[mainAxis] = preventedOffset - offset;
|
|
2912
|
+
}
|
|
2785
2913
|
|
|
2786
|
-
|
|
2787
|
-
|
|
2788
|
-
popperOffsets[mainAxis] = preventedOffset;
|
|
2789
|
-
data[mainAxis] = preventedOffset - offset;
|
|
2790
|
-
}
|
|
2914
|
+
if (checkAltAxis) {
|
|
2915
|
+
var _offsetModifierState$2;
|
|
2791
2916
|
|
|
2792
|
-
|
|
2793
|
-
var _mainSide = mainAxis === 'x' ? top : left;
|
|
2917
|
+
var _mainSide = mainAxis === 'x' ? top : left;
|
|
2794
2918
|
|
|
2795
|
-
|
|
2919
|
+
var _altSide = mainAxis === 'x' ? bottom : right;
|
|
2796
2920
|
|
|
2797
|
-
|
|
2921
|
+
var _offset = popperOffsets[altAxis];
|
|
2798
2922
|
|
|
2799
|
-
|
|
2923
|
+
var _len = altAxis === 'y' ? 'height' : 'width';
|
|
2800
2924
|
|
|
2801
|
-
|
|
2925
|
+
var _min = _offset + overflow[_mainSide];
|
|
2802
2926
|
|
|
2803
|
-
|
|
2927
|
+
var _max = _offset - overflow[_altSide];
|
|
2804
2928
|
|
|
2805
|
-
|
|
2806
|
-
|
|
2807
|
-
|
|
2929
|
+
var isOriginSide = [top, left].indexOf(basePlacement) !== -1;
|
|
2930
|
+
|
|
2931
|
+
var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
|
|
2932
|
+
|
|
2933
|
+
var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
|
|
2934
|
+
|
|
2935
|
+
var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
|
|
2936
|
+
|
|
2937
|
+
var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
|
|
2938
|
+
|
|
2939
|
+
popperOffsets[altAxis] = _preventedOffset;
|
|
2940
|
+
data[altAxis] = _preventedOffset - _offset;
|
|
2808
2941
|
}
|
|
2809
2942
|
|
|
2810
2943
|
state.modifiersData[name] = data;
|
|
@@ -2834,16 +2967,24 @@ function getNodeScroll(node) {
|
|
|
2834
2967
|
}
|
|
2835
2968
|
}
|
|
2836
2969
|
|
|
2970
|
+
function isElementScaled(element) {
|
|
2971
|
+
var rect = element.getBoundingClientRect();
|
|
2972
|
+
var scaleX = round(rect.width) / element.offsetWidth || 1;
|
|
2973
|
+
var scaleY = round(rect.height) / element.offsetHeight || 1;
|
|
2974
|
+
return scaleX !== 1 || scaleY !== 1;
|
|
2975
|
+
} // Returns the composite rect of an element relative to its offsetParent.
|
|
2837
2976
|
// Composite means it takes into account transforms as well as layout.
|
|
2838
2977
|
|
|
2978
|
+
|
|
2839
2979
|
function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
2840
2980
|
if (isFixed === void 0) {
|
|
2841
2981
|
isFixed = false;
|
|
2842
2982
|
}
|
|
2843
2983
|
|
|
2844
|
-
var documentElement = getDocumentElement(offsetParent);
|
|
2845
|
-
var rect = getBoundingClientRect(elementOrVirtualElement);
|
|
2846
2984
|
var isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2985
|
+
var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
|
|
2986
|
+
var documentElement = getDocumentElement(offsetParent);
|
|
2987
|
+
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
|
|
2847
2988
|
var scroll = {
|
|
2848
2989
|
scrollLeft: 0,
|
|
2849
2990
|
scrollTop: 0
|
|
@@ -2860,7 +3001,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
2860
3001
|
}
|
|
2861
3002
|
|
|
2862
3003
|
if (isHTMLElement(offsetParent)) {
|
|
2863
|
-
offsets = getBoundingClientRect(offsetParent);
|
|
3004
|
+
offsets = getBoundingClientRect(offsetParent, true);
|
|
2864
3005
|
offsets.x += offsetParent.clientLeft;
|
|
2865
3006
|
offsets.y += offsetParent.clientTop;
|
|
2866
3007
|
} else if (documentElement) {
|
|
@@ -2997,7 +3138,8 @@ function popperGenerator(generatorOptions) {
|
|
|
2997
3138
|
var isDestroyed = false;
|
|
2998
3139
|
var instance = {
|
|
2999
3140
|
state: state,
|
|
3000
|
-
setOptions: function setOptions(
|
|
3141
|
+
setOptions: function setOptions(setOptionsAction) {
|
|
3142
|
+
var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
|
|
3001
3143
|
cleanupModifierEffects();
|
|
3002
3144
|
state.options = Object.assign({}, defaultOptions, state.options, options);
|
|
3003
3145
|
state.scrollParents = {
|
|
@@ -3309,6 +3451,9 @@ var Popover = /*#__PURE__*/function () {
|
|
|
3309
3451
|
this.defaults = defaults;
|
|
3310
3452
|
this.settings = _extends({}, this.defaults, options);
|
|
3311
3453
|
this.collection = [];
|
|
3454
|
+
this.memory = {
|
|
3455
|
+
trigger: null
|
|
3456
|
+
};
|
|
3312
3457
|
this.__handlerKeydown = handlerKeydown.bind(this);
|
|
3313
3458
|
if (this.settings.autoInit) this.init();
|
|
3314
3459
|
}
|