uikit 3.15.11-dev.fd61e70ff → 3.15.12-dev.0c0d42cdf

package/dist/js/uikit.js

@@ -1,4 +1,4 @@
-/*! UIkit 3.15.11-dev.fd61e70ff | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
+/*! UIkit 3.15.12-dev.0c0d42cdf | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
 
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -215,8 +215,8 @@
         [aProp]: dimensions[prop] ?
         Math.round(value * dimensions[aProp] / dimensions[prop]) :
         dimensions[aProp],
-        [prop]: value };
-
+        [prop]: value
+      };
     }
 
     function contain(dimensions, maxDimensions) {
@@ -284,7 +284,8 @@
           this.reject = reject;
           this.resolve = resolve;
         });
-      }}
+      }
+    }
 
     function attr(element, name, value) {
       if (isObject(name)) {
@@ -348,8 +349,8 @@
       param: true,
       source: true,
       track: true,
-      wbr: true };
-
+      wbr: true
+    };
     function isVoidElement(element) {
       return toNodes(element).some((element) => voidElements[element.tagName.toLowerCase()]);
     }
@@ -666,8 +667,8 @@
         xhr: new XMLHttpRequest(),
         beforeSend: noop,
         responseType: '',
-        ...options };
-
+        ...options
+      };
       return Promise.resolve().
       then(() => env.beforeSend(env)).
       then(() => send(url, env));
@@ -700,8 +701,8 @@
             reject(
             assign(Error(xhr.statusText), {
               xhr,
-              status: xhr.status }));
-
+              status: xhr.status
+            }));
 
           }
         });
@@ -745,8 +746,8 @@
       'stroke-dashoffset': true,
       widows: true,
       'z-index': true,
-      zoom: true };
-
+      zoom: true
+    };
 
     function css(element, property, value, priority) {if (priority === void 0) {priority = '';}
       const elements = toNodes(element);
@@ -879,8 +880,8 @@
           css(element, {
             transitionProperty: '',
             transitionDuration: '',
-            transitionTimingFunction: '' });
-
+            transitionTimingFunction: ''
+          });
           type === 'transitioncanceled' ? reject() : resolve(element);
         },
         { self: true });
@@ -891,8 +892,8 @@
           transitionProperty: Object.keys(props).map(propName).join(','),
           transitionDuration: duration + "ms",
           transitionTimingFunction: timing,
-          ...props });
-
+          ...props
+        });
       })));
 
 
@@ -913,8 +914,8 @@
 
       inProgress(element) {
         return hasClass(element, 'uk-transition');
-      } };
-
+      }
+    };
 
     const animationPrefix = 'uk-animation-';
 
@@ -967,12 +968,13 @@
 
       cancel(element) {
         trigger(element, 'animationcanceled');
-      } };
+      }
+    };
 
     const dirs$1 = {
       width: ['left', 'right'],
-      height: ['top', 'bottom'] };
-
+      height: ['top', 'bottom']
+    };
 
     function dimensions$1(element) {
       const rect = isElement(element) ?
@@ -985,8 +987,8 @@
         top: rect.top,
         left: rect.left,
         bottom: rect.top + rect.height,
-        right: rect.left + rect.width };
-
+        right: rect.left + rect.width
+      };
     }
 
     function offset(element, coordinates) {
@@ -1025,8 +1027,8 @@
 
       const {
         ownerDocument: { body, documentElement },
-        offsetParent } =
-      toNode(element);
+        offsetParent
+      } = toNode(element);
       let parent = offsetParent || documentElement;
 
       while (
@@ -1045,8 +1047,8 @@
 
       return {
         top: top - toFloat(css(element, 'marginTop')),
-        left: left - toFloat(css(element, 'marginLeft')) };
-
+        left: left - toFloat(css(element, 'marginLeft'))
+      };
     }
 
     function offsetPosition(element) {
@@ -1278,7 +1280,7 @@
     }
 
     const inBrowser = typeof window !== 'undefined';
-    const isRtl = inBrowser && attr(document.documentElement, 'dir') === 'rtl';
+    const isRtl = inBrowser && document.dir === 'rtl';
 
     const hasTouch = inBrowser && 'ontouchstart' in window;
     const hasPointerEvents = inBrowser && window.PointerEvent;
@@ -1317,8 +1319,8 @@
         remove(this.writes, task);
       },
 
-      flush };
-
+      flush
+    };
 
     function flush(recursion) {
       runTasks(fastdom.reads);
@@ -1420,8 +1422,8 @@
           const intersection = intersect(path, diagonal);
           return intersection && pointInRect(intersection, p);
         });
-      } };
-
+      }
+    };
 
     // Inspired by http://paulbourke.net/geometry/pointlineplane/
     function intersect(_ref, _ref2) {let [{ x: x1, y: y1 }, { x: x2, y: y2 }] = _ref;let [{ x: x3, y: y3 }, { x: x4, y: y4 }] = _ref2;
@@ -1473,8 +1475,8 @@
       return {
         disconnect() {
           listeners.delete(cb);
-        } };
-
+        }
+      };
     }
 
     let listeners;
@@ -1778,8 +1780,8 @@
           top: top - offsetTop,
           left: left - offsetLeft,
           bottom: bottom + offsetTop,
-          right: right + offsetLeft };
-
+          right: right + offsetLeft
+        };
       }).
       concat(offset(element)));
 
@@ -1889,8 +1891,8 @@
     function offsetViewport(scrollElement) {
       const window = toWindow(scrollElement);
       const {
-        document: { documentElement } } =
-      window;
+        document: { documentElement }
+      } = window;
       let viewportElement =
       scrollElement === scrollingElement(scrollElement) ? window : scrollElement;
 
@@ -1933,12 +1935,12 @@
         attach: {
           element: ['left', 'top'],
           target: ['left', 'top'],
-          ...options.attach },
-
+          ...options.attach
+        },
         offset: [0, 0],
         placement: [],
-        ...options };
-
+        ...options
+      };
 
       if (!isArray(target)) {
         target = [target, target];
@@ -1953,7 +1955,7 @@
 
       let offsetPosition = position;
       for (const [i, [prop,, start, end]] of Object.entries(dirs)) {
-        const viewport = getViewport$1(target[i], viewportOffset, boundary, i);
+        const viewport = getViewport$2(element, target[i], viewportOffset, boundary, i);
 
         if (isWithin(position, viewport, i)) {
           continue;
@@ -1973,7 +1975,7 @@
 
           offsetBy = flip(element, target, options, i)[start] - position[start];
 
-          const scrollArea = getScrollArea(target[i], viewportOffset, i);
+          const scrollArea = getScrollArea(element, target[i], viewportOffset, i);
 
           if (!isWithin(applyOffset(position, offsetBy, i), scrollArea, i)) {
             if (isWithin(position, scrollArea, i)) {
@@ -2016,11 +2018,11 @@
         attach: {
           element: ['left', 'top'],
           target: ['left', 'top'],
-          ...options.attach },
-
+          ...options.attach
+        },
         offset: [0, 0],
-        ...options };
-
+        ...options
+      };
 
       let elOffset = offset(element);
 
@@ -2053,8 +2055,8 @@
       return attach === 'center' ? dim / 2 : attach === end ? dim : 0;
     }
 
-    function getViewport$1(element, viewportOffset, boundary, i) {
-      let viewport = getIntersectionArea(...scrollParents(element).map(offsetViewport));
+    function getViewport$2(element, target, viewportOffset, boundary, i) {
+      let viewport = getIntersectionArea(...commonScrollParents(element, target).map(offsetViewport));
 
       if (viewportOffset) {
         viewport[dirs[i][2]] += viewportOffset;
@@ -2071,15 +2073,19 @@
       return viewport;
     }
 
-    function getScrollArea(element, viewportOffset, i) {
+    function getScrollArea(element, target, viewportOffset, i) {
       const [prop,, start, end] = dirs[i];
-      const [scrollElement] = scrollParents(element);
+      const [scrollElement] = commonScrollParents(element, target);
       const viewport = offsetViewport(scrollElement);
       viewport[start] -= scrollElement["scroll" + ucfirst(start)] - viewportOffset;
       viewport[end] = viewport[start] + scrollElement["scroll" + ucfirst(prop)] - viewportOffset;
       return viewport;
     }
 
+    function commonScrollParents(element, target) {
+      return scrollParents(target).filter((parent) => within(element, parent));
+    }
+
     function getIntersectionArea() {
       let area = {};for (var _len = arguments.length, rects = new Array(_len), _key = 0; _key < _len; _key++) {rects[_key] = arguments[_key];}
       for (const rect of rects) {
@@ -2100,10 +2106,10 @@
       return attachTo(element, target, {
         attach: {
           element: flipAttach(attach.element, i),
-          target: flipAttach(attach.target, i) },
-
-        offset: flipOffset(offset, i) });
-
+          target: flipAttach(attach.target, i)
+        },
+        offset: flipOffset(offset, i)
+      });
     }
 
     function flipAxis(element, target, options) {
@@ -2111,12 +2117,12 @@
         ...options,
         attach: {
           element: options.attach.element.map(flipAttachAxis).reverse(),
-          target: options.attach.target.map(flipAttachAxis).reverse() },
-
+          target: options.attach.target.map(flipAttachAxis).reverse()
+        },
         offset: options.offset.reverse(),
         placement: options.placement.reverse(),
-        recursion: true });
-
+        recursion: true
+      });
     }
 
     function flipAttach(attach, i) {
@@ -2340,8 +2346,8 @@
 
         set(element) {
           container = $(element);
-        } });
-
+        }
+      });
 
       function update(data, e) {
         if (!data) {
@@ -2463,8 +2469,8 @@
 
       function runWatches(initial) {
         const {
-          $options: { computed } } =
-        this;
+          $options: { computed }
+        } = this;
         const values = { ...this._computed };
         this._computed = {};
 
@@ -2642,8 +2648,8 @@
           if (isUndefined(_computed[key])) {
             delete _computed[key];
           }
-        } });
-
+        }
+      });
     }
 
     function registerEvent(component, event, key) {
@@ -2740,8 +2746,8 @@
       const observer = new MutationObserver(() => component._callWatches());
       observer.observe(el, {
         childList: true,
-        subtree: true });
-
+        subtree: true
+      });
 
       return observer;
     }
@@ -2773,8 +2779,8 @@
 
       observer.observe(el, {
         attributes: true,
-        attributeFilter: filter.concat(filter.map((key) => "data-" + key)) });
-
+        attributeFilter: filter.concat(filter.map((key) => "data-" + key))
+      });
 
       return observer;
     }
@@ -2944,7 +2950,7 @@
     UIkit.data = '__uikit__';
     UIkit.prefix = 'uk-';
     UIkit.options = {};
-    UIkit.version = '3.15.11-dev.fd61e70ff';
+    UIkit.version = '3.15.12-dev.0c0d42cdf';
 
     globalAPI(UIkit);
     hooksAPI(UIkit);
@@ -2960,6 +2966,8 @@
       }
 
       requestAnimationFrame(function () {
+        trigger(document, 'uikit:init', UIkit);
+
         if (document.body) {
           apply(document.body, connect);
         }
@@ -2968,16 +2976,16 @@
         document,
         {
           childList: true,
-          subtree: true });
-
+          subtree: true
+        });
 
 
         new MutationObserver((records) => records.forEach(applyAttributeMutation)).observe(
         document,
         {
           attributes: true,
-          subtree: true });
-
+          subtree: true
+        });
 
 
         UIkit._initialized = true;
@@ -3010,12 +3018,13 @@
     var Class = {
       connected() {
         addClass(this.$el, this.$options.id);
-      } };
+      }
+    };
 
     var Lazyload = {
       data: {
-        preload: 5 },
-
+        preload: 5
+      },
 
       methods: {
         lazyload(observeTargets, targets) {if (observeTargets === void 0) {observeTargets = this.$el;}if (targets === void 0) {targets = this.$el;}
@@ -3034,7 +3043,9 @@
             }
           }));
 
-        } } };
+        }
+      }
+    };
 
     var Togglable = {
       props: {
@@ -3043,8 +3054,8 @@
         duration: Number,
         velocity: Number,
         origin: String,
-        transition: String },
-
+        transition: String
+      },
 
       data: {
         cls: false,
@@ -3054,8 +3065,8 @@
         origin: false,
         transition: 'ease',
         clsEnter: 'uk-togglabe-enter',
-        clsLeave: 'uk-togglabe-leave' },
-
+        clsLeave: 'uk-togglabe-leave'
+      },
 
       computed: {
         hasAnimation(_ref) {let { animation } = _ref;
@@ -3064,8 +3075,8 @@
 
         hasTransition(_ref2) {let { animation } = _ref2;
           return ['slide', 'reveal'].some((transition) => startsWith(animation[0], transition));
-        } },
-
+        }
+      },
 
       methods: {
         toggleElement(targets, toggle, animate) {
@@ -3142,9 +3153,9 @@
           if (changed) {
             trigger(el, 'toggled', [toggled, this]);
           }
-        } } };
-
-
+        }
+      }
+    };
 
     function toggleInstant(el, show, _ref3) {let { _toggle } = _ref3;
       Animation.cancel(el);
@@ -3216,9 +3227,9 @@
         'borderBottom',
         'borderLeft',
         'borderImage',
-        marginStartProp]) });
-
+        marginStartProp])
 
+      });
 
       css(el, {
         padding: 0,
@@ -3229,8 +3240,8 @@
         width: dim.width,
         height: dim.height,
         overflow: 'hidden',
-        [dimProp]: currentDim });
-
+        [dimProp]: currentDim
+      });
 
       const percent = currentDim / endDim;
       duration = (velocity * endDim + duration) * (show ? 1 - percent : percent);
@@ -3284,8 +3295,8 @@
         multiple: Boolean,
         toggle: String,
         content: String,
-        offset: Number },
-
+        offset: Number
+      },
 
       data: {
         targets: '> *',
@@ -3296,8 +3307,8 @@
         clsOpen: 'uk-open',
         toggle: '> .uk-accordion-title',
         content: '> .uk-accordion-content',
-        offset: 0 },
-
+        offset: 0
+      },
 
       computed: {
         items: {
@@ -3319,8 +3330,8 @@
             }
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         toggles(_ref2) {let { toggle } = _ref2;
           return this.items.map((item) => $(toggle, item));
@@ -3343,9 +3354,9 @@
             }
           },
 
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       connected() {
         this.lazyload();
@@ -3366,8 +3377,8 @@
           this._off = keepScrollPosition(e.target);
           await this.toggle(index(this.toggles, e.current));
           this._off();
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -3399,9 +3410,9 @@
           })));
 
 
-        } } };
-
-
+        }
+      }
+    };
 
     function hide(el, hide) {
       el && (el.hidden = hide);
@@ -3462,14 +3473,14 @@
 
       props: {
         animation: Boolean,
-        close: String },
-
+        close: String
+      },
 
       data: {
         animation: true,
         selClose: '.uk-alert-close',
-        duration: 150 },
-
+        duration: 150
+      },
 
       events: {
         name: 'click',
@@ -3481,16 +3492,16 @@
         handler(e) {
           e.preventDefault();
           this.close();
-        } },
-
+        }
+      },
 
       methods: {
         async close() {
           await this.toggleElement(this.$el, false, animate$1);
           this.$destroy(true);
-        } } };
-
-
+        }
+      }
+    };
 
     function animate$1(el, show, _ref) {let { duration, transition, velocity } = _ref;
       const height = toFloat(css(el, 'height'));
@@ -3505,8 +3516,8 @@
         paddingBottom: 0,
         borderTop: 0,
         borderBottom: 0,
-        opacity: 0 },
-
+        opacity: 0
+      },
       velocity * height + duration,
       transition);
 
@@ -3517,13 +3528,13 @@
 
       props: {
         automute: Boolean,
-        autoplay: Boolean },
-
+        autoplay: Boolean
+      },
 
       data: {
         automute: false,
-        autoplay: true },
-
+        autoplay: true
+      },
 
       connected() {
         this.inView = this.autoplay === 'inview';
@@ -3544,24 +3555,27 @@
       },
 
       update: {
-        read() {
+        read(_ref) {let { visible } = _ref;
           if (!isVideo(this.$el)) {
             return false;
           }
 
           return {
+            prev: visible,
             visible: isVisible(this.$el) && css(this.$el, 'visibility') !== 'hidden',
-            inView: this.inView && isInView(this.$el) };
-
+            inView: this.inView && isInView(this.$el)
+          };
         },
 
-        write(_ref) {let { visible, inView } = _ref;
+        write(_ref2) {let { prev, visible, inView } = _ref2;
           if (!visible || this.inView && !inView) {
             pause(this.$el);
-          } else if (this.autoplay === true || this.inView && inView) {
+          } else if (this.autoplay === true && !prev || this.inView && inView) {
             play(this.$el);
           }
-        } } };
+        }
+      }
+    };
 
     var Resize = {
       connected() {var _this$$options$resize;
@@ -3570,25 +3584,26 @@
         this.$emit('resize')));
 
 
-      } };
+      }
+    };
 
     var cover = {
       mixins: [Resize, Video],
 
       props: {
         width: Number,
-        height: Number },
-
+        height: Number
+      },
 
       data: {
-        automute: true },
-
+        automute: true
+      },
 
       events: {
         'load loadedmetadata'() {
           this.$emit('resize');
-        } },
-
+        }
+      },
 
       resizeTargets() {
         return [this.$el, getPositionedParent(this.$el) || parent(this.$el)];
@@ -3604,8 +3619,8 @@
           if (!dim.width || !dim.height) {
             const intrinsic = {
               width: $el.naturalWidth || $el.videoWidth || $el.clientWidth,
-              height: $el.naturalHeight || $el.videoHeight || $el.clientHeight };
-
+              height: $el.naturalHeight || $el.videoHeight || $el.clientHeight
+            };
 
             if (dim.width) {
               dim = ratio(intrinsic, 'width', dim.width);
@@ -3620,8 +3635,8 @@
           getPositionedParent($el) || parent($el);
           const coverDim = cover(dim, {
             width: coverWidth + (coverWidth % 2 ? 1 : 0),
-            height: coverHeight + (coverHeight % 2 ? 1 : 0) });
-
+            height: coverHeight + (coverHeight % 2 ? 1 : 0)
+          });
 
           if (!coverDim.width || !coverDim.height) {
             return false;
@@ -3634,9 +3649,9 @@
           css(this.$el, { height, width });
         },
 
-        events: ['resize'] } };
-
-
+        events: ['resize']
+      }
+    };
 
     function getPositionedParent(el) {
       while (el = parent(el)) {
@@ -3648,17 +3663,19 @@
 
     var Container = {
       props: {
-        container: Boolean },
-
+        container: Boolean
+      },
 
       data: {
-        container: true },
-
+        container: true
+      },
 
       computed: {
         container(_ref) {let { container } = _ref;
           return container === true && this.$container || container && $(container);
-        } } };
+        }
+      }
+    };
 
     var Position = {
       props: {
@@ -3666,16 +3683,16 @@
         offset: null,
         flip: Boolean,
         shift: Boolean,
-        inset: Boolean },
-
+        inset: Boolean
+      },
 
       data: {
         pos: "bottom-" + (isRtl ? 'right' : 'left'),
         offset: false,
         flip: true,
         shift: true,
-        inset: false },
-
+        inset: false
+      },
 
       connected() {
         this.pos = this.$props.pos.split('-').concat('center').slice(0, 2);
@@ -3690,8 +3707,8 @@
 
           const attach = {
             element: [this.inset ? this.dir : flipPosition(this.dir), this.align],
-            target: [this.dir, this.align] };
-
+            target: [this.dir, this.align]
+          };
 
           if (this.axis === 'y') {
             for (const prop in attach) {
@@ -3713,8 +3730,8 @@
             offset,
             boundary,
             placement,
-            viewportOffset: this.getViewportOffset(element) });
-
+            viewportOffset: this.getViewportOffset(element)
+          });
 
           // Restore scroll position
           scrollElement.scrollTop = scrollTop;
@@ -3745,7 +3762,9 @@
 
         getViewportOffset(element) {
           return toPx(css(element, '--uk-position-viewport-offset'));
-        } } };
+        }
+      }
+    };
 
     var Style = {
       beforeConnect() {
@@ -3754,7 +3773,8 @@
 
       disconnected() {
         attr(this.$el, 'style', this._style);
-      } };
+      }
+    };
 
     const active$1 = [];
 
@@ -3766,16 +3786,16 @@
         selClose: String,
         escClose: Boolean,
         bgClose: Boolean,
-        stack: Boolean },
-
+        stack: Boolean
+      },
 
       data: {
         cls: 'uk-open',
         escClose: true,
         bgClose: true,
         overlay: true,
-        stack: false },
-
+        stack: false
+      },
 
       computed: {
         panel(_ref, $el) {let { selPanel } = _ref;
@@ -3788,8 +3808,8 @@
 
         bgClose(_ref2) {let { bgClose } = _ref2;
           return bgClose && this.panel;
-        } },
-
+        }
+      },
 
       beforeDisconnect() {
         if (includes(active$1, this)) {
@@ -3808,8 +3828,8 @@
         handler(e) {
           e.preventDefault();
           this.hide();
-        } },
-
+        }
+      },
 
       {
         name: 'click',
@@ -3829,8 +3849,8 @@
           {
             this.hide();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'toggle',
@@ -3847,8 +3867,8 @@
           if (this.isToggled() === includes(active$1, this)) {
             this.toggle();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'beforeshow',
@@ -3866,8 +3886,8 @@
           } else {
             active$1.push(this);
           }
-        } },
-
+        }
+      },
 
       {
         name: 'show',
@@ -3940,8 +3960,8 @@
             { self: true });
 
           }
-        } },
-
+        }
+      },
 
       {
         name: 'shown',
@@ -3956,8 +3976,8 @@
           if (!$(':focus', this.$el)) {
             this.$el.focus();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'hidden',
@@ -3974,8 +3994,8 @@
           if (!active$1.some((modal) => modal.clsPage === this.clsPage)) {
             removeClass(document.documentElement, this.clsPage);
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -3996,9 +4016,9 @@
 
         hide() {
           return this.toggleElement(this.$el, false, animate);
-        } } };
-
-
+        }
+      }
+    };
 
     function animate(el, show, _ref6) {let { transitionElement, _toggle } = _ref6;
       return new Promise((resolve, reject) =>
@@ -4013,8 +4033,8 @@
         'transitionstart',
         () => {
           once(transitionElement, 'transitionend transitioncancel', resolve, {
-            self: true });
-
+            self: true
+          });
           clearTimeout(timer);
         },
         { self: true });
@@ -4095,8 +4115,8 @@
       css(scrollingElement, {
         overflowY: 'hidden',
         touchAction: 'none',
-        paddingRight: width(window) - scrollingElement.clientWidth });
-
+        paddingRight: width(window) - scrollingElement.clientWidth
+      });
       return () => {
         prevented = false;
         css(scrollingElement, { overflowY: '', touchAction: '', paddingRight: '' });
@@ -4139,8 +4159,8 @@
         autoUpdate: Boolean,
         clsDrop: String,
         animateOut: Boolean,
-        bgScroll: Boolean },
-
+        bgScroll: Boolean
+      },
 
       data: {
         mode: ['click', 'hover'],
@@ -4160,8 +4180,8 @@
         bgScroll: true,
         animation: ['uk-animation-fade'],
         cls: 'uk-open',
-        container: false },
-
+        container: false
+      },
 
       computed: {
         boundary(_ref, $el) {let { boundary, boundaryX, boundaryY } = _ref;
@@ -4179,8 +4199,8 @@
           targetX === true ? window : query(targetX, $el),
           targetY === true ? window : query(targetY, $el)];
 
-        } },
-
+        }
+      },
 
       created() {
         this.tracker = new MouseTracker();
@@ -4196,8 +4216,8 @@
         if (this.toggle && !this.targetEl) {
           this.targetEl = this.$create('toggle', query(this.toggle, this.$el), {
             target: this.$el,
-            mode: this.mode }).
-          $el;
+            mode: this.mode
+          }).$el;
           attr(this.targetEl, 'aria-haspopup', true);
           this.lazyload(this.targetEl);
         }
@@ -4221,8 +4241,8 @@
         handler(e) {
           e.preventDefault();
           this.hide(false);
-        } },
-
+        }
+      },
 
       {
         name: 'click',
@@ -4241,16 +4261,16 @@
           {
             this.hide(false);
           }
-        } },
-
+        }
+      },
 
       {
         name: 'beforescroll',
 
         handler() {
           this.hide(false);
-        } },
-
+        }
+      },
 
       {
         name: 'toggle',
@@ -4265,8 +4285,8 @@
           } else {
             this.show(toggle == null ? void 0 : toggle.$el, false);
           }
-        } },
-
+        }
+      },
 
       {
         name: 'toggleshow',
@@ -4276,8 +4296,8 @@
         handler(e, toggle) {
           e.preventDefault();
           this.show(toggle == null ? void 0 : toggle.$el);
-        } },
-
+        }
+      },
 
       {
         name: 'togglehide',
@@ -4289,8 +4309,8 @@
           if (!matches(this.$el, ':focus,:hover')) {
             this.hide();
           }
-        } },
-
+        }
+      },
 
       {
         name: pointerEnter + " focusin",
@@ -4303,8 +4323,8 @@
           if (!isTouch(e)) {
             this.clearTimers();
           }
-        } },
-
+        }
+      },
 
       {
         name: pointerLeave + " focusout",
@@ -4317,8 +4337,8 @@
           if (!isTouch(e) && e.relatedTarget) {
             this.hide();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'toggled',
@@ -4332,8 +4352,8 @@
 
           this.clearTimers();
           this.position();
-        } },
-
+        }
+      },
 
       {
         name: 'show',
@@ -4388,8 +4408,8 @@
           ...(this.autoUpdate ?
           [
           on([document, scrollParents(this.$el)], 'scroll', update, {
-            passive: true })] :
-
+            passive: true
+          })] :
 
           []),
 
@@ -4399,10 +4419,10 @@
 
 
           once(this.$el, 'hide', () => handlers.forEach((handler) => handler()), {
-            self: true });
-
-        } },
-
+            self: true
+          });
+        }
+      },
 
       {
         name: 'beforehide',
@@ -4411,8 +4431,8 @@
 
         handler() {
           this.clearTimers();
-        } },
-
+        }
+      },
 
       {
         name: 'hide',
@@ -4428,8 +4448,8 @@
 
           active = this.isActive() ? null : active;
           this.tracker.cancel();
-        } }],
-
+        }
+      }],
 
 
       update: {
@@ -4437,8 +4457,8 @@
           if (this.isToggled() && !hasClass(this.$el, this.clsEnter)) {
             this.position();
           }
-        } },
-
+        }
+      },
 
       methods: {
         show(target, delay) {if (target === void 0) {target = this.targetEl;}if (delay === void 0) {delay = true;}
@@ -4514,7 +4534,7 @@
           // Ensure none positioned element does not generate scrollbars
           this.$el.hidden = true;
 
-          const viewports = this.target.map((target) => offsetViewport(scrollParents(target)[0]));
+          const viewports = this.target.map((target) => getViewport$1(this.$el, target));
           const viewportOffset = this.getViewportOffset(this.$el);
 
           const dirs = [
@@ -4529,8 +4549,8 @@
                 offset(this.boundary[i])[prop],
                 viewports[i][prop] - 2 * viewportOffset),
 
-                ["overflow-" + axis]: 'auto' });
-
+                ["overflow-" + axis]: 'auto'
+              });
             }
           }
 
@@ -4564,15 +4584,15 @@
                 offset(this.boundary[i])[end],
                 viewports[i][end] - viewportOffset) -
                 targetOffset[end]) - positionOffset,
-                ["overflow-" + axis]: 'auto' });
-
+                ["overflow-" + axis]: 'auto'
+              });
 
               this.positionAt(this.$el, this.target, this.boundary);
             }
           }
-        } } };
-
-
+        }
+      }
+    };
 
     function getPositionedElements(el) {
       const result = [];
@@ -4580,18 +4600,22 @@
       return result;
     }
 
+    function getViewport$1(el, target) {
+      return offsetViewport(scrollParents(target).find((parent) => within(el, parent)));
+    }
+
     var formCustom = {
       mixins: [Class],
 
       args: 'target',
 
       props: {
-        target: Boolean },
-
+        target: Boolean
+      },
 
       data: {
-        target: false },
-
+        target: false
+      },
 
       computed: {
         input(_, $el) {
@@ -4608,8 +4632,8 @@
             target === true && parent(this.input) === $el && this.input.nextElementSibling ||
             $(target, $el)));
 
-        } },
-
+        }
+      },
 
       update() {var _input$files;
         const { target, input } = this;
@@ -4639,8 +4663,8 @@
 
         handler() {
           this.$emit();
-        } },
-
+        }
+      },
 
       {
         name: 'reset',
@@ -4651,20 +4675,23 @@
 
         handler() {
           this.$emit();
-        } }] };
+        }
+      }]
+
+    };
 
     var Margin = {
       mixins: [Resize],
 
       props: {
         margin: String,
-        firstColumn: Boolean },
-
+        firstColumn: Boolean
+      },
 
       data: {
         margin: 'uk-margin-small-top',
-        firstColumn: 'uk-first-column' },
-
+        firstColumn: 'uk-first-column'
+      },
 
       resizeTargets() {
         return [this.$el, ...toArray(this.$el.children)];
@@ -4673,8 +4700,10 @@
       connected() {
         this.registerObserver(
         observeMutation(this.$el, () => this.$reset(), {
-          childList: true }));
-
+          childList: true,
+          attributes: true,
+          attributeFilter: ['style']
+        }));
 
       },
 
@@ -4684,8 +4713,8 @@
 
           return {
             rows,
-            columns: getColumns(rows) };
-
+            columns: getColumns(rows)
+          };
         },
 
         write(_ref) {let { columns, rows } = _ref;
@@ -4697,9 +4726,9 @@
           }
         },
 
-        events: ['resize'] } };
-
-
+        events: ['resize']
+      }
+    };
 
     function getRows(items) {
       return sortBy(items, 'top', 'bottom');
@@ -4775,8 +4804,8 @@
         top: offsetTop,
         left: offsetLeft,
         bottom: offsetTop + offsetHeight,
-        right: offsetLeft + offsetWidth };
-
+        right: offsetLeft + offsetWidth
+      };
     }
 
     var Scroll = {
@@ -4786,8 +4815,8 @@
 
       disconnected() {
         unregisterScrollListener(this._uid);
-      } };
-
+      }
+    };
 
     const scrollListeners = new Map();
     let unbindScrollListener;
@@ -4796,8 +4825,8 @@
       unbindScrollListener ||
       on(window, 'scroll', () => scrollListeners.forEach((listener) => listener()), {
         passive: true,
-        capture: true });
-
+        capture: true
+      });
 
       scrollListeners.set(id, listener);
     }
@@ -4819,15 +4848,15 @@
 
       props: {
         masonry: Boolean,
-        parallax: Number },
-
+        parallax: Number
+      },
 
       data: {
         margin: 'uk-grid-margin',
         clsStack: 'uk-grid-stack',
         masonry: false,
-        parallax: 0 },
-
+        parallax: 0
+      },
 
       connected() {
         this.masonry && addClass(this.$el, 'uk-flex-top uk-flex-wrap-top');
@@ -4844,8 +4873,8 @@
           toggleClass(this.$el, this.clsStack, columns.length < 2);
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       {
         read(data) {
@@ -4893,8 +4922,8 @@
           height !== false && css(this.$el, 'height', height);
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       {
         read() {
@@ -4905,8 +4934,8 @@
           return {
             scrolled: this.parallax ?
             scrolledOver(this.$el) * Math.abs(this.parallax) :
-            false };
-
+            false
+          };
         },
 
         write(_ref3) {let { columns, scrolled, translates } = _ref3;
@@ -4930,10 +4959,10 @@
 
         },
 
-        events: ['scroll', 'resize'] }] };
-
-
+        events: ['scroll', 'resize']
+      }]
 
+    };
 
     function positionedAbsolute(el) {
       return children(el).some((el) => css(el, 'position') === 'absolute');
@@ -4968,13 +4997,13 @@
 
       props: {
         target: String,
-        row: Boolean },
-
+        row: Boolean
+      },
 
       data: {
         target: '> *',
-        row: true },
-
+        row: true
+      },
 
       computed: {
         elements: {
@@ -4984,9 +5013,9 @@
 
           watch() {
             this.$reset();
-          } } },
-
-
+          }
+        }
+      },
 
       resizeTargets() {
         return [this.$el, ...this.elements];
@@ -4995,8 +5024,8 @@
       update: {
         read() {
           return {
-            rows: (this.row ? getRows(this.elements) : [this.elements]).map(match$1) };
-
+            rows: (this.row ? getRows(this.elements) : [this.elements]).map(match$1)
+          };
         },
 
         write(_ref2) {let { rows } = _ref2;
@@ -5005,9 +5034,9 @@
           }
         },
 
-        events: ['resize'] } };
-
-
+        events: ['resize']
+      }
+    };
 
     function match$1(elements) {
       if (elements.length < 2) {
@@ -5020,8 +5049,8 @@
 
       return {
         heights: elements.map((el, i) => heights[i].toFixed(2) === max.toFixed(2) ? '' : max),
-        elements };
-
+        elements
+      };
     }
 
     function getHeight(element) {
@@ -5047,15 +5076,15 @@
         expand: Boolean,
         offsetTop: Boolean,
         offsetBottom: Boolean,
-        minHeight: Number },
-
+        minHeight: Number
+      },
 
       data: {
         expand: false,
         offsetTop: false,
         offsetBottom: false,
-        minHeight: 0 },
-
+        minHeight: 0
+      },
 
       resizeTargets() {
         // check for offsetTop change
@@ -5124,7 +5153,9 @@
           }
         },
 
-        events: ['resize'] } };
+        events: ['resize']
+      }
+    };
 
     var SVG = {
       args: 'src',
@@ -5139,15 +5170,15 @@
         ratio: Number,
         class: String,
         strokeAnimation: Boolean,
-        attributes: 'list' },
-
+        attributes: 'list'
+      },
 
       data: {
         ratio: 1,
         include: ['style', 'class'],
         class: '',
-        strokeAnimation: false },
-
+        strokeAnimation: false
+      },
 
       beforeConnect() {
         this.class += ' uk-svg';
@@ -5244,9 +5275,9 @@
           }
 
           dimensions.forEach((val, i) => attr(el, props[i], toFloat(val) * this.ratio || null));
-        } } };
-
-
+        }
+      }
+    };
 
     const loadSVG = memoize(async (src) => {
       if (src) {
@@ -5338,7 +5369,7 @@
 
     var navbarParentIcon = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\"><polyline fill=\"none\" stroke=\"#000\" stroke-width=\"1.1\" points=\"1 3.5 6 8.5 11 3.5\"/></svg>";
 
-    var navbarToggleIcon = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><style>.uk-navbar-toggle-animate svg > [class*='line-'] {\n            transition: 0.2s ease-in-out;\n            transition-property: transform, opacity,;\n            transform-origin: center;\n            opacity: 1;\n        }\n\n        .uk-navbar-toggle svg > .line-3 { opacity: 0; }\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-3 { opacity: 1; }\n\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-2 { transform: rotate(45deg); }\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-3 { transform: rotate(-45deg); }\n\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-1,\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-4 { opacity: 0; }\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-1 { transform: translateY(6px) scaleX(0); }\n        .uk-navbar-toggle-animate[aria-expanded=\"true\"] svg > .line-4 { transform: translateY(-6px) scaleX(0); }</style><rect class=\"line-1\" y=\"3\" width=\"20\" height=\"2\"/><rect class=\"line-2\" y=\"9\" width=\"20\" height=\"2\"/><rect class=\"line-3\" y=\"9\" width=\"20\" height=\"2\"/><rect class=\"line-4\" y=\"15\" width=\"20\" height=\"2\"/></svg>";
+    var navbarToggleIcon = "<svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><style>.uk-navbar-toggle-animate svg>[class*=line-]{transition:.2s ease-in-out;transition-property:transform,opacity,;transform-origin:center;opacity:1}.uk-navbar-toggle svg>.line-3{opacity:0}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-3{opacity:1}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-2{transform:rotate(45deg)}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-3{transform:rotate(-45deg)}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-1,.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-4{opacity:0}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-1{transform:translateY(6px) scaleX(0)}.uk-navbar-toggle-animate[aria-expanded=true] svg>.line-4{transform:translateY(-6px) scaleX(0)}</style><rect class=\"line-1\" y=\"3\" width=\"20\" height=\"2\"/><rect class=\"line-2\" y=\"9\" width=\"20\" height=\"2\"/><rect class=\"line-3\" y=\"9\" width=\"20\" height=\"2\"/><rect class=\"line-4\" y=\"15\" width=\"20\" height=\"2\"/></svg>";
 
     var overlayIcon = "<svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" xmlns=\"http://www.w3.org/2000/svg\"><rect x=\"19\" y=\"0\" width=\"1\" height=\"40\"/><rect x=\"0\" y=\"19\" width=\"40\" height=\"1\"/></svg>";
 
@@ -5383,8 +5414,8 @@
       'slidenav-next': slidenavNext,
       'slidenav-next-large': slidenavNextLarge,
       'slidenav-previous': slidenavPrevious,
-      'slidenav-previous-large': slidenavPreviousLarge };
-
+      'slidenav-previous-large': slidenavPreviousLarge
+    };
 
     const Icon = {
       install: install$3,
@@ -5412,7 +5443,9 @@
           }
 
           return icon;
-        } } };
+        }
+      }
+    };
 
     const IconComponent = {
       args: false,
@@ -5420,13 +5453,13 @@
       extends: Icon,
 
       data: (vm) => ({
-        icon: hyphenate(vm.constructor.options.name) }),
-
+        icon: hyphenate(vm.constructor.options.name)
+      }),
 
       beforeConnect() {
         addClass(this.$el, this.$options.id);
-      } };
-
+      }
+    };
 
     const NavParentIcon = {
       extends: IconComponent,
@@ -5434,8 +5467,8 @@
       beforeConnect() {
         const icon = this.$props.icon;
         this.icon = closest(this.$el, '.uk-nav-primary') ? icon + "-large" : icon;
-      } };
-
+      }
+    };
 
     const Slidenav = {
       extends: IconComponent,
@@ -5444,8 +5477,8 @@
         addClass(this.$el, 'uk-slidenav');
         const icon = this.$props.icon;
         this.icon = hasClass(this.$el, 'uk-slidenav-large') ? icon + "-large" : icon;
-      } };
-
+      }
+    };
 
     const Search = {
       extends: IconComponent,
@@ -5457,16 +5490,16 @@
         parents(this.$el, '.uk-search-navbar').length ?
         'search-navbar' :
         this.$props.icon;
-      } };
-
+      }
+    };
 
     const Close = {
       extends: IconComponent,
 
       beforeConnect() {
         this.icon = "close-" + (hasClass(this.$el, 'uk-close-large') ? 'large' : 'icon');
-      } };
-
+      }
+    };
 
     const Spinner = {
       extends: IconComponent,
@@ -5480,9 +5513,9 @@
           }
 
           return icon;
-        } } };
-
-
+        }
+      }
+    };
 
     const parsed = {};
     function install$3(UIkit) {
@@ -5530,8 +5563,8 @@
         offsetTop: String,
         offsetLeft: String,
         target: String,
-        loading: String },
-
+        loading: String
+      },
 
       data: {
         dataSrc: '',
@@ -5539,8 +5572,8 @@
         offsetTop: '50vh',
         offsetLeft: '50vw',
         target: false,
-        loading: 'lazy' },
-
+        loading: 'lazy'
+      },
 
       connected() {
         if (this.loading !== 'lazy') {
@@ -5571,9 +5604,9 @@
         {
           rootMargin: toPx(this.offsetTop, 'height') + "px " + toPx(
           this.offsetLeft,
-          'width') + "px" }));
-
+          'width') + "px"
 
+        }));
 
 
       },
@@ -5597,9 +5630,9 @@
           removeAttr(image, 'loading');
           setSrcAttrs(this.$el, image.currentSrc);
           return this._data.image = image;
-        } } };
-
-
+        }
+      }
+    };
 
     function setSrcAttrs(el, src) {
       if (isImg(el)) {
@@ -5689,12 +5722,12 @@
 
     var Media = {
       props: {
-        media: Boolean },
-
+        media: Boolean
+      },
 
       data: {
-        media: false },
-
+        media: false
+      },
 
       connected() {
         const media = toMedia(this.media, this.$el);
@@ -5715,8 +5748,8 @@
 
       disconnected() {var _this$offMediaObj;
         (_this$offMediaObj = this.offMediaObj) == null ? void 0 : _this$offMediaObj.call(this);
-      } };
-
+      }
+    };
 
     function toMedia(value, element) {
       if (isString(value)) {
@@ -5734,21 +5767,21 @@
       mixins: [Class, Media, Resize],
 
       props: {
-        fill: String },
-
+        fill: String
+      },
 
       data: {
         fill: '',
         clsWrapper: 'uk-leader-fill',
         clsHide: 'uk-leader-hide',
-        attrFill: 'data-fill' },
-
+        attrFill: 'data-fill'
+      },
 
       computed: {
         fill(_ref) {let { fill } = _ref;
           return fill || css(this.$el, '--uk-leader-fill-content');
-        } },
-
+        }
+      },
 
       connected() {
         [this.wrapper] = wrapInner(this.$el, "<span class=\"" + this.clsWrapper + "\">");
@@ -5765,8 +5798,8 @@
           return {
             width,
             fill: this.fill,
-            hide: !this.matchMedia };
-
+            hide: !this.matchMedia
+          };
         },
 
         write(_ref2) {let { width, fill, hide } = _ref2;
@@ -5774,7 +5807,9 @@
           attr(this.wrapper, this.attrFill, new Array(width).join(fill));
         },
 
-        events: ['resize'] } };
+        events: ['resize']
+      }
+    };
 
     var modal = {
       install: install$2,
@@ -5785,8 +5820,8 @@
         clsPage: 'uk-modal-page',
         selPanel: '.uk-modal-dialog',
         selClose:
-        '.uk-modal-close, .uk-modal-close-default, .uk-modal-close-outside, .uk-modal-close-full' },
-
+        '.uk-modal-close, .uk-modal-close-default, .uk-modal-close-outside, .uk-modal-close-full'
+      },
 
       events: [
       {
@@ -5802,8 +5837,8 @@
           }
 
           height(this.$el); // force reflow
-        } },
-
+        }
+      },
 
       {
         name: 'hidden',
@@ -5813,10 +5848,10 @@
         handler() {
           css(this.$el, 'display', '');
           removeClass(this.$el, 'uk-flex');
-        } }] };
-
-
+        }
+      }]
 
+    };
 
     function install$2(_ref) {let { modal } = _ref;
       modal.dialog = function (content, options) {
@@ -5895,8 +5930,8 @@
 
       modal.labels = {
         ok: 'Ok',
-        cancel: 'Cancel' };
-
+        cancel: 'Cancel'
+      };
 
       function openDialog(tmpl, options, hideFn, submitFn) {
         options = { bgClose: false, escClose: true, labels: modal.labels, ...options };
@@ -5927,7 +5962,9 @@
       data: {
         targets: '> .uk-parent',
         toggle: '> a',
-        content: '> ul' } };
+        content: '> ul'
+      }
+    };
 
     var navbar = {
       mixins: [Class, Container],
@@ -5949,8 +5986,8 @@
         targetX: Boolean,
         targetY: Boolean,
         animation: Boolean,
-        animateOut: Boolean },
-
+        animateOut: Boolean
+      },
 
       data: {
         dropdown: '.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle',
@@ -5960,8 +5997,8 @@
         dropbar: false,
         dropbarAnchor: false,
         duration: 200,
-        container: false },
-
+        container: false
+      },
 
       computed: {
         dropbarAnchor(_ref, $el) {let { dropbarAnchor } = _ref;
@@ -5986,8 +6023,8 @@
             addClass(dropbar, 'uk-dropbar', 'uk-dropbar-top', 'uk-navbar-dropbar');
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         dropContainer(_, $el) {
           return this.container || $el;
@@ -6018,13 +6055,13 @@
               flip: false,
               shift: true,
               pos: "bottom-" + this.align,
-              boundary: this.boundary === true ? this.$el : this.boundary });
-
+              boundary: this.boundary === true ? this.$el : this.boundary
+            });
 
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         toggles: {
           get(_ref4, $el) {let { dropdown } = _ref4;
@@ -6041,9 +6078,9 @@
             }
           },
 
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       disconnected() {
         this.dropbar && remove$1(this.dropbar);
@@ -6069,8 +6106,8 @@
           {
             active.hide(false);
           }
-        } },
-
+        }
+      },
 
       {
         name: 'keydown',
@@ -6097,8 +6134,8 @@
           }
 
           handleNavItemNavigation(e, this.toggles, active);
-        } },
-
+        }
+      },
 
       {
         name: 'keydown',
@@ -6141,8 +6178,8 @@
           }
 
           handleNavItemNavigation(e, this.toggles, active);
-        } },
-
+        }
+      },
 
       {
         name: 'mouseleave',
@@ -6165,8 +6202,8 @@
           {
             active.hide();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'beforeshow',
@@ -6189,8 +6226,8 @@
           }
 
           addClass(target, this.clsDrop + "-dropbar");
-        } },
-
+        }
+      },
 
       {
         name: 'show',
@@ -6222,8 +6259,8 @@
             target);
 
           });
-        } },
-
+        }
+      },
 
       {
         name: 'beforehide',
@@ -6246,8 +6283,8 @@
           {
             e.preventDefault();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'hide',
@@ -6272,8 +6309,8 @@
           if (!active || (active == null ? void 0 : active.$el) === target) {
             this.transitionTo(0);
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -6297,8 +6334,8 @@
           Transition.start(
           el,
           {
-            clipPath: "polygon(0 0,100% 0,100% " + newHeight + "px,0 " + newHeight + "px)" },
-
+            clipPath: "polygon(0 0,100% 0,100% " + newHeight + "px,0 " + newHeight + "px)"
+          },
           this.duration)]).
 
 
@@ -6312,9 +6349,9 @@
 
         isDropbarDrop(el) {
           return this.getDropdown(el) && hasClass(el, this.clsDrop);
-        } } };
-
-
+        }
+      }
+    };
 
     function handleNavItemNavigation(e, toggles, active) {
       const { current, keyCode } = e;
@@ -6351,22 +6388,23 @@
       LEFT: 37,
       UP: 38,
       RIGHT: 39,
-      DOWN: 40 };
+      DOWN: 40
+    };
 
     var Swipe = {
       props: {
-        swiping: Boolean },
-
+        swiping: Boolean
+      },
 
       data: {
-        swiping: true },
-
+        swiping: true
+      },
 
       computed: {
         swipeTarget(props, $el) {
           return $el;
-        } },
-
+        }
+      },
 
       connected() {
         if (!this.swiping) {
@@ -6399,10 +6437,10 @@
                 });
               }
             });
-          } });
-
-      } };
-
+          }
+        });
+      }
+    };
 
     function swipeDirection(x1, y1, x2, y2) {
       return Math.abs(x1 - x2) >= Math.abs(y1 - y2) ?
@@ -6422,8 +6460,8 @@
       props: {
         mode: String,
         flip: Boolean,
-        overlay: Boolean },
-
+        overlay: Boolean
+      },
 
       data: {
         mode: 'slide',
@@ -6438,8 +6476,8 @@
         clsMode: 'uk-offcanvas',
         clsOverlay: 'uk-offcanvas-overlay',
         selClose: '.uk-offcanvas-close',
-        container: false },
-
+        container: false
+      },
 
       computed: {
         clsFlip(_ref) {let { flip, clsFlip } = _ref;
@@ -6464,8 +6502,8 @@
 
         transitionElement(_ref6) {let { mode } = _ref6;
           return mode === 'reveal' ? parent(this.panel) : this.panel;
-        } },
-
+        }
+      },
 
       update: {
         read() {
@@ -6474,8 +6512,8 @@
           }
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       events: [
       {
@@ -6490,8 +6528,8 @@
 
         handler(e) {
           e.cancelable && e.preventDefault();
-        } },
-
+        }
+      },
 
       {
         name: 'show',
@@ -6521,8 +6559,8 @@
           addClass(body, this.clsContainerAnimation);
 
           this.clsContainerAnimation && suppressUserScale();
-        } },
-
+        }
+      },
 
       {
         name: 'hide',
@@ -6532,8 +6570,8 @@
         handler() {
           removeClass(document.body, this.clsContainerAnimation);
           css(document.body, 'touch-action', '');
-        } },
-
+        }
+      },
 
       {
         name: 'hidden',
@@ -6552,8 +6590,8 @@
           css(this.$el, 'display', '');
           css(this.panel, 'maxWidth', '');
           removeClass(document.body, this.clsContainer, this.clsFlip);
-        } },
-
+        }
+      },
 
       {
         name: 'swipeLeft swipeRight',
@@ -6562,10 +6600,10 @@
           if (this.isToggled() && endsWith(e.type, 'Left') ^ this.flip) {
             this.hide();
           }
-        } }] };
-
-
+        }
+      }]
 
+    };
 
     // Chrome in responsive mode zooms page upon opening offcanvas
     function suppressUserScale() {
@@ -6589,14 +6627,14 @@
       props: {
         selContainer: String,
         selContent: String,
-        minHeight: Number },
-
+        minHeight: Number
+      },
 
       data: {
         selContainer: '.uk-modal',
         selContent: '.uk-modal-dialog',
-        minHeight: 150 },
-
+        minHeight: 150
+      },
 
       computed: {
         container(_ref, $el) {let { selContainer } = _ref;
@@ -6605,8 +6643,8 @@
 
         content(_ref2, $el) {let { selContent } = _ref2;
           return closest($el, selContent);
-        } },
-
+        }
+      },
 
       resizeTargets() {
         return [this.container, this.content];
@@ -6621,16 +6659,18 @@
           return {
             max: Math.max(
             this.minHeight,
-            height(this.container) - (dimensions$1(this.content).height - height(this.$el))) };
-
+            height(this.container) - (dimensions$1(this.content).height - height(this.$el)))
 
+          };
         },
 
         write(_ref3) {let { max } = _ref3;
           css(this.$el, { minHeight: this.minHeight, maxHeight: max });
         },
 
-        events: ['resize'] } };
+        events: ['resize']
+      }
+    };
 
     var responsive = {
       mixins: [Resize],
@@ -6658,23 +6698,25 @@
           Dimensions.contain(
           {
             height: this.height,
-            width: this.width },
-
+            width: this.width
+          },
           dim).
           height);
 
         },
 
-        events: ['resize'] } };
+        events: ['resize']
+      }
+    };
 
     var scroll = {
       props: {
-        offset: Number },
-
+        offset: Number
+      },
 
       data: {
-        offset: 0 },
-
+        offset: 0
+      },
 
       connected() {
         registerClick(this);
@@ -6692,9 +6734,9 @@
             await scrollIntoView(el, { offset: this.offset });
             trigger(this.$el, 'scrolled', [this, el]);
           }
-        } } };
-
-
+        }
+      }
+    };
 
     const components$2 = new Set();
     function registerClick(cmp) {
@@ -6742,8 +6784,8 @@
         offsetTop: Number,
         offsetLeft: Number,
         repeat: Boolean,
-        delay: Number },
-
+        delay: Number
+      },
 
       data: () => ({
         cls: '',
@@ -6753,8 +6795,8 @@
         offsetLeft: 0,
         repeat: false,
         delay: 0,
-        inViewClass: 'uk-scrollspy-inview' }),
-
+        inViewClass: 'uk-scrollspy-inview'
+      }),
 
       computed: {
         elements: {
@@ -6773,9 +6815,9 @@
             }
           },
 
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       connected() {
         this._data.elements = new Map();
@@ -6787,8 +6829,8 @@
           for (const { target: el, isIntersecting } of records) {
             if (!elements.has(el)) {
               elements.set(el, {
-                cls: data(el, 'uk-scrollspy-class') || this.cls });
-
+                cls: data(el, 'uk-scrollspy-class') || this.cls
+              });
             }
 
             const state = elements.get(el);
@@ -6803,9 +6845,9 @@
         },
         {
           rootMargin: toPx(this.offsetTop, 'height') - 1 + "px " + (
-          toPx(this.offsetLeft, 'width') - 1) + "px" },
-
+          toPx(this.offsetLeft, 'width') - 1) + "px"
 
+        },
         false));
 
 
@@ -6837,8 +6879,8 @@
               this.toggle(el, false);
             }
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -6871,7 +6913,9 @@
 
           // change to `visibility: hidden` does not trigger observers
           this.$update(el);
-        } } };
+        }
+      }
+    };
 
     var scrollspyNav = {
       mixins: [Scroll],
@@ -6881,16 +6925,16 @@
         closest: String,
         scroll: Boolean,
         overflow: Boolean,
-        offset: Number },
-
+        offset: Number
+      },
 
       data: {
         cls: 'uk-active',
         closest: false,
         scroll: false,
         overflow: true,
-        offset: 0 },
-
+        offset: 0
+      },
 
       computed: {
         links: {
@@ -6904,13 +6948,13 @@
             }
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         elements(_ref) {let { closest: selector } = _ref;
           return closest(this.links, selector || '*');
-        } },
-
+        }
+      },
 
       update: [
       {
@@ -6960,7 +7004,10 @@
           }
         },
 
-        events: ['scroll', 'resize'] }] };
+        events: ['scroll', 'resize']
+      }]
+
+    };
 
     var sticky = {
       mixins: [Class, Media, Resize, Scroll],
@@ -6980,8 +7027,8 @@
         clsBelow: String,
         selTarget: String,
         showOnUp: Boolean,
-        targetOffset: Number },
-
+        targetOffset: Number
+      },
 
       data: {
         position: 'top',
@@ -6998,14 +7045,14 @@
         clsBelow: 'uk-sticky-below',
         selTarget: '',
         showOnUp: false,
-        targetOffset: false },
-
+        targetOffset: false
+      },
 
       computed: {
         selTarget(_ref, $el) {let { selTarget } = _ref;
           return selTarget && $(selTarget, $el) || $el;
-        } },
-
+        }
+      },
 
       resizeTargets() {
         return document.documentElement;
@@ -7042,8 +7089,8 @@
 
         handler() {
           this.$emit('resize');
-        } },
-
+        }
+      },
       {
         name: 'load hashchange popstate',
 
@@ -7074,13 +7121,13 @@
               toPx(this.offset, 'height', this.placeholder);
             }
           });
-        } }],
-
+        }
+      }],
 
 
       update: [
       {
-        read(_ref2, types) {let { height: height$1, margin } = _ref2;
+        read(_ref2, types) {let { height: height$1, width, margin } = _ref2;
           this.inactive = !this.matchMedia || !isVisible(this.$el);
 
           if (this.inactive) {
@@ -7094,7 +7141,7 @@
           }
 
           if (!this.active) {
-            height$1 = offset(this.$el).height;
+            ({ height: height$1, width } = offset(this.$el));
             margin = css(this.$el, 'margin');
           }
 
@@ -7103,7 +7150,6 @@
             requestAnimationFrame(() => css(this.selTarget, 'transition', ''));
           }
 
-          const referenceElement = this.isFixed ? this.placeholder : this.$el;
           const windowHeight = height(window);
 
           let position = this.position;
@@ -7111,6 +7157,7 @@
             position = position === 'top' ? 'bottom' : 'top';
           }
 
+          const referenceElement = this.isFixed ? this.placeholder : this.$el;
           let offset$1 = toPx(this.offset, 'height', referenceElement);
           if (position === 'bottom' && (height$1 < windowHeight || this.overflowFlip)) {
             offset$1 += windowHeight - height$1;
@@ -7140,16 +7187,16 @@
             overflow,
             topOffset,
             height: height$1,
+            width,
             margin,
-            width: dimensions$1(referenceElement).width,
-            top: offsetPosition(referenceElement)[0] };
-
+            top: offsetPosition(referenceElement)[0]
+          };
         },
 
-        write(_ref3) {let { height, margin } = _ref3;
+        write(_ref3) {let { height, width, margin } = _ref3;
           const { placeholder } = this;
 
-          css(placeholder, { height, margin });
+          css(placeholder, { height, width, margin });
 
           if (!within(placeholder, document)) {
             after(this.$el, placeholder);
@@ -7157,8 +7204,8 @@
           }
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       {
         read(_ref4)
@@ -7183,9 +7230,9 @@
             overflowScroll: clamp(
             overflowScroll + clamp(scroll, start, end) - clamp(prevScroll, start, end),
             0,
-            overflow) };
-
+            overflow)
 
+          };
         },
 
         write(data, types) {
@@ -7199,8 +7246,8 @@
             top,
             start,
             topOffset,
-            height } =
-          data;
+            height
+          } = data;
 
           if (
           scroll < 0 ||
@@ -7261,8 +7308,8 @@
           }
         },
 
-        events: ['resize', 'scroll'] }],
-
+        events: ['resize', 'scroll']
+      }],
 
 
       methods: {
@@ -7290,8 +7337,8 @@
             offset,
             topOffset,
             height,
-            offsetParentTop } =
-          this._data;
+            offsetParentTop
+          } = this._data;
           const active = start !== 0 || scroll > start;
           let position = 'fixed';
 
@@ -7307,8 +7354,8 @@
           css(this.$el, {
             position,
             top: offset + "px",
-            width });
-
+            width
+          });
 
           this.setActive(active);
           toggleClass(this.$el, this.clsBelow, scroll > topOffset + height);
@@ -7325,9 +7372,9 @@
             replaceClass(this.selTarget, this.clsActive, this.clsInactive);
             prev !== active && trigger(this.$el, 'inactive');
           }
-        } } };
-
-
+        }
+      }
+    };
 
     function parseProp(value, el, propOffset, padding) {
       if (!value) {
@@ -7365,8 +7412,8 @@
         connect: String,
         toggle: String,
         itemNav: String,
-        active: Number },
-
+        active: Number
+      },
 
       data: {
         connect: '~.uk-switcher',
@@ -7374,8 +7421,8 @@
         itemNav: false,
         active: 0,
         cls: 'uk-active',
-        attrItem: 'uk-switcher-item' },
-
+        attrItem: 'uk-switcher-item'
+      },
 
       computed: {
         connects: {
@@ -7390,8 +7437,8 @@
           },
 
           document: true,
-          immediate: true },
-
+          immediate: true
+        },
 
         connectChildren: {
           get() {
@@ -7406,8 +7453,8 @@
             }
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         toggles: {
           get(_ref2, $el) {let { toggle } = _ref2;
@@ -7421,8 +7468,8 @@
             this.show(~active ? active : toggles[this.active] || toggles[0]);
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         children() {
           return children(this.$el).filter((child) =>
@@ -7432,8 +7479,8 @@
 
         swipeTarget() {
           return this.connects;
-        } },
-
+        }
+      },
 
       events: [
       {
@@ -7446,8 +7493,8 @@
         handler(e) {
           e.preventDefault();
           this.show(e.current);
-        } },
-
+        }
+      },
 
       {
         name: 'click',
@@ -7463,8 +7510,8 @@
         handler(e) {
           e.preventDefault();
           this.show(data(e.current, this.attrItem));
-        } },
-
+        }
+      },
 
       {
         name: 'swipeRight swipeLeft',
@@ -7479,8 +7526,8 @@
 
         handler(_ref3) {let { type } = _ref3;
           this.show(endsWith(type, 'Left') ? 'next' : 'previous');
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -7506,7 +7553,9 @@
 
             await this.toggleElement(children[active], true, animate);
           });
-        } } };
+        }
+      }
+    };
 
     var tab = {
       mixins: [Class],
@@ -7514,13 +7563,13 @@
       extends: Switcher,
 
       props: {
-        media: Boolean },
-
+        media: Boolean
+      },
 
       data: {
         media: 960,
-        attrItem: 'uk-tab-item' },
-
+        attrItem: 'uk-tab-item'
+      },
 
       connected() {
         const cls = hasClass(this.$el, 'uk-tab-left') ?
@@ -7532,7 +7581,8 @@
         if (cls) {
           this.$create('toggle', this.$el, { cls, mode: 'media', media: this.media });
         }
-      } };
+      }
+    };
 
     const KEY_SPACE = 32;
 
@@ -7545,15 +7595,15 @@
         href: String,
         target: null,
         mode: 'list',
-        queued: Boolean },
-
+        queued: Boolean
+      },
 
       data: {
         href: false,
         target: false,
         mode: 'click',
-        queued: true },
-
+        queued: true
+      },
 
       computed: {
         target: {
@@ -7568,9 +7618,9 @@
           },
 
           document: true,
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       connected() {
         if (!includes(this.mode, 'media') && !isFocusable(this.$el)) {
@@ -7608,8 +7658,8 @@
           if (includes(this.mode, 'click')) {
             this._preventClick = true;
           }
-        } },
-
+        }
+      },
 
       {
         name: pointerEnter + " " + pointerLeave + " focus blur",
@@ -7647,8 +7697,8 @@
           this._showState = show ? expanded : null;
 
           this.toggle("toggle" + (show ? 'show' : 'hide'));
-        } },
-
+        }
+      },
 
       {
         name: 'keydown',
@@ -7662,8 +7712,8 @@
             e.preventDefault();
             this.$el.click();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'click',
@@ -7687,8 +7737,8 @@
           if (!this._preventClick && includes(this.mode, 'click')) {
             this.toggle();
           }
-        } },
-
+        }
+      },
 
       {
         name: 'hide show',
@@ -7701,8 +7751,8 @@
 
         handler(_ref2) {let { target, type } = _ref2;
           this.updateAria(target === this.target[0] && type === 'show');
-        } },
-
+        }
+      },
 
       {
         name: 'mediachange',
@@ -7719,8 +7769,8 @@
           if (mediaObj.matches ^ this.isToggled(this.target)) {
             this.toggle();
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -7761,7 +7811,9 @@
           'aria-expanded',
           isBoolean(toggled) ? toggled : this.isToggled(this.target));
 
-        } } };
+        }
+      }
+    };
 
     var components$1 = /*#__PURE__*/Object.freeze({
         __proto__: null,
@@ -7820,13 +7872,13 @@
 
       props: {
         date: String,
-        clsWrapper: String },
-
+        clsWrapper: String
+      },
 
       data: {
         date: '',
-        clsWrapper: '.uk-countdown-%unit%' },
-
+        clsWrapper: '.uk-countdown-%unit%'
+      },
 
       connected() {
         this.date = Date.parse(this.$props.date);
@@ -7851,8 +7903,8 @@
           } else {
             this.start();
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -7896,9 +7948,9 @@
               digits.forEach((digit, i) => el.children[i].textContent = digit);
             }
           }
