uikit 3.16.24-dev.d6158da87 → 3.16.25-dev.12f581d90

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 (136) hide show
  1. package/.eslintrc.json +0 -9
  2. package/.prettierrc.json +3 -4
  3. package/CHANGELOG.md +2 -1
  4. package/build/build.js +2 -2
  5. package/build/less.js +2 -2
  6. package/build/prefix.js +3 -3
  7. package/build/release.js +7 -7
  8. package/build/scope.js +3 -3
  9. package/build/scss.js +9 -9
  10. package/build/util.js +11 -11
  11. package/dist/css/uikit-core-rtl.css +1 -1
  12. package/dist/css/uikit-core-rtl.min.css +1 -1
  13. package/dist/css/uikit-core.css +1 -1
  14. package/dist/css/uikit-core.min.css +1 -1
  15. package/dist/css/uikit-rtl.css +1 -1
  16. package/dist/css/uikit-rtl.min.css +1 -1
  17. package/dist/css/uikit.css +1 -1
  18. package/dist/css/uikit.min.css +1 -1
  19. package/dist/js/components/countdown.js +2 -2
  20. package/dist/js/components/countdown.min.js +1 -1
  21. package/dist/js/components/filter.js +18 -18
  22. package/dist/js/components/filter.min.js +1 -1
  23. package/dist/js/components/lightbox-panel.js +351 -350
  24. package/dist/js/components/lightbox-panel.min.js +1 -1
  25. package/dist/js/components/lightbox.js +353 -352
  26. package/dist/js/components/lightbox.min.js +1 -1
  27. package/dist/js/components/notification.js +6 -6
  28. package/dist/js/components/notification.min.js +1 -1
  29. package/dist/js/components/parallax.js +69 -69
  30. package/dist/js/components/parallax.min.js +1 -1
  31. package/dist/js/components/slider-parallax.js +37 -37
  32. package/dist/js/components/slider-parallax.min.js +1 -1
  33. package/dist/js/components/slider.js +222 -224
  34. package/dist/js/components/slider.min.js +1 -1
  35. package/dist/js/components/slideshow-parallax.js +37 -37
  36. package/dist/js/components/slideshow-parallax.min.js +1 -1
  37. package/dist/js/components/slideshow.js +300 -302
  38. package/dist/js/components/slideshow.min.js +1 -1
  39. package/dist/js/components/sortable.js +2 -2
  40. package/dist/js/components/sortable.min.js +1 -1
  41. package/dist/js/components/tooltip.js +95 -95
  42. package/dist/js/components/tooltip.min.js +1 -1
  43. package/dist/js/components/upload.js +2 -2
  44. package/dist/js/components/upload.min.js +1 -1
  45. package/dist/js/uikit-core.js +452 -449
  46. package/dist/js/uikit-core.min.js +1 -1
  47. package/dist/js/uikit-icons.js +1 -1
  48. package/dist/js/uikit-icons.min.js +1 -1
  49. package/dist/js/uikit.js +6837 -6836
  50. package/dist/js/uikit.min.js +1 -1
  51. package/package.json +8 -7
  52. package/src/js/api/app.js +1 -1
  53. package/src/js/api/boot.js +2 -2
  54. package/src/js/api/component.js +1 -1
  55. package/src/js/api/computed.js +2 -2
  56. package/src/js/api/events.js +2 -2
  57. package/src/js/api/global.js +3 -3
  58. package/src/js/api/hooks.js +4 -4
  59. package/src/js/api/instance.js +3 -3
  60. package/src/js/api/log.js +1 -1
  61. package/src/js/api/observables.js +1 -1
  62. package/src/js/api/observer.js +2 -2
  63. package/src/js/api/options.js +2 -2
  64. package/src/js/api/props.js +2 -2
  65. package/src/js/api/state.js +2 -2
  66. package/src/js/components/countdown.js +1 -1
  67. package/src/js/components/filter.js +5 -5
  68. package/src/js/components/internal/lightbox-animations.js +1 -1
  69. package/src/js/components/internal/slider-transitioner.js +6 -6
  70. package/src/js/components/internal/slideshow-animations.js +1 -1
  71. package/src/js/components/lightbox-panel.js +10 -10
  72. package/src/js/components/lightbox.js +2 -2
  73. package/src/js/components/notification.js +4 -4
  74. package/src/js/components/parallax.js +3 -3
  75. package/src/js/components/slider-parallax.js +1 -1
  76. package/src/js/components/slider.js +12 -12
  77. package/src/js/components/slideshow.js +3 -3
  78. package/src/js/components/sortable.js +4 -4
  79. package/src/js/components/tooltip.js +6 -6
  80. package/src/js/components/upload.js +4 -4
  81. package/src/js/core/accordion.js +8 -8
  82. package/src/js/core/alert.js +2 -2
  83. package/src/js/core/cover.js +1 -1
  84. package/src/js/core/drop.js +12 -12
  85. package/src/js/core/dropnav.js +7 -7
  86. package/src/js/core/form-custom.js +1 -1
  87. package/src/js/core/grid.js +9 -9
  88. package/src/js/core/height-match.js +2 -2
  89. package/src/js/core/height-viewport.js +1 -1
  90. package/src/js/core/icon.js +23 -23
  91. package/src/js/core/img.js +2 -2
  92. package/src/js/core/index.js +16 -14
  93. package/src/js/core/leader.js +2 -2
  94. package/src/js/core/modal.js +7 -7
  95. package/src/js/core/navbar.js +4 -4
  96. package/src/js/core/offcanvas.js +3 -3
  97. package/src/js/core/overflow-auto.js +3 -3
  98. package/src/js/core/responsive.js +3 -3
  99. package/src/js/core/scrollspy-nav.js +1 -1
  100. package/src/js/core/scrollspy.js +1 -1
  101. package/src/js/core/sticky.js +12 -12
  102. package/src/js/core/svg.js +4 -4
  103. package/src/js/core/switcher.js +7 -7
  104. package/src/js/core/tab.js +2 -2
  105. package/src/js/core/toggle.js +5 -5
  106. package/src/js/core/video.js +1 -1
  107. package/src/js/mixin/animate.js +1 -1
  108. package/src/js/mixin/i18n.js +1 -1
  109. package/src/js/mixin/internal/animate-fade.js +14 -14
  110. package/src/js/mixin/internal/animate-slide.js +1 -1
  111. package/src/js/mixin/internal/scroll.js +1 -1
  112. package/src/js/mixin/modal.js +15 -12
  113. package/src/js/mixin/parallax.js +2 -2
  114. package/src/js/mixin/position.js +2 -2
  115. package/src/js/mixin/slider-drag.js +1 -1
  116. package/src/js/mixin/slider-nav.js +8 -9
  117. package/src/js/mixin/slider.js +9 -9
  118. package/src/js/mixin/slideshow.js +1 -1
  119. package/src/js/mixin/togglable.js +4 -4
  120. package/src/js/uikit-core.js +2 -2
  121. package/src/js/uikit.js +2 -2
  122. package/src/js/util/animation.js +8 -8
  123. package/src/js/util/class.js +1 -1
  124. package/src/js/util/dimensions.js +5 -5
  125. package/src/js/util/dom.js +3 -3
  126. package/src/js/util/event.js +3 -3
  127. package/src/js/util/filter.js +1 -1
  128. package/src/js/util/lang.js +4 -4
  129. package/src/js/util/observer.js +2 -2
  130. package/src/js/util/player.js +1 -1
  131. package/src/js/util/position.js +5 -5
  132. package/src/js/util/selector.js +1 -1
  133. package/src/js/util/style.js +1 -1
  134. package/src/js/util/svg.js +2 -2
  135. package/src/js/util/viewport.js +6 -6
  136. package/tests/js/index.js +7 -7
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.16.24-dev.d6158da87 | https://www.getuikit.com | (c) 2014 - 2023 YOOtheme | MIT License */
1
+ /*! UIkit 3.16.25-dev.12f581d90 | https://www.getuikit.com | (c) 2014 - 2023 YOOtheme | MIT License */
2
2
 
