uikit 3.11.2-dev.9433cd5fd → 3.11.2-dev.946d2efea

package/dist/js/components/slideshow.js

@@ -1,4 +1,4 @@
-/*! UIkit 3.11.2-dev.9433cd5fd | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
+/*! UIkit 3.11.2-dev.946d2efea | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
 
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('uikit-util')) :
@@ -7,1043 +7,873 @@
 })(this, (function (uikitUtil) { 'use strict';
 
     var Class = {
-
-        connected: function() {
-            !uikitUtil.hasClass(this.$el, this.$name) && uikitUtil.addClass(this.$el, this.$name);
-        }
-
-    };
+      connected() {
+        !uikitUtil.hasClass(this.$el, this.$name) && uikitUtil.addClass(this.$el, this.$name);
+      } };
 
     var Animations$1 = {
+      slide: {
+        show(dir) {
+          return [{ transform: translate(dir * -100) }, { transform: translate() }];
+        },
 
-        slide: {
+        percent(current) {
+          return translated(current);
+        },
 
-            show: function(dir) {
-                return [
-                    {transform: translate(dir * -100)},
-                    {transform: translate()}
-                ];
-            },
+        translate(percent, dir) {
+          return [
+          { transform: translate(dir * -100 * percent) },
+          { transform: translate(dir * 100 * (1 - percent)) }];
 
-            percent: function(current) {
-                return translated(current);
-            },
+        } } };
 
-            translate: function(percent, dir) {
-                return [
-                    {transform: translate(dir * -100 * percent)},
-                    {transform: translate(dir * 100 * (1 - percent))}
-                ];
-            }
 
-        }
-
-    };
 
     function translated(el) {
-        return Math.abs(uikitUtil.css(el, 'transform').split(',')[4] / el.offsetWidth) || 0;
+      return Math.abs(uikitUtil.css(el, 'transform').split(',')[4] / el.offsetWidth) || 0;
     }
 
-    function translate(value, unit) {
-        if ( value === void 0 ) value = 0;
-        if ( unit === void 0 ) unit = '%';
-
-        value += value ? unit : '';
-        return uikitUtil.isIE ? ("translateX(" + value + ")") : ("translate3d(" + value + ", 0, 0)"); // currently, not translate3d in IE, translate3d within translate3d does not work while transitioning
+    function translate(value, unit) {if (value === void 0) {value = 0;}if (unit === void 0) {unit = '%';}
+      value += value ? unit : '';
+      return "translate3d(" + value + ", 0, 0)";
     }
 
     function scale3d(value) {
-        return ("scale3d(" + value + ", " + value + ", 1)");
+      return "scale3d(" + value + ", " + value + ", 1)";
     }
 
-    function Transitioner(prev, next, dir, ref) {
-        var animation = ref.animation;
-        var easing = ref.easing;
-
-
-        var percent = animation.percent;
-        var translate = animation.translate;
-        var show = animation.show; if ( show === void 0 ) show = uikitUtil.noop;
-        var props = show(dir);
-        var deferred = new uikitUtil.Deferred();
-
-        return {
-
-            dir: dir,
-
-            show: function(duration, percent, linear) {
-                var this$1$1 = this;
-                if ( percent === void 0 ) percent = 0;
-
-
-                var timing = linear ? 'linear' : easing;
-                duration -= Math.round(duration * uikitUtil.clamp(percent, -1, 1));
-
-                this.translate(percent);
-
-                triggerUpdate(next, 'itemin', {percent: percent, duration: duration, timing: timing, dir: dir});
-                triggerUpdate(prev, 'itemout', {percent: 1 - percent, duration: duration, timing: timing, dir: dir});
-
-                uikitUtil.Promise.all([
-                    uikitUtil.Transition.start(next, props[1], duration, timing),
-                    uikitUtil.Transition.start(prev, props[0], duration, timing)
-                ]).then(function () {
-                    this$1$1.reset();
-                    deferred.resolve();
-                }, uikitUtil.noop);
-
-                return deferred.promise;
-            },
-
-            cancel: function() {
-                uikitUtil.Transition.cancel([next, prev]);
-            },
-
-            reset: function() {
-                for (var prop in props[0]) {
-                    uikitUtil.css([next, prev], prop, '');
-                }
-            },
-
-            forward: function(duration, percent) {
-                if ( percent === void 0 ) percent = this.percent();
-
-                uikitUtil.Transition.cancel([next, prev]);
-                return this.show(duration, percent, true);
-            },
+    function Transitioner(prev, next, dir, _ref) {let { animation, easing } = _ref;
+      const { percent, translate, show = uikitUtil.noop } = animation;
+      const props = show(dir);
+      const deferred = new uikitUtil.Deferred();
 
-            translate: function(percent) {
+      return {
+        dir,
 
-                this.reset();
+        show(duration, percent, linear) {if (percent === void 0) {percent = 0;}
+          const timing = linear ? 'linear' : easing;
+          duration -= Math.round(duration * uikitUtil.clamp(percent, -1, 1));
 
-                var props = translate(percent, dir);
-                uikitUtil.css(next, props[1]);
-                uikitUtil.css(prev, props[0]);
-                triggerUpdate(next, 'itemtranslatein', {percent: percent, dir: dir});
-                triggerUpdate(prev, 'itemtranslateout', {percent: 1 - percent, dir: dir});
+          this.translate(percent);
 
-            },
+          triggerUpdate(next, 'itemin', { percent, duration, timing, dir });
+          triggerUpdate(prev, 'itemout', { percent: 1 - percent, duration, timing, dir });
 
-            percent: function() {
-                return percent(prev || next, next, dir);
-            },
+          Promise.all([
+          uikitUtil.Transition.start(next, props[1], duration, timing),
+          uikitUtil.Transition.start(prev, props[0], duration, timing)]).
+          then(() => {
+            this.reset();
+            deferred.resolve();
+          }, uikitUtil.noop);
 
-            getDistance: function() {
-                return prev && prev.offsetWidth;
-            }
-
-        };
-
-    }
-
-    function triggerUpdate(el, type, data) {
-        uikitUtil.trigger(el, uikitUtil.createEvent(type, false, false, data));
-    }
-
-    var SliderAutoplay = {
-
-        props: {
-            autoplay: Boolean,
-            autoplayInterval: Number,
-            pauseOnHover: Boolean
-        },
-
-        data: {
-            autoplay: false,
-            autoplayInterval: 7000,
-            pauseOnHover: true
+          return deferred.promise;
         },
 
-        connected: function() {
-            this.autoplay && this.startAutoplay();
+        cancel() {
+          uikitUtil.Transition.cancel([next, prev]);
         },
 
-        disconnected: function() {
-            this.stopAutoplay();
+        reset() {
+          for (const prop in props[0]) {
+            uikitUtil.css([next, prev], prop, '');
+          }
         },
 
-        update: function() {
-            uikitUtil.attr(this.slides, 'tabindex', '-1');
+        forward(duration, percent) {if (percent === void 0) {percent = this.percent();}
+          uikitUtil.Transition.cancel([next, prev]);
+          return this.show(duration, percent, true);
         },
 
-        events: [
-
-            {
-
-                name: 'visibilitychange',
+        translate(percent) {
+          this.reset();
 
-                el: function() {
-                    return document;
-                },
-
-                filter: function() {
-                    return this.autoplay;
-                },
-
-                handler: function() {
-                    if (document.hidden) {
-                        this.stopAutoplay();
-                    } else {
-                        this.startAutoplay();
-                    }
-                }
+          const props = translate(percent, dir);
+          uikitUtil.css(next, props[1]);
+          uikitUtil.css(prev, props[0]);
+          triggerUpdate(next, 'itemtranslatein', { percent, dir });
+          triggerUpdate(prev, 'itemtranslateout', { percent: 1 - percent, dir });
+        },
 
-            }
+        percent() {
+          return percent(prev || next, next, dir);
+        },
 
-        ],
+        getDistance() {
+          return prev == null ? void 0 : prev.offsetWidth;
+        } };
 
-        methods: {
+    }
 
-            startAutoplay: function() {
-                var this$1$1 = this;
+    function triggerUpdate(el, type, data) {
+      uikitUtil.trigger(el, uikitUtil.createEvent(type, false, false, data));
+    }
 
+    var SliderAutoplay = {
+      props: {
+        autoplay: Boolean,
+        autoplayInterval: Number,
+        pauseOnHover: Boolean },
 
-                this.stopAutoplay();
 
-                this.interval = setInterval(
-                    function () { return (!this$1$1.draggable || !uikitUtil.$(':focus', this$1$1.$el))
-                        && (!this$1$1.pauseOnHover || !uikitUtil.matches(this$1$1.$el, ':hover'))
-                        && !this$1$1.stack.length
-                        && this$1$1.show('next'); },
-                    this.autoplayInterval
-                );
+      data: {
+        autoplay: false,
+        autoplayInterval: 7000,
+        pauseOnHover: true },
 
-            },
 
-            stopAutoplay: function() {
-                this.interval && clearInterval(this.interval);
-            }
+      connected() {
+        this.autoplay && this.startAutoplay();
+      },
 
-        }
+      disconnected() {
+        this.stopAutoplay();
+      },
 
-    };
+      update() {
+        uikitUtil.attr(this.slides, 'tabindex', '-1');
+      },
 
-    var SliderDrag = {
+      events: [
+      {
+        name: 'visibilitychange',
 
-        props: {
-            draggable: Boolean
+        el() {
+          return document;
         },
 
-        data: {
-            draggable: true,
-            threshold: 10
+        filter() {
+          return this.autoplay;
         },
 
-        created: function() {
-            var this$1$1 = this;
-
-
-            ['start', 'move', 'end'].forEach(function (key) {
-
-                var fn = this$1$1[key];
-                this$1$1[key] = function (e) {
+        handler() {
+          if (document.hidden) {
+            this.stopAutoplay();
+          } else {
+            this.startAutoplay();
+          }
+        } }],
 
-                    var pos = uikitUtil.getEventPos(e).x * (uikitUtil.isRtl ? -1 : 1);
 
-                    this$1$1.prevPos = pos !== this$1$1.pos ? this$1$1.pos : this$1$1.prevPos;
-                    this$1$1.pos = pos;
 
-                    fn(e);
-                };
+      methods: {
+        startAutoplay() {
+          this.stopAutoplay();
 
-            });
+          this.interval = setInterval(
+          () =>
+          (!this.draggable || !uikitUtil.$(':focus', this.$el)) && (
+          !this.pauseOnHover || !uikitUtil.matches(this.$el, ':hover')) &&
+          !this.stack.length &&
+          this.show('next'),
+          this.autoplayInterval);
 
         },
 
-        events: [
-
-            {
-
-                name: uikitUtil.pointerDown,
-
-                delegate: function() {
-                    return this.selSlides;
-                },
-
-                handler: function(e) {
-
-                    if (!this.draggable
-                        || !uikitUtil.isTouch(e) && hasTextNodesOnly(e.target)
-                        || uikitUtil.closest(e.target, uikitUtil.selInput)
-                        || e.button > 0
-                        || this.length < 2
-                    ) {
-                        return;
-                    }
-
-                    this.start(e);
-                }
-
-            },
-
-            {
-                name: 'dragstart',
-
-                handler: function(e) {
-                    e.preventDefault();
-                }
-            }
-
-        ],
-
-        methods: {
-
-            start: function() {
-
-                this.drag = this.pos;
+        stopAutoplay() {
+          this.interval && clearInterval(this.interval);
+        } } };
 
-                if (this._transitioner) {
+    var SliderDrag = {
+      props: {
+        draggable: Boolean },
 
-                    this.percent = this._transitioner.percent();
-                    this.drag += this._transitioner.getDistance() * this.percent * this.dir;
 
-                    this._transitioner.cancel();
-                    this._transitioner.translate(this.percent);
+      data: {
+        draggable: true,
+        threshold: 10 },
 
-                    this.dragging = true;
 
-                    this.stack = [];
+      created() {
+        for (const key of ['start', 'move', 'end']) {
+          const fn = this[key];
+          this[key] = (e) => {
+            const pos = uikitUtil.getEventPos(e).x * (uikitUtil.isRtl ? -1 : 1);
 
-                } else {
-                    this.prevIndex = this.index;
-                }
+            this.prevPos = pos === this.pos ? this.prevPos : this.pos;
+            this.pos = pos;
 
-                uikitUtil.on(document, uikitUtil.pointerMove, this.move, {passive: false});
+            fn(e);
+          };
+        }
+      },
 
-                // 'input' event is triggered by video controls
-                uikitUtil.on(document, (uikitUtil.pointerUp + " " + uikitUtil.pointerCancel + " input"), this.end, true);
+      events: [
+      {
+        name: uikitUtil.pointerDown,
 
-                uikitUtil.css(this.list, 'userSelect', 'none');
+        delegate() {
+          return this.selSlides;
+        },
 
-            },
+        handler(e) {
+          if (
+          !this.draggable ||
+          !uikitUtil.isTouch(e) && hasTextNodesOnly(e.target) ||
+          uikitUtil.closest(e.target, uikitUtil.selInput) ||
+          e.button > 0 ||
+          this.length < 2)
+          {
+            return;
+          }
 
-            move: function(e) {
-                var this$1$1 = this;
+          this.start(e);
+        } },
 
 
-                var distance = this.pos - this.drag;
+      {
+        name: 'dragstart',
 
-                if (distance === 0 || this.prevPos === this.pos || !this.dragging && Math.abs(distance) < this.threshold) {
-                    return;
-                }
+        handler(e) {
+          e.preventDefault();
+        } }],
 
-                // prevent click event
-                uikitUtil.css(this.list, 'pointerEvents', 'none');
 
-                e.cancelable && e.preventDefault();
 
-                this.dragging = true;
-                this.dir = (distance < 0 ? 1 : -1);
+      methods: {
+        start() {
+          this.drag = this.pos;
 
-                var ref = this;
-                var slides = ref.slides;
-                var ref$1 = this;
-                var prevIndex = ref$1.prevIndex;
-                var dis = Math.abs(distance);
-                var nextIndex = this.getIndex(prevIndex + this.dir, prevIndex);
-                var width = this._getDistance(prevIndex, nextIndex) || slides[prevIndex].offsetWidth;
+          if (this._transitioner) {
+            this.percent = this._transitioner.percent();
+            this.drag += this._transitioner.getDistance() * this.percent * this.dir;
 
-                while (nextIndex !== prevIndex && dis > width) {
+            this._transitioner.cancel();
+            this._transitioner.translate(this.percent);
 
-                    this.drag -= width * this.dir;
+            this.dragging = true;
 
-                    prevIndex = nextIndex;
-                    dis -= width;
-                    nextIndex = this.getIndex(prevIndex + this.dir, prevIndex);
-                    width = this._getDistance(prevIndex, nextIndex) || slides[prevIndex].offsetWidth;
+            this.stack = [];
+          } else {
+            this.prevIndex = this.index;
+          }
 
-                }
+          uikitUtil.on(document, uikitUtil.pointerMove, this.move, { passive: false });
 
-                this.percent = dis / width;
+          // 'input' event is triggered by video controls
+          uikitUtil.on(document, uikitUtil.pointerUp + " " + uikitUtil.pointerCancel + " input", this.end, true);
 
-                var prev = slides[prevIndex];
-                var next = slides[nextIndex];
-                var changed = this.index !== nextIndex;
-                var edge = prevIndex === nextIndex;
+          uikitUtil.css(this.list, 'userSelect', 'none');
+        },
 
-                var itemShown;
+        move(e) {
+          const distance = this.pos - this.drag;
 
-                [this.index, this.prevIndex].filter(function (i) { return !uikitUtil.includes([nextIndex, prevIndex], i); }).forEach(function (i) {
-                    uikitUtil.trigger(slides[i], 'itemhidden', [this$1$1]);
+          if (
+          distance === 0 ||
+          this.prevPos === this.pos ||
+          !this.dragging && Math.abs(distance) < this.threshold)
+          {
+            return;
+          }
 
-                    if (edge) {
-                        itemShown = true;
-                        this$1$1.prevIndex = prevIndex;
-                    }
+          // prevent click event
+          uikitUtil.css(this.list, 'pointerEvents', 'none');
 
-                });
+          e.cancelable && e.preventDefault();
 
-                if (this.index === prevIndex && this.prevIndex !== prevIndex || itemShown) {
-                    uikitUtil.trigger(slides[this.index], 'itemshown', [this]);
-                }
+          this.dragging = true;
+          this.dir = distance < 0 ? 1 : -1;
 
-                if (changed) {
-                    this.prevIndex = prevIndex;
-                    this.index = nextIndex;
+          const { slides } = this;
+          let { prevIndex } = this;
+          let dis = Math.abs(distance);
+          let nextIndex = this.getIndex(prevIndex + this.dir, prevIndex);
+          let width = this._getDistance(prevIndex, nextIndex) || slides[prevIndex].offsetWidth;
 
-                    !edge && uikitUtil.trigger(prev, 'beforeitemhide', [this]);
-                    uikitUtil.trigger(next, 'beforeitemshow', [this]);
-                }
+          while (nextIndex !== prevIndex && dis > width) {
+            this.drag -= width * this.dir;
 
-                this._transitioner = this._translate(Math.abs(this.percent), prev, !edge && next);
+            prevIndex = nextIndex;
+            dis -= width;
+            nextIndex = this.getIndex(prevIndex + this.dir, prevIndex);
+            width = this._getDistance(prevIndex, nextIndex) || slides[prevIndex].offsetWidth;
+          }
 
-                if (changed) {
-                    !edge && uikitUtil.trigger(prev, 'itemhide', [this]);
-                    uikitUtil.trigger(next, 'itemshow', [this]);
-                }
+          this.percent = dis / width;
 
-            },
+          const prev = slides[prevIndex];
+          const next = slides[nextIndex];
+          const changed = this.index !== nextIndex;
+          const edge = prevIndex === nextIndex;
 
-            end: function() {
+          let itemShown;
 
-                uikitUtil.off(document, uikitUtil.pointerMove, this.move, {passive: false});
-                uikitUtil.off(document, (uikitUtil.pointerUp + " " + uikitUtil.pointerCancel + " input"), this.end, true);
+          [this.index, this.prevIndex].
+          filter((i) => !uikitUtil.includes([nextIndex, prevIndex], i)).
+          forEach((i) => {
+            uikitUtil.trigger(slides[i], 'itemhidden', [this]);
 
-                if (this.dragging) {
+            if (edge) {
+              itemShown = true;
+              this.prevIndex = prevIndex;
+            }
+          });
 
-                    this.dragging = null;
+          if (this.index === prevIndex && this.prevIndex !== prevIndex || itemShown) {
+            uikitUtil.trigger(slides[this.index], 'itemshown', [this]);
+          }
 
-                    if (this.index === this.prevIndex) {
-                        this.percent = 1 - this.percent;
-                        this.dir *= -1;
-                        this._show(false, this.index, true);
-                        this._transitioner = null;
-                    } else {
+          if (changed) {
+            this.prevIndex = prevIndex;
+            this.index = nextIndex;
 
-                        var dirChange = (uikitUtil.isRtl ? this.dir * (uikitUtil.isRtl ? 1 : -1) : this.dir) < 0 === this.prevPos > this.pos;
-                        this.index = dirChange ? this.index : this.prevIndex;
+            !edge && uikitUtil.trigger(prev, 'beforeitemhide', [this]);
+            uikitUtil.trigger(next, 'beforeitemshow', [this]);
+          }
 
-                        if (dirChange) {
-                            this.percent = 1 - this.percent;
-                        }
+          this._transitioner = this._translate(Math.abs(this.percent), prev, !edge && next);
 
-                        this.show(this.dir > 0 && !dirChange || this.dir < 0 && dirChange ? 'next' : 'previous', true);
-                    }
+          if (changed) {
+            !edge && uikitUtil.trigger(prev, 'itemhide', [this]);
+            uikitUtil.trigger(next, 'itemshow', [this]);
+          }
+        },
 
-                }
+        end() {
+          uikitUtil.off(document, uikitUtil.pointerMove, this.move, { passive: false });
+          uikitUtil.off(document, uikitUtil.pointerUp + " " + uikitUtil.pointerCancel + " input", this.end, true);
+
+          if (this.dragging) {
+            this.dragging = null;
+
+            if (this.index === this.prevIndex) {
+              this.percent = 1 - this.percent;
+              this.dir *= -1;
+              this._show(false, this.index, true);
+              this._transitioner = null;
+            } else {
+              const dirChange =
+              (uikitUtil.isRtl ? this.dir * (uikitUtil.isRtl ? 1 : -1) : this.dir) < 0 ===
+              this.prevPos > this.pos;
+              this.index = dirChange ? this.index : this.prevIndex;
+
+              if (dirChange) {
+                this.percent = 1 - this.percent;
+              }
+
+              this.show(
+              this.dir > 0 && !dirChange || this.dir < 0 && dirChange ?
+              'next' :
+              'previous',
+              true);
 
-                uikitUtil.css(this.list, {userSelect: '', pointerEvents: ''});
+            }
+          }
 
-                this.drag
-                    = this.percent
-                    = null;
+          uikitUtil.css(this.list, { userSelect: '', pointerEvents: '' });
 
-            }
+          this.drag = this.percent = null;
+        } } };
 
-        }
 
-    };
 
     function hasTextNodesOnly(el) {
-        return !el.children.length && el.childNodes.length;
+      return !el.children.length && el.childNodes.length;
     }
 
     var SliderNav = {
+      data: {
+        selNav: false },
 
-        data: {
-            selNav: false
-        },
-
-        computed: {
-
-            nav: function(ref, $el) {
-                var selNav = ref.selNav;
-
-                return uikitUtil.$(selNav, $el);
-            },
-
-            selNavItem: function(ref) {
-                var attrItem = ref.attrItem;
-
-                return ("[" + attrItem + "],[data-" + attrItem + "]");
-            },
-
-            navItems: function(_, $el) {
-                return uikitUtil.$$(this.selNavItem, $el);
-            }
 
+      computed: {
+        nav(_ref, $el) {let { selNav } = _ref;
+          return uikitUtil.$(selNav, $el);
         },
 
-        update: {
-
-            write: function() {
-                var this$1$1 = this;
-
-
-                if (this.nav && this.length !== this.nav.children.length) {
-                    uikitUtil.html(this.nav, this.slides.map(function (_, i) { return ("<li " + (this$1$1.attrItem) + "=\"" + i + "\"><a href></a></li>"); }).join(''));
-                }
-
-                this.navItems.concat(this.nav).forEach(function (el) { return el && (el.hidden = !this$1$1.maxIndex); });
-
-                this.updateNav();
-
-            },
-
-            events: ['resize']
-
+        selNavItem(_ref2) {let { attrItem } = _ref2;
+          return "[" + attrItem + "],[data-" + attrItem + "]";
         },
 
-        events: [
-
-            {
+        navItems(_, $el) {
+          return uikitUtil.$$(this.selNavItem, $el);
+        } },
 
-                name: 'click',
 
-                delegate: function() {
-                    return this.selNavItem;
-                },
+      update: {
+        write() {
+          if (this.nav && this.length !== this.nav.children.length) {
+            uikitUtil.html(
+            this.nav,
+            this.slides.
+            map((_, i) => "<li " + this.attrItem + "=\"" + i + "\"><a href></a></li>").
+            join(''));
 
-                handler: function(e) {
-                    e.preventDefault();
-                    this.show(uikitUtil.data(e.current, this.attrItem));
-                }
+          }
 
-            },
+          this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = !this.maxIndex));
 
-            {
+          this.updateNav();
+        },
 
-                name: 'itemshow',
-                handler: 'updateNav'
+        events: ['resize'] },
 
-            }
 
-        ],
+      events: [
+      {
+        name: 'click',
 
-        methods: {
+        delegate() {
+          return this.selNavItem;
+        },
 
-            updateNav: function() {
-                var this$1$1 = this;
+        handler(e) {
+          e.preventDefault();
+          this.show(uikitUtil.data(e.current, this.attrItem));
+        } },
 
 
-                var i = this.getValidIndex();
-                this.navItems.forEach(function (el) {
+      {
+        name: 'itemshow',
+        handler: 'updateNav' }],
 
-                    var cmd = uikitUtil.data(el, this$1$1.attrItem);
 
-                    uikitUtil.toggleClass(el, this$1$1.clsActive, uikitUtil.toNumber(cmd) === i);
-                    uikitUtil.toggleClass(el, 'uk-invisible', this$1$1.finite && (cmd === 'previous' && i === 0 || cmd === 'next' && i >= this$1$1.maxIndex));
-                });
 
-            }
+      methods: {
+        updateNav() {
+          const i = this.getValidIndex();
+          for (const el of this.navItems) {
+            const cmd = uikitUtil.data(el, this.attrItem);
 
-        }
+            uikitUtil.toggleClass(el, this.clsActive, uikitUtil.toNumber(cmd) === i);
+            uikitUtil.toggleClass(
+            el,
+            'uk-invisible',
+            this.finite && (
+            cmd === 'previous' && i === 0 || cmd === 'next' && i >= this.maxIndex));
 
-    };
+          }
+        } } };
 
     var Slider = {
-
-        mixins: [SliderAutoplay, SliderDrag, SliderNav],
-
-        props: {
-            clsActivated: Boolean,
-            easing: String,
-            index: Number,
-            finite: Boolean,
-            velocity: Number,
-            selSlides: String
+      mixins: [SliderAutoplay, SliderDrag, SliderNav],
+
+      props: {
+        clsActivated: Boolean,
+        easing: String,
+        index: Number,
+        finite: Boolean,
+        velocity: Number,
+        selSlides: String },
+
+
+      data: () => ({
+        easing: 'ease',
+        finite: false,
+        velocity: 1,
+        index: 0,
+        prevIndex: -1,
+        stack: [],
+        percent: 0,
+        clsActive: 'uk-active',
+        clsActivated: false,
+        Transitioner: false,
+        transitionOptions: {} }),
+
+
+      connected() {
+        this.prevIndex = -1;
+        this.index = this.getValidIndex(this.$props.index);
+        this.stack = [];
+      },
+
+      disconnected() {
+        uikitUtil.removeClass(this.slides, this.clsActive);
+      },
+
+      computed: {
+        duration(_ref, $el) {let { velocity } = _ref;
+          return speedUp($el.offsetWidth / velocity);
         },
 
-        data: function () { return ({
-            easing: 'ease',
-            finite: false,
-            velocity: 1,
-            index: 0,
-            prevIndex: -1,
-            stack: [],
-            percent: 0,
-            clsActive: 'uk-active',
-            clsActivated: false,
-            Transitioner: false,
-            transitionOptions: {}
-        }); },
-
-        connected: function() {
-            this.prevIndex = -1;
-            this.index = this.getValidIndex(this.$props.index);
-            this.stack = [];
+        list(_ref2, $el) {let { selList } = _ref2;
+          return uikitUtil.$(selList, $el);
         },
 
-        disconnected: function() {
-            uikitUtil.removeClass(this.slides, this.clsActive);
+        maxIndex() {
+          return this.length - 1;
         },
 
-        computed: {
-
-            duration: function(ref, $el) {
-                var velocity = ref.velocity;
-
-                return speedUp($el.offsetWidth / velocity);
-            },
-
-            list: function(ref, $el) {
-                var selList = ref.selList;
-
-                return uikitUtil.$(selList, $el);
-            },
+        selSlides(_ref3) {let { selList, selSlides } = _ref3;
+          return selList + " " + (selSlides || '> *');
+        },
 
-            maxIndex: function() {
-                return this.length - 1;
-            },
+        slides: {
+          get() {
+            return uikitUtil.$$(this.selSlides, this.$el);
+          },
 
-            selSlides: function(ref) {
-                var selList = ref.selList;
-                var selSlides = ref.selSlides;
+          watch() {
+            this.$reset();
+          } },
 
-                return (selList + " " + (selSlides || '> *'));
-            },
 
-            slides: {
+        length() {
+          return this.slides.length;
+        } },
 
-                get: function() {
-                    return uikitUtil.$$(this.selSlides, this.$el);
-                },
 
-                watch: function() {
-                    this.$reset();
-                }
+      methods: {
+        show(index, force) {if (force === void 0) {force = false;}
+          if (this.dragging || !this.length) {
+            return;
+          }
 
-            },
+          const { stack } = this;
+          const queueIndex = force ? 0 : stack.length;
+          const reset = () => {
+            stack.splice(queueIndex, 1);
 
-            length: function() {
-                return this.slides.length;
+            if (stack.length) {
+              this.show(stack.shift(), true);
             }
+          };
 
-        },
-
-        events: {
+          stack[force ? 'unshift' : 'push'](index);
 
-            itemshown: function() {
-                this.$update(this.list);
+          if (!force && stack.length > 1) {
+            if (stack.length === 2) {
+              this._transitioner.forward(Math.min(this.duration, 200));
             }
 
-        },
-
-        methods: {
-
-            show: function(index, force) {
-                var this$1$1 = this;
-                if ( force === void 0 ) force = false;
-
-
-                if (this.dragging || !this.length) {
-                    return;
-                }
-
-                var ref = this;
-                var stack = ref.stack;
-                var queueIndex = force ? 0 : stack.length;
-                var reset = function () {
-                    stack.splice(queueIndex, 1);
-
-                    if (stack.length) {
-                        this$1$1.show(stack.shift(), true);
-                    }
-                };
-
-                stack[force ? 'unshift' : 'push'](index);
-
-                if (!force && stack.length > 1) {
-
-                    if (stack.length === 2) {
-                        this._transitioner.forward(Math.min(this.duration, 200));
-                    }
-
-                    return;
-                }
-
-                var prevIndex = this.getIndex(this.index);
-                var prev = uikitUtil.hasClass(this.slides, this.clsActive) && this.slides[prevIndex];
-                var nextIndex = this.getIndex(index, this.index);
-                var next = this.slides[nextIndex];
-
-                if (prev === next) {
-                    reset();
-                    return;
-                }
-
-                this.dir = getDirection(index, prevIndex);
-                this.prevIndex = prevIndex;
-                this.index = nextIndex;
-
-                if (prev && !uikitUtil.trigger(prev, 'beforeitemhide', [this])
-                    || !uikitUtil.trigger(next, 'beforeitemshow', [this, prev])
-                ) {
-                    this.index = this.prevIndex;
-                    reset();
-                    return;
+            return;
+          }
+
+          const prevIndex = this.getIndex(this.index);
+          const prev = uikitUtil.hasClass(this.slides, this.clsActive) && this.slides[prevIndex];
+          const nextIndex = this.getIndex(index, this.index);
+          const next = this.slides[nextIndex];
+
+          if (prev === next) {
+            reset();
+            return;
+          }
+
+          this.dir = getDirection(index, prevIndex);
+          this.prevIndex = prevIndex;
+          this.index = nextIndex;
+
+          if (
+          prev && !uikitUtil.trigger(prev, 'beforeitemhide', [this]) ||
+          !uikitUtil.trigger(next, 'beforeitemshow', [this, prev]))
+          {
+            this.index = this.prevIndex;
+            reset();
+            return;
+          }
+
+          const promise = this._show(prev, next, force).then(() => {
+            prev && uikitUtil.trigger(prev, 'itemhidden', [this]);
+            uikitUtil.trigger(next, 'itemshown', [this]);
+
+            return new Promise((resolve) => {
+              uikitUtil.fastdom.write(() => {
+                stack.shift();
+                if (stack.length) {
+                  this.show(stack.shift(), true);
+                } else {
+                  this._transitioner = null;
                 }
+                resolve();
+              });
+            });
+          });
 
-                var promise = this._show(prev, next, force).then(function () {
-
-                    prev && uikitUtil.trigger(prev, 'itemhidden', [this$1$1]);
-                    uikitUtil.trigger(next, 'itemshown', [this$1$1]);
-
-                    return new uikitUtil.Promise(function (resolve) {
-                        uikitUtil.fastdom.write(function () {
-                            stack.shift();
-                            if (stack.length) {
-                                this$1$1.show(stack.shift(), true);
-                            } else {
-                                this$1$1._transitioner = null;
-                            }
-                            resolve();
-                        });
-                    });
+          prev && uikitUtil.trigger(prev, 'itemhide', [this]);
+          uikitUtil.trigger(next, 'itemshow', [this]);
 
-                });
+          return promise;
+        },
 
-                prev && uikitUtil.trigger(prev, 'itemhide', [this]);
-                uikitUtil.trigger(next, 'itemshow', [this]);
+        getIndex(index, prev) {if (index === void 0) {index = this.index;}if (prev === void 0) {prev = this.index;}
+          return uikitUtil.clamp(uikitUtil.getIndex(index, this.slides, prev, this.finite), 0, this.maxIndex);
+        },
 
-                return promise;
+        getValidIndex(index, prevIndex) {if (index === void 0) {index = this.index;}if (prevIndex === void 0) {prevIndex = this.prevIndex;}
+          return this.getIndex(index, prevIndex);
+        },
 
-            },
+        _show(prev, next, force) {
+          this._transitioner = this._getTransitioner(prev, next, this.dir, {
+            easing: force ?
+            next.offsetWidth < 600 ?
+            'cubic-bezier(0.25, 0.46, 0.45, 0.94)' /* easeOutQuad */ :
+            'cubic-bezier(0.165, 0.84, 0.44, 1)' /* easeOutQuart */ :
+            this.easing,
+            ...this.transitionOptions });
 
