uikit 3.16.24 → 3.16.25-dev.931f07bf4

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 (144) hide show
  1. package/.eslintrc.json +0 -9
  2. package/.prettierrc.json +3 -4
  3. package/CHANGELOG.md +6 -0
  4. package/build/build.js +2 -2
  5. package/build/less.js +2 -2
  6. package/build/prefix.js +8 -7
  7. package/build/release.js +7 -7
  8. package/build/scope.js +3 -3
  9. package/build/scss.js +26 -16
  10. package/build/util.js +11 -11
  11. package/dist/css/uikit-core-rtl.css +6 -2
  12. package/dist/css/uikit-core-rtl.min.css +1 -1
  13. package/dist/css/uikit-core.css +6 -2
  14. package/dist/css/uikit-core.min.css +1 -1
  15. package/dist/css/uikit-rtl.css +6 -2
  16. package/dist/css/uikit-rtl.min.css +1 -1
  17. package/dist/css/uikit.css +6 -2
  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 +347 -350
  24. package/dist/js/components/lightbox-panel.min.js +1 -1
  25. package/dist/js/components/lightbox.js +349 -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 +76 -72
  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 +218 -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 +265 -271
  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 +459 -452
  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 +6832 -6831
  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 +12 -6
  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 +5 -5
  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 +13 -13
  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 -14
  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/src/less/components/slider.less +8 -2
  137. package/src/scss/components/inverse.scss +0 -1
  138. package/src/scss/components/slider.scss +8 -2
  139. package/src/scss/mixins-theme.scss +560 -552
  140. package/src/scss/mixins.scss +456 -448
  141. package/src/scss/variables-theme.scss +2 -2
  142. package/src/scss/variables.scss +2 -2
  143. package/tests/js/index.js +7 -7
  144. package/build/scss/inverse.scss +0 -30