-        } } };
-
-
+        }
+      }
+    };
 
     function getTimeSpan(date) {
       const total = date - Date.now();
@@ -7908,8 +7960,8 @@
         seconds: total / 1000 % 60,
         minutes: total / 1000 / 60 % 60,
         hours: total / 1000 / 60 / 60 % 24,
-        days: total / 1000 / 60 / 60 / 24 };
-
+        days: total / 1000 / 60 / 60 / 24
+      };
     }
 
     const clsLeave = 'uk-transition-leave';
@@ -8065,10 +8117,7 @@
       const targetStyle = attr(target, 'style');
       const targetPropsTo = css(target, ['height', 'padding']);
       const [propsTo, propsFrom] = getTransitionProps(target, nodes, currentProps);
-      const attrsTo = nodes.map((el) => ({
-        class: attr(el, 'class'),
-        style: attr(el, 'style') }));
-
+      const attrsTo = nodes.map((el) => ({ style: attr(el, 'style') }));
 
       // Reset to previous state
       nodes.forEach((el, i) => propsFrom[i] && css(el, propsFrom[i]));
@@ -8106,8 +8155,8 @@
         pointerEvents: 'none',
         position: 'absolute',
         zIndex: zIndex === 'auto' ? index(el) : zIndex,
-        ...getPositionWithMargin(el) } :
-
+        ...getPositionWithMargin(el)
+      } :
       false;
     }
 