3
3
  (function (global, factory) {
4
4
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('uikit-util')) :
@@ -6,65 +6,20 @@
6
6
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.UIkitLightbox = factory(global.UIkit.util));
7
7
  })(this, (function (util) { 'use strict';
8
8
 
9
- var Animations$1 = {
10
- slide: {
11
- show(dir) {
12
- return [{ transform: translate(dir * -100) }, { transform: translate() }];
13
- },
14
- percent(current) {
15
- return translated(current);
16
- },
17
- translate(percent, dir) {
18
- return [
19
- { transform: translate(dir * -100 * percent) },
20
- { transform: translate(dir * 100 * (1 - percent)) }
21
- ];
22
- }
9
+ function parseOptions(options, args = []) {
10
+ try {
11
+ return options ? util.startsWith(options, "{") ? JSON.parse(options) : args.length && !util.includes(options, ":") ? { [args[0]]: options } : options.split(";").reduce((options2, option) => {
12
+ const [key, value] = option.split(/:(.*)/);
13
+ if (key && !util.isUndefined(value)) {
14
+ options2[key.trim()] = value.trim();
15
+ }
16
+ return options2;
17
+ }, {}) : {};
18
+ } catch (e) {
19
+ return {};
23
20
  }
24
- };
25
- function translated(el) {
26
- return Math.abs(util.css(el, "transform").split(",")[4] / el.offsetWidth) || 0;
27
- }
28
- function translate(value = 0, unit = "%") {
29
- value += value ? unit : "";
30
- return `translate3d(${value}, 0, 0)`;
31
- }
32
- function scale3d(value) {
33
- return `scale3d(${value}, ${value}, 1)`;
34
21
  }
35
22
 
36
- var Animations = {
37
- ...Animations$1,
38
- fade: {
39
- show() {
40
- return [{ opacity: 0 }, { opacity: 1 }];
41
- },
42
- percent(current) {
43
- return 1 - util.css(current, "opacity");
44
- },
45
- translate(percent) {
46
- return [{ opacity: 1 - percent }, { opacity: percent }];
47
- }
48
- },
49
- scale: {
50
- show() {
51
- return [
52
- { opacity: 0, transform: scale3d(1 - 0.2) },
53
- { opacity: 1, transform: scale3d(1) }
54
- ];
55
- },
56
- percent(current) {
57
- return 1 - util.css(current, "opacity");
58
- },
59
- translate(percent) {
60
- return [
61
- { opacity: 1 - percent, transform: scale3d(1 - 0.2 * percent) },
62
- { opacity: percent, transform: scale3d(1 - 0.2 + 0.2 * percent) }
63
- ];
64
- }
65
- }
66
- };
67
-
68
23
  var Class = {
69
24
  connected() {
70
25
  util.addClass(this.$el, this.$options.id);
@@ -85,6 +40,39 @@
85
40
  }
86
41
  };
87
42
 
43
+ let prevented;
44
+ function preventBackgroundScroll(el) {
45
+ const off = util.on(
46
+ el,
47
+ "touchmove",
48
+ (e) => {
49
+ if (e.targetTouches.length !== 1 || util.matches(e.target, 'input[type="range"')) {
50
+ return;
51
+ }
52
+ let { scrollHeight, clientHeight } = util.scrollParent(e.target);
53
+ if (clientHeight >= scrollHeight && e.cancelable) {
54
+ e.preventDefault();
55
+ }
56
+ },
57
+ { passive: false }
58
+ );
59
+ if (prevented) {
60
+ return off;
61
+ }
62
+ prevented = true;
63
+ const { scrollingElement } = document;
64
+ util.css(scrollingElement, {
65
+ overflowY: CSS.supports("overflow", "clip") ? "clip" : "hidden",
66
+ touchAction: "none",
67
+ paddingRight: util.width(window) - scrollingElement.clientWidth || ""
68
+ });
69
+ return () => {
70
+ prevented = false;
71
+ off();
72
+ util.css(scrollingElement, { overflowY: "", touchAction: "", paddingRight: "" });
73
+ };
74
+ }
75
+
88
76
  var Togglable = {
89
77
  props: {
90
78
  cls: Boolean,
@@ -118,7 +106,7 @@
118
106
  await Promise.all(
119
107
  util.toNodes(targets).map((el) => {
120
108
  const show = util.isBoolean(toggle) ? toggle : !this.isToggled(el);
121
- if (!util.trigger(el, `before${show ? "show" : "hide"}`, [this])) {
109
+ if (!util.trigger(el, "before".concat(show ? "show" : "hide"), [this])) {
122
110
  return Promise.reject();
123
111
  }
124
112
  const promise = (util.isFunction(animate) ? animate : animate === false || !this.hasAnimation ? toggleInstant : this.hasTransition ? toggleTransition : toggleAnimation)(el, show, this);
@@ -180,8 +168,8 @@
180
168
  const end = dir[1] === startProp;
181
169
  const props = ["width", "height"];
182
170
  const dimProp = props[dirs.indexOf(dir)];
183
- const marginProp = `margin-${dir[0]}`;
184
- const marginStartProp = `margin-${startProp}`;
171
+ const marginProp = "margin-".concat(dir[0]);
172
+ const marginStartProp = "margin-".concat(startProp);
185
173
  let currentDim = util.dimensions(el)[dimProp];
186
174
  const inProgress = util.Transition.inProgress(el);
187
175
  await util.Transition.cancel(el);
@@ -269,39 +257,6 @@
269
257
  );
270
258
  }
271
259
 
272
- let prevented;
273
- function preventBackgroundScroll(el) {
274
- const off = util.on(
275
- el,
276
- "touchmove",
277
- (e) => {
278
- if (e.targetTouches.length !== 1 || util.matches(e.target, 'input[type="range"')) {
279
- return;
280
- }
281
- let { scrollHeight, clientHeight } = util.scrollParent(e.target);
282
- if (clientHeight >= scrollHeight && e.cancelable) {
283
- e.preventDefault();
284
- }
285
- },
286
- { passive: false }
287
- );
288
- if (prevented) {
289
- return off;
290
- }
291
- prevented = true;
292
- const { scrollingElement } = document;
293
- util.css(scrollingElement, {
294
- overflowY: CSS.supports("overflow", "clip") ? "clip" : "hidden",
295
- touchAction: "none",
296
- paddingRight: util.width(window) - scrollingElement.clientWidth || ""
297
- });
298
- return () => {
299
- prevented = false;
300
- off();
301
- util.css(scrollingElement, { overflowY: "", touchAction: "", paddingRight: "" });
302
- };
303
- }
304
-
305
260
  const active = [];
306
261
  var Modal = {
307
262
  mixins: [Class, Container, Togglable],
@@ -347,7 +302,7 @@
347
302
  {
348
303
  name: "click",
349
304
  delegate() {
350
- return `${this.selClose},a[href*="#"]`;
305
+ return "".concat(this.selClose, ',a[href*="#"]');
351
306
  },
352
307
  handler(e) {
353
308
  const { current, defaultPrevented } = e;
@@ -472,10 +427,13 @@
472
427
  },
473
428
  { self: true }
474
429
  );
475
- const timer = setTimeout(() => {
476
- off();
477
- resolve();
478
- }, toMs(util.css(transitionElement, "transitionDuration")));
430
+ const timer = setTimeout(
431
+ () => {
432
+ off();
433
+ resolve();
434
+ },
435
+ toMs(util.css(transitionElement, "transitionDuration"))
436
+ );
479
437
  })
480
438
  ).then(() => delete el._reject);
481
439
  }
@@ -496,7 +454,7 @@
496
454
  }
497
455
  util.once(
498
456
  document,
499
- `${util.pointerUp} ${util.pointerCancel} scroll`,
457
+ "".concat(util.pointerUp, " ").concat(util.pointerCancel, " scroll"),
500
458
  ({ defaultPrevented, type, target: newTarget }) => {
501
459
  if (!defaultPrevented && type === util.pointerUp && target === newTarget) {
502
460
  modal.hide();
@@ -514,6 +472,33 @@
514
472
  });
515
473
  }
516
474
 
475
+ var Animations$1 = {
476
+ slide: {
477
+ show(dir) {
478
+ return [{ transform: translate(dir * -100) }, { transform: translate() }];
479
+ },
480
+ percent(current) {
481
+ return translated(current);
482
+ },
483
+ translate(percent, dir) {
484
+ return [
485
+ { transform: translate(dir * -100 * percent) },
486
+ { transform: translate(dir * 100 * (1 - percent)) }
487
+ ];
488
+ }
489
+ }
490
+ };
491
+ function translated(el) {
492
+ return Math.abs(util.css(el, "transform").split(",")[4] / el.offsetWidth) || 0;
493
+ }
494
+ function translate(value = 0, unit = "%") {
495
+ value += value ? unit : "";
496
+ return "translate3d(".concat(value, ", 0, 0)");
497
+ }
498
+ function scale3d(value) {
499
+ return "scale3d(".concat(value, ", ").concat(value, ", 1)");
500
+ }
501
+
517
502
  function Transitioner(prev, next, dir, { animation, easing }) {
518
503
  const { percent, translate, show = util.noop } = animation;
519
504
  const props = show(dir);
@@ -569,6 +554,19 @@
569
554
  util.trigger(el, util.createEvent(type, false, false, data));
570
555
  }
571
556
 
557
+ function resize(options) {
558
+ return observe(util.observeResize, options, "resize");
559
+ }
560
+ function observe(observe2, options, emit) {
561
+ return {
562
+ observe: observe2,
563
+ handler() {
564
+ this.$emit(emit);
565
+ },
566
+ ...options
567
+ };
568
+ }
569
+
572
570
  var I18n = {
573
571
  props: {
574
572
  i18n: Object
@@ -588,215 +586,56 @@
588
586
  }
589
587
  };
590
588
 
591
- const keyMap = {
592
- TAB: 9,
593
- ESC: 27,
594
- SPACE: 32,
595
- END: 35,
596
- HOME: 36,
597
- LEFT: 37,
598
- UP: 38,
599
- RIGHT: 39,
600
- DOWN: 40
601
- };
602
-
603
- function parseOptions(options, args = []) {
604
- try {
605
- return options ? util.startsWith(options, "{") ? JSON.parse(options) : args.length && !util.includes(options, ":") ? { [args[0]]: options } : options.split(";").reduce((options2, option) => {
606
- const [key, value] = option.split(/:(.*)/);
607
- if (key && !util.isUndefined(value)) {
608
- options2[key.trim()] = value.trim();
609
- }
610
- return options2;
611
- }, {}) : {};
612
- } catch (e) {
613
- return {};
614
- }
615
- }
616
-
617
- function generateId(instance, el = instance.$el, postfix = "") {
618
- if (el.id) {
619
- return el.id;
620
- }
621
- let id = `${instance.$options.id}-${instance._uid}${postfix}`;
622
- if (util.$(`#${id}`)) {
623
- id = generateId(instance, el, `${postfix}-2`);
624
- }
625
- return id;
626
- }
627
-
628
- var SliderNav = {
629
- i18n: {
630
- next: "Next slide",
631
- previous: "Previous slide",
632
- slideX: "Slide %s",
633
- slideLabel: "%s of %s",
634
- role: "String"
589
+ var SliderAutoplay = {
590
+ props: {
591
+ autoplay: Boolean,
592
+ autoplayInterval: Number,
593
+ pauseOnHover: Boolean
635
594
  },
636
595
  data: {
637
- selNav: false,
638
- role: "region"
596
+ autoplay: false,
597
+ autoplayInterval: 7e3,
598
+ pauseOnHover: true
639
599
  },
640
- computed: {
641
- nav({ selNav }, $el) {
642
- return util.$(selNav, $el);
643
- },
644
- navChildren() {
645
- return util.children(this.nav);
646
- },
647
- selNavItem({ attrItem }) {
648
- return `[${attrItem}],[data-${attrItem}]`;
649
- },
650
- navItems(_, $el) {
651
- return util.$$(this.selNavItem, $el);
652
- }
600
+ connected() {
601
+ util.attr(this.list, "aria-live", this.autoplay ? "off" : "polite");
602
+ this.autoplay && this.startAutoplay();
653
603
  },
654
- watch: {
655
- nav(nav, prev) {
656
- util.attr(nav, "role", "tablist");
657
- if (prev) {
658
- this.$emit();
659
- }
660
- },
661
- list(list) {
662
- util.attr(list, "role", "presentation");
663
- },
664
- navChildren(children2) {
665
- util.attr(children2, "role", "presentation");
666
- },
667
- navItems(items) {
668
- for (const el of items) {
669
- const cmd = util.data(el, this.attrItem);
670
- const button = util.$("a,button", el) || el;
671
- let ariaLabel;
672
- let ariaControls = null;
673
- if (util.isNumeric(cmd)) {
674
- const item = util.toNumber(cmd);
675
- const slide = this.slides[item];
676
- if (slide) {
677
- if (!slide.id) {
678
- slide.id = generateId(this, slide, `-item-${cmd}`);
679
- }
680
- ariaControls = slide.id;
681
- }
682
- ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
683
- util.attr(button, "role", "tab");
684
- } else {
685
- if (this.list) {
686
- if (!this.list.id) {
687
- this.list.id = generateId(this, this.list, "-items");
688
- }
689
- ariaControls = this.list.id;
690
- }
691
- ariaLabel = this.t(cmd);
692
- }
693
- util.attr(button, {
694
- "aria-controls": ariaControls,
695
- "aria-label": util.attr(button, "aria-label") || ariaLabel
696
- });
697
- }
698
- },
699
- slides(slides) {
700
- slides.forEach(
701
- (slide, i) => util.attr(slide, {
702
- role: this.nav ? "tabpanel" : "group",
703
- "aria-label": this.t("slideLabel", i + 1, this.length),
704
- "aria-roledescription": this.nav ? null : "slide"
705
- })
706
- );
707
- },
708
- length(length) {
709
- const navLength = this.navChildren.length;
710
- if (this.nav && length !== navLength) {
711
- util.empty(this.nav);
712
- for (let i = 0; i < length; i++) {
713
- util.append(this.nav, `<li ${this.attrItem}="${i}"><a href></a></li>`);
714
- }
715
- }
716
- }
604
+ disconnected() {
605
+ this.stopAutoplay();
717
606
  },
718
- connected() {
719
- util.attr(this.$el, {
720
- role: this.role,
721
- "aria-roledescription": "carousel"
722
- });
607
+ update() {
608
+ util.attr(this.slides, "tabindex", "-1");
723
609
  },
724
- update: [
725
- {
726
- write() {
727
- this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
728
- this.updateNav();
729
- },
730
- events: ["resize"]
731
- }
732
- ],
733
610
  events: [
734
611
  {
735
- name: "click keydown",
736
- delegate() {
737
- return this.selNavItem;
612
+ name: "visibilitychange",
613
+ el() {
614
+ return document;
738
615
  },
739
- handler(e) {
740
- if (util.closest(e.target, "a,button") && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
741
- e.preventDefault();
742
- this.show(util.data(e.current, this.attrItem));
743
- }
744
- }
745
- },
746
- {
747
- name: "itemshow",
748
- handler: "updateNav"
749
- },
750
- {
751
- name: "keydown",
752
- delegate() {
753
- return this.selNavItem;
616
+ filter() {
617
+ return this.autoplay;
754
618
  },
755
- handler(e) {
756
- const { current, keyCode } = e;
757
- const cmd = util.data(current, this.attrItem);
758
- if (!util.isNumeric(cmd)) {
759
- return;
760
- }
761
- let i = keyCode === keyMap.HOME ? 0 : keyCode === keyMap.END ? "last" : keyCode === keyMap.LEFT ? "previous" : keyCode === keyMap.RIGHT ? "next" : -1;
762
- if (~i) {
763
- e.preventDefault();
764
- this.show(i);
619
+ handler() {
620
+ if (document.hidden) {
621
+ this.stopAutoplay();
622
+ } else {
623
+ this.startAutoplay();
765
624
  }
766
625
  }
767
626
  }
768
627
  ],
769
628
  methods: {
770
- updateNav() {
771
- const index = this.getValidIndex();
772
- let focus;
773
- let focusEl;
774
- for (const el of this.navItems) {
775
- const cmd = util.data(el, this.attrItem);
776
- const button = util.$("a,button", el) || el;
777
- if (util.isNumeric(cmd)) {
778
- const item = util.toNumber(cmd);
779
- const active = item === index;
780
- util.toggleClass(el, this.clsActive, active);
781
- util.attr(button, {
782
- "aria-selected": active,
783
- tabindex: active ? null : -1
784
- });
785
- if (active) {
786
- focusEl = button;
787
- }
788
- focus || (focus = util.matches(button, ":focus"));
789
- } else {
790
- util.toggleClass(
791
- el,
792
- "uk-invisible",
793
- this.finite && (cmd === "previous" && index === 0 || cmd === "next" && index >= this.maxIndex)
794
- );
795
- }
796
- if (focus && focusEl) {
797
- focusEl.focus();
629
+ startAutoplay() {
630
+ this.stopAutoplay();
631
+ this.interval = setInterval(() => {
632
+ if (!(this.stack.length || this.draggable && util.matches(this.$el, ":focus-within") || this.pauseOnHover && util.matches(this.$el, ":hover"))) {
633
+ this.show("next");
798
634
  }
799
- }
635
+ }, this.autoplayInterval);
636
+ },
637
+ stopAutoplay() {
638
+ clearInterval(this.interval);
800
639
  }
801
640
  }
802
641
  };
@@ -830,7 +669,7 @@
830
669
  name: pointerDown,
831
670
  passive: true,
832
671
  delegate() {
833
- return `${this.selList} > *`;
672
+ return "".concat(this.selList, " > *");
834
673
  },
835
674
  handler(e) {
836
675
  if (!this.draggable || !util.isTouch(e) && hasSelectableText(e.target) || util.closest(e.target, util.selInput) || e.button > 0 || this.length < 2) {
@@ -956,73 +795,203 @@
956
795
  return util.css(el, "userSelect") !== "none" && util.toArray(el.childNodes).some((el2) => el2.nodeType === 3 && el2.textContent.trim());
957
796
  }
958
797
 
959
- var SliderAutoplay = {
960
- props: {
961
- autoplay: Boolean,
962
- autoplayInterval: Number,
963
- pauseOnHover: Boolean
798
+ function generateId(instance, el = instance.$el, postfix = "") {
799
+ if (el.id) {
800
+ return el.id;
801
+ }
802
+ let id = "".concat(instance.$options.id, "-").concat(instance._uid).concat(postfix);
803
+ if (util.$("#".concat(id))) {
804
+ id = generateId(instance, el, "".concat(postfix, "-2"));
805
+ }
806
+ return id;
807
+ }
808
+
809
+ const keyMap = {
810
+ TAB: 9,
811
+ ESC: 27,
812
+ SPACE: 32,
813
+ END: 35,
814
+ HOME: 36,
815
+ LEFT: 37,
816
+ UP: 38,
817
+ RIGHT: 39,
818
+ DOWN: 40
819
+ };
820
+
821
+ var SliderNav = {
822
+ i18n: {
823
+ next: "Next slide",
824
+ previous: "Previous slide",
825
+ slideX: "Slide %s",
826
+ slideLabel: "%s of %s",
827
+ role: "String"
964
828
  },
965
829
  data: {
966
- autoplay: false,
967
- autoplayInterval: 7e3,
968
- pauseOnHover: true
830
+ selNav: false,
831
+ role: "region"
969
832
  },
970
- connected() {
971
- util.attr(this.list, "aria-live", this.autoplay ? "off" : "polite");
972
- this.autoplay && this.startAutoplay();
833
+ computed: {
834
+ nav({ selNav }, $el) {
835
+ return util.$(selNav, $el);
836
+ },
837
+ navChildren() {
838
+ return util.children(this.nav);
839
+ },
840
+ selNavItem({ attrItem }) {
841
+ return "[".concat(attrItem, "],[data-").concat(attrItem, "]");
842
+ },
843
+ navItems(_, $el) {
844
+ return util.$$(this.selNavItem, $el);
845
+ }
973
846
  },
974
- disconnected() {
975
- this.stopAutoplay();
847
+ watch: {
848
+ nav(nav, prev) {
849
+ util.attr(nav, "role", "tablist");
850
+ if (prev) {
851
+ this.$emit();
852
+ }
853
+ },
854
+ list(list) {
855
+ util.attr(list, "role", "presentation");
856
+ },
857
+ navChildren(children2) {
858
+ util.attr(children2, "role", "presentation");
859
+ },
860
+ navItems(items) {
861
+ for (const el of items) {
862
+ const cmd = util.data(el, this.attrItem);
863
+ const button = util.$("a,button", el) || el;
864
+ let ariaLabel;
865
+ let ariaControls = null;
866
+ if (util.isNumeric(cmd)) {
867
+ const item = util.toNumber(cmd);
868
+ const slide = this.slides[item];
869
+ if (slide) {
870
+ if (!slide.id) {
871
+ slide.id = generateId(this, slide, "-item-".concat(cmd));
872
+ }
873
+ ariaControls = slide.id;
874
+ }
875
+ ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
876
+ util.attr(button, "role", "tab");
877
+ } else {
878
+ if (this.list) {
879
+ if (!this.list.id) {
880
+ this.list.id = generateId(this, this.list, "-items");
881
+ }
882
+ ariaControls = this.list.id;
883
+ }
884
+ ariaLabel = this.t(cmd);
885
+ }
886
+ util.attr(button, {
887
+ "aria-controls": ariaControls,
888
+ "aria-label": util.attr(button, "aria-label") || ariaLabel
889
+ });
890
+ }
891
+ },
892
+ slides(slides) {
893
+ slides.forEach(
894
+ (slide, i) => util.attr(slide, {
895
+ role: this.nav ? "tabpanel" : "group",
896
+ "aria-label": this.t("slideLabel", i + 1, this.length),
897
+ "aria-roledescription": this.nav ? null : "slide"
898
+ })
899
+ );
900
+ },
901
+ length(length) {
902
+ const navLength = this.navChildren.length;
903
+ if (this.nav && length !== navLength) {
904
+ util.empty(this.nav);
905
+ for (let i = 0; i < length; i++) {
906
+ util.append(this.nav, "<li ".concat(this.attrItem, '="').concat(i, '"><a href></a></li>'));
907
+ }
908
+ }
909
+ }
976
910
  },
977
- update() {
978
- util.attr(this.slides, "tabindex", "-1");
911
+ connected() {
912
+ util.attr(this.$el, {
913
+ role: this.role,
914
+ "aria-roledescription": "carousel"
915
+ });
979
916
  },
917
+ update: [
918
+ {
919
+ write() {
920
+ this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
921
+ this.updateNav();
922
+ },
923
+ events: ["resize"]
924
+ }
925
+ ],
980
926
  events: [
981
927
  {
982
- name: "visibilitychange",
983
- el() {
984
- return document;
928
+ name: "click keydown",
929
+ delegate() {
930
+ return this.selNavItem;
985
931
  },
986
- filter() {
987
- return this.autoplay;
932
+ handler(e) {
933
+ if (util.closest(e.target, "a,button") && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
934
+ e.preventDefault();
935
+ this.show(util.data(e.current, this.attrItem));
936
+ }
937
+ }
938
+ },
939
+ {
940
+ name: "itemshow",
941
+ handler: "updateNav"
942
+ },
943
+ {
944
+ name: "keydown",
945
+ delegate() {
946
+ return this.selNavItem;
988
947
  },
989
- handler() {
990
- if (document.hidden) {
991
- this.stopAutoplay();
992
- } else {
993
- this.startAutoplay();
948
+ handler(e) {
949
+ const { current, keyCode } = e;
950
+ const cmd = util.data(current, this.attrItem);
951
+ if (!util.isNumeric(cmd)) {
952
+ return;
953
+ }
954
+ let i = keyCode === keyMap.HOME ? 0 : keyCode === keyMap.END ? "last" : keyCode === keyMap.LEFT ? "previous" : keyCode === keyMap.RIGHT ? "next" : -1;
955
+ if (~i) {
956
+ e.preventDefault();
957
+ this.show(i);
994
958
  }
995
959
  }
996
960
  }
997
961
  ],
998
962
  methods: {
999
- startAutoplay() {
1000
- this.stopAutoplay();
1001
- this.interval = setInterval(() => {
1002
- if (!(this.stack.length || this.draggable && util.matches(this.$el, ":focus-within") || this.pauseOnHover && util.matches(this.$el, ":hover"))) {
1003
- this.show("next");
963
+ updateNav() {
964
+ const index = this.getValidIndex();
965
+ let focusEl;
966
+ for (const el of this.navItems) {
967
+ const cmd = util.data(el, this.attrItem);
968
+ const button = util.$("a,button", el) || el;
969
+ if (util.isNumeric(cmd)) {
970
+ const item = util.toNumber(cmd);
971
+ const active = item === index;
972
+ util.toggleClass(el, this.clsActive, active);
973
+ util.attr(button, {
974
+ "aria-selected": active,
975
+ tabindex: active ? null : -1
976
+ });
977
+ if (active) {
978
+ focusEl || (focusEl = util.matches(util.parent(el), ":focus-within") && button);
979
+ }
980
+ } else {
981
+ util.toggleClass(
982
+ el,
983
+ "uk-invisible",
984
+ this.finite && (cmd === "previous" && index === 0 || cmd === "next" && index >= this.maxIndex)
985
+ );
1004
986
  }
1005
- }, this.autoplayInterval);
1006
- },
1007
- stopAutoplay() {
1008
- clearInterval(this.interval);
987
+ if (focusEl && util.isInView(focusEl)) {
988
+ focusEl.focus();
989
+ }
990
+ }
1009
991
  }
1010
992
  }
1011
993
  };
1012
994
 
1013
- function resize(options) {
1014
- return observe(util.observeResize, options, "resize");
1015
- }
1016
- function observe(observe2, options, emit) {
1017
- return {
1018
- observe: observe2,
1019
- handler() {
1020
- this.$emit(emit);
1021
- },
1022
- ...options
1023
- };
1024
- }
1025
-
1026
995
  var Slider = {
1027
996
  mixins: [SliderAutoplay, SliderDrag, SliderNav, I18n],
1028
997
  props: {
@@ -1205,6 +1174,38 @@
1205
1174
  }
1206
1175
  };
1207
1176
 
1177
+ var Animations = {
1178
+ ...Animations$1,
1179
+ fade: {
1180
+ show() {
1181
+ return [{ opacity: 0 }, { opacity: 1 }];
1182
+ },
1183
+ percent(current) {
1184
+ return 1 - util.css(current, "opacity");
1185
+ },
1186
+ translate(percent) {
1187
+ return [{ opacity: 1 - percent }, { opacity: percent }];
1188
+ }
1189
+ },
1190
+ scale: {
1191
+ show() {
1192
+ return [
1193
+ { opacity: 0, transform: scale3d(1 - 0.2) },
1194
+ { opacity: 1, transform: scale3d(1) }
1195
+ ];
1196
+ },
1197
+ percent(current) {
1198
+ return 1 - util.css(current, "opacity");
1199
+ },
1200
+ translate(percent) {
1201
+ return [
1202
+ { opacity: 1 - percent, transform: scale3d(1 - 0.2 * percent) },
1203
+ { opacity: percent, transform: scale3d(1 - 0.2 + 0.2 * percent) }
1204
+ ];
1205
+ }
1206
+ }
1207
+ };
1208
+
1208
1209
  var LightboxPanel = {
1209
1210
  mixins: [Modal, Slideshow],
1210
1211
  functional: true,
@@ -1228,7 +1229,7 @@
1228
1229
  pauseOnHover: false,
1229
1230
  velocity: 2,
1230
1231
  Animations,
1231
- template: `<div class="uk-lightbox uk-overflow-hidden"> <ul class="uk-lightbox-items"></ul> <div class="uk-lightbox-toolbar uk-position-top uk-text-right uk-transition-slide-top uk-transition-opaque"> <button class="uk-lightbox-toolbar-icon uk-close-large" type="button" uk-close></button> </div> <a class="uk-lightbox-button uk-position-center-left uk-position-medium uk-transition-fade" href uk-slidenav-previous uk-lightbox-item="previous"></a> <a class="uk-lightbox-button uk-position-center-right uk-position-medium uk-transition-fade" href uk-slidenav-next uk-lightbox-item="next"></a> <div class="uk-lightbox-toolbar uk-lightbox-caption uk-position-bottom uk-text-center uk-transition-slide-bottom uk-transition-opaque"></div> </div>`
1232
+ template: '<div class="uk-lightbox uk-overflow-hidden">\n <ul class="uk-lightbox-items"></ul>\n <div class="uk-lightbox-toolbar uk-position-top uk-text-right uk-transition-slide-top uk-transition-opaque">\n <button class="uk-lightbox-toolbar-icon uk-close-large" type="button" uk-close></button>\n </div>\n <a class="uk-lightbox-button uk-position-center-left uk-position-medium uk-transition-fade" href uk-slidenav-previous uk-lightbox-item="previous"></a>\n <a class="uk-lightbox-button uk-position-center-right uk-position-medium uk-transition-fade" href uk-slidenav-next uk-lightbox-item="next"></a>\n <div class="uk-lightbox-toolbar uk-lightbox-caption uk-position-bottom uk-text-center uk-transition-slide-bottom uk-transition-opaque"></div>\n </div>'
1232
1233
  }),
1233
1234
  created() {
1234
1235
  const $el = util.$(this.template);
@@ -1248,14 +1249,14 @@
1248
1249
  },
1249
1250
  events: [
1250
1251
  {
1251
- name: `${util.pointerMove} ${util.pointerDown} keydown`,
1252
+ name: "".concat(util.pointerMove, " ").concat(util.pointerDown, " keydown"),
1252
1253
  handler: "showControls"
1253
1254
  },
1254
1255
  {
1255
1256
  name: "click",
1256
1257
  self: true,
1257
1258
  delegate() {
1258
- return `${this.selList} > *`;
1259
+ return "".concat(this.selList, " > *");
1259
1260
  },
1260
1261
  handler(e) {
1261
1262
  if (!e.defaultPrevented) {
@@ -1352,7 +1353,7 @@
1352
1353
  allowfullscreen: "",
1353
1354
  style: "max-width: 100%; box-sizing: border-box;",
1354
1355
  "uk-responsive": "",
1355
- "uk-video": `${this.videoAutoplay}`
1356
+ "uk-video": "".concat(this.videoAutoplay)
1356
1357
  };
1357
1358
  if (type === "image" || src.match(/\.(avif|jpe?g|jfif|a?png|gif|svg|webp)($|\?)/i)) {
1358
1359
  const img = createEl("img", { src, alt, ...attrs });
@@ -1364,7 +1365,7 @@
1364
1365
  poster,
1365
1366
  controls: "",
1366
1367
  playsinline: "",
1367
- "uk-video": `${this.videoAutoplay}`,
1368
+ "uk-video": "".concat(this.videoAutoplay),
1368
1369
  ...attrs
1369
1370
  });
1370
1371
  util.on(video, "loadedmetadata", () => this.setItem(item, video));
@@ -1385,7 +1386,7 @@
1385
1386
  this.setItem(
1386
1387
  item,
1387
1388
  createEl("iframe", {
1388
- src: `https://www.youtube${matches[1] || ""}.com/embed/${matches[2]}${matches[3] ? `?${matches[3]}` : ""}`,
1389
+ src: "https://www.youtube".concat(matches[1] || "", ".com/embed/").concat(matches[2]).concat(matches[3] ? "?".concat(matches[3]) : ""),
1389
1390
  width: 1920,
1390
1391
  height: 1080,
1391
1392
  ...iframeAttrs,
@@ -1395,15 +1396,15 @@
1395
1396
  } else if (matches = src.match(/\/\/.*?vimeo\.[a-z]+\/(\d+)[&?]?(.*)?/)) {
1396
1397
  try {
1397
1398
  const { height, width } = await (await fetch(
1398
- `https://vimeo.com/api/oembed.json?maxwidth=1920&url=${encodeURI(
1399
- src
1400
- )}`,
1399
+ "https://vimeo.com/api/oembed.json?maxwidth=1920&url=".concat(encodeURI(
1400
+ src
1401
+ )),
1401
1402
  { credentials: "omit" }
1402
1403
  )).json();
1403
1404
  this.setItem(
1404
1405
  item,
1405
1406
  createEl("iframe", {
1406
- src: `https://player.vimeo.com/video/${matches[1]}${matches[2] ? `?${matches[2]}` : ""}`,
1407
+ src: "https://player.vimeo.com/video/".concat(matches[1]).concat(matches[2] ? "?".concat(matches[2]) : ""),
1407
1408
  width,
1408
1409
  height,
1409
1410
  ...iframeAttrs,
@@ -1447,7 +1448,7 @@
1447
1448
  }
1448
1449
  };
1449
1450
  function createEl(tag, attrs) {
1450
- const el = util.fragment(`<${tag}>`);
1451
+ const el = util.fragment("<".concat(tag, ">"));
1451
1452
  util.attr(el, attrs);
1452
1453
  return el;
1453
1454
  }
@@ -1477,7 +1478,7 @@
1477
1478
  events: {
1478
1479
  name: "click",
1479
1480
  delegate() {
1480
- return `${this.toggle}:not(.uk-disabled)`;
1481
+ return "".concat(this.toggle, ":not(.uk-disabled)");
1481
1482
  },
1482
1483
  handler(e) {
1483
1484
  e.preventDefault();