@@ -1,4 +1,4 @@
1
- /*! UIkit 3.16.24 | https://www.getuikit.com | (c) 2014 - 2023 YOOtheme | MIT License */
1
+ /*! UIkit 3.16.25-dev.931f07bf4 | 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,6 @@
6
6
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.UIkitLightbox_panel = 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
- }
23
- }
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
- }
35
-
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
9
  var Class = {
69
10
  connected() {
70
11
  util.addClass(this.$el, this.$options.id);
@@ -85,6 +26,39 @@
85
26
  }
86
27
  };
87
28
 
29
+ let prevented;
30
+ function preventBackgroundScroll(el) {
31
+ const off = util.on(
32
+ el,
33
+ "touchmove",
34
+ (e) => {
35
+ if (e.targetTouches.length !== 1 || util.matches(e.target, 'input[type="range"')) {
36
+ return;
37
+ }
38
+ let { scrollHeight, clientHeight } = util.scrollParent(e.target);
39
+ if (clientHeight >= scrollHeight && e.cancelable) {
40
+ e.preventDefault();
41
+ }
42
+ },
43
+ { passive: false }
44
+ );
45
+ if (prevented) {
46
+ return off;
47
+ }
48
+ prevented = true;
49
+ const { scrollingElement } = document;
50
+ util.css(scrollingElement, {
51
+ overflowY: CSS.supports("overflow", "clip") ? "clip" : "hidden",
52
+ touchAction: "none",
53
+ paddingRight: util.width(window) - scrollingElement.clientWidth || ""
54
+ });
55
+ return () => {
56
+ prevented = false;
57
+ off();
58
+ util.css(scrollingElement, { overflowY: "", touchAction: "", paddingRight: "" });
59
+ };
60
+ }
61
+
88
62
  var Togglable = {
89
63
  props: {
90
64
  cls: Boolean,
@@ -118,7 +92,7 @@
118
92
  await Promise.all(
119
93
  util.toNodes(targets).map((el) => {
120
94
  const show = util.isBoolean(toggle) ? toggle : !this.isToggled(el);
121
- if (!util.trigger(el, `before${show ? "show" : "hide"}`, [this])) {
95
+ if (!util.trigger(el, "before".concat(show ? "show" : "hide"), [this])) {
122
96
  return Promise.reject();
123
97
  }
124
98
  const promise = (util.isFunction(animate) ? animate : animate === false || !this.hasAnimation ? toggleInstant : this.hasTransition ? toggleTransition : toggleAnimation)(el, show, this);
@@ -180,8 +154,8 @@
180
154
  const end = dir[1] === startProp;
181
155
  const props = ["width", "height"];
182
156
  const dimProp = props[dirs.indexOf(dir)];
183
- const marginProp = `margin-${dir[0]}`;
184
- const marginStartProp = `margin-${startProp}`;
157
+ const marginProp = "margin-".concat(dir[0]);
158
+ const marginStartProp = "margin-".concat(startProp);
185
159
  let currentDim = util.dimensions(el)[dimProp];
186
160
  const inProgress = util.Transition.inProgress(el);
187
161
  await util.Transition.cancel(el);
@@ -269,39 +243,6 @@
269
243
  );
270
244
  }
271
245
 
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
246
  const active = [];
306
247
  var Modal = {
307
248
  mixins: [Class, Container, Togglable],
@@ -347,7 +288,7 @@
347
288
  {
348
289
  name: "click",
349
290
  delegate() {
350
- return `${this.selClose},a[href*="#"]`;
291
+ return "".concat(this.selClose, ',a[href*="#"]');
351
292
  },
352
293
  handler(e) {
353
294
  const { current, defaultPrevented } = e;
@@ -472,10 +413,13 @@
472
413
  },
473
414
  { self: true }
474
415
  );
475
- const timer = setTimeout(() => {
476
- off();
477
- resolve();
478
- }, toMs(util.css(transitionElement, "transitionDuration")));
416
+ const timer = setTimeout(
417
+ () => {
418
+ off();
419
+ resolve();
420
+ },
421
+ toMs(util.css(transitionElement, "transitionDuration"))
422
+ );
479
423
  })
480
424
  ).then(() => delete el._reject);
481
425
  }
@@ -496,7 +440,7 @@
496
440
  }
497
441
  util.once(
498
442
  document,
499
- `${util.pointerUp} ${util.pointerCancel} scroll`,
443
+ "".concat(util.pointerUp, " ").concat(util.pointerCancel, " scroll"),
500
444
  ({ defaultPrevented, type, target: newTarget }) => {
501
445
  if (!defaultPrevented && type === util.pointerUp && target === newTarget) {
502
446
  modal.hide();
@@ -514,6 +458,33 @@
514
458
  });
515
459
  }
516
460
 
461
+ var Animations$1 = {
462
+ slide: {
463
+ show(dir) {
464
+ return [{ transform: translate(dir * -100) }, { transform: translate() }];
465
+ },
466
+ percent(current) {
467
+ return translated(current);
468
+ },
469
+ translate(percent, dir) {
470
+ return [
471
+ { transform: translate(dir * -100 * percent) },
472
+ { transform: translate(dir * 100 * (1 - percent)) }
473
+ ];
474
+ }
475
+ }
476
+ };
477
+ function translated(el) {
478
+ return Math.abs(util.css(el, "transform").split(",")[4] / el.offsetWidth) || 0;
479
+ }
480
+ function translate(value = 0, unit = "%") {
481
+ value += value ? unit : "";
482
+ return "translate3d(".concat(value, ", 0, 0)");
483
+ }
484
+ function scale3d(value) {
485
+ return "scale3d(".concat(value, ", ").concat(value, ", 1)");
486
+ }
487
+
517
488
  function Transitioner(prev, next, dir, { animation, easing }) {
518
489
  const { percent, translate, show = util.noop } = animation;
519
490
  const props = show(dir);
@@ -569,6 +540,19 @@
569
540
  util.trigger(el, util.createEvent(type, false, false, data));
570
541
  }
571
542
 
543
+ function resize(options) {
544
+ return observe(util.observeResize, options, "resize");
545
+ }
546
+ function observe(observe2, options, emit) {
547
+ return {
548
+ observe: observe2,
549
+ handler() {
550
+ this.$emit(emit);
551
+ },
552
+ ...options
553
+ };
554
+ }
555
+
572
556
  var I18n = {
573
557
  props: {
574
558
  i18n: Object
@@ -588,201 +572,56 @@
588
572
  }
589
573
  };
590
574
 
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 generateId(instance, el = instance.$el, postfix = "") {
604
- if (el.id) {
605
- return el.id;
606
- }
607
- let id = `${instance.$options.id}-${instance._uid}${postfix}`;
608
- if (util.$(`#${id}`)) {
609
- id = generateId(instance, el, `${postfix}-2`);
610
- }
611
- return id;
612
- }
613
-
614
- var SliderNav = {
615
- i18n: {
616
- next: "Next slide",
617
- previous: "Previous slide",
618
- slideX: "Slide %s",
619
- slideLabel: "%s of %s",
620
- role: "String"
575
+ var SliderAutoplay = {
576
+ props: {
577
+ autoplay: Boolean,
578
+ autoplayInterval: Number,
579
+ pauseOnHover: Boolean
621
580
  },
622
581
  data: {
623
- selNav: false,
624
- role: "region"
582
+ autoplay: false,
583
+ autoplayInterval: 7e3,
584
+ pauseOnHover: true
625
585
  },
626
- computed: {
627
- nav({ selNav }, $el) {
628
- return util.$(selNav, $el);
629
- },
630
- navChildren() {
631
- return util.children(this.nav);
632
- },
633
- selNavItem({ attrItem }) {
634
- return `[${attrItem}],[data-${attrItem}]`;
635
- },
636
- navItems(_, $el) {
637
- return util.$$(this.selNavItem, $el);
638
- }
586
+ connected() {
587
+ util.attr(this.list, "aria-live", this.autoplay ? "off" : "polite");
588
+ this.autoplay && this.startAutoplay();
639
589
  },
640
- watch: {
641
- nav(nav, prev) {
642
- util.attr(nav, "role", "tablist");
643
- if (prev) {
644
- this.$emit();
590
+ disconnected() {
591
+ this.stopAutoplay();
592
+ },
593
+ update() {
594
+ util.attr(this.slides, "tabindex", "-1");
595
+ },
596
+ events: [
597
+ {
598
+ name: "visibilitychange",
599
+ el() {
600
+ return document;
601
+ },
602
+ filter() {
603
+ return this.autoplay;
604
+ },
605
+ handler() {
606
+ if (document.hidden) {
607
+ this.stopAutoplay();
608
+ } else {
609
+ this.startAutoplay();
610
+ }
645
611
  }
612
+ }
613
+ ],
614
+ methods: {
615
+ startAutoplay() {
616
+ this.stopAutoplay();
617
+ this.interval = setInterval(() => {
618
+ if (!(this.stack.length || this.draggable && util.matches(this.$el, ":focus-within") || this.pauseOnHover && util.matches(this.$el, ":hover"))) {
619
+ this.show("next");
620
+ }
621
+ }, this.autoplayInterval);
646
622
  },
647
- list(list) {
648
- util.attr(list, "role", "presentation");
649
- },
650
- navChildren(children2) {
651
- util.attr(children2, "role", "presentation");
652
- },
653
- navItems(items) {
654
- for (const el of items) {
655
- const cmd = util.data(el, this.attrItem);
656
- const button = util.$("a,button", el) || el;
657
- let ariaLabel;
658
- let ariaControls = null;
659
- if (util.isNumeric(cmd)) {
660
- const item = util.toNumber(cmd);
661
- const slide = this.slides[item];
662
- if (slide) {
663
- if (!slide.id) {
664
- slide.id = generateId(this, slide, `-item-${cmd}`);
665
- }
666
- ariaControls = slide.id;
667
- }
668
- ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
669
- util.attr(button, "role", "tab");
670
- } else {
671
- if (this.list) {
672
- if (!this.list.id) {
673
- this.list.id = generateId(this, this.list, "-items");
674
- }
675
- ariaControls = this.list.id;
676
- }
677
- ariaLabel = this.t(cmd);
678
- }
679
- util.attr(button, {
680
- "aria-controls": ariaControls,
681
- "aria-label": util.attr(button, "aria-label") || ariaLabel
682
- });
683
- }
684
- },
685
- slides(slides) {
686
- slides.forEach(
687
- (slide, i) => util.attr(slide, {
688
- role: this.nav ? "tabpanel" : "group",
689
- "aria-label": this.t("slideLabel", i + 1, this.length),
690
- "aria-roledescription": this.nav ? null : "slide"
691
- })
692
- );
693
- },
694
- length(length) {
695
- const navLength = this.navChildren.length;
696
- if (this.nav && length !== navLength) {
697
- util.empty(this.nav);
698
- for (let i = 0; i < length; i++) {
699
- util.append(this.nav, `<li ${this.attrItem}="${i}"><a href></a></li>`);
700
- }
701
- }
702
- }
703
- },
704
- connected() {
705
- util.attr(this.$el, {
706
- role: this.role,
707
- "aria-roledescription": "carousel"
708
- });
709
- },
710
- update: [
711
- {
712
- write() {
713
- this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
714
- this.updateNav();
715
- },
716
- events: ["resize"]
717
- }
718
- ],
719
- events: [
720
- {
721
- name: "click keydown",
722
- delegate() {
723
- return this.selNavItem;
724
- },
725
- handler(e) {
726
- if (util.closest(e.target, "a,button") && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
727
- e.preventDefault();
728
- this.show(util.data(e.current, this.attrItem));
729
- }
730
- }
731
- },
732
- {
733
- name: "itemshow",
734
- handler: "updateNav"
735
- },
736
- {
737
- name: "keydown",
738
- delegate() {
739
- return this.selNavItem;
740
- },
741
- handler(e) {
742
- const { current, keyCode } = e;
743
- const cmd = util.data(current, this.attrItem);
744
- if (!util.isNumeric(cmd)) {
745
- return;
746
- }
747
- let i = keyCode === keyMap.HOME ? 0 : keyCode === keyMap.END ? "last" : keyCode === keyMap.LEFT ? "previous" : keyCode === keyMap.RIGHT ? "next" : -1;
748
- if (~i) {
749
- e.preventDefault();
750
- this.show(i);
751
- }
752
- }
753
- }
754
- ],
755
- methods: {
756
- updateNav() {
757
- const index = this.getValidIndex();
758
- let focus;
759
- let focusEl;
760
- for (const el of this.navItems) {
761
- const cmd = util.data(el, this.attrItem);
762
- const button = util.$("a,button", el) || el;
763
- if (util.isNumeric(cmd)) {
764
- const item = util.toNumber(cmd);
765
- const active = item === index;
766
- util.toggleClass(el, this.clsActive, active);
767
- util.attr(button, {
768
- "aria-selected": active,
769
- tabindex: active ? null : -1
770
- });
771
- if (active) {
772
- focusEl = button;
773
- }
774
- focus || (focus = util.matches(button, ":focus"));
775
- } else {
776
- util.toggleClass(
777
- el,
778
- "uk-invisible",
779
- this.finite && (cmd === "previous" && index === 0 || cmd === "next" && index >= this.maxIndex)
780
- );
781
- }
782
- if (focus && focusEl) {
783
- focusEl.focus();
784
- }
785
- }
623
+ stopAutoplay() {
624
+ clearInterval(this.interval);
786
625
  }
787
626
  }
788
627
  };
@@ -816,7 +655,7 @@
816
655
  name: pointerDown,
817
656
  passive: true,
818
657
  delegate() {
819
- return `${this.selList} > *`;
658
+ return "".concat(this.selList, " > *");
820
659
  },
821
660
  handler(e) {
822
661
  if (!this.draggable || !util.isTouch(e) && hasSelectableText(e.target) || util.closest(e.target, util.selInput) || e.button > 0 || this.length < 2) {
@@ -942,73 +781,199 @@
942
781
  return util.css(el, "userSelect") !== "none" && util.toArray(el.childNodes).some((el2) => el2.nodeType === 3 && el2.textContent.trim());
943
782
  }
944
783
 
945
- var SliderAutoplay = {
946
- props: {
947
- autoplay: Boolean,
948
- autoplayInterval: Number,
949
- pauseOnHover: Boolean
784
+ function generateId(instance, el = instance.$el, postfix = "") {
785
+ if (el.id) {
786
+ return el.id;
787
+ }
788
+ let id = "".concat(instance.$options.id, "-").concat(instance._uid).concat(postfix);
789
+ if (util.$("#".concat(id))) {
790
+ id = generateId(instance, el, "".concat(postfix, "-2"));
791
+ }
792
+ return id;
793
+ }
794
+
795
+ const keyMap = {
796
+ TAB: 9,
797
+ ESC: 27,
798
+ SPACE: 32,
799
+ END: 35,
800
+ HOME: 36,
801
+ LEFT: 37,
802
+ UP: 38,
803
+ RIGHT: 39,
804
+ DOWN: 40
805
+ };
806
+
807
+ var SliderNav = {
808
+ i18n: {
809
+ next: "Next slide",
810
+ previous: "Previous slide",
811
+ slideX: "Slide %s",
812
+ slideLabel: "%s of %s",
813
+ role: "String"
950
814
  },
951
815
  data: {
952
- autoplay: false,
953
- autoplayInterval: 7e3,
954
- pauseOnHover: true
816
+ selNav: false,
817
+ role: "region"
955
818
  },
956
- connected() {
957
- util.attr(this.list, "aria-live", this.autoplay ? "off" : "polite");
958
- this.autoplay && this.startAutoplay();
819
+ computed: {
820
+ nav({ selNav }, $el) {
821
+ return util.$(selNav, $el);
822
+ },
823
+ navChildren() {
824
+ return util.children(this.nav);
825
+ },
826
+ selNavItem({ attrItem }) {
827
+ return "[".concat(attrItem, "],[data-").concat(attrItem, "]");
828
+ },
829
+ navItems(_, $el) {
830
+ return util.$$(this.selNavItem, $el);
831
+ }
959
832
  },
960
- disconnected() {
961
- this.stopAutoplay();
833
+ watch: {
834
+ nav(nav, prev) {
835
+ util.attr(nav, "role", "tablist");
836
+ if (prev) {
837
+ this.$emit();
838
+ }
839
+ },
840
+ list(list) {
841
+ util.attr(list, "role", "presentation");
842
+ },
843
+ navChildren(children2) {
844
+ util.attr(children2, "role", "presentation");
845
+ },
846
+ navItems(items) {
847
+ for (const el of items) {
848
+ const cmd = util.data(el, this.attrItem);
849
+ const button = util.$("a,button", el) || el;
850
+ let ariaLabel;
851
+ let ariaControls = null;
852
+ if (util.isNumeric(cmd)) {
853
+ const item = util.toNumber(cmd);
854
+ const slide = this.slides[item];
855
+ if (slide) {
856
+ if (!slide.id) {
857
+ slide.id = generateId(this, slide, "-item-".concat(cmd));
858
+ }
859
+ ariaControls = slide.id;
860
+ }
861
+ ariaLabel = this.t("slideX", util.toFloat(cmd) + 1);
862
+ util.attr(button, "role", "tab");
863
+ } else {
864
+ if (this.list) {
865
+ if (!this.list.id) {
866
+ this.list.id = generateId(this, this.list, "-items");
867
+ }
868
+ ariaControls = this.list.id;
869
+ }
870
+ ariaLabel = this.t(cmd);
871
+ }
872
+ util.attr(button, {
873
+ "aria-controls": ariaControls,
874
+ "aria-label": util.attr(button, "aria-label") || ariaLabel
875
+ });
876
+ }
877
+ },
878
+ slides(slides) {
879
+ slides.forEach(
880
+ (slide, i) => util.attr(slide, {
881
+ role: this.nav ? "tabpanel" : "group",
882
+ "aria-label": this.t("slideLabel", i + 1, this.length),
883
+ "aria-roledescription": this.nav ? null : "slide"
884
+ })
885
+ );
886
+ },
887
+ length(length) {
888
+ const navLength = this.navChildren.length;
889
+ if (this.nav && length !== navLength) {
890
+ util.empty(this.nav);
891
+ for (let i = 0; i < length; i++) {
892
+ util.append(this.nav, "<li ".concat(this.attrItem, '="').concat(i, '"><a href></a></li>'));
893
+ }
894
+ }
895
+ }
962
896
  },
963
- update() {
964
- util.attr(this.slides, "tabindex", "-1");
897
+ connected() {
898
+ util.attr(this.$el, {
899
+ role: this.role,
900
+ "aria-roledescription": "carousel"
901
+ });
965
902
  },
903
+ update: [
904
+ {
905
+ write() {
906
+ this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
907
+ this.updateNav();
908
+ },
909
+ events: ["resize"]
910
+ }
911
+ ],
966
912
  events: [
967
913
  {
968
- name: "visibilitychange",
969
- el() {
970
- return document;
914
+ name: "click keydown",
915
+ delegate() {
916
+ return this.selNavItem;
971
917
  },
972
- filter() {
973
- return this.autoplay;
918
+ handler(e) {
919
+ if (util.closest(e.target, "a,button") && (e.type === "click" || e.keyCode === keyMap.SPACE)) {
920
+ e.preventDefault();
921
+ this.show(util.data(e.current, this.attrItem));
922
+ }
923
+ }
924
+ },
925
+ {
926
+ name: "itemshow",
927
+ handler: "updateNav"
928
+ },
929
+ {
930
+ name: "keydown",
931
+ delegate() {
932
+ return this.selNavItem;
974
933
  },
975
- handler() {
976
- if (document.hidden) {
977
- this.stopAutoplay();
978
- } else {
979
- this.startAutoplay();
934
+ handler(e) {
935
+ const { current, keyCode } = e;
936
+ const cmd = util.data(current, this.attrItem);
937
+ if (!util.isNumeric(cmd)) {
938
+ return;
939
+ }
940
+ let i = keyCode === keyMap.HOME ? 0 : keyCode === keyMap.END ? "last" : keyCode === keyMap.LEFT ? "previous" : keyCode === keyMap.RIGHT ? "next" : -1;
941
+ if (~i) {
942
+ e.preventDefault();
943
+ this.show(i);
980
944
  }
981
945
  }
982
946
  }
983
947
  ],
984
948
  methods: {
985
- startAutoplay() {
986
- this.stopAutoplay();
987
- this.interval = setInterval(() => {
988
- if (!(this.stack.length || this.draggable && util.matches(this.$el, ":focus-within") || this.pauseOnHover && util.matches(this.$el, ":hover"))) {
989
- this.show("next");
949
+ updateNav() {
950
+ const index = this.getValidIndex();
951
+ for (const el of this.navItems) {
952
+ const cmd = util.data(el, this.attrItem);
953
+ const button = util.$("a,button", el) || el;
954
+ if (util.isNumeric(cmd)) {
955
+ const item = util.toNumber(cmd);
956
+ const active = item === index;
957
+ util.toggleClass(el, this.clsActive, active);
958
+ util.attr(button, {
959
+ "aria-selected": active,
960
+ tabindex: active ? null : -1
961
+ });
962
+ if (active && button && util.matches(util.parent(el), ":focus-within")) {
963
+ button.focus();
964
+ }
965
+ } else {
966
+ util.toggleClass(
967
+ el,
968
+ "uk-invisible",
969
+ this.finite && (cmd === "previous" && index === 0 || cmd === "next" && index >= this.maxIndex)
970
+ );
990
971
  }
991
- }, this.autoplayInterval);
992
- },
993
- stopAutoplay() {
994
- clearInterval(this.interval);
972
+ }
995
973
  }
996
974
  }
997
975
  };
998
976
 
999
- function resize(options) {
1000
- return observe(util.observeResize, options, "resize");
1001
- }
1002
- function observe(observe2, options, emit) {
1003
- return {
1004
- observe: observe2,
1005
- handler() {
1006
- this.$emit(emit);
1007
- },
1008
- ...options
1009
- };
1010
- }
1011
-
1012
977
  var Slider = {
1013
978
  mixins: [SliderAutoplay, SliderDrag, SliderNav, I18n],
1014
979
  props: {
@@ -1191,6 +1156,38 @@
1191
1156
  }
1192
1157
  };
1193
1158
 
1159
+ var Animations = {
1160
+ ...Animations$1,
1161
+ fade: {
1162
+ show() {
1163
+ return [{ opacity: 0 }, { opacity: 1 }];
1164
+ },
1165
+ percent(current) {
1166
+ return 1 - util.css(current, "opacity");
1167
+ },
1168
+ translate(percent) {
1169
+ return [{ opacity: 1 - percent }, { opacity: percent }];
1170
+ }
1171
+ },
1172
+ scale: {
1173
+ show() {
1174
+ return [
1175
+ { opacity: 0, transform: scale3d(1 - 0.2) },
1176
+ { opacity: 1, transform: scale3d(1) }
1177
+ ];
1178
+ },
1179
+ percent(current) {
1180
+ return 1 - util.css(current, "opacity");
1181
+ },
1182
+ translate(percent) {
1183
+ return [
1184
+ { opacity: 1 - percent, transform: scale3d(1 - 0.2 * percent) },
1185
+ { opacity: percent, transform: scale3d(1 - 0.2 + 0.2 * percent) }
1186
+ ];
1187
+ }
1188
+ }
1189
+ };
1190
+
1194
1191
  var Component = {
1195
1192
  mixins: [Modal, Slideshow],
1196
1193
  functional: true,
@@ -1214,7 +1211,7 @@
1214
1211
  pauseOnHover: false,
1215
1212
  velocity: 2,
1216
1213
  Animations,
1217
- 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>`
1214
+ 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>'
1218
1215
  }),
1219
1216
  created() {
1220
1217
  const $el = util.$(this.template);
@@ -1234,14 +1231,14 @@
1234
1231
  },
1235
1232
  events: [
1236
1233
  {
1237
- name: `${util.pointerMove} ${util.pointerDown} keydown`,
1234
+ name: "".concat(util.pointerMove, " ").concat(util.pointerDown, " keydown"),
1238
1235
  handler: "showControls"
1239
1236
  },
1240
1237
  {
1241
1238
  name: "click",
1242
1239
  self: true,
1243
1240
  delegate() {
1244
- return `${this.selList} > *`;
1241
+ return "".concat(this.selList, " > *");
1245
1242
  },
1246
1243
  handler(e) {
1247
1244
  if (!e.defaultPrevented) {
@@ -1338,7 +1335,7 @@
1338
1335
  allowfullscreen: "",
1339
1336
  style: "max-width: 100%; box-sizing: border-box;",
1340
1337
  "uk-responsive": "",
1341
- "uk-video": `${this.videoAutoplay}`
1338
+ "uk-video": "".concat(this.videoAutoplay)
1342
1339
  };
1343
1340
  if (type === "image" || src.match(/\.(avif|jpe?g|jfif|a?png|gif|svg|webp)($|\?)/i)) {
1344
1341
  const img = createEl("img", { src, alt, ...attrs });
@@ -1350,7 +1347,7 @@
1350
1347
  poster,
1351
1348
  controls: "",
1352
1349
  playsinline: "",
1353
- "uk-video": `${this.videoAutoplay}`,
1350
+ "uk-video": "".concat(this.videoAutoplay),
1354
1351
  ...attrs
1355
1352
  });
1356
1353
  util.on(video, "loadedmetadata", () => this.setItem(item, video));
@@ -1371,7 +1368,7 @@
1371
1368
  this.setItem(
1372
1369
  item,
1373
1370
  createEl("iframe", {
1374
- src: `https://www.youtube${matches[1] || ""}.com/embed/${matches[2]}${matches[3] ? `?${matches[3]}` : ""}`,
1371
+ src: "https://www.youtube".concat(matches[1] || "", ".com/embed/").concat(matches[2]).concat(matches[3] ? "?".concat(matches[3]) : ""),
1375
1372
  width: 1920,
1376
1373
  height: 1080,
1377
1374
  ...iframeAttrs,
@@ -1381,15 +1378,15 @@
1381
1378
  } else if (matches = src.match(/\/\/.*?vimeo\.[a-z]+\/(\d+)[&?]?(.*)?/)) {
1382
1379
  try {
1383
1380
  const { height, width } = await (await fetch(
1384
- `https://vimeo.com/api/oembed.json?maxwidth=1920&url=${encodeURI(
1385
- src
1386
- )}`,
1381
+ "https://vimeo.com/api/oembed.json?maxwidth=1920&url=".concat(encodeURI(
1382
+ src
1383
+ )),
1387
1384
  { credentials: "omit" }
1388
1385
  )).json();
1389
1386
  this.setItem(
1390
1387
  item,
1391
1388
  createEl("iframe", {
1392
- src: `https://player.vimeo.com/video/${matches[1]}${matches[2] ? `?${matches[2]}` : ""}`,
1389
+ src: "https://player.vimeo.com/video/".concat(matches[1]).concat(matches[2] ? "?".concat(matches[2]) : ""),
1393
1390
  width,
1394
1391
  height,
1395
1392
  ...iframeAttrs,
@@ -1433,7 +1430,7 @@
1433
1430
  }
1434
1431
  };
1435
1432
  function createEl(tag, attrs) {
1436
- const el = util.fragment(`<${tag}>`);
1433
+ const el = util.fragment("<".concat(tag, ">"));
1437
1434
  util.attr(el, attrs);
1438
1435
  return el;
1439
1436
  }