@@ -8161,8 +8210,8 @@
         width,
         transform: '',
         ...position(el),
-        ...css(el, ['marginTop', 'marginLeft']) };
-
+        ...css(el, ['marginTop', 'marginLeft'])
+      };
     }
 
     function awaitFrame() {
@@ -8172,13 +8221,13 @@
     var Animate = {
       props: {
         duration: Number,
-        animation: Boolean },
-
+        animation: Boolean
+      },
 
       data: {
         duration: 150,
-        animation: 'slide' },
-
+        animation: 'slide'
+      },
 
       methods: {
         animate(action, target) {if (target === void 0) {target = this.$el;}
@@ -8196,7 +8245,9 @@
           };
 
           return animationFn(action, target, this.duration).catch(noop);
-        } } };
+        }
+      }
+    };
 
     var filter = {
       mixins: [Animate],
@@ -8205,16 +8256,16 @@
 
       props: {
         target: Boolean,
-        selActive: Boolean },
-
+        selActive: Boolean
+      },
 
       data: {
         target: null,
         selActive: false,
         attrItem: 'uk-filter-control',
         cls: 'uk-active',
-        duration: 250 },
-
+        duration: 250
+      },
 
       computed: {
         toggles: {
@@ -8231,8 +8282,8 @@
             }
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         children: {
           get(_ref2, $el) {let { target } = _ref2;
@@ -8245,9 +8296,9 @@
             }
           },
 
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       events: [
       {
@@ -8260,8 +8311,8 @@
         handler(e) {
           e.preventDefault();
           this.apply(e.current);
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -8279,8 +8330,8 @@
           filter((item) => hasClass(item, this.cls)).
           reduce((state, el) => mergeState(el, this.attrItem, state), {
             filter: { '': '' },
-            sort: [] });
-
+            sort: []
+          });
         },
 
         async setState(state, animate) {if (animate === void 0) {animate = true;}
@@ -8307,9 +8358,9 @@
 
         updateState() {
           fastdom.write(() => this.setState(this.getState(), false));
-        } } };
-
-
+        }
+      }
+    };
 
     function getFilter(el, attr) {
       return parseOptions(data(el, attr), ['filter']);
@@ -8407,9 +8458,9 @@
           { transform: translate(dir * -100 * percent) },
           { transform: translate(dir * 100 * (1 - percent)) }];
 
