uikit 3.11.2-dev.c7ed3c19b → 3.11.2-dev.cfa6c7d5c

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.
Files changed (135) hide show
  1. package/CHANGELOG.md +37 -19
  2. package/dist/css/uikit-core-rtl.css +86 -185
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +86 -185
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +88 -191
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +88 -191
  9. package/dist/css/uikit.min.css +1 -1
  10. package/dist/js/components/countdown.js +1 -1
  11. package/dist/js/components/countdown.min.js +1 -1
  12. package/dist/js/components/filter.js +6 -8
  13. package/dist/js/components/filter.min.js +1 -1
  14. package/dist/js/components/lightbox-panel.js +26 -55
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +27 -57
  17. package/dist/js/components/lightbox.min.js +1 -1
  18. package/dist/js/components/notification.js +1 -1
  19. package/dist/js/components/notification.min.js +1 -1
  20. package/dist/js/components/parallax.js +114 -78
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +114 -78
  23. package/dist/js/components/slider-parallax.min.js +1 -1
  24. package/dist/js/components/slider.js +60 -12
  25. package/dist/js/components/slider.min.js +1 -1
  26. package/dist/js/components/slideshow-parallax.js +114 -78
  27. package/dist/js/components/slideshow-parallax.min.js +1 -1
  28. package/dist/js/components/slideshow.js +52 -16
  29. package/dist/js/components/slideshow.min.js +1 -1
  30. package/dist/js/components/sortable.js +5 -7
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +2 -2
  33. package/dist/js/components/tooltip.min.js +1 -1
  34. package/dist/js/components/upload.js +1 -1
  35. package/dist/js/components/upload.min.js +1 -1
  36. package/dist/js/uikit-core.js +288 -270
  37. package/dist/js/uikit-core.min.js +1 -1
  38. package/dist/js/uikit-icons.js +1 -1
  39. package/dist/js/uikit-icons.min.js +1 -1
  40. package/dist/js/uikit.js +501 -417
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/api/component.js +2 -11
  44. package/src/js/api/hooks.js +1 -1
  45. package/src/js/api/state.js +1 -1
  46. package/src/js/components/filter.js +2 -3
  47. package/src/js/components/internal/lightbox-animations.js +4 -3
  48. package/src/js/components/internal/slider-preload.js +37 -0
  49. package/src/js/components/internal/slideshow-animations.js +4 -3
  50. package/src/js/components/lightbox-panel.js +34 -58
  51. package/src/js/components/lightbox.js +1 -2
  52. package/src/js/components/slider.js +21 -1
  53. package/src/js/components/slideshow.js +8 -1
  54. package/src/js/components/sortable.js +1 -1
  55. package/src/js/core/alert.js +1 -2
  56. package/src/js/core/height-viewport.js +3 -0
  57. package/src/js/core/icon.js +13 -6
  58. package/src/js/core/img.js +131 -114
  59. package/src/js/core/modal.js +1 -2
  60. package/src/js/core/navbar.js +3 -3
  61. package/src/js/core/sticky.js +51 -57
  62. package/src/js/core/svg.js +10 -6
  63. package/src/js/core/toggle.js +2 -1
  64. package/src/js/mixin/internal/animate-slide.js +9 -12
  65. package/src/js/mixin/parallax.js +115 -79
  66. package/src/js/mixin/slider.js +8 -16
  67. package/src/js/mixin/slideshow.js +2 -2
  68. package/src/js/mixin/togglable.js +1 -2
  69. package/src/js/util/ajax.js +15 -14
  70. package/src/js/util/animation.js +7 -12
  71. package/src/js/util/dimensions.js +4 -4
  72. package/src/js/util/dom.js +37 -31
  73. package/src/js/util/lang.js +7 -6
  74. package/src/js/util/options.js +2 -11
  75. package/src/js/util/player.js +5 -4
  76. package/src/js/util/selector.js +11 -11
  77. package/src/js/util/style.js +4 -4
  78. package/src/less/components/base.less +10 -33
  79. package/src/less/components/form-range.less +48 -95
  80. package/src/less/components/form.less +0 -1
  81. package/src/less/components/height.less +3 -0
  82. package/src/less/components/leader.less +0 -1
  83. package/src/less/components/lightbox.less +0 -1
  84. package/src/less/components/modal.less +3 -7
  85. package/src/less/components/progress.less +14 -36
  86. package/src/less/components/slider.less +0 -3
  87. package/src/less/components/slideshow.less +0 -3
  88. package/src/less/components/text.less +16 -32
  89. package/src/scss/components/base.scss +10 -33
  90. package/src/scss/components/form-range.scss +48 -95
  91. package/src/scss/components/form.scss +0 -1
  92. package/src/scss/components/height.scss +3 -0
  93. package/src/scss/components/leader.scss +0 -1
  94. package/src/scss/components/lightbox.scss +0 -1
  95. package/src/scss/components/modal.scss +3 -7
  96. package/src/scss/components/progress.scss +14 -36
  97. package/src/scss/components/slider.scss +0 -3
  98. package/src/scss/components/slideshow.scss +0 -3
  99. package/src/scss/components/text.scss +16 -32
  100. package/src/scss/mixins-theme.scss +1 -1
  101. package/src/scss/mixins.scss +1 -1
  102. package/src/scss/variables-theme.scss +3 -3
  103. package/src/scss/variables.scss +3 -3
  104. package/tests/align.html +10 -10
  105. package/tests/animation.html +2 -2
  106. package/tests/article.html +2 -2
  107. package/tests/base.html +3 -3
  108. package/tests/card.html +10 -10
  109. package/tests/column.html +3 -3
  110. package/tests/comment.html +9 -9
  111. package/tests/dotnav.html +3 -3
  112. package/tests/image.html +296 -64
  113. package/tests/images/image-type.avif +0 -0
  114. package/tests/images/image-type.jpeg +0 -0
  115. package/tests/images/image-type.webp +0 -0
  116. package/tests/index.html +8 -8
  117. package/tests/lightbox.html +10 -10
  118. package/tests/marker.html +2 -2
  119. package/tests/modal.html +8 -9
  120. package/tests/navbar.html +2 -2
  121. package/tests/overlay.html +7 -7
  122. package/tests/parallax.html +14 -5
  123. package/tests/position.html +12 -12
  124. package/tests/slidenav.html +12 -12
  125. package/tests/slider.html +20 -20
  126. package/tests/sortable.html +1 -1
  127. package/tests/sticky-parallax.html +55 -70
  128. package/tests/svg.html +6 -6
  129. package/tests/table.html +11 -11
  130. package/tests/thumbnav.html +12 -12
  131. package/tests/transition.html +30 -30
  132. package/tests/utility.html +33 -33
  133. package/tests/video.html +1 -1
  134. package/tests/width.html +1 -1
  135. package/tests/images/animated.gif +0 -0