-            getIndex: function(index, prev) {
-                if ( index === void 0 ) index = this.index;
-                if ( prev === void 0 ) prev = this.index;
 
-                return uikitUtil.clamp(uikitUtil.getIndex(index, this.slides, prev, this.finite), 0, this.maxIndex);
-            },
+          if (!force && !prev) {
+            this._translate(1);
+            return Promise.resolve();
+          }
 
-            getValidIndex: function(index, prevIndex) {
-                if ( index === void 0 ) index = this.index;
-                if ( prevIndex === void 0 ) prevIndex = this.prevIndex;
+          const { length } = this.stack;
+          return this._transitioner[length > 1 ? 'forward' : 'show'](
+          length > 1 ? Math.min(this.duration, 75 + 75 / (length - 1)) : this.duration,
+          this.percent);
 
-                return this.getIndex(index, prevIndex);
-            },
+        },
 
-            _show: function(prev, next, force) {
+        _getDistance(prev, next) {
+          return this._getTransitioner(prev, prev !== next && next).getDistance();
+        },
 
-                this._transitioner = this._getTransitioner(
-                    prev,
-                    next,
-                    this.dir,
-                    uikitUtil.assign({
-                        easing: force
-                            ? next.offsetWidth < 600
-                                ? 'cubic-bezier(0.25, 0.46, 0.45, 0.94)' /* easeOutQuad */
-                                : 'cubic-bezier(0.165, 0.84, 0.44, 1)' /* easeOutQuart */
-                            : this.easing
-                    }, this.transitionOptions)
-                );
+        _translate(percent, prev, next) {if (prev === void 0) {prev = this.prevIndex;}if (next === void 0) {next = this.index;}
+          const transitioner = this._getTransitioner(prev !== next ? prev : false, next);
+          transitioner.translate(percent);
+          return transitioner;
+        },
 
-                if (!force && !prev) {
-                    this._translate(1);
-                    return uikitUtil.Promise.resolve();
-                }
+        _getTransitioner(
+        prev,
+        next,
+        dir,
+        options)
+        {if (prev === void 0) {prev = this.prevIndex;}if (next === void 0) {next = this.index;}if (dir === void 0) {dir = this.dir || 1;}if (options === void 0) {options = this.transitionOptions;}
+          return new this.Transitioner(
+          uikitUtil.isNumber(prev) ? this.slides[prev] : prev,
+          uikitUtil.isNumber(next) ? this.slides[next] : next,
+          dir * (uikitUtil.isRtl ? -1 : 1),
+          options);
 
-                var ref = this.stack;
-                var length = ref.length;
-                return this._transitioner[length > 1 ? 'forward' : 'show'](length > 1 ? Math.min(this.duration, 75 + 75 / (length - 1)) : this.duration, this.percent);
-
-            },
-
-            _getDistance: function(prev, next) {
-                return this._getTransitioner(prev, prev !== next && next).getDistance();
-            },
-
-            _translate: function(percent, prev, next) {
-                if ( prev === void 0 ) prev = this.prevIndex;
-                if ( next === void 0 ) next = this.index;
-
-                var transitioner = this._getTransitioner(prev !== next ? prev : false, next);
-                transitioner.translate(percent);
-                return transitioner;
-            },
-
-            _getTransitioner: function(prev, next, dir, options) {
-                if ( prev === void 0 ) prev = this.prevIndex;
-                if ( next === void 0 ) next = this.index;
-                if ( dir === void 0 ) dir = this.dir || 1;
-                if ( options === void 0 ) options = this.transitionOptions;
-
-                return new this.Transitioner(
-                    uikitUtil.isNumber(prev) ? this.slides[prev] : prev,
-                    uikitUtil.isNumber(next) ? this.slides[next] : next,
-                    dir * (uikitUtil.isRtl ? -1 : 1),
-                    options
-                );
-            }
+        } } };
 