-        } } };
-
-
+        }
+      }
+    };
 
     function translated(el) {
       return Math.abs(css(el, 'transform').split(',')[4] / el.offsetWidth) || 0;
@@ -8437,8 +8488,8 @@
 
         translate(percent) {
           return [{ opacity: 1 - percent }, { opacity: percent }];
-        } },
-
+        }
+      },
 
       scale: {
         show() {
@@ -8457,7 +8508,9 @@
           { opacity: 1 - percent, transform: scale3d(1 - 0.2 * percent) },
           { opacity: percent, transform: scale3d(1 - 0.2 + 0.2 * percent) }];
 
-        } } };
+        }
+      }
+    };
 
     function Transitioner$1(prev, next, dir, _ref) {let { animation, easing } = _ref;
       const { percent, translate, show = noop } = animation;
@@ -8518,8 +8571,8 @@
 
         getDistance() {
           return prev == null ? void 0 : prev.offsetWidth;
-        } };
-
+        }
+      };
     }
 
     function triggerUpdate$1(el, type, data) {
@@ -8530,14 +8583,14 @@
       props: {
         autoplay: Boolean,
         autoplayInterval: Number,
-        pauseOnHover: Boolean },
-
+        pauseOnHover: Boolean
+      },
 
       data: {
         autoplay: false,
         autoplayInterval: 7000,
-        pauseOnHover: true },
-
+        pauseOnHover: true
+      },
 
       connected() {
         this.autoplay && this.startAutoplay();
@@ -8569,8 +8622,8 @@
           } else {
             this.startAutoplay();
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -8589,7 +8642,9 @@
 
         stopAutoplay() {
           this.interval && clearInterval(this.interval);
-        } } };
+        }
+      }
+    };
 
     const pointerOptions = { passive: false, capture: true };
     const pointerUpOptions = { passive: true, capture: true };
