uikit 3.25.29-dev.e02d266 → 3.25.29-dev.f3e1c53

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 (63) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/css/uikit-core-rtl.css +1 -1
  3. package/dist/css/uikit-core-rtl.min.css +1 -1
  4. package/dist/css/uikit-core.css +1 -1
  5. package/dist/css/uikit-core.min.css +1 -1
  6. package/dist/css/uikit-rtl.css +1 -1
  7. package/dist/css/uikit-rtl.min.css +1 -1
  8. package/dist/css/uikit.css +1 -1
  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 +12 -11
  13. package/dist/js/components/filter.min.js +1 -1
  14. package/dist/js/components/lightbox-panel.js +23 -18
  15. package/dist/js/components/lightbox-panel.min.js +1 -1
  16. package/dist/js/components/lightbox.js +23 -18
  17. package/dist/js/components/lightbox.min.js +1 -1
  18. package/dist/js/components/notification.js +5 -2
  19. package/dist/js/components/notification.min.js +1 -1
  20. package/dist/js/components/parallax.js +10 -9
  21. package/dist/js/components/parallax.min.js +1 -1
  22. package/dist/js/components/slider-parallax.js +1 -1
  23. package/dist/js/components/slider-parallax.min.js +1 -1
  24. package/dist/js/components/slider.js +11 -10
  25. package/dist/js/components/slider.min.js +1 -1
  26. package/dist/js/components/slideshow-parallax.js +1 -1
  27. package/dist/js/components/slideshow-parallax.min.js +1 -1
  28. package/dist/js/components/slideshow.js +11 -10
  29. package/dist/js/components/slideshow.min.js +1 -1
  30. package/dist/js/components/sortable.js +11 -10
  31. package/dist/js/components/sortable.min.js +1 -1
  32. package/dist/js/components/tooltip.js +1 -1
  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 +71 -77
  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 +71 -77
  41. package/dist/js/uikit.min.js +1 -1
  42. package/package.json +1 -1
  43. package/src/js/api/computed.js +1 -1
  44. package/src/js/api/observables.js +5 -4
  45. package/src/js/api/observer.js +3 -4
  46. package/src/js/api/update.js +10 -9
  47. package/src/js/core/alert.js +6 -3
  48. package/src/js/core/drop.js +4 -4
  49. package/src/js/core/dropnav.js +1 -1
  50. package/src/js/core/grid.js +1 -1
  51. package/src/js/core/icon.js +6 -12
  52. package/src/js/core/img.js +3 -3
  53. package/src/js/core/inverse.js +4 -2
  54. package/src/js/core/margin.js +1 -1
  55. package/src/js/core/modal.js +1 -1
  56. package/src/js/core/overflow-fade.js +6 -2
  57. package/src/js/core/switcher.js +1 -0
  58. package/src/js/core/toggle.js +0 -2
  59. package/src/js/mixin/event.js +4 -1
  60. package/src/js/util/lang.js +8 -33
  61. package/src/js/util/scroll.js +14 -9
  62. package/tests/alert.html +2 -2
  63. package/tests/overflow-fade.test.mjs +69 -0
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.25.29-dev.e02d266 | https://www.getuikit.com | (c) 2014 - 2026 YOOtheme | MIT License */
1
+ /*! UIkit 3.25.29-dev.f3e1c53 | https://www.getuikit.com | (c) 2014 - 2026 YOOtheme | MIT License */
2
2
 