package/dist/js/uikit.js CHANGED
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.11.2-dev.c7ed3c19b | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
1
+ /*! UIkit 3.11.2-dev.cfa6c7d5c | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
2
2
 
3
3
  (function (global, factory) {
4
4
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -29,19 +29,19 @@
29
29
  }
30
30
 
31
31
  function startsWith(str, search) {
32
- return str.startsWith(search);
32
+ return str == null ? void 0 : str.startsWith == null ? void 0 : str.startsWith(search);
33
33
  }
34
34
 
35
35
  function endsWith(str, search) {
36
- return str.endsWith(search);
36
+ return str == null ? void 0 : str.endsWith == null ? void 0 : str.endsWith(search);
37
37
  }
38
38
 
39
39
  function includes(obj, search) {
40
- return obj && obj.includes(search);
40
+ return obj == null ? void 0 : obj.includes == null ? void 0 : obj.includes(search);
41
41
  }
42
42
 
43
43
  function findIndex(array, predicate) {
44
- return array.findIndex(predicate);
44
+ return array == null ? void 0 : array.findIndex == null ? void 0 : array.findIndex(predicate);
45
45
  }
46
46
 
47
47
  const { isArray, from: toArray } = Array;
@@ -130,14 +130,15 @@
130
130
  return element && (isNode(element) ? [element] : Array.from(element).filter(isNode)) || [];
131
131
  }
132
132
 
133
- function toWindow(element) {
133
+ function toWindow(element) {var _element;
134
134
  if (isWindow(element)) {
135
135
  return element;
136
136
  }
137
137
 
138
138
  element = toNode(element);
139
+ const document = isDocument(element) ? element : (_element = element) == null ? void 0 : _element.ownerDocument;
139
140
 
140
- return element ? (isDocument(element) ? element : element.ownerDocument).defaultView : window;
141
+ return (document == null ? void 0 : document.defaultView) || window;
141
142
  }
142
143
 
143
144
  function toMs(time) {
@@ -224,7 +225,7 @@
224
225
  },
225
226
 
226
227
  contain(dimensions, maxDimensions) {
227
- dimensions = assign({}, dimensions);
228
+ dimensions = { ...dimensions };
228
229
 
229
230
  each(
230
231
  dimensions,
@@ -438,12 +439,6 @@
438
439
  return findAll(selector, getContext(selector, context));
439
440
  }
440
441
 
441
- function getContext(selector, context) {if (context === void 0) {context = document;}
442
- return isString(selector) && isContextSelector(selector) || isDocument(context) ?
443
- context :
444
- context.ownerDocument;
445
- }
446
-
447
442
  function find(selector, context) {
448
443
  return toNode(_query(selector, context, 'querySelector'));
449
444
  }
@@ -452,6 +447,17 @@
452
447
  return toNodes(_query(selector, context, 'querySelectorAll'));
453
448
  }
454
449
 
450
+ const contextSelectorRe = /(^|[^\\],)\s*[!>+~-]/;
451
+ const isContextSelector = memoize((selector) => selector.match(contextSelectorRe));
452
+
453
+ function getContext(selector, context) {if (context === void 0) {context = document;}
454
+ return isString(selector) && isContextSelector(selector) || isDocument(context) ?
455
+ context :
456
+ context.ownerDocument;
457
+ }
458
+
459
+ const contextSanitizeRe = /([!>+~-])(?=\s+[!>+~-]|\s*$)/g;
460
+
455
461
  function _query(selector, context, queryFn) {if (context === void 0) {context = document;}
456
462
  if (!selector || !isString(selector)) {
457
463
  return selector;
@@ -496,11 +502,6 @@
496
502
  }
497
503
  }
498
504
 
499
- const contextSelectorRe = /(^|[^\\],)\s*[!>+~-]/;
500
- const contextSanitizeRe = /([!>+~-])(?=\s+[!>+~-]|\s*$)/g;
501
-
502
- const isContextSelector = memoize((selector) => selector.match(contextSelectorRe));
503
-
504
505
  const selectorRe = /.*?[^\\](?:,|$)/g;
505
506
 
506
507
  const splitSelector = memoize((selector) =>
@@ -670,17 +671,14 @@
670
671
  }
671
672
 
672
673
  function ajax(url, options) {
673
- const env = assign(
674
- {
674
+ const env = {
675
675
  data: null,
676
676
  method: 'GET',
677
677
  headers: {},
678
678
  xhr: new XMLHttpRequest(),
679
679
  beforeSend: noop,
680
- responseType: '' },
681
-
682
- options);
683
-
680
+ responseType: '',
681
+ ...options };
684
682
 
685
683
  return Promise.resolve().
686
684
  then(() => env.beforeSend(env)).
@@ -731,8 +729,12 @@
731
729
  return new Promise((resolve, reject) => {
732
730
  const img = new Image();
733
731
 
734
- img.onerror = (e) => reject(e);
735
- img.onload = () => resolve(img);
732
+ img.onerror = (e) => {
733
+ reject(e);
734
+ };
735
+ img.onload = () => {
736
+ resolve(img);
737
+ };
736
738
 
737
739
  sizes && (img.sizes = sizes);
738
740
  srcset && (img.srcset = srcset);
@@ -759,7 +761,8 @@
759
761
 
760
762
 
761
763
  function css(element, property, value, priority) {if (priority === void 0) {priority = '';}
762
- return toNodes(element).map((element) => {
764
+ const elements = toNodes(element);
765
+ for (const element of elements) {
763
766
  if (isString(property)) {
764
767
  property = propName(property);
765
768
 
@@ -785,9 +788,8 @@
785
788
  priority = value;
786
789
  each(property, (value, property) => css(element, property, value, priority));
787
790
  }
788
-
789
- return element;
790
- })[0];
791
+ }
792
+ return elements[0];
791
793
  }
792
794
 
793
795
  function getStyles(element, pseudoElt) {
@@ -914,16 +916,11 @@
914
916
 
915
917
 
916
918
  addClass(element, 'uk-transition');
917
- css(
918
- element,
919
- assign(
920
- {
919
+ css(element, {
921
920
  transitionProperty: Object.keys(props).map(propName).join(','),
922
921
  transitionDuration: duration + "ms",
923
- transitionTimingFunction: timing },
924
-
925
- props));
926
-
922
+ transitionTimingFunction: timing,
923
+ ...props });
927
924
 
928
925
  })));
929
926
 
@@ -1023,8 +1020,8 @@
1023
1020
  const currentOffset = dimensions$1(element);
1024
1021
 
1025
1022
  if (element) {
1026
- const { pageYOffset, pageXOffset } = toWindow(element);
1027
- const offsetBy = { height: pageYOffset, width: pageXOffset };
1023
+ const { scrollY, scrollX } = toWindow(element);
1024
+ const offsetBy = { height: scrollY, width: scrollX };
1028
1025
 
1029
1026
  for (const dir in dirs$1) {
1030
1027
  for (const i in dirs$1[dir]) {
@@ -1090,8 +1087,8 @@
1090
1087
 
1091
1088
  if (css(element, 'position') === 'fixed') {
1092
1089
  const win = toWindow(element);
1093
- offset[0] += win.pageYOffset;
1094
- offset[1] += win.pageXOffset;
1090
+ offset[0] += win.scrollY;
1091
+ offset[1] += win.scrollX;
1095
1092
  return offset;
1096
1093
  }
1097
1094
  } while (element = element.offsetParent);
@@ -1182,8 +1179,8 @@
1182
1179
 
1183
1180
  const calcRe = /-?\d+(?:\.\d+)?(?:v[wh]|%|px)?/g;
1184
1181
  const parseCalc = memoize((calc) => calc.toString().replace(/\s/g, '').match(calcRe) || []);
1185
- const unitRe = /(?:v[hw]|%)$/;
1186
- const parseUnit = memoize((str) => (str.match(unitRe) || [])[0]);
1182
+ const unitRe$1 = /(?:v[hw]|%)$/;
1183
+ const parseUnit = memoize((str) => (str.match(unitRe$1) || [])[0]);
1187
1184
 
1188
1185
  function percent(base, value) {
1189
1186
  return base * toFloat(value) / 100;
@@ -1198,6 +1195,10 @@
1198
1195
  once(document, 'DOMContentLoaded', fn);
1199
1196
  }
1200
1197
 
1198
+ function isTag(element, tagName) {var _element$tagName;
1199
+ return (element == null ? void 0 : (_element$tagName = element.tagName) == null ? void 0 : _element$tagName.toLowerCase()) === tagName.toLowerCase();
1200
+ }
1201
+
1201
1202
  function empty(element) {
1202
1203
  return replaceChildren(element, '');
1203
1204
  }
@@ -1206,34 +1207,20 @@
1206
1207
  return isUndefined(html) ? $(parent).innerHTML : replaceChildren(parent, html);
1207
1208
  }
1208
1209
 
1209
- function replaceChildren(parent, element) {
1210
- const nodes = $$(element);
1211
- $(parent).replaceChildren(...nodes);
1212
- return nodes;
1213
- }
1214
-
1215
- function prepend(parent, element) {
1216
- const nodes = $$(element);
1217
- $(parent).prepend(...nodes);
1218
- return nodes;
1219
- }
1220
-
1221
- function append(parent, element) {
1222
- const nodes = $$(element);
1223
- $(parent).append(...nodes);
1224
- return nodes;
1225
- }
1226
-
1227
- function before(ref, element) {
1228
- const nodes = $$(element);
1229
- $(ref).before(...nodes);
1230
- return nodes;
1231
- }
1210
+ const replaceChildren = applyFn('replaceChildren');
1211
+ const prepend = applyFn('prepend');
1212
+ const append = applyFn('append');
1213
+ const before = applyFn('before');
1214
+ const after = applyFn('after');
1232
1215
 
1233
- function after(ref, element) {
1234
- const nodes = $$(element);
1235
- $(ref).after(...nodes);
1236
- return nodes;
1216
+ function applyFn(fn) {
1217
+ return function (ref, element) {
1218
+ const nodes = toNodes(isString(element) ? fragment(element) : element);
1219
+ if (nodes.length) {
1220
+ $(ref)[fn](...nodes);
1221
+ }
1222
+ return unwrapSingle(nodes);
1223
+ };
1237
1224
  }
1238
1225
 
1239
1226
  function remove$1(element) {
@@ -1269,11 +1256,27 @@
1269
1256
  forEach((parent) => parent.replaceWith(...parent.childNodes));
1270
1257
  }
1271
1258
 
1259
+ const fragmentRe = /^\s*<(\w+|!)[^>]*>/;
1260
+ const singleTagRe = /^<(\w+)\s*\/?>(?:<\/\1>)?$/;
1261
+
1272
1262
  function fragment(html) {
1273
- const template = document.createElement('template');
1274
- template.innerHTML = html;
1275
- const { childNodes } = template.content;
1276
- return childNodes.length > 1 ? toNodes(childNodes) : childNodes[0];
1263
+ const matches = singleTagRe.exec(html);
1264
+ if (matches) {
1265
+ return document.createElement(matches[1]);
1266
+ }
1267
+
1268
+ const container = document.createElement('div');
1269
+ if (fragmentRe.test(html)) {
1270
+ container.insertAdjacentHTML('beforeend', html.trim());
1271
+ } else {
1272
+ container.textContent = html;
1273
+ }
1274
+
1275
+ return unwrapSingle(container.childNodes);
1276
+ }
1277
+
1278
+ function unwrapSingle(nodes) {
1279
+ return nodes.length > 1 ? nodes : nodes[0];
1277
1280
  }
1278
1281
 
1279
1282
  function apply(node, fn) {
@@ -1506,7 +1509,7 @@
1506
1509
 
1507
1510
  // extend strategy
1508
1511
  strats.computed = strats.methods = function (parentVal, childVal) {
1509
- return childVal ? parentVal ? assign({}, parentVal, childVal) : childVal : parentVal;
1512
+ return childVal ? parentVal ? { ...parentVal, ...childVal } : childVal : parentVal;
1510
1513
  };
1511
1514
 
1512
1515
  // data strategy
@@ -1646,11 +1649,11 @@
1646
1649
  }
1647
1650
 
1648
1651
  function isHTML5(el) {
1649
- return (el == null ? void 0 : el.tagName) === 'VIDEO';
1652
+ return isTag(el, 'video');
1650
1653
  }
1651
1654
 
1652
1655
  function isIFrame(el) {
1653
- return (el == null ? void 0 : el.tagName) === 'IFRAME' && (isYoutube(el) || isVimeo(el));
1656
+ return isTag(el, 'iframe') && (isYoutube(el) || isVimeo(el));
1654
1657
  }
1655
1658
 
1656
1659
  function isYoutube(el) {
@@ -1670,7 +1673,7 @@
1670
1673
 
1671
1674
  function post(el, cmd) {
1672
1675
  try {
1673
- el.contentWindow.postMessage(JSON.stringify(assign({ event: 'command' }, cmd)), '*');
1676
+ el.contentWindow.postMessage(JSON.stringify({ event: 'command', ...cmd }), '*');
1674
1677
  } catch (e) {
1675
1678
  // noop
1676
1679
  }
@@ -2050,6 +2053,7 @@
2050
2053
  flipPosition: flipPosition,
2051
2054
  toPx: toPx,
2052
2055
  ready: ready,
2056
+ isTag: isTag,
2053
2057
  empty: empty,
2054
2058
  html: html,
2055
2059
  replaceChildren: replaceChildren,
@@ -2344,7 +2348,7 @@
2344
2348
  const {
2345
2349
  $options: { computed } } =
2346
2350
  this;
2347
- const values = assign({}, this._computeds);
2351
+ const values = { ...this._computeds };
2348
2352
  this._computeds = {};
2349
2353
 
2350
2354
  for (const key in computed) {
@@ -2529,7 +2533,7 @@
2529
2533
  el = isFunction(el) ? el.call(component) : el || component.$el;
2530
2534
 
2531
2535
  if (isArray(el)) {
2532
- el.forEach((el) => registerEvent(component, assign({}, event, { el }), key));
2536
+ el.forEach((el) => registerEvent(component, { ...event, el }, key));
2533
2537
  return;
2534
2538
  }
2535
2539
 
@@ -2763,7 +2767,7 @@
2763
2767
  }
2764
2768
  };
2765
2769
 
2766
- const opt = isPlainObject(options) ? assign({}, options) : options.options;
2770
+ const opt = isPlainObject(options) ? { ...options } : options.options;
2767
2771
 
2768
2772
  opt.name = name;
2769
2773
 
@@ -2816,7 +2820,7 @@
2816
2820
  UIkit.data = '__uikit__';
2817
2821
  UIkit.prefix = 'uk-';
2818
2822
  UIkit.options = {};
2819
- UIkit.version = '3.11.2-dev.c7ed3c19b';
2823
+ UIkit.version = '3.11.2-dev.cfa6c7d5c';
2820
2824
 
2821
2825
  globalAPI(UIkit);
2822
2826
  hooksAPI(UIkit);
@@ -3139,7 +3143,7 @@
3139
3143
  show ?
3140
3144
  Transition.start(
3141
3145
  el,
3142
- assign({}, initProps, { overflow: 'hidden', height: endHeight }),
3146
+ { ...initProps, overflow: 'hidden', height: endHeight },
3143
3147
  Math.round(duration * (1 - currentHeight / endHeight)),
3144
3148
  transition) :
3145
3149
 
@@ -3311,7 +3315,7 @@
3311
3315
  animation: [true],
3312
3316
  selClose: '.uk-alert-close',
3313
3317
  duration: 150,
3314
- hideProps: assign({ opacity: 0 }, Togglable.data.hideProps) },
3318
+ hideProps: { opacity: 0, ...Togglable.data.hideProps } },
3315
3319
 
3316
3320
 
3317
3321
  events: [
@@ -4321,6 +4325,8 @@
4321
4325
  }
4322
4326
 
4323
4327
  var heightViewport = {
4328
+ mixins: [Class],
4329
+
4324
4330
  props: {
4325
4331
  expand: Boolean,
4326
4332
  offsetTop: Boolean,
@@ -4468,6 +4474,12 @@
4468
4474
 
4469
4475
  methods: {
4470
4476
  async getSvg() {
4477
+ if (isTag(this.$el, 'img') && !this.$el.complete && this.$el.loading === 'lazy') {
4478
+ return new Promise((resolve) =>
4479
+ once(this.$el, 'load', () => resolve(this.getSvg())));
4480
+
4481
+ }
4482
+
4471
4483
  return parseSVG(await loadSVG(this.src), this.icon) || Promise.reject('SVG not found.');
4472
4484
  },
4473
4485
 
@@ -4567,7 +4579,7 @@
4567
4579
  }
4568
4580
 
4569
4581
  function insertSVG(el, root) {
4570
- if (isVoidElement(root) || root.tagName === 'CANVAS') {
4582
+ if (isVoidElement(root) || isTag(root, 'canvas')) {
4571
4583
  root.hidden = true;
4572
4584
 
4573
4585
  const next = root.nextElementSibling;
@@ -4579,11 +4591,7 @@
4579
4591
  }
4580
4592
 
4581
4593
  function equals(el, other) {
4582
- return isSVG(el) && isSVG(other) && innerHTML(el) === innerHTML(other);
4583
- }
4584
-
4585
- function isSVG(el) {
4586
- return (el == null ? void 0 : el.tagName) === 'svg';
4594
+ return isTag(el, 'svg') && isTag(other, 'svg') && innerHTML(el) === innerHTML(other);
4587
4595
  }
4588
4596
 
4589
4597
  function innerHTML(el) {
@@ -4664,14 +4672,14 @@
4664
4672
  },
4665
4673
 
4666
4674
  methods: {
4667
- getSvg() {
4675
+ async getSvg() {
4668
4676
  const icon = getIcon(this.icon);
4669
4677
 
4670
4678
  if (!icon) {
4671
- return Promise.reject('Icon not found.');
4679
+ throw 'Icon not found.';
4672
4680
  }
4673
4681
 
4674
- return Promise.resolve(icon);
4682
+ return icon;
4675
4683
  } } };
4676
4684
 
4677
4685
  const IconComponent = {
@@ -4729,10 +4737,17 @@
4729
4737
  const Spinner = {
4730
4738
  extends: IconComponent,
4731
4739
 
4732
- async connected() {
4733
- const svg = await this.svg;
4734
- svg && this.ratio !== 1 && css($('circle', svg), 'strokeWidth', 1 / this.ratio);
4735
- } };
4740
+ methods: {
4741
+ async getSvg() {
4742
+ const icon = await Icon.methods.getSvg.call(this);
4743
+
4744
+ if (this.ratio !== 1) {
4745
+ css($('circle', icon), 'strokeWidth', 1 / this.ratio);
4746
+ }
4747
+
4748
+ return icon;
4749
+ } } };
4750
+
4736
4751
 
4737
4752
 
4738
4753
  const parsed = {};
@@ -4770,120 +4785,95 @@
4770
4785
  return isRtl ? swap(swap(icon, 'left', 'right'), 'previous', 'next') : icon;
4771
4786
  }
4772
4787
 
4788
+ const nativeLazyLoad = ('loading' in HTMLImageElement.prototype);
4789
+ const nativeIsIntersecting = ('isIntersecting' in IntersectionObserverEntry.prototype); // Old chromium based browsers (UC Browser) did not implement `isIntersecting`
4790
+
4773
4791
  var img = {
4774
4792
  args: 'dataSrc',
4775
4793
 
4776
4794
  props: {
4777
4795
  dataSrc: String,
4778
- dataSrcset: Boolean,
4779
- sizes: String,
4780
- width: Number,
4781
- height: Number,
4796
+ sources: String,
4782
4797
  offsetTop: String,
4783
4798
  offsetLeft: String,
4784
- target: String },
4799
+ target: String,
4800
+ loading: String },
4785
4801
 
4786
4802
 
4787
4803
  data: {
4788
4804
  dataSrc: '',
4789
- dataSrcset: false,
4790
- sizes: false,
4791
- width: false,
4792
- height: false,
4805
+ sources: false,
4793
4806
  offsetTop: '50vh',
4794
4807
  offsetLeft: '50vw',
4795
- target: false },
4808
+ target: false,
4809
+ loading: 'lazy' },
4796
4810
 
4797
4811
 
4798
4812
  computed: {
4799
- cacheKey(_ref) {let { dataSrc } = _ref;
4800
- return this.$name + "." + dataSrc;
4801
- },
4802
-
4803
- width(_ref2) {let { width, dataWidth } = _ref2;
4804
- return width || dataWidth;
4805
- },
4806
-
4807
- height(_ref3) {let { height, dataHeight } = _ref3;
4808
- return height || dataHeight;
4809
- },
4810
-
4811
- sizes(_ref4) {let { sizes, dataSizes } = _ref4;
4812
- return sizes || dataSizes;
4813
- },
4814
-
4815
- isImg(_, $el) {
4816
- return isImg($el);
4817
- },
4818
-
4819
4813
  target: {
4820
- get(_ref5) {let { target } = _ref5;
4814
+ get(_ref) {let { target } = _ref;
4821
4815
  return [this.$el, ...queryAll(target, this.$el)];
4822
4816
  },
4823
4817
 
4824
4818
  watch() {
4825
4819
  this.observe();
4826
- } },
4827
-
4828
-
4829
- offsetTop(_ref6) {let { offsetTop } = _ref6;
4830
- return toPx(offsetTop, 'height');
4831
- },
4820
+ } } },
4832
4821
 
4833
- offsetLeft(_ref7) {let { offsetLeft } = _ref7;
4834
- return toPx(offsetLeft, 'width');
4835
- } },
4836
4822
 
4837
4823
 
4838
4824
  connected() {
4839
- if (!window.IntersectionObserver) {
4840
- setSrcAttrs(this.$el, this.dataSrc, this.dataSrcset, this.sizes);
4825
+ if (this.loading !== 'lazy' || !window.IntersectionObserver || !nativeIsIntersecting) {
4826
+ this.load();
4841
4827
  return;
4842
4828
  }
4843
4829
 
4844
- if (storage[this.cacheKey]) {
4845
- setSrcAttrs(this.$el, storage[this.cacheKey], this.dataSrcset, this.sizes);
4846
- } else if (this.isImg && this.width && this.height) {
4847
- setSrcAttrs(this.$el, getPlaceholderImage(this.width, this.height, this.sizes));
4830
+ if (nativeLazyLoad && isImg(this.$el)) {
4831
+ this.$el.loading = 'lazy';
4832
+ setSrcAttrs(this.$el);
4833
+
4834
+ if (this.target.length === 1) {
4835
+ return;
4836
+ }
4848
4837
  }
4849
4838
 
4850
- this.observer = new IntersectionObserver(this.load, {
4851
- rootMargin: this.offsetTop + "px " + this.offsetLeft + "px" });
4839
+ ensureSrcAttribute(this.$el);
4852
4840
 
4841
+ const rootMargin = toPx(this.offsetTop, 'height') + "px " + toPx(
4842
+ this.offsetLeft,
4843
+ 'width') + "px";
4853
4844
 
4854
- requestAnimationFrame(this.observe);
4855
- },
4845
+ this.observer = new IntersectionObserver(
4846
+ (entries) => {
4847
+ if (entries.some((entry) => entry.isIntersecting)) {
4848
+ this.load();
4849
+ this.observer.disconnect();
4850
+ }
4851
+ },
4852
+ { rootMargin });
4856
4853
 
4857
- disconnected() {
4858
- this.observer && this.observer.disconnect();
4854
+ this.observe();
4859
4855
  },
4860
4856
 
4861
- update: {
4862
- read(_ref8) {let { image } = _ref8;
4863
- if (!this.observer) {
4864
- return false;
4865
- }
4857
+ disconnected() {var _this$observer;
4858
+ if (this._data.image) {
4859
+ this._data.image.onload = '';
4860
+ }
4866
4861
 
4867
- if (!image && document.readyState === 'complete') {
4868
- this.load(this.observer.takeRecords());
4869
- }
4862
+ (_this$observer = this.observer) == null ? void 0 : _this$observer.disconnect();
4863
+ },
4870
4864
 
4871
- if (this.isImg) {
4865
+ update: {
4866
+ write(store) {
4867
+ if (!this.observer || isImg(this.$el)) {
4872
4868
  return false;
4873
4869
  }
4874
4870
 
4875
- image &&
4876
- image.then(
4877
- (img) => img && img.currentSrc !== '' && setSrcAttrs(this.$el, currentSrc(img)));
4878
-
4879
- },
4880
-
4881
- write(data) {
4882
- if (this.dataSrcset && window.devicePixelRatio !== 1) {
4871
+ const srcset = data(this.$el, 'data-srcset');
4872
+ if (srcset && window.devicePixelRatio !== 1) {
4883
4873
  const bgSize = css(this.$el, 'backgroundSize');
4884
- if (bgSize.match(/^(auto\s?)+$/) || toFloat(bgSize) === data.bgSize) {
4885
- data.bgSize = getSourceSize(this.dataSrcset, this.sizes);
4886
- css(this.$el, 'backgroundSize', data.bgSize + "px");
4874
+ if (bgSize.match(/^(auto\s?)+$/) || toFloat(bgSize) === store.bgSize) {
4875
+ store.bgSize = getSourceSize(srcset, data(this.$el, 'sizes'));
4876
+ css(this.$el, 'backgroundSize', store.bgSize + "px");
4887
4877
  }
4888
4878
  }
4889
4879
  },
@@ -4892,24 +4882,18 @@
4892
4882
 
4893
4883
 
4894
4884
  methods: {
4895
- load(entries) {
4896
- // Old chromium based browsers (UC Browser) did not implement `isIntersecting`
4897
- if (
4898
- !entries.some((entry) => isUndefined(entry.isIntersecting) || entry.isIntersecting))
4899
- {
4900
- return;
4885
+ load() {
4886
+ if (this._data.image) {
4887
+ return this._data.image;
4901
4888
  }
4902
4889
 
4903
- this._data.image = getImage(this.dataSrc, this.dataSrcset, this.sizes).then(
4904
- (img) => {
4905
- setSrcAttrs(this.$el, currentSrc(img), img.srcset, img.sizes);
4906
- storage[this.cacheKey] = currentSrc(img);
4907
- return img;
4908
- },
4909
- (e) => trigger(this.$el, new e.constructor(e.type, e)));
4910
-
4890
+ const image = isImg(this.$el) ?
4891
+ this.$el :
4892
+ getImageFromElement(this.$el, this.dataSrc, this.sources);
4911
4893
 
4912
- this.observer.disconnect();
4894
+ removeAttr(image, 'loading');
4895
+ setSrcAttrs(this.$el, image.currentSrc);
4896
+ return this._data.image = image;
4913
4897
  },
4914
4898
 
4915
4899
  observe() {
@@ -4922,12 +4906,11 @@
4922
4906
 
4923
4907
 
4924
4908
 
4925
- function setSrcAttrs(el, src, srcset, sizes) {
4909
+ function setSrcAttrs(el, src) {
4926
4910
  if (isImg(el)) {
4927
- const set = (prop, val) => val && val !== el[prop] && (el[prop] = val);
4928
- set('sizes', sizes);
4929
- set('srcset', srcset);
4930
- set('src', src);
4911
+ const parentNode = parent(el);
4912
+ const elements = isPicture(parentNode) ? children(parentNode) : [el];
4913
+ elements.forEach((el) => setSourceProps(el, el));
4931
4914
  } else if (src) {
4932
4915
  const change = !includes(el.style.backgroundImage, src);
4933
4916
  if (change) {
@@ -4937,16 +4920,62 @@
4937
4920
  }
4938
4921
  }
4939
4922
 
4940
- function getPlaceholderImage(width, height, sizes) {
4941
- if (sizes) {
4942
- ({ width, height } = Dimensions.ratio(
4943
- { width, height },
4944
- 'width',
4945
- toPx(sizesToPixel(sizes))));
4923
+ const srcProps = ['data-src', 'data-srcset', 'sizes'];
4924
+ function setSourceProps(sourceEl, targetEl) {
4925
+ srcProps.forEach((prop) => {
4926
+ const value = data(sourceEl, prop);
4927
+ if (value) {
4928
+ attr(targetEl, prop.replace(/^(data-)+/, ''), value);
4929
+ }
4930
+ });
4931
+ }
4932
+
4933
+ function getImageFromElement(el, src, sources) {
4934
+ const img = new Image();
4935
+
4936
+ wrapInPicture(img, sources);
4937
+ setSourceProps(el, img);
4938
+ img.onload = () => {
4939
+ setSrcAttrs(el, img.currentSrc);
4940
+ };
4941
+ attr(img, 'src', src);
4942
+ return img;
4943
+ }
4944
+
4945
+ function wrapInPicture(img, sources) {
4946
+ sources = parseSources(sources);
4947
+
4948
+ if (sources.length) {
4949
+ const picture = fragment('<picture>');
4950
+ for (const attrs of sources) {
4951
+ const source = fragment('<source>');
4952
+ attr(source, attrs);
4953
+ append(picture, source);
4954
+ }
4955
+ append(picture, img);
4956
+ }
4957
+ }
4958
+
4959
+ function parseSources(sources) {
4960
+ if (!sources) {
4961
+ return [];
4962
+ }
4963
+
4964
+ if (startsWith(sources, '[')) {
4965
+ try {
4966
+ sources = JSON.parse(sources);
4967
+ } catch (e) {
4968
+ sources = [];
4969
+ }
4970
+ } else {
4971
+ sources = parseOptions(sources);
4972
+ }
4946
4973
 
4974
+ if (!isArray(sources)) {
4975
+ sources = [sources];
4947
4976
  }
4948
4977
 
4949
- return "data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"" + width + "\" height=\"" + height + "\"></svg>";
4978
+ return sources.filter((source) => !isEmpty(source));
4950
4979
  }
4951
4980
 
4952
4981
  const sizesRe = /\s*(.*?)\s*(\w+|calc\(.*?\))\s*(?:,|$)/g;
@@ -4986,24 +5015,18 @@
4986
5015
  return descriptors.filter((size) => size >= srcSize)[0] || descriptors.pop() || '';
4987
5016
  }
4988
5017
 
4989
- function isImg(el) {
4990
- return el.tagName === 'IMG';
5018
+ function ensureSrcAttribute(el) {
5019
+ if (isImg(el) && !hasAttr(el, 'src')) {
5020
+ attr(el, 'src', 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"></svg>');
5021
+ }
4991
5022
  }
4992
5023
 
4993
- function currentSrc(el) {
4994
- return el.currentSrc || el.src;
5024
+ function isPicture(el) {
5025
+ return isTag(el, 'picture');
4995
5026
  }
4996
5027
 
4997
- const key = '__test__';
4998
- let storage;
4999
-
5000
- // workaround for Safari's private browsing mode and accessing sessionStorage in Blink
5001
- try {
5002
- storage = window.sessionStorage || {};
5003
- storage[key] = 1;
5004
- delete storage[key];
5005
- } catch (e) {
5006
- storage = {};
5028
+ function isImg(el) {
5029
+ return isTag(el, 'img');
5007
5030
  }
5008
5031
 
5009
5032
  var Media = {
@@ -5459,7 +5482,7 @@
5459
5482
 
5460
5483
 
5461
5484
  function openDialog(tmpl, options, hideFn, submitFn) {
5462
- options = assign({ bgClose: false, escClose: true, labels: modal.labels }, options);
5485
+ options = { bgClose: false, escClose: true, labels: modal.labels, ...options };
5463
5486
 
5464
5487
  const dialog = modal.dialog(tmpl(options), options);
5465
5488
  const deferred = new Deferred();
@@ -5588,10 +5611,11 @@
5588
5611
  this.$create(
5589
5612
  'drop',
5590
5613
  dropdowns.filter((el) => !this.getDropdown(el)),
5591
- assign({}, this.$props, {
5614
+ {
5615
+ ...this.$props,
5592
5616
  boundary: this.boundary,
5593
5617
  pos: this.pos,
5594
- offset: this.dropbar || this.offset }));
5618
+ offset: this.dropbar || this.offset });
5595
5619
 
5596
5620
 
5597
5621
  },
@@ -6483,26 +6507,11 @@
6483
6507
 
6484
6508
 
6485
6509
  computed: {
6486
- position(_ref, $el) {let { position } = _ref;
6487
- return position === 'auto' ?
6488
- (this.isFixed ? this.placeholder : $el).offsetHeight > height(window) ?
6489
- 'bottom' :
6490
- 'top' :
6491
- position;
6492
- },
6493
-
6494
- offset(_ref2, $el) {let { offset } = _ref2;
6495
- if (this.position === 'bottom') {
6496
- offset += '+100vh-100%';
6497
- }
6498
- return toPx(offset, 'height', $el);
6499
- },
6500
-
6501
- selTarget(_ref3, $el) {let { selTarget } = _ref3;
6510
+ selTarget(_ref, $el) {let { selTarget } = _ref;
6502
6511
  return selTarget && $(selTarget, $el) || $el;
6503
6512
  },
6504
6513
 
6505
- widthElement(_ref4, $el) {let { widthElement } = _ref4;
6514
+ widthElement(_ref2, $el) {let { widthElement } = _ref2;
6506
6515
  return query(widthElement, $el) || this.placeholder;
6507
6516
  },
6508
6517
 
@@ -6550,41 +6559,36 @@
6550
6559
  return window;
6551
6560
  },
6552
6561
 
6562
+ filter() {
6563
+ return this.targetOffset !== false;
6564
+ },
6565
+
6553
6566
  handler() {
6554
- if (!(this.targetOffset !== false && location.hash && scrollTop(window) > 0)) {
6567
+ if (!location.hash || scrollTop(window) === 0) {
6555
6568
  return;
6556
6569
  }
6557
6570
 
6558
- const target = $(location.hash);
6559
-
6560
- if (target) {
6561
- fastdom.read(() => {
6562
- const { top } = offset(target);
6563
- const elTop = offset(this.$el).top;
6564
- const elHeight = this.$el.offsetHeight;
6571
+ fastdom.read(() => {
6572
+ const targetOffset = offset($(location.hash));
6573
+ const elOffset = offset(this.$el);
6565
6574
 
6566
- if (
6567
- this.isFixed &&
6568
- elTop + elHeight >= top &&
6569
- elTop <= top + target.offsetHeight)
6570
- {
6571
- scrollTop(
6572
- window,
6573
- top -
6574
- elHeight - (
6575
- isNumeric(this.targetOffset) ? this.targetOffset : 0) -
6576
- this.offset);
6575
+ if (this.isFixed && intersectRect(targetOffset, elOffset)) {
6576
+ scrollTop(
6577
+ window,
6578
+ targetOffset.top -
6579
+ elOffset.height -
6580
+ toPx(this.targetOffset, 'height') -
6581
+ toPx(this.offset, 'height'));
6577
6582
 
6578
- }
6579
- });
6580
- }
6583
+ }
6584
+ });
6581
6585
  } }],
6582
6586
 
6583
6587
 
6584
6588
 
6585
6589
  update: [
6586
6590
  {
6587
- read(_ref5, types) {let { height: height$1, margin } = _ref5;
6591
+ read(_ref3, types) {let { height: height$1, margin } = _ref3;
6588
6592
  this.inactive = !this.matchMedia || !isVisible(this.$el);
6589
6593
 
6590
6594
  if (this.inactive) {
@@ -6593,35 +6597,49 @@
6593
6597
 
6594
6598
  const hide = this.isActive && types.has('resize');
6595
6599
  if (hide) {
6600
+ css(this.selTarget, 'transition', '0s');
6596
6601
  this.hide();
6597
6602
  }
6598
6603
 
6599
6604
  if (!this.isActive) {
6600
- height$1 = this.$el.offsetHeight;
6605
+ height$1 = offset(this.$el).height;
6601
6606
  margin = css(this.$el, 'margin');
6602
6607
  }
6603
6608
 
6604
6609
  if (hide) {
6605
6610
  this.show();
6611
+ fastdom.write(() => css(this.selTarget, 'transition', ''));
6606
6612
  }
6607
6613
 
6608
- const overflow = Math.max(0, height$1 + this.offset - height(window));
6609
-
6610
6614
  const referenceElement = this.isFixed ? this.placeholder : this.$el;
6615
+ const windowHeight = height(window);
6616
+
6617
+ let position = this.position;
6618
+ if (position === 'auto' && height$1 > windowHeight) {
6619
+ position = 'bottom';
6620
+ }
6621
+
6622
+ let offset$1 = toPx(this.offset, 'height', referenceElement);
6623
+ if (position === 'bottom') {
6624
+ offset$1 += windowHeight - height$1;
6625
+ }
6626
+
6627
+ const overflow = Math.max(0, height$1 + offset$1 - windowHeight);
6611
6628
  const topOffset = offset(referenceElement).top;
6612
6629
  const offsetParentTop = offset(referenceElement.offsetParent).top;
6613
6630
 
6614
6631
  const top = parseProp(this.top, this.$el, topOffset);
6615
6632
  const bottom = parseProp(this.bottom, this.$el, topOffset + height$1, true);
6616
6633
 
6617
- const start = Math.max(top, topOffset) - this.offset;
6634
+ const start = Math.max(top, topOffset) - offset$1;
6618
6635
  const end = bottom ?
6619
- bottom - this.$el.offsetHeight + overflow - this.offset :
6620
- getScrollingElement(this.$el).scrollHeight - height(window);
6636
+ bottom - offset(this.$el).height + overflow - offset$1 :
6637
+ getScrollingElement(this.$el).scrollHeight - windowHeight;
6621
6638
 
6622
6639
  return {
6623
6640
  start,
6624
6641
  end,
6642
+ offset: offset$1,
6625
6643
  overflow,
6626
6644
  topOffset,
6627
6645
  offsetParentTop,
@@ -6629,11 +6647,11 @@
6629
6647
  margin,
6630
6648
  width: dimensions$1(isVisible(this.widthElement) ? this.widthElement : this.$el).
6631
6649
  width,
6632
- top: offsetPosition(this.placeholder)[0] };
6650
+ top: offsetPosition(referenceElement)[0] };
6633
6651
 
6634
6652
  },
6635
6653
 
6636
- write(_ref6) {let { height, margin } = _ref6;
6654
+ write(_ref4) {let { height, margin } = _ref4;
6637
6655
  const { placeholder } = this;
6638
6656
 
6639
6657
  css(placeholder, { height, margin });
@@ -6650,14 +6668,14 @@
6650
6668
 
6651
6669
 
6652
6670
  {
6653
- read(_ref7)
6671
+ read(_ref5)
6654
6672
 
6655
6673
 
6656
6674
 
6657
6675
 
6658
6676
 
6659
6677
 
6660
- {let { scroll: prevScroll = 0, dir: prevDir = 'down', overflow, overflowScroll = 0, start, end } = _ref7;
6678
+ {let { scroll: prevScroll = 0, dir: prevDir = 'down', overflow, overflowScroll = 0, start, end } = _ref5;
6661
6679
  const scroll = scrollTop(window);
6662
6680
  const dir = prevScroll <= scroll ? 'down' : 'up';
6663
6681
 
@@ -6738,7 +6756,7 @@
6738
6756
  }
6739
6757
  } else if (this.isFixed) {
6740
6758
  this.update();
6741
- } else if (this.animation) {
6759
+ } else if (this.animation && scroll > topOffset) {
6742
6760
  Animation.cancel(this.$el);
6743
6761
  this.show();
6744
6762
  Animation.in(this.$el, this.animation).catch(noop);
@@ -6766,33 +6784,33 @@
6766
6784
  },
6767
6785
 
6768
6786
  update() {
6769
- const {
6787
+ let {
6770
6788
  width,
6771
6789
  scroll = 0,
6772
6790
  overflow,
6773
6791
  overflowScroll = 0,
6774
6792
  start,
6775
6793
  end,
6794
+ offset,
6776
6795
  topOffset,
6777
6796
  height,
6778
6797
  offsetParentTop } =
6779
6798
  this._data;
6780
6799
  const active = start !== 0 || scroll > start;
6781
- let top = this.offset;
6782
6800
  let position = 'fixed';
6783
6801
 
6784
6802
  if (scroll > end) {
6785
- top = end + this.offset - offsetParentTop;
6803
+ offset += end - offsetParentTop;
6786
6804
  position = 'absolute';
6787
6805
  }
6788
6806
 
6789
6807
  if (overflow) {
6790
- top -= overflowScroll;
6808
+ offset -= overflowScroll;
6791
6809
  }
6792
6810
 
6793
6811
  css(this.$el, {
6794
6812
  position,
6795
- top: top + "px",
6813
+ top: offset + "px",
6796
6814
  width });
6797
6815
 
6798
6816
 
@@ -7107,7 +7125,7 @@
7107
7125
  name: 'keydown',
7108
7126
 
7109
7127
  filter() {
7110
- return includes(this.mode, 'click') && this.$el.tagName !== 'INPUT';
7128
+ return includes(this.mode, 'click') && !isTag(this.$el, 'input');
7111
7129
  },
7112
7130
 
7113
7131
  handler(e) {
@@ -7551,7 +7569,7 @@
7551
7569
 
7552
7570
  // Reset to previous state
7553
7571
  nodes.forEach((el, i) => propsFrom[i] && css(el, propsFrom[i]));
7554
- css(target, assign({ display: 'block' }, targetProps));
7572
+ css(target, { display: 'block', ...targetProps });
7555
7573
 
7556
7574
  // Start transitions on next frame
7557
7575
  requestAnimationFrame(() => {
@@ -7583,15 +7601,13 @@
7583
7601
  const zIndex = css(el, 'zIndex');
7584
7602
 
7585
7603
  return isVisible(el) ?
7586
- assign(
7587
7604
  {
7588
7605
  display: '',
7589
7606
  opacity: opacity ? css(el, 'opacity') : '0',
7590
7607
  pointerEvents: 'none',
7591
7608
  position: 'absolute',
7592
- zIndex: zIndex === 'auto' ? index(el) : zIndex },
7593
-
7594
- getPositionWithMargin(el)) :
7609
+ zIndex: zIndex === 'auto' ? index(el) : zIndex,
7610
+ ...getPositionWithMargin(el) } :
7595
7611
 
7596
7612
  false;
7597
7613
  }
@@ -7775,7 +7791,7 @@
7775
7791
  },
7776
7792
 
7777
7793
  setState(state, animate) {if (animate === void 0) {animate = true;}
7778
- state = assign({ filter: { '': '' }, sort: [] }, state);
7794
+ state = { filter: { '': '' }, sort: [], ...state };
7779
7795
 
7780
7796
  trigger(this.$el, 'beforeFilter', [this, state]);
7781
7797
 
@@ -7875,7 +7891,7 @@
7875
7891
  }
7876
7892
 
7877
7893
  function sortItems(nodes, sort, order) {
7878
- return assign([], nodes).sort(
7894
+ return [...nodes].sort(
7879
7895
  (a, b) =>
7880
7896
  data(a, sort).localeCompare(data(b, sort), undefined, { numeric: true }) * (
7881
7897
  order === 'asc' || -1));
@@ -7914,7 +7930,8 @@
7914
7930
  return "scale3d(" + value + ", " + value + ", 1)";
7915
7931
  }
7916
7932
 
7917
- var Animations$1 = assign({}, Animations$2, {
7933
+ var Animations$1 = {
7934
+ ...Animations$2,
7918
7935
  fade: {
7919
7936
  show() {
7920
7937
  return [{ opacity: 0 }, { opacity: 1 }];
@@ -7946,7 +7963,7 @@
7946
7963
  { opacity: 1 - percent, transform: scale3d(1 - 0.2 * percent) },
7947
7964
  { opacity: percent, transform: scale3d(1 - 0.2 + 0.2 * percent) }];
7948
7965
 
7949
- } } });
7966
+ } } };
7950
7967
 
7951
7968
  function Transitioner$1(prev, next, dir, _ref) {let { animation, easing } = _ref;
7952
7969
  const { percent, translate, show = noop } = animation;
@@ -8507,20 +8524,13 @@
8507
8524
  },
8508
8525
 
8509
8526
  _show(prev, next, force) {
8510
- this._transitioner = this._getTransitioner(
8511
- prev,
8512
- next,
8513
- this.dir,
8514
- assign(
8515
- {
8527
+ this._transitioner = this._getTransitioner(prev, next, this.dir, {
8516
8528
  easing: force ?
8517
8529
  next.offsetWidth < 600 ?
8518
8530
  'cubic-bezier(0.25, 0.46, 0.45, 0.94)' /* easeOutQuad */ :