@@ -8599,13 +8654,13 @@
 
     var SliderDrag = {
       props: {
-        draggable: Boolean },
-
+        draggable: Boolean
+      },
 
       data: {
         draggable: true,
-        threshold: 10 },
-
+        threshold: 10
+      },
 
       created() {
         for (const key of ['start', 'move', 'end']) {
@@ -8643,16 +8698,16 @@
           }
 
           this.start(e);
-        } },
-
+        }
+      },
 
       {
         name: 'dragstart',
 
         handler(e) {
           e.preventDefault();
-        } },
-
+        }
+      },
 
       {
         // iOS workaround for slider stopping if swiping fast
@@ -8661,8 +8716,8 @@
           return this.list;
         },
         handler: noop,
-        ...pointerOptions }],
-
+        ...pointerOptions
+      }],
 
 
       methods: {
@@ -8799,9 +8854,9 @@
           css(this.list, { userSelect: '', pointerEvents: '' });
 
           this.drag = this.percent = null;
-        } } };
-
-
+        }
+      }
+    };
 
     function hasSelectableText(el) {
       return (
@@ -8812,8 +8867,8 @@
 
     var SliderNav = {
       data: {
-        selNav: false },
-
+        selNav: false
+      },
 
       computed: {
         nav(_ref, $el) {let { selNav } = _ref;
@@ -8826,8 +8881,8 @@
 
         navItems(_, $el) {
           return $$(this.selNavItem, $el);
-        } },
-
+        }
+      },
 
       update: {
         write() {
@@ -8845,8 +8900,8 @@
           this.updateNav();
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       events: [
       {
@@ -8859,13 +8914,13 @@
         handler(e) {
           e.preventDefault();
           this.show(data(e.current, this.attrItem));
-        } },
-
+        }
+      },
 
       {
         name: 'itemshow',
-        handler: 'updateNav' }],
-
+        handler: 'updateNav'
+      }],
 
 
       methods: {
@@ -8882,7 +8937,9 @@
             cmd === 'previous' && i === 0 || cmd === 'next' && i >= this.maxIndex));
 
           }