3
3
  (function (global, factory) {
4
4
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -156,28 +156,17 @@
156
156
  function pointInRect(point, rect) {
157
157
  return point.x <= rect.right && point.x >= rect.left && point.y <= rect.bottom && point.y >= rect.top;
158
158
  }
159
- function ratio(dimensions, prop, value) {
160
- const aProp = prop === "width" ? "height" : "width";
159
+ function cover$1(dimensions, maxDimensions) {
160
+ const scale = Math.max(
161
+ dimensions.width ? maxDimensions.width / dimensions.width : 0,
162
+ dimensions.height ? maxDimensions.height / dimensions.height : 0
163
+ );
161
164
  return {
162
- [aProp]: dimensions[prop] ? Math.round(value * dimensions[aProp] / dimensions[prop]) : dimensions[aProp],
163
- [prop]: value
165
+ width: Math.round(dimensions.width * scale),
166
+ height: Math.round(dimensions.height * scale)
164
167
  };
165
168
  }
166
- function contain(dimensions, maxDimensions) {
167
- dimensions = { ...dimensions };
168
- for (const prop in dimensions) {
169
- dimensions = dimensions[prop] > maxDimensions[prop] ? ratio(dimensions, prop, maxDimensions[prop]) : dimensions;
170
- }
171
- return dimensions;
172
- }
173
- function cover$1(dimensions, maxDimensions) {
174
- dimensions = contain(dimensions, maxDimensions);
175
- for (const prop in dimensions) {
176
- dimensions = dimensions[prop] < maxDimensions[prop] ? ratio(dimensions, prop, maxDimensions[prop]) : dimensions;
177
- }
178
- return dimensions;
179
- }
180
- const Dimensions = { ratio, contain, cover: cover$1 };
169
+ const Dimensions = { cover: cover$1 };
181
170
  function getIndex(i, elements, current = 0, finite = false) {
182
171
  elements = toNodes(elements);
183
172
  const { length } = elements;
@@ -1690,7 +1679,7 @@
1690
1679
  wrapInner: wrapInner
1691
1680
  });
1692
1681
 
1693
- var VERSION = '3.25.29-dev.e02d266';
1682
+ var VERSION = '3.25.29-dev.f3e1c53';
1694
1683
 
1695
1684
  function initUpdates(instance) {
1696
1685
  instance._data = {};
@@ -1707,22 +1696,23 @@
1707
1696
  if (!instance._updates.length) {
1708
1697
  return;
1709
1698
  }
1710
- if (!instance._updateCount) {
1711
- instance._updateCount = 0;
1712
- requestAnimationFrame(() => instance._updateCount = 0);
1713
- }
1714
1699
  if (!instance._queued) {
1715
1700
  instance._queued = /* @__PURE__ */ new Set();
1716
1701
  fastdom.read(() => {
1717
1702
  if (instance._connected) {
1718
- runUpdates(instance, instance._queued);
1703
+ if (!instance._updateCount) {
1704
+ instance._updateCount = 0;
1705
+ requestAnimationFrame(() => instance._updateCount = 0);
1706
+ }
1707
+ if (instance._updateCount < 10) {
1708
+ instance._updateCount++;
1709
+ runUpdates(instance, instance._queued);
1710
+ }
1719
1711
  }
1720
1712
  instance._queued = null;
1721
1713
  });
1722
1714
  }
1723
- if (instance._updateCount++ < 20) {
1724
- instance._queued.add(e.type || e);
1725
- }
1715
+ instance._queued.add(e.type || e);
1726
1716
  }
1727
1717
  function runUpdates(instance, types) {
1728
1718
  for (const { read, write, events = [] } of instance._updates) {
@@ -1827,7 +1817,7 @@
1827
1817
  });
1828
1818
  }
1829
1819
  function resetComputed(instance) {
1830
- const values = { ...instance._computed };
1820
+ const values = instance._computed;
1831
1821
  instance._computed = {};
1832
1822
  return values;
1833
1823
  }
@@ -1863,16 +1853,15 @@
1863
1853
  }
1864
1854
 