-        }
 
-    };
 
     function getDirection(index, prevIndex) {
-        return index === 'next'
-            ? 1
-            : index === 'previous'
-                ? -1
-                : index < prevIndex
-                    ? -1
-                    : 1;
+      return index === 'next' ? 1 : index === 'previous' ? -1 : index < prevIndex ? -1 : 1;
     }
 
     function speedUp(x) {
-        return .5 * x + 300; // parabola through (400,500; 600,600; 1800,1200)
+      return 0.5 * x + 300; // parabola through (400,500; 600,600; 1800,1200)
     }
 
     var Slideshow = {
+      mixins: [Slider],
 
-        mixins: [Slider],
+      props: {
+        animation: String },
 
-        props: {
-            animation: String
-        },
 
-        data: {
-            animation: 'slide',
-            clsActivated: 'uk-transition-active',
-            Animations: Animations$1,
-            Transitioner: Transitioner
-        },
+      data: {
+        animation: 'slide',
+        clsActivated: 'uk-transition-active',
+        Animations: Animations$1,
+        Transitioner },
 
-        computed: {
 
-            animation: function(ref) {
-                var animation = ref.animation;
-                var Animations = ref.Animations;
+      computed: {
+        animation(_ref) {let { animation, Animations } = _ref;
+          return { ...(Animations[animation] || Animations.slide), name: animation };
+        },
 
-                return uikitUtil.assign(Animations[animation] || Animations.slide, {name: animation});
-            },
+        transitionOptions() {
+          return { animation: this.animation };
+        } },
 
-            transitionOptions: function() {
-                return {animation: this.animation};
-            }
 
+      events: {
+        beforeitemshow(_ref2) {let { target } = _ref2;
+          uikitUtil.addClass(target, this.clsActive);
         },
 
-        events: {
+        itemshown(_ref3) {let { target } = _ref3;
+          uikitUtil.addClass(target, this.clsActivated);
+        },
 
-            'itemshow itemhide itemshown itemhidden': function(ref) {
-                var target = ref.target;
+        itemhidden(_ref4) {let { target } = _ref4;
+          uikitUtil.removeClass(target, this.clsActive, this.clsActivated);
+        } } };
 
-                this.$update(target);
-            },
+    var Animations = {
+      ...Animations$1,
+      fade: {
+        show() {
+          return [{ opacity: 0, zIndex: 0 }, { zIndex: -1 }];
+        },
 
-            beforeitemshow: function(ref) {
-                var target = ref.target;
+        percent(current) {
+          return 1 - uikitUtil.css(current, 'opacity');
+        },
 
-                uikitUtil.addClass(target, this.clsActive);
-            },
+        translate(percent) {
+          return [{ opacity: 1 - percent, zIndex: 0 }, { zIndex: -1 }];
+        } },
 
-            itemshown: function(ref) {
-                var target = ref.target;
 
-                uikitUtil.addClass(target, this.clsActivated);
-            },
+      scale: {
+        show() {
+          return [{ opacity: 0, transform: scale3d(1 + 0.5), zIndex: 0 }, { zIndex: -1 }];
+        },
 
-            itemhidden: function(ref) {
-                var target = ref.target;
+        percent(current) {
+          return 1 - uikitUtil.css(current, 'opacity');
+        },
 
-                uikitUtil.removeClass(target, this.clsActive, this.clsActivated);
-            }
+        translate(percent) {
+          return [
+          { opacity: 1 - percent, transform: scale3d(1 + 0.5 * percent), zIndex: 0 },
+          { zIndex: -1 }];
 
-        }
+        } },
 
-    };
 
-    var Animations = uikitUtil.assign({}, Animations$1, {
+      pull: {
+        show(dir) {
+          return dir < 0 ?
+          [
+          { transform: translate(30), zIndex: -1 },
+          { transform: translate(), zIndex: 0 }] :
 
-        fade: {
+          [
+          { transform: translate(-100), zIndex: 0 },
+          { transform: translate(), zIndex: -1 }];
 
-            show: function() {
-                return [
-                    {opacity: 0, zIndex: 0},
-                    {zIndex: -1}
-                ];
-            },
+        },
 
-            percent: function(current) {
-                return 1 - uikitUtil.css(current, 'opacity');
-            },
+        percent(current, next, dir) {
+          return dir < 0 ? 1 - translated(next) : translated(current);
+        },
 
-            translate: function(percent) {
-                return [
-                    {opacity: 1 - percent, zIndex: 0},
-                    {zIndex: -1}
-                ];
-            }
+        translate(percent, dir) {
+          return dir < 0 ?
+          [
+          { transform: translate(30 * percent), zIndex: -1 },
+          { transform: translate(-100 * (1 - percent)), zIndex: 0 }] :
 
-        },
+          [
+          { transform: translate(-percent * 100), zIndex: 0 },
+          { transform: translate(30 * (1 - percent)), zIndex: -1 }];
 
-        scale: {
+        } },
 
-            show: function() {
-                return [
-                    {opacity: 0, transform: scale3d(1 + .5), zIndex: 0},
-                    {zIndex: -1}
-                ];
-            },
 
-            percent: function(current) {
-                return 1 - uikitUtil.css(current, 'opacity');
-            },
+      push: {
+        show(dir) {
+          return dir < 0 ?
+          [
+          { transform: translate(100), zIndex: 0 },
+          { transform: translate(), zIndex: -1 }] :
 
-            translate: function(percent) {
-                return [
-                    {opacity: 1 - percent, transform: scale3d(1 + .5 * percent), zIndex: 0},
-                    {zIndex: -1}
-                ];
-            }
+          [
+          { transform: translate(-30), zIndex: -1 },
+          { transform: translate(), zIndex: 0 }];
 
         },
 
-        pull: {
-
-            show: function(dir) {
-                return dir < 0
-                    ? [
-                        {transform: translate(30), zIndex: -1},
-                        {transform: translate(), zIndex: 0}
-                    ]
-                    : [
-                        {transform: translate(-100), zIndex: 0},
-                        {transform: translate(), zIndex: -1}
-                    ];
-            },
-
-            percent: function(current, next, dir) {
-                return dir < 0
-                    ? 1 - translated(next)
-                    : translated(current);
-            },
-
-            translate: function(percent, dir) {
-                return dir < 0
-                    ? [
-                        {transform: translate(30 * percent), zIndex: -1},
-                        {transform: translate(-100 * (1 - percent)), zIndex: 0}
-                    ]
-                    : [
-                        {transform: translate(-percent * 100), zIndex: 0},
-                        {transform: translate(30 * (1 - percent)), zIndex: -1}
-                    ];
-            }
-
+        percent(current, next, dir) {
+          return dir > 0 ? 1 - translated(next) : translated(current);
         },
 
-        push: {
-
-            show: function(dir) {
-                return dir < 0
-                    ? [
-                        {transform: translate(100), zIndex: 0},
-                        {transform: translate(), zIndex: -1}
-                    ]
-                    : [
-                        {transform: translate(-30), zIndex: -1},
-                        {transform: translate(), zIndex: 0}
-                    ];
-            },
-
-            percent: function(current, next, dir) {
-                return dir > 0
-                    ? 1 - translated(next)
-                    : translated(current);
-            },
-
-            translate: function(percent, dir) {
-                return dir < 0
-                    ? [
-                        {transform: translate(percent * 100), zIndex: 0},
-                        {transform: translate(-30 * (1 - percent)), zIndex: -1}
-                    ]
-                    : [
-                        {transform: translate(-30 * percent), zIndex: -1},
-                        {transform: translate(100 * (1 - percent)), zIndex: 0}
-                    ];
-            }
+        translate(percent, dir) {
+          return dir < 0 ?
+          [
+          { transform: translate(percent * 100), zIndex: 0 },
+          { transform: translate(-30 * (1 - percent)), zIndex: -1 }] :
 
-        }
+          [
+          { transform: translate(-30 * percent), zIndex: -1 },
+          { transform: translate(100 * (1 - percent)), zIndex: 0 }];
 
-    });
+        } } };
 
     var SliderReactive = {
+      update: {
+        write() {
+          if (this.stack.length || this.dragging) {
+            return;
+          }
 
-        update: {
+          const index = this.getValidIndex(this.index);
 
-            write: function() {
-
-                if (this.stack.length || this.dragging) {
-                    return;
-                }
-
-                var index = this.getValidIndex(this.index);
+          if (!~this.prevIndex || this.index !== index) {
+            this.show(index);
+          }
+        },
 
-                if (!~this.prevIndex || this.index !== index) {
-                    this.show(index);
-                }
+        events: ['resize'] } };
 
-            },
+    var Lazyload = {
+      methods: {
+        lazyload(observeTargets, targets) {if (observeTargets === void 0) {observeTargets = this.$el;}if (targets === void 0) {targets = this.$el;}
+          this.registerObserver(
+          uikitUtil.observeIntersection(observeTargets, (entries, observer) => {
+            for (const el of uikitUtil.toNodes(uikitUtil.isFunction(targets) ? targets() : targets)) {
+              uikitUtil.$$('[loading="lazy"]', el).forEach((el) => uikitUtil.removeAttr(el, 'loading'));
+            }
+            for (const el of entries.
+            filter((_ref) => {let { isIntersecting } = _ref;return isIntersecting;}).
+            map((_ref2) => {let { target } = _ref2;return target;})) {
+              observer.unobserve(el);
+            }
+          }));
 
-            events: ['resize']
+        } } };
 
-        }
+    var SliderPreload = {
+      mixins: [Lazyload],
 
-    };
+      connected() {
+        this.lazyload(this.slides, this.getAdjacentSlides);
+      } };
 
     var Component = {
+      mixins: [Class, Slideshow, SliderReactive, SliderPreload],
 
-        mixins: [Class, Slideshow, SliderReactive],
-
-        props: {
-            ratio: String,
-            minHeight: Number,
-            maxHeight: Number
-        },
-
-        data: {
-            ratio: '16:9',
-            minHeight: false,
-            maxHeight: false,
-            selList: '.uk-slideshow-items',
-            attrItem: 'uk-slideshow-item',
-            selNav: '.uk-slideshow-nav',
-            Animations: Animations
-        },
+      props: {
+        ratio: String,
+        minHeight: Number,
+        maxHeight: Number },
 
-        update: {
 
-            read: function() {
+      data: {
+        ratio: '16:9',
+        minHeight: false,
+        maxHeight: false,
+        selList: '.uk-slideshow-items',
+        attrItem: 'uk-slideshow-item',
+        selNav: '.uk-slideshow-nav',
+        Animations },
 
-                if (!this.list) {
-                    return false;
-                }
 
-                var ref = this.ratio.split(':').map(Number);
-                var width = ref[0];
-                var height = ref[1];
+      update: {
+        read() {
+          if (!this.list) {
+            return false;
+          }
 
-                height = height * this.list.offsetWidth / width || 0;
+          let [width, height] = this.ratio.split(':').map(Number);
 
-                if (this.minHeight) {
-                    height = Math.max(this.minHeight, height);
-                }
+          height = height * this.list.offsetWidth / width || 0;
 
-                if (this.maxHeight) {
-                    height = Math.min(this.maxHeight, height);
-                }
+          if (this.minHeight) {
+            height = Math.max(this.minHeight, height);
+          }
 
-                return {height: height - uikitUtil.boxModelAdjust(this.list, 'height', 'content-box')};
-            },
+          if (this.maxHeight) {
+            height = Math.min(this.maxHeight, height);
+          }
 
-            write: function(ref) {
-                var height = ref.height;
+          return { height: height - uikitUtil.boxModelAdjust(this.list, 'height', 'content-box') };
+        },
 
-                height > 0 && uikitUtil.css(this.list, 'minHeight', height);
-            },
+        write(_ref) {let { height } = _ref;
+          height > 0 && uikitUtil.css(this.list, 'minHeight', height);
+        },
 
-            events: ['resize']
+        events: ['resize'] },
 
-        }
 
-    };
+      methods: {
+        getAdjacentSlides() {
+          return [1, -1].map((i) => this.slides[this.getIndex(this.index + i)]);
+        } } };
 
     if (typeof window !== 'undefined' && window.UIkit) {
-        window.UIkit.component('slideshow', Component);
+      window.UIkit.component('slideshow', Component);
     }
 
     return Component;