-        } } };
+        }
+      }
+    };
 
     var Slider = {
       mixins: [SliderAutoplay, SliderDrag, SliderNav, Resize],
@@ -8893,8 +8950,8 @@
         index: Number,
         finite: Boolean,
         velocity: Number,
-        selSlides: String },
-
+        selSlides: String
+      },
 
       data: () => ({
         easing: 'ease',
@@ -8907,8 +8964,8 @@
         clsActive: 'uk-active',
         clsActivated: false,
         Transitioner: false,
-        transitionOptions: {} }),
-
+        transitionOptions: {}
+      }),
 
       connected() {
         this.prevIndex = -1;
@@ -8944,13 +9001,13 @@
 
           watch() {
             this.$emit('resize');
-          } },
-
+          }
+        },
 
         length() {
           return this.slides.length;
-        } },
-
+        }
+      },
 
       methods: {
         show(index, force) {if (force === void 0) {force = false;}
@@ -9039,8 +9096,8 @@
             '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 });
-
+            ...this.transitionOptions
+          });
 
           if (!force && !prev) {
             this._translate(1);
@@ -9076,9 +9133,9 @@
           dir * (isRtl ? -1 : 1),
           options);
 
-        } } };
-
-
+        }
+      }
+    };
 
     function getDirection(index, prevIndex) {
       return index === 'next' ? 1 : index === 'previous' ? -1 : index < prevIndex ? -1 : 1;
@@ -9092,15 +9149,15 @@
       mixins: [Slider],
 
       props: {
-        animation: String },
-
+        animation: String
+      },
 
       data: {
         animation: 'slide',
         clsActivated: 'uk-transition-active',
         Animations: Animations$2,
-        Transitioner: Transitioner$1 },
-
+        Transitioner: Transitioner$1
+      },
 
       computed: {
         animation(_ref) {let { animation, Animations } = _ref;
@@ -9109,8 +9166,8 @@
 
         transitionOptions() {
           return { animation: this.animation };
-        } },
-
+        }
+      },
 
       events: {
         beforeitemshow(_ref2) {let { target } = _ref2;
@@ -9123,7 +9180,9 @@
 
         itemhidden(_ref4) {let { target } = _ref4;
           removeClass(target, this.clsActive, this.clsActivated);
-        } } };
+        }
+      }
+    };
 
     var LightboxPanel = {
       mixins: [Container, Modal, Togglable, Slideshow],
@@ -9134,8 +9193,8 @@
         delayControls: Number,
         preload: Number,
         videoAutoplay: Boolean,
-        template: String },
-
+        template: String
+      },
 
       data: () => ({
         preload: 1,
@@ -9151,8 +9210,7 @@
         pauseOnHover: false,
         velocity: 2,
         Animations: Animations$1,
-        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>" }),
-
+        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>"
 
 
 
@@ -9161,6 +9219,7 @@
 
 
 
+      }),
 
       created() {
         const $el = $(this.template);
@@ -9173,15 +9232,15 @@
       computed: {
         caption(_ref, $el) {let { selCaption } = _ref;
           return $(selCaption, $el);
-        } },
-
+        }
+      },
 
       events: [
       {
         name: pointerMove$1 + " " + pointerDown$1 + " keydown",
 
-        handler: 'showControls' },
-
+        handler: 'showControls'
+      },
 
       {
         name: 'click',
@@ -9198,8 +9257,8 @@
           }
 
           this.hide();