1865
1855
  function initObservers(instance) {
1866
- for (const observer of instance.$options.observe || []) {
1867
- registerObservable(instance, observer);
1856
+ for (const [index, observer] of (instance.$options.observe || []).entries()) {
1857
+ registerObservable(instance, observer, `_observe${index}`);
1868
1858
  }
1869
1859
  }
1870
- function registerObservable(instance, observable) {
1860
+ function registerObservable(instance, observable, key) {
1871
1861
  let { observe, target = instance.$el, handler, options, filter, args } = observable;
1872
1862
  if (filter && !filter.call(instance, instance)) {
1873
1863
  return;
1874
1864
  }
1875
- const key = `_observe${instance._disconnect.length}`;
1876
1865
  if (isFunction(target) && !hasOwn(instance, key)) {
1877
1866
  registerComputed(instance, key, () => {
1878
1867
  const targets2 = target.call(instance, instance);
@@ -2459,8 +2448,11 @@
2459
2448
  const pos = getEventPos(e);
2460
2449
  const target = "tagName" in e.target ? e.target : parent(e.target);
2461
2450
  once(document, `${pointerUp} ${pointerCancel} scroll`, (e2) => {
2451
+ if (e2.type !== pointerUp || !target) {
2452
+ return;
2453
+ }
2462
2454
  const { x, y } = getEventPos(e2);
2463
- if (e2.type !== "scroll" && target && x && Math.abs(pos.x - x) > 100 || y && Math.abs(pos.y - y) > 100) {
2455
+ if (x && Math.abs(pos.x - x) > 100 || y && Math.abs(pos.y - y) > 100) {
2464
2456
  setTimeout(() => {
2465
2457
  trigger(target, "swipe");
2466
2458
  trigger(target, `swipe${swipeDirection(pos.x, pos.y, x, y)}`);
@@ -2530,7 +2522,7 @@
2530
2522
  }
2531
2523
 
2532
2524
  function maybeDefaultPreventClick(e) {
2533
- if (e.target.closest('a[href="#"],a[href=""]')) {
2525
+ if (e.type === "keydown" && e.keyCode === keyMap.SPACE || e.target.closest('a[href="#"],a[href=""]')) {
2534
2526
  e.preventDefault();
2535
2527
  }
2536
2528
  }
@@ -2918,11 +2910,10 @@
2918
2910
  mixins: [Class, Togglable],
2919
2911
  args: "animation",
2920
2912
  props: {
2921
- animation: Boolean,
2922
2913
  close: String
2923
2914
  },
2924
2915
  data: {
2925
- animation: true,
2916
+ animation: [true],
2926
2917
  selClose: ".uk-alert-close",
2927
2918
  duration: 150
2928
2919
  },
@@ -2936,7 +2927,11 @@
2936
2927
  },
2937
2928
  methods: {
2938
2929
  async close() {
2939
- await this.toggleElement(this.$el, false, this.animation ? animate$1 : false);
2930
+ await this.toggleElement(
2931
+ this.$el,
2932
+ false,
2933
+ this.animation[0] === true || this.animation[0] === 1 ? animate$1 : true
2934
+ );
2940
2935
  this.$destroy(true);
2941
2936
  }
2942
2937
  }
@@ -3189,7 +3184,7 @@
3189
3184
  };
3190
3185
  }
3191
3186
 
3192
- let prevented;
3187
+ let scrollLocks = 0;
3193
3188
  function preventBackgroundScroll(el) {
3194
3189
  const off = on(
3195
3190
  el,
@@ -3224,21 +3219,25 @@
3224
3219
  },
3225
3220
  { passive: true }
3226
3221
  );
3227
- if (prevented) {
3228
- return off;
3229
- }
3230
- prevented = true;
3231
3222
  const { scrollingElement } = document;
3232
3223
  const props = {
3233
3224
  overflowY: CSS.supports("overflow", "clip") ? "clip" : "hidden",
3234
3225
  touchAction: "none",
3235
3226
  scrollbarGutter: width(window) - scrollingElement.clientWidth ? "stable" : ""
3236
3227
  };
3237
- css(scrollingElement, props);
3228
+ if (!scrollLocks++) {
3229
+ css(scrollingElement, props);
3230
+ }
3231
+ let released = false;
3238
3232
  return () => {
3239
- prevented = false;
3233
+ if (released) {
3234
+ return;
3235
+ }
3236
+ released = true;
3240
3237
  off();
3241
- resetProps(scrollingElement, props);
3238
+ if (!--scrollLocks) {
3239
+ resetProps(scrollingElement, props);
3240
+ }
3242
3241
  };
3243
3242
  }
3244
3243
 
@@ -3311,11 +3310,10 @@
3311
3310
  attr(this.targetEl, "aria-expanded", false);
3312
3311
  this._style = pick(this.$el.style, ["width", "height"]);
3313
3312
  },
3313
+ beforeDisconnect() {
3314
+ this.hide(false, false);
3315
+ },
3314
3316
  disconnected() {
3315
- if (this.isActive()) {
3316
- this.hide(false);
3317
- active$1 = null;
3318
- }
3319
3317
  css(this.$el, this._style);
3320
3318
  },
3321
3319
  events: [
@@ -3744,7 +3742,7 @@
3744
3742
  el: ({ dropContainer }) => dropContainer,
3745
3743
  delegate: ({ clsDrop }) => `.${clsDrop}`,
3746
3744
  handler(e) {
3747
- var _a;
3745
+ var _a, _b;
3748
3746
  const { current, keyCode, target } = e;
3749
3747
  if (isInput(target) || !includes(this.dropdowns, current)) {
3750
3748
  return;
@@ -3754,15 +3752,15 @@
3754
3752
  if (~next) {
3755
3753
  e.preventDefault();
3756
3754
  const elements = $$(selFocusable, current);
3757
- elements[getIndex(
3755
+ (_a = elements[getIndex(
3758
3756
  next,
3759
3757
  elements,
3760
3758
  findIndex(elements, (el) => matches(el, ":focus"))
3761
- )].focus();
3759
+ )]) == null ? void 0 : _a.focus();
3762
3760
  return;
3763
3761
  }
3764
3762
  if (keyCode === keyMap.ESC) {
3765
- (_a = active2.targetEl) == null ? void 0 : _a.focus();
3763
+ (_b = active2.targetEl) == null ? void 0 : _b.focus();
3766
3764
  }
3767
3765
  handleNavItemNavigation(e, this.items, active2);
3768
3766
  }
@@ -4041,7 +4039,7 @@
4041
4039
  }
4042
4040
  const offsetCurrent = getOffset(current[0], withOffset);
4043
4041
  if (offset.top >= offsetCurrent.bottom - 1 && offset.top !== offsetCurrent.top) {
4044
- sorted.push([el]);
4042
+ sorted.splice(i + 1, 0, [el]);
4045
4043
  break;
4046
4044
  }
4047
4045
  if (offset.bottom - 1 > offsetCurrent.top || offset.top === offsetCurrent.top) {
@@ -4166,7 +4164,7 @@
4166
4164
  };
4167
4165
  },
4168
4166
  write({ columns, scrolled, scrollColumns, translates }) {
4169
- if (!scrolled && !translates) {
4167
+ if (scrolled === false && !translates) {
4170
4168
  return;
4171
4169
  }
4172
4170
  columns.forEach(
@@ -4643,16 +4641,9 @@
4643
4641
  beforeConnect() {
4644
4642
  const isToggle = hasClass(this.$el, "uk-search-toggle") || hasClass(this.$el, "uk-navbar-toggle");
4645
4643
  this.icon = isToggle ? "search-toggle-icon" : hasClass(this.$el, "uk-search-icon") && this.$el.closest(".uk-search-large") ? "search-large" : this.$el.closest(".uk-search-medium") ? "search-medium" : this.$props.icon;
4646
- if (hasAttr(this.$el, "aria-label")) {
4647
- return;
4648
- }
4649
- if (isToggle) {
4650
- this.$el.ariaLabel = this.t("toggle");
4651
- } else {
4652
- const button = this.$el.closest("a,button");
4653
- if (button) {
4654
- button.ariaLabel = this.t("submit");
4655
- }
4644
+ const target = isToggle ? this.$el : this.$el.closest("a,button");
4645
+ if (target && !hasAttr(target, "aria-label")) {
4646
+ target.ariaLabel = this.t(isToggle ? "toggle" : "submit");
4656
4647
  }
4657
4648
  }
4658
4649
  };
@@ -4738,7 +4729,7 @@
4738
4729
  apply(
4739
4730
  document.body,
4740
4731
  (el) => each(UIkit.getComponents(el), (cmp) => {
4741
- cmp.$options.isIcon && cmp.icon in added && cmp.$reset();
4732
+ cmp.$options.isIcon && (aliases[cmp.icon] || cmp.icon) in added && cmp.$reset();
4742
4733
  })
4743
4734
  );
4744
4735
  }
@@ -4816,8 +4807,9 @@
4816
4807
  const elements = isTag(parentNode, "picture") ? children(parentNode) : [el];
4817
4808
  elements.forEach((el2) => setSourceProps(el2, el2));
4818
4809
  } else if (src) {
4819
- if (!includes(el.style.backgroundImage, src)) {
4820
- css(el, "backgroundImage", `url(${escape(src)})`);
4810
+ const previousBackground = el.style.backgroundImage;
4811
+ css(el, "backgroundImage", `url(${escape(src)})`);
4812
+ if (el.style.backgroundImage !== previousBackground) {
4821
4813
  trigger(el, createEvent("load", false));
4822
4814
  }
4823
4815
  }
@@ -4916,6 +4908,7 @@
4916
4908
  [...toNodes(target), document.documentElement],
4917
4909
  handler
4918
4910
  );
4911
+ const transitionObserver = observeResize([], handler);
4919
4912
  const listener = [
4920
4913
  on(document, "scroll itemshown itemhidden", handler, {
4921
4914
  passive: true,
@@ -4923,11 +4916,11 @@
4923
4916
  }),
4924
4917
  on(document, "show hide transitionstart", (e) => {
4925
4918
  handler();
4926
- return observer.observe(e.target);
4919
+ return transitionObserver.observe(e.target);
4927
4920
  }),
4928
4921
  on(document, "shown hidden transitionend transitioncancel", (e) => {
4929
4922
  handler();
4930
- return observer.unobserve(e.target);
4923
+ return transitionObserver.unobserve(e.target);
4931
4924
  })
4932
4925
  ];
4933
4926
  return {
@@ -4935,6 +4928,7 @@
4935
4928
  unobserve: observer.unobserve.bind(observer),
4936
4929
  disconnect() {
4937
4930
  observer.disconnect();
4931
+ transitionObserver.disconnect();
4938
4932
  listener.forEach((off) => off());
4939
4933
  }
4940
4934
  };
@@ -5350,7 +5344,7 @@
5350
5344
  const dialog = modal.dialog(tmpl(options), options);
5351
5345
  return assign(
5352
5346
  new Promise((resolve) => {
5353
- const off = on(dialog.$el, "hide", () => resolve(hideFn()));
5347
+ const off = on(dialog.$el, "hide", () => resolve(hideFn()), { self: true });
5354
5348
  on(dialog.$el, "submit", "form", (e) => {
5355
5349
  e.preventDefault();
5356
5350
  resolve(submitFn(dialog));
@@ -5653,7 +5647,8 @@
5653
5647
  );
5654
5648
  if (!overflow[i - 1]) {
5655
5649
  const dir = i ? "Top" : "Left";
5656
- const percent = overflow[i] ? this.$el[`scroll${dir}`] / overflow[i] : 0;
5650
+ const position = this.$el[`scroll${dir}`] + (!i && isRtl ? overflow[i] : 0);
5651
+ const percent = overflow[i] ? position / overflow[i] : 0;
5657
5652
  const toValue = (value) => overflow[i] ? clamp((this.fadeDuration - value) / this.fadeDuration) : 1;
5658
5653
  css(this.$el, {
5659
5654
  "--uk-overflow-fade-start-opacity": toValue(percent),
@@ -5675,7 +5670,7 @@
5675
5670
  const { $el: el, threshold, $options } = this;
5676
5671
  let started;
5677
5672
  const off = on(document, pointerMove, move(e), pointerOptions);
5678
- on(document, [pointerUp, pointerCancel], end, { capture: true, once: true });
5673
+ once(document, [pointerUp, pointerCancel], end, true);
5679
5674
  function move(e2) {
5680
5675
  let origin = getEventPos(e2);
5681
5676
  let pos = origin;
@@ -6466,7 +6461,7 @@
6466
6461
  name: "click keydown",
6467
6462
  delegate: ({ toggle }) => toggle,
6468
6463
  handler(e) {
6469
- if (!matches(e.current, selDisabled) && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
6464
+ if (!e.defaultPrevented && !matches(e.current, selDisabled) && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
6470
6465
  maybeDefaultPreventClick(e);
6471
6466
  this.show(e.current);
6472
6467
  }
@@ -6705,7 +6700,6 @@
6705
6700
  {
6706
6701
  name: "mediachange",
6707
6702
  filter: ({ mode }) => includes(mode, "media"),
6708
- el: ({ target }) => target,
6709
6703
  handler(e, mediaObj) {
6710
6704
  if (mediaObj.matches ^ this.isToggled(this.target)) {
6711
6705
  this.toggle();