8519
8531
  'cubic-bezier(0.165, 0.84, 0.44, 1)' /* easeOutQuart */ :
8520
- this.easing },
8521
-
8522
- this.transitionOptions));
8523
-
8532
+ this.easing,
8533
+ ...this.transitionOptions });
8524
8534
 
8525
8535
 
8526
8536
  if (!force && !prev) {
@@ -8585,7 +8595,7 @@
8585
8595
 
8586
8596
  computed: {
8587
8597
  animation(_ref) {let { animation, Animations } = _ref;
8588
- return assign(Animations[animation] || Animations.slide, { name: animation });
8598
+ return { ...(Animations[animation] || Animations.slide), name: animation };
8589
8599
  },
8590
8600
 
8591
8601
  transitionOptions() {
@@ -8808,28 +8818,20 @@
8808
8818
  if (type === 'image' || src.match(/\.(avif|jpe?g|a?png|gif|svg|webp)($|\?)/i)) {
8809
8819
  try {
8810
8820
  const { width, height } = await getImage(src, attrs.srcset, attrs.size);
8811
- this.setItem(
8812
- item,
8813
- createEl('img', assign({ src, width, height, alt }, attrs)));
8814
-
8821
+ this.setItem(item, createEl('img', { src, width, height, alt, ...attrs }));
8815
8822
  } catch (e) {
8816
8823
  this.setError(item);
8817
8824
  }
8818
8825
 
8819
8826
  // Video
8820
8827
  } else if (type === 'video' || src.match(/\.(mp4|webm|ogv)($|\?)/i)) {
8821
- const video = createEl(
8822
- 'video',
8823
- assign(
8824
- {
8828
+ const video = createEl('video', {
8825
8829
  src,
8826
8830
  poster,
8827
8831
  controls: '',
8828
8832
  playsinline: '',
8829
- 'uk-video': "" + this.videoAutoplay },
8830
-
8831
- attrs));
8832
-
8833
+ 'uk-video': "" + this.videoAutoplay,
8834
+ ...attrs });
8833
8835
 
8834
8836
 
8835
8837
  on(video, 'loadedmetadata', () => {
@@ -8842,17 +8844,12 @@
8842
8844
  } else if (type === 'iframe' || src.match(/\.(html|php)($|\?)/i)) {
8843
8845
  this.setItem(
8844
8846
  item,
8845
- createEl(
8846
- 'iframe',
8847
- assign(
8848
- {
8847
+ createEl('iframe', {
8849
8848
  src,
8850
8849
  frameborder: '0',
8851
8850
  allowfullscreen: '',
8852
- class: 'uk-lightbox-iframe' },
8853
-
8854
- attrs)));
8855
-
8851
+ class: 'uk-lightbox-iframe',
8852
+ ...attrs }));
8856
8853
 
8857
8854
 
8858
8855
 
@@ -8864,19 +8861,14 @@
8864
8861
  {
8865
8862
  this.setItem(
8866
8863
  item,
8867
- createEl(
8868
- 'iframe',
8869
- assign(
8870
- {
8871
- src: "https://www.youtube" + (matches[1] || '') + ".com/embed/" +
8872
- matches[2] + (
8864
+ createEl('iframe', {
8865
+ src: "https://www.youtube" + (matches[1] || '') + ".com/embed/" + matches[2] + (
8873
8866
  matches[3] ? "?" + matches[3] : ''),
8874
- width: 1920,
8875
- height: 1080 },
8876
-
8877
- iframeAttrs,
8878
- attrs)));
8879
8867
 
8868
+ width: 1920,
8869
+ height: 1080,
8870
+ ...iframeAttrs,
8871
+ ...attrs }));
8880
8872
 
8881
8873
 
8882
8874
 
@@ -8896,19 +8888,14 @@
8896
8888
 
8897
8889
  this.setItem(
8898
8890
  item,
8899
- createEl(
8900
- 'iframe',
8901
- assign(
8902
- {
8891
+ createEl('iframe', {
8903
8892
  src: "https://player.vimeo.com/video/" + matches[1] + (
8904
8893
  matches[2] ? "?" + matches[2] : ''),
8905
8894
 
8906
8895
  width,
8907
- height },
8908
-
8909
- iframeAttrs,
8910
- attrs)));
8911
-
8896
+ height,
8897
+ ...iframeAttrs,
8898
+ ...attrs }));
8912
8899
 
8913
8900
 
8914
8901
  } catch (e) {
@@ -9010,8 +8997,7 @@
9010
8997
  index = findIndex(items, (_ref2) => {let { source: src } = _ref2;return source === src;});
9011
8998
  }
9012
8999
 
9013
- this.panel =
9014
- this.panel || this.$create('lightboxPanel', assign({}, this.$props, { items }));
9000
+ this.panel = this.panel || this.$create('lightboxPanel', { ...this.$props, items });
9015
9001
 
9016
9002
  on(this.panel.$el, 'hidden', () => this.panel = false);
9017
9003
 
@@ -9216,50 +9202,44 @@
9216
9202
  },
9217
9203
 
9218
9204
  getCss(percent) {
9219
- return keys(this.props).reduce(
9220
- (css, prop) => {
9205
+ const css = { transform: '', filter: '' };
9206
+ for (const prop in this.props) {
9221
9207
  this.props[prop](css, percent);
9222
- return css;
9223
- },
9224
- { transform: '', filter: '' });
9225
-
9208
+ }
9209
+ return css;
9226
9210
  } } };
9227
9211
 
9228
9212
 
9229
9213
 
9230
- function transformFn(prop, el, steps) {
9231
- const unit = getUnit(steps) || { x: 'px', y: 'px', rotate: 'deg' }[prop] || '';
9214
+ function transformFn(prop, el, stops) {
9215
+ const unit = getUnit(stops) || { x: 'px', y: 'px', rotate: 'deg' }[prop] || '';
9216
+ let transformFn;
9232
9217
 
9233
9218
  if (prop === 'x' || prop === 'y') {
9234
9219
  prop = "translate" + ucfirst(prop);
9220
+ transformFn = (stop) => toFloat(toFloat(stop).toFixed(unit === 'px' ? 0 : 6));
9235
9221
  }
9236
9222
 
9237
- steps = steps.map(toFloat);
9238
-
9239
- if (steps.length === 1) {
9240
- steps.unshift(prop === 'scale' ? 1 : 0);
9223
+ if (stops.length === 1) {
9224
+ stops.unshift(prop === 'scale' ? 1 : 0);
9241
9225
  }
9242
9226
 
9243
- return (css, percent) => {
9244
- let value = getValue(steps, percent);
9245
-
9246
- if (startsWith(prop, 'translate')) {
9247
- value = toFloat(value).toFixed(unit === 'px' ? 0 : 6);
9248
- }
9227
+ stops = parseStops(stops, transformFn);
9249
9228
 
9250
- css.transform += " " + prop + "(" + value + unit + ")";
9229
+ return (css, percent) => {
9230
+ css.transform += " " + prop + "(" + getValue(stops, percent) + unit + ")";
9251
9231
  };
9252
9232
  }
9253
9233
 
9254
- function colorFn(prop, el, steps) {
9255
- if (steps.length === 1) {
9256
- steps.unshift(getCssValue(el, prop, ''));
9234
+ function colorFn(prop, el, stops) {
9235
+ if (stops.length === 1) {
9236
+ stops.unshift(getCssValue(el, prop, ''));
9257
9237
  }
9258
9238
 
9259
- steps = steps.map((step) => parseColor(el, step));
9239
+ stops = parseStops(stops, (stop) => parseColor(el, stop));
9260
9240
 
9261
9241
  return (css, percent) => {
9262
- const [start, end, p] = getStep(steps, percent);
9242
+ const [start, end, p] = getStop(stops, percent);
9263
9243
  const value = start.
9264
9244
  map((value, i) => {
9265
9245
  value += p * (end[i] - value);
@@ -9279,85 +9259,83 @@
9279
9259
  map(toFloat);
9280
9260
  }
9281
9261
 
9282
- function filterFn(prop, el, steps) {
9283
- if (steps.length === 1) {
9284
- steps.unshift(0);
9262
+ function filterFn(prop, el, stops) {
9263
+ if (stops.length === 1) {
9264
+ stops.unshift(0);
9285
9265
  }
9286
9266
 
9287
- const unit = getUnit(steps) || { blur: 'px', hue: 'deg' }[prop] || '%';
9267
+ const unit = getUnit(stops) || { blur: 'px', hue: 'deg' }[prop] || '%';
9288
9268
  prop = { fopacity: 'opacity', hue: 'hue-rotate' }[prop] || prop;
9289
- steps = steps.map(toFloat);
9269
+ stops = parseStops(stops);
9290
9270
 
9291
9271
  return (css, percent) => {
9292
- const value = getValue(steps, percent);
9272
+ const value = getValue(stops, percent);
9293
9273
  css.filter += " " + prop + "(" + (value + unit) + ")";
9294
9274
  };
9295
9275
  }
9296
9276
 
9297
- function cssPropFn(prop, el, steps) {
9298
- if (steps.length === 1) {
9299
- steps.unshift(getCssValue(el, prop, ''));
9277
+ function cssPropFn(prop, el, stops) {
9278
+ if (stops.length === 1) {
9279
+ stops.unshift(getCssValue(el, prop, ''));
9300
9280
  }
9301
9281
 
9302
- steps = steps.map(toFloat);
9282
+ stops = parseStops(stops);
9303
9283
 
9304
9284
  return (css, percent) => {
9305
- css[prop] = getValue(steps, percent);
9285
+ css[prop] = getValue(stops, percent);
9306
9286
  };
9307
9287
  }
9308
9288
 
9309
- function strokeFn(prop, el, steps) {
9310
- if (steps.length === 1) {
9311
- steps.unshift(0);
9289
+ function strokeFn(prop, el, stops) {
9290
+ if (stops.length === 1) {
9291
+ stops.unshift(0);
9312
9292
  }
9313
9293
 
9314
- const unit = getUnit(steps);
9315
- steps = steps.map(toFloat);
9294
+ const unit = getUnit(stops);
9295
+ const length = getMaxPathLength(el);
9296
+ stops = parseStops(stops.reverse(), (stop) => {
9297
+ stop = toFloat(stop);
9298
+ return unit === '%' ? stop * length / 100 : stop;
9299
+ });
9316
9300
 
9317
- if (!steps.some((step) => step)) {
9301
+ if (!stops.some((_ref) => {let [value] = _ref;return value;})) {
9318
9302
  return noop;
9319
9303
  }
9320
9304
 
9321
- const length = getMaxPathLength(el);
9322
9305
  css(el, 'strokeDasharray', length);
9323
9306
 
9324
- if (unit === '%') {
9325
- steps = steps.map((step) => step * length / 100);
9326
- }
9327
-
9328
- steps = steps.reverse();
9329
-
9330
9307
  return (css, percent) => {
9331
- css.strokeDashoffset = getValue(steps, percent);
9308
+ css.strokeDashoffset = getValue(stops, percent);
9332
9309
  };
9333
9310
  }
9334
9311
 
9335
- function backgroundFn(prop, el, steps) {
9336
- if (steps.length === 1) {
9337
- steps.unshift(0);
9312
+ function backgroundFn(prop, el, stops) {
9313
+ if (stops.length === 1) {
9314
+ stops.unshift(0);
9338
9315
  }
9339
9316
 
9340
9317
  prop = prop.substr(-1);
9341
9318
  const attr = prop === 'y' ? 'height' : 'width';
9342
- steps = steps.map((step) => toPx(step, attr, el));
9319
+ stops = parseStops(stops, (stop) => toPx(stop, attr, el));
9343
9320
 
9344
9321
  const bgPos = getCssValue(el, "background-position-" + prop, '');
9345
9322
 
9346
9323
  return getCssValue(el, 'backgroundSize', '') === 'cover' ?
9347
- backgroundCoverFn(prop, el, steps, bgPos, attr) :
9348
- setBackgroundPosFn(prop, steps, bgPos);
9324
+ backgroundCoverFn(prop, el, stops, bgPos, attr) :
9325
+ setBackgroundPosFn(prop, stops, bgPos);
9349
9326
  }
9350
9327
 
9351
- function backgroundCoverFn(prop, el, steps, bgPos, attr) {
9328
+ function backgroundCoverFn(prop, el, stops, bgPos, attr) {
9352
9329
  const dimImage = getBackgroundImageDimensions(el);
9353
9330
 
9354
9331
  if (!dimImage.width) {
9355
9332
  return noop;
9356
9333
  }
9357
9334
 
9358
- const min = Math.min(...steps);
9359
- const max = Math.max(...steps);
9360
- const down = steps.indexOf(min) < steps.indexOf(max);
9335
+ const values = stops.map((_ref2) => {let [value] = _ref2;return value;});
9336
+ const min = Math.min(...values);
9337
+ const max = Math.max(...values);
9338
+ const down = values.indexOf(min) < values.indexOf(max);
9361
9339
 
9362
9340
  const diff = max - min;
9363
9341
  let pos = (down ? -diff : 0) - (down ? min : max);
@@ -9382,7 +9360,7 @@
9382
9360
 
9383
9361
  const dim = Dimensions.cover(dimImage, dimEl);
9384
9362
 
9385
- const fn = setBackgroundPosFn(prop, steps, pos + "px");
9363
+ const fn = setBackgroundPosFn(prop, stops, pos + "px");
9386
9364
  return (css, percent) => {
9387
9365
  fn(css, percent);
9388
9366
  css.backgroundSize = dim.width + "px " + dim.height + "px";
@@ -9390,9 +9368,9 @@
9390
9368
  };
9391
9369
  }
9392
9370
 
9393
- function setBackgroundPosFn(prop, steps, pos) {
9371
+ function setBackgroundPosFn(prop, stops, pos) {
9394
9372
  return function (css, percent) {
9395
- css["background-position-" + prop] = "calc(" + pos + " + " + getValue(steps, percent) + "px)";
9373
+ css["background-position-" + prop] = "calc(" + pos + " + " + getValue(stops, percent) + "px)";
9396
9374
  };
9397
9375
  }
9398
9376
 
@@ -9426,27 +9404,71 @@
9426
9404
 
9427
9405
  }
9428
9406
 
9429
- function getStep(steps, percent) {
9430
- const count = steps.length - 1;
9431
- const index = Math.min(Math.floor(count * percent), count - 1);
9407
+ function parseStops(stops, fn) {if (fn === void 0) {fn = toFloat;}
9408
+ const result = [];
9409
+ const { length } = stops;
9410
+ let nullIndex = 0;
9411
+ for (let i = 0; i < length; i++) {
9412
+ let [value, percent] = isString(stops[i]) ? stops[i].trim().split(' ') : [stops[i]];
9413
+ value = fn(value);
9414
+ percent = percent ? toFloat(percent) / 100 : null;
9415
+
9416
+ if (i === 0) {
9417
+ if (percent === null) {
9418
+ percent = 0;
9419
+ } else if (percent) {
9420
+ result.push([value, 0]);
9421
+ }
9422
+ } else if (i === length - 1) {
9423
+ if (percent === null) {
9424
+ percent = 1;
9425
+ } else if (percent !== 1) {
9426
+ result.push([value, percent]);
9427
+ percent = 1;
9428
+ }
9429
+ }
9430
+
9431
+ result.push([value, percent]);
9432
+
9433
+ if (percent === null) {
9434
+ nullIndex++;
9435
+ } else if (nullIndex) {
9436
+ const leftPercent = result[i - nullIndex - 1][1];
9437
+ const p = (percent - leftPercent) / (nullIndex + 1);
9438
+ for (let j = nullIndex; j > 0; j--) {
9439
+ result[i - j][1] = leftPercent + p * (nullIndex - j + 1);
9440
+ }
9441
+
9442
+ nullIndex = 0;
9443
+ }
9444
+ }
9445
+
9446
+ return result;
9447
+ }
9448
+
9449
+ function getStop(stops, percent) {
9450
+ const index = findIndex(stops.slice(1), (_ref3) => {let [, targetPercent] = _ref3;return percent <= targetPercent;}) + 1;
9451
+ return [
9452
+ stops[index - 1][0],
9453
+ stops[index][0],
9454
+ (percent - stops[index - 1][1]) / (stops[index][1] - stops[index - 1][1])];
9432
9455
 
9433
- return steps.
9434
- slice(index, index + 2).
9435
- concat(percent === 1 ? 1 : percent % (1 / count) * count);
9436
9456
  }
9437
9457
 
9438
- function getValue(steps, percent) {
9439
- const [start, end, p] = getStep(steps, percent);
9458
+ function getValue(stops, percent) {
9459
+ const [start, end, p] = getStop(stops, percent);
9440
9460
  return isNumber(start) ? start + Math.abs(start - end) * p * (start < end ? 1 : -1) : +end;
9441
9461
  }
9442
9462
 
9443
- function getUnit(steps, defaultUnit) {
9444
- return (
9445
- steps.reduce(
9446
- (unit, step) => unit || isString(step) && step.replace(/[\d-]/g, '').trim(),
9447
- '') ||
9448
- defaultUnit);
9449
-
9463
+ const unitRe = /^-?\d+([^\s]*)/;
9464
+ function getUnit(stops, defaultUnit) {
9465
+ for (const stop of stops) {
9466
+ const match = stop.match == null ? void 0 : stop.match(unitRe);
9467
+ if (match) {
9468
+ return match[1];
9469
+ }
9470
+ }
9471
+ return defaultUnit;
9450
9472
  }
9451
9473
 
9452
9474
  function getCssValue(el, prop, value) {
@@ -9558,6 +9580,42 @@
9558
9580
 
9559
9581
  events: ['resize'] } };
9560
9582
 
9583
+ var SliderPreload = {
9584
+ connected() {
9585
+ if (window.IntersectionObserver) {
9586
+ this.observer = new IntersectionObserver(
9587
+ (entries) => {
9588
+ if (entries.some((entry) => entry.isIntersecting)) {
9589
+ removeLazyLoad(this.getAdjacentSlides());
9590
+ }
9591
+ },
9592
+ { rootMargin: '50% 50%' });
9593
+
9594
+ this.observer.observe(this.$el);
9595
+ }
9596
+ },
9597
+
9598
+ disconnected() {
9599
+ this.observer && this.observer.disconnect();
9600
+ },
9601
+
9602
+ update: {
9603
+ read() {
9604
+ if (isVisible(this.$el)) {
9605
+ removeLazyLoad(this.getAdjacentSlides());
9606
+ }
9607
+ },
9608
+
9609
+ events: ['resize'] } };
9610
+
9611
+
9612
+
9613
+ function removeLazyLoad(elements) {if (elements === void 0) {elements = [];}
9614
+ for (const el of elements) {
9615
+ el && $$('img[loading="lazy"]', el).forEach((el) => removeAttr(el, 'loading'));
9616
+ }
9617
+ }
9618
+
9561
9619
  function Transitioner (prev, next, dir, _ref) {let { center, easing, list } = _ref;
9562
9620
  const deferred = new Deferred();
9563
9621
 
@@ -9724,7 +9782,7 @@
9724
9782
  }
9725
9783
 
9726
9784
  var slider = {
9727
- mixins: [Class, Slider, SliderReactive],
9785
+ mixins: [Class, Slider, SliderReactive, SliderPreload],
9728
9786
 
9729
9787
  props: {
9730
9788
  center: Boolean,
@@ -9961,6 +10019,25 @@
9961
10019
  } while (index !== prev);
9962
10020
 
9963
10021
  return index;
10022
+ },
10023
+
10024
+ getAdjacentSlides() {
10025
+ const { width } = dimensions$1(this.list);
10026
+ const left = -width;
10027
+ const right = width * 2;
10028
+ const slideWidth = dimensions$1(this.slides[this.index]).width;
10029
+ const slideLeft = this.center ? width / 2 - slideWidth / 2 : 0;
10030
+ const slides = new Set();
10031
+ for (const i of [-1, 1]) {
10032
+ let currentLeft = slideLeft + (i > 0 ? slideWidth : 0);
10033
+ let j = 0;
10034
+ do {
10035
+ const slide = this.slides[this.getIndex(this.index + i + j++ * i)];
10036
+ currentLeft += dimensions$1(slide).width * i;
10037
+ slides.add(slide);
10038
+ } while (this.slides.length > j && currentLeft > left && currentLeft < right);
10039
+ }
10040
+ return Array.from(slides);
9964
10041
  } } };
9965
10042
 
9966
10043
 
@@ -10047,7 +10124,8 @@
10047
10124
  return isIn(type) ^ dir < 0 ? percent : 1 - percent;
10048
10125
  }
10049
10126
 
10050
- var Animations = assign({}, Animations$2, {
10127
+ var Animations = {
10128
+ ...Animations$2,
10051
10129
  fade: {
10052
10130
  show() {
10053
10131
  return [{ opacity: 0, zIndex: 0 }, { zIndex: -1 }];
@@ -10136,10 +10214,10 @@
10136
10214
  { transform: translate(-30 * percent), zIndex: -1 },
10137
10215
  { transform: translate(100 * (1 - percent)), zIndex: 0 }];
10138
10216
 
10139
- } } });
10217
+ } } };
10140
10218
 
10141
10219
  var slideshow = {
10142
- mixins: [Class, Slideshow, SliderReactive],
10220
+ mixins: [Class, Slideshow, SliderReactive, SliderPreload],
10143
10221
 
10144
10222
  props: {
10145
10223
  ratio: String,
@@ -10182,7 +10260,13 @@
10182
10260
  height > 0 && css(this.list, 'minHeight', height);
10183
10261
  },
10184
10262
 
10185
- events: ['resize'] } };
10263
+ events: ['resize'] },
10264
+
10265
+
10266
+ methods: {
10267
+ getAdjacentSlides() {
10268
+ return [1, -1].map((i) => this.slides[this.getIndex(this.index + i)]);
10269
+ } } };
10186
10270
 
10187
10271
  var sortable = {
10188
10272
  mixins: [Class, Animate],
@@ -10355,7 +10439,7 @@
10355
10439
 
10356
10440
  this.touched = new Set([this]);
10357
10441
  this.placeholder = placeholder;
10358
- this.origin = assign({ target, index: index(placeholder) }, this.pos);
10442
+ this.origin = { target, index: index(placeholder), ...this.pos };
10359
10443
 
10360
10444
  on(document, pointerMove, this.move);
10361
10445
  on(document, pointerUp, this.end);