-        } },
-
+        }
+      },
 
       {
         name: 'shown',
@@ -9208,8 +9267,8 @@
 
         handler() {
           this.showControls();
-        } },
-
+        }
+      },
 
       {
         name: 'hide',
@@ -9221,8 +9280,8 @@
 
           removeClass(this.slides, this.clsActive);
           Transition.stop(this.slides);
-        } },
-
+        }
+      },
 
       {
         name: 'hidden',
@@ -9231,8 +9290,8 @@
 
         handler() {
           this.$destroy(true);
-        } },
-
+        }
+      },
 
       {
         name: 'keyup',
@@ -9254,8 +9313,8 @@
               this.show('next');
               break;}
 
-        } },
-
+        }
+      },
 
       {
         name: 'beforeitemshow',
@@ -9274,8 +9333,8 @@
           this.animation = Animations$1['scale'];
           removeClass(e.target, this.clsActive);
           this.stack.splice(1, 0, this.index);
-        } },
-
+        }
+      },
 
       {
         name: 'itemshow',
@@ -9286,16 +9345,16 @@
           for (let j = -this.preload; j <= this.preload; j++) {
             this.loadItem(this.index + j);
           }
-        } },
-
+        }
+      },
 
       {
         name: 'itemshown',
 
         handler() {
           this.draggable = this.$props.draggable;
-        } },
-
+        }
+      },
 
       {
         name: 'itemload',
@@ -9314,8 +9373,8 @@
             allowfullscreen: '',
             style: 'max-width: 100%; box-sizing: border-box;',
             'uk-responsive': '',
-            'uk-video': "" + this.videoAutoplay };
-
+            'uk-video': "" + this.videoAutoplay
+          };
 
           // Image
           if (
@@ -9336,12 +9395,15 @@
               poster,
               controls: '',
               playsinline: '',
-              'uk-video': "" + this.videoAutoplay,
-              ...attrs });
-
+              'uk-video': "" + this.videoAutoplay
+            });
 
             on(video, 'loadedmetadata', () => {
-              attr(video, { width: video.videoWidth, height: video.videoHeight });
+              attr(video, {
+                width: video.videoWidth,
+                height: video.videoHeight,
+                ...attrs
+              });
               this.setItem(item, video);
             });
             on(video, 'error', () => this.setError(item));
@@ -9354,8 +9416,8 @@
               src,
               allowfullscreen: '',
               class: 'uk-lightbox-iframe',
-              ...attrs }));
-
+              ...attrs
+            }));
 
 
             // YouTube
@@ -9373,8 +9435,8 @@
               width: 1920,
               height: 1080,
               ...iframeAttrs,
-              ...attrs }));
-
+              ...attrs
+            }));
 
 
             // Vimeo
@@ -9386,8 +9448,8 @@
               src),
 
               {
-                credentials: 'omit' })).
-
+                credentials: 'omit'
+              })).
 
               json();
 
@@ -9400,15 +9462,15 @@
                 width,
                 height,
                 ...iframeAttrs,
-                ...attrs }));
-
+                ...attrs
+              }));
 
             } catch (e) {
               this.setError(item);
             }
           }
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -9445,9 +9507,9 @@
 
         hideControls() {
           removeClass(this.$el, 'uk-active', 'uk-transition-active');
-        } } };
-
-
+        }
+      }
+    };
 
     function createEl(tag, attrs) {
       const el = fragment("<" + tag + ">");
@@ -9470,9 +9532,9 @@
 
           watch() {
             this.hide();
-          } } },
-
-
+          }
+        }
+      },
 
       disconnected() {
         this.hide();
@@ -9489,8 +9551,8 @@
         handler(e) {
           e.preventDefault();
           this.show(e.current);
-        } }],
-
+        }
+      }],
 
 
       methods: {
@@ -9511,9 +9573,9 @@
 
         hide() {var _this$panel;
           return (_this$panel = this.panel) == null ? void 0 : _this$panel.hide();
-        } } };
-
-
+        }
+      }
+    };
 
     function install$1(UIkit, Lightbox) {
       if (!UIkit.lightboxPanel) {
@@ -9550,8 +9612,8 @@
         pos: 'top-center',
         clsContainer: 'uk-notification',
         clsClose: 'uk-notification-close',
-        clsMsg: 'uk-notification-message' },
-
+        clsMsg: 'uk-notification-message'
+      },
 
       install,
 
@@ -9562,8 +9624,8 @@
 
         startProps() {
           return { opacity: 0, [this.marginProp]: -this.$el.offsetHeight };
-        } },
-
+        }
+      },
 
       created() {
         const container =
@@ -9590,8 +9652,8 @@
         const margin = toFloat(css(this.$el, this.marginProp));
         await Transition.start(css(this.$el, this.startProps), {
           opacity: 1,
-          [this.marginProp]: margin });
-
+          [this.marginProp]: margin
+        });
 
         if (this.timeout) {
           this.timer = setTimeout(this.close, this.timeout);
@@ -9616,8 +9678,8 @@
           if (this.timeout) {
             this.timer = setTimeout(this.close, this.timeout);
           }
-        } },
-
+        }
+      },
 
       methods: {
         async close(immediate) {
@@ -9641,9 +9703,9 @@
           }
 
           removeFn(this.$el);
-        } } };
-
-
+        }
+      }
+    };
 
     function install(UIkit) {
       UIkit.notification.closeAll = function (group, immediate) {
@@ -9674,8 +9736,8 @@
       opacity: cssPropFn,
       stroke: strokeFn,
       bgx: backgroundFn,
-      bgy: backgroundFn };
-
+      bgy: backgroundFn
+    };
 
     const { keys } = Object;
 
@@ -9699,14 +9761,14 @@
             result[prop] = props[prop](prop, $el, stops[prop], stops);
           }
           return result;
-        } },
-
+        }
+      },
 
       events: {
         load() {
           this.$emit();
-        } },
-
+        }
+      },
 
       methods: {
         reset() {
@@ -9721,9 +9783,9 @@
             this.props[prop](css, percent);
           }
           return css;
-        } } };
-
-
+        }
+      }
+    };
 
     function transformFn(prop, el, stops) {
       let unit = getUnit(stops) || { x: 'px', y: 'px', rotate: 'deg' }[prop] || '';
@@ -9861,8 +9923,8 @@
 
       const dimEl = {
         width: el.offsetWidth,
-        height: el.offsetHeight };
-
+        height: el.offsetHeight
+      };
 
       const bgProps = ['bgx', 'bgy'].filter((prop) => prop in props);
 
@@ -9934,8 +9996,8 @@
     function toDimensions(image) {
       return {
         width: image.naturalWidth,
-        height: image.naturalHeight };
-
+        height: image.naturalHeight
+      };
     }
 
     function parseStops(stops, fn) {if (fn === void 0) {fn = toFloat;}
@@ -10027,16 +10089,16 @@
         viewport: Number, // Deprecated
         easing: Number,
         start: String,
-        end: String },
-
+        end: String
+      },
 
       data: {
         target: false,
         viewport: 1,
         easing: 1,
         start: 0,
-        end: 0 },
-
+        end: 0
+      },
 
       computed: {
         target(_ref, $el) {let { target } = _ref;
@@ -10054,8 +10116,8 @@
           this.target,
           true);
 
-        } },
-
+        }
+      },
 
       update: {
         read(_ref4, types) {let { percent } = _ref4;
@@ -10072,8 +10134,8 @@
 
           return {
             percent,
-            style: prev === percent ? false : this.getCss(percent) };
-
+            style: prev === percent ? false : this.getCss(percent)
+          };
         },
 
         write(_ref5) {let { style } = _ref5;
@@ -10085,9 +10147,9 @@
           style && css(this.$el, style);
         },
 
-        events: ['scroll', 'resize'] } };
-
-
+        events: ['scroll', 'resize']
+      }
+    };
 
     /*
      * Inspired by https://gist.github.com/gre/1650294?permalink_comment_id=3477425#gistcomment-3477425
@@ -10129,14 +10191,17 @@
           }
         },
 
-        events: ['resize'] } };
+        events: ['resize']
+      }
+    };
 
     var SliderPreload = {
       mixins: [Lazyload],
 
       connected() {
         this.lazyload(this.slides, this.getAdjacentSlides);
-      } };
+      }
+    };
 
     function Transitioner (prev, next, dir, _ref) {let { center, easing, list } = _ref;
       const deferred = new Deferred();
@@ -10164,8 +10229,8 @@
             percent: 1 - percent,
             duration,
             timing,
-            dir });
-
+            dir
+          });
 
           Transition.start(
           list,
@@ -10225,8 +10290,8 @@
 
             triggerUpdate(slide, "itemtranslate" + (translateIn ? 'in' : 'out'), {
               dir,
-              percent: isOut ? 1 - percent : isIn ? percent : isActive ? 1 : 0 });
-
+              percent: isOut ? 1 - percent : isIn ? percent : isActive ? 1 : 0
+            });
           }
         },
 
@@ -10255,8 +10320,8 @@
 
         getActives() {
           return inView(list, getLeft(prev || next, list, center));
-        } };
-
+        }
+      };
     }
 
     function getLeft(el, list, center) {
@@ -10308,8 +10373,8 @@
 
       props: {
         center: Boolean,
-        sets: Boolean },
-
+        sets: Boolean
+      },
 
       data: {
         center: false,
@@ -10318,8 +10383,8 @@
         selList: '.uk-slider-items',
         selNav: '.uk-slider-nav',
         clsContainer: 'uk-slider-container',
-        Transitioner },
-
+        Transitioner
+      },
 
       computed: {
         avgWidth() {
@@ -10394,10 +10459,10 @@
         transitionOptions() {
           return {
             center: this.center,
-            list: this.list };
-
-        } },
-
+            list: this.list
+          };
+        }
+      },
 
       connected() {
         toggleClass(this.$el, this.clsContainer, !$("." + this.clsContainer, this.$el));
@@ -10423,8 +10488,8 @@
           this.updateActiveClasses();
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       events: {
         beforeitemshow(e) {
@@ -10472,8 +10537,8 @@
 
         itemshown() {
           this.updateActiveClasses();
-        } },
-
+        }
+      },
 
       methods: {
         reorder() {
@@ -10559,9 +10624,9 @@
             } while (this.slides.length > j && currentLeft > left && currentLeft < right);
           }
           return Array.from(slides);
-        } } };
-
-
+        }
+      }
+    };
 
     function getMaxElWidth(list) {
       return Math.max(0, ...children(list).map((el) => dimensions$1(el).width));
@@ -10571,8 +10636,8 @@
       mixins: [Parallax],
 
       data: {
-        selItem: '!li' },
-
+        selItem: '!li'
+      },
 
       beforeConnect() {
         this.item = query(this.selItem, this.$el);
@@ -10594,6 +10659,10 @@
 
         handler(_ref) {let { type, detail: { percent, duration, timing, dir } } = _ref;
           fastdom.read(() => {
+            if (!this.matchMedia) {
+              return;
+            }
+
             const propsFrom = this.getCss(getCurrentPercent(type, dir, percent));
             const propsTo = this.getCss(isIn(type) ? 0.5 : dir > 0 ? 1 : 0);
             fastdom.write(() => {
@@ -10601,8 +10670,8 @@
               Transition.start(this.$el, propsTo, duration, timing).catch(noop);
             });
           });
-        } },
-
+        }
+      },
 
       {
         name: 'transitioncanceled transitionend',
@@ -10615,8 +10684,8 @@
 
         handler() {
           Transition.cancel(this.$el);
-        } },
-
+        }
+      },
 
       {
         name: 'itemtranslatein itemtranslateout',
@@ -10629,13 +10698,18 @@
 
         handler(_ref2) {let { type, detail: { percent, dir } } = _ref2;
           fastdom.read(() => {
+            if (!this.matchMedia) {
+              this.reset();
+              return;
+            }
+
             const props = this.getCss(getCurrentPercent(type, dir, percent));
             fastdom.write(() => css(this.$el, props));
           });
-        } }] };
-
-
+        }
+      }]
 
+    };
 
     function isIn(type) {
       return endsWith(type, 'in');
@@ -10660,8 +10734,8 @@
 
         translate(percent) {
           return [{ opacity: 1 - percent, zIndex: 0 }, { zIndex: -1 }];
-        } },
-
+        }
+      },
 
       scale: {
         show() {
@@ -10677,8 +10751,8 @@
           { opacity: 1 - percent, transform: scale3d(1 + 0.5 * percent), zIndex: 0 },
           { zIndex: -1 }];
 
-        } },
-
+        }
+      },
 
       pull: {
         show(dir) {
@@ -10707,8 +10781,8 @@
           { transform: translate(-percent * 100), zIndex: 0 },
           { transform: translate(30 * (1 - percent)), zIndex: -1 }];
 
-        } },
-
+        }
+      },
 
       push: {
         show(dir) {
@@ -10737,7 +10811,9 @@
           { transform: translate(-30 * percent), zIndex: -1 },
           { transform: translate(100 * (1 - percent)), zIndex: 0 }];
 
-        } } };
+        }
+      }
+    };
 
     var slideshow = {
       mixins: [Class, Slideshow, SliderReactive, SliderPreload],
@@ -10745,8 +10821,8 @@
       props: {
         ratio: String,
         minHeight: Number,
-        maxHeight: Number },
-
+        maxHeight: Number
+      },
 
       data: {
         ratio: '16:9',
@@ -10755,8 +10831,8 @@
         selList: '.uk-slideshow-items',
         attrItem: 'uk-slideshow-item',
         selNav: '.uk-slideshow-nav',
-        Animations },
-
+        Animations
+      },
 
       update: {
         read() {
@@ -10783,13 +10859,15 @@
           height > 0 && css(this.list, 'minHeight', height);
         },
 
-        events: ['resize'] },
-
+        events: ['resize']
+      },
 
       methods: {
         getAdjacentSlides() {
           return [1, -1].map((i) => this.slides[this.getIndex(this.index + i)]);
-        } } };
+        }
+      }
+    };
 
     var sortable = {
       mixins: [Class, Animate],
@@ -10805,8 +10883,8 @@
         clsNoDrag: String,
         clsEmpty: String,
         clsCustom: String,
-        handle: String },
-
+        handle: String
+      },
 
       data: {
         group: false,
@@ -10820,8 +10898,8 @@
         clsEmpty: 'uk-sortable-empty',
         clsCustom: '',
         handle: false,
-        pos: {} },
-
+        pos: {}
+      },
 
       created() {
         for (const key of ['init', 'start', 'move', 'end']) {
@@ -10836,8 +10914,8 @@
       events: {
         name: pointerDown$1,
         passive: false,
-        handler: 'init' },
-
+        handler: 'init'
+      },
 
       computed: {
         target() {
@@ -10857,8 +10935,8 @@
             toggleClass(this.target, this.clsEmpty, empty);
           },
 
-          immediate: true },
-
+          immediate: true
+        },
 
         handles: {
           get(_ref, el) {let { handle } = _ref;
@@ -10870,9 +10948,9 @@
             css(handles, { touchAction: hasTouch ? 'none' : '', userSelect: 'none' }); // touchAction set to 'none' causes a performance drop in Chrome 80
           },
 
-          immediate: true } },
-
-
+          immediate: true
+        }
+      },
 
       update: {
         write(data) {
@@ -10883,13 +10961,13 @@
           const {
             pos: { x, y },
             origin: { offsetTop, offsetLeft },
-            placeholder } =
-          this;
+            placeholder
+          } = this;
 
           css(this.drag, {
             top: y - offsetTop,
-            left: x - offsetLeft });
-
+            left: x - offsetLeft
+          });
 
           const sortable = this.getSortable(document.elementFromPoint(x, y));
 
@@ -10939,8 +11017,8 @@
           this.touched.add(sortable);
         },
 
-        events: ['move'] },
-
+        events: ['move']
+      },
 
       methods: {
         init(e) {
@@ -11062,9 +11140,9 @@
               return sortable;
             }
           } while (element = parent(element));
-        } } };
-
-
+        }
+      }
+    };
 
     let trackTimer;
     function trackScroll(pos) {
@@ -11122,8 +11200,8 @@
         boxSizing: 'border-box',
         width: element.offsetWidth,
         height: element.offsetHeight,
-        padding: css(element, 'padding') });
-
+        padding: css(element, 'padding')
+      });
 
       height(clone.firstElementChild, height(element.firstElementChild));
 
@@ -11213,8 +11291,8 @@
 
       props: {
         delay: Number,
-        title: String },
-
+        title: String
+      },
 
       data: {
         pos: 'top',
@@ -11222,16 +11300,16 @@
         delay: 0,
         animation: ['uk-animation-scale-up'],
         duration: 100,
-        cls: 'uk-active' },
-
+        cls: 'uk-active'
+      },
 
       beforeConnect() {
         this.id = "uk-tooltip-" + this._uid;
         this._hasTitle = hasAttr(this.$el, 'title');
         attr(this.$el, {
           title: '',
-          'aria-describedby': this.id });
-
+          'aria-describedby': this.id
+        });
         makeFocusable(this.$el);
       },
 
@@ -11304,8 +11382,8 @@
           });
 
           this.toggleElement(this.tooltip, true);
-        } },
-
+        }
+      },
 
       events: {
         focus: 'show',
@@ -11323,9 +11401,9 @@
           if (isTouch(e)) {
             this.show();
           }
-        } } };
-
-
+        }
+      }
+    };
 
     function makeFocusable(el) {
       if (!isFocusable(el)) {
@@ -11379,8 +11457,8 @@
         name: String,
         params: Object,
         type: String,
-        url: String },
-
+        url: String
+      },
 
       data: {
         allow: false,
@@ -11407,8 +11485,8 @@
         load: noop,
         loadEnd: noop,
         loadStart: noop,
-        progress: noop },
-
+        progress: noop
+      },
 
       events: {
         change(e) {
@@ -11451,8 +11529,8 @@
         dragleave(e) {
           stop(e);
           removeClass(this.$el, this.clsDragover);
-        } },
-
+        }
+      },
 
       methods: {
         async upload(files) {
@@ -11510,8 +11588,8 @@
                   }
 
                   return this.beforeSend(env);
-                } });
-
+                }
+              });
 
               this.complete(xhr);
 
@@ -11526,9 +11604,9 @@
           };
 
           await upload(chunks.shift());
-        } } };
-
-
+        }
+      }
+    };
 
     function match(pattern, path) {
       return path.match(