uikit-reset 3.3.0 → 3.4.0

data/vendor/assets/javascripts/uikit-reset.js

@@ -1,6 +1,6 @@
 //= require jquery
 
-/*! UIkit 3.3.0 | http://www.getuikit.com | (c) 2014 - 2019 YOOtheme | MIT License */
+/*! UIkit 3.4.0 | https://www.getuikit.com | (c) 2014 - 2020 YOOtheme | MIT License */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -595,26 +595,6 @@
     return element && isElement(element.parentNode) && element.parentNode;
   }
 
-  function parents(element, selector) {
-    var elements = [];
-
-    while ((element = parent(element))) {
-      if (!selector || matches(element, selector)) {
-        elements.push(element);
-      }
-    }
-
-    return elements;
-  }
-
-  function children(element, selector) {
-    element = toNode(element);
-    var children = element ? toNodes(element.children) : [];
-    return selector ? children.filter(function (element) {
-      return matches(element, selector);
-    }) : children;
-  }
-
   var escapeFn = window.CSS && CSS.escape || function (css) {
     return css.replace(/([^\x7f-\uFFFF\w-])/g, function (match) {
       return ("\\" + match);
@@ -679,6 +659,24 @@
       matches(element, selector) || closest(element, selector);
   }
 
+  function parents(element, selector) {
+    var elements = [];
+
+    while ((element = parent(element))) {
+      if (!selector || matches(element, selector)) {
+        elements.push(element);
+      }
+    }
+
+    return elements;
+  }
+
+  function children(element, selector) {
+    element = toNode(element);
+    var children = element ? toNodes(element.children) : [];
+    return selector ? filter(children, selector) : children;
+  }
+
   function on() {
     var args = [],
       len = arguments.length;
@@ -847,14 +845,12 @@
     return e.pointerType === 'touch' || !!e.touches;
   }
 
-  function getEventPos(e, prop) {
-    if (prop === void 0) prop = 'client';
-
+  function getEventPos(e) {
     var touches = e.touches;
     var changedTouches = e.changedTouches;
     var ref = touches && touches[0] || changedTouches && changedTouches[0] || e;
-    var x = ref[(prop + "X")];
-    var y = ref[(prop + "Y")];
+    var x = ref.clientX;
+    var y = ref.clientY;
 
     return {
       x: x,
@@ -2034,7 +2030,7 @@
 
     if (pos.length === 1) {
       pos = x.test(pos[0]) ?
-        pos.concat(['center']) :
+        pos.concat('center') :
         y.test(pos[0]) ?
           ['center'].concat(pos) :
           ['center', 'center'];
@@ -2181,7 +2177,7 @@
 
       var position;
       this.unbind = on(document, 'mousemove', function (e) {
-        return position = getEventPos(e, 'page');
+        return position = getEventPos(e);
       });
       this.interval = setInterval(function () {
 
@@ -2209,7 +2205,7 @@
         return false;
       }
 
-      var p = offset(target);
+      var p = target.getBoundingClientRect();
       var left = p.left;
       var right = p.right;
       var top = p.top;
@@ -2601,28 +2597,28 @@
   function listen(cb) {
 
     return new Promise(function (resolve) {
+        return once(window, 'message', function (_, data) {
+          return resolve(data);
+        }, false, function (ref) {
+          var data = ref.data;
 
-      once(window, 'message', function (_, data) {
-        return resolve(data);
-      }, false, function (ref) {
-        var data = ref.data;
 
+          if (!data || !isString(data)) {
+            return;
+          }
 
-        if (!data || !isString(data)) {
-          return;
-        }
-
-        try {
-          data = JSON.parse(data);
-        } catch (e) {
-          return;
-        }
+          try {
+            data = JSON.parse(data);
+          } catch (e) {
+            return;
+          }
 
-        return data && cb(data);
+          return data && cb(data);
 
-      });
+        });
+      }
 
-    });
+    );
 
   }
 
@@ -2676,10 +2672,8 @@
 
   function scrollIntoView(element, ref) {
     if (ref === void 0) ref = {};
-    var duration = ref.duration;
-    if (duration === void 0) duration = 1000;
-    var offset = ref.offset;
-    if (offset === void 0) offset = 0;
+    var offsetBy = ref.offset;
+    if (offsetBy === void 0) offsetBy = 0;
 
 
     if (!isVisible(element)) {
@@ -2687,7 +2681,6 @@
     }
 
     var parents = overflowParents(element).concat(element);
-    duration /= parents.length - 1;
 
     var promise = Promise.resolve();
     var loop = function (i) {
@@ -2698,7 +2691,8 @@
           var element = parents[i + 1];
 
           var scroll = scrollElement.scrollTop;
-          var top = position(element, getViewport(scrollElement)).top - offset;
+          var top = Math.ceil(position(element, getViewport(scrollElement)).top - offsetBy);
+          var duration = getDuration(Math.abs(top));
 
           var start = Date.now();
           var step = function () {
@@ -2725,6 +2719,10 @@
 
     return promise;
 
+    function getDuration(dist) {
+      return 40 * Math.pow(dist, .375);
+    }
+
     function ease(k) {
       return 0.5 * (1 - Math.cos(Math.PI * k));
     }
@@ -2861,7 +2859,6 @@
       return IntersectionObserverClass;
     }());
 
-
   var util = /*#__PURE__*/ Object.freeze({
     __proto__: null,
     ajax: ajax,
@@ -2930,6 +2927,8 @@
     isInput: isInput,
     filter: filter,
     within: within,
+    parents: parents,
+    children: children,
     hasOwn: hasOwn,
     hyphenate: hyphenate,
     camelize: camelize,
@@ -2988,8 +2987,6 @@
     matches: matches,
     closest: closest,
     parent: parent,
-    parents: parents,
-    children: children,
     escape: escape,
     css: css,
     getStyles: getStyles,
@@ -3083,7 +3080,6 @@
       }
 
     }
-
   }
 
   function hooksAPI(UIkit) {
@@ -3109,6 +3105,11 @@
 
       this._data = {};
       this._computeds = {};
+      this._frames = {
+        reads: {},
+        writes: {}
+      };
+
       this._initProps();
 
       this._callHook('beforeConnect');
@@ -3194,6 +3195,54 @@
 
     };
 
+    UIkit.prototype._callWatches = function () {
+      var this$1 = this;
+
+
+      var ref = this;
+      var _frames = ref._frames;
+
+      if (_frames.watch) {
+        return;
+      }
+
+      var initital = !hasOwn(_frames, 'watch');
+
+      _frames.watch = fastdom.read(function () {
+
+        if (!this$1._connected) {
+          return;
+        }
+
+        var ref = this$1;
+        var computed = ref.$options.computed;
+        var _computeds = ref._computeds;
+
+        for (var key in computed) {
+
+          var hasPrev = hasOwn(_computeds, key);
+          var prev = _computeds[key];
+
+          delete _computeds[key];
+
+          var ref$1 = computed[key];
+          var watch = ref$1.watch;
+          var immediate = ref$1.immediate;
+          if (watch && (
+            initital && immediate ||
+            hasPrev && !isEqual(prev, this$1[key])
+          )) {
+            watch.call(this$1, this$1[key], prev);
+          }
+
+        }
+
+        _frames.watch = null;
+
+      });
+
+    };
+
   }
 
   function stateAPI(UIkit) {
@@ -3209,12 +3258,6 @@
       this.$el = null;
       this.$props = {};
 
-      this._frames = {
-        reads: {},
-        writes: {}
-      };
-      this._events = [];
-
       this._uid = uid++;
       this._initData();
       this._initMethods();
@@ -3263,25 +3306,6 @@
       }
     };
 
-    UIkit.prototype._callWatches = function () {
-
-      var ref = this;
-      var computed = ref.$options.computed;
-      var _computeds = ref._computeds;
-
-      for (var key in _computeds) {
-
-        var value = _computeds[key];
-        delete _computeds[key];
-
-        if (computed[key].watch && !isEqual(value, this[key])) {
-          computed[key].watch.call(this, this[key], value);
-        }
-
-      }
-
-    };
-
     UIkit.prototype._initProps = function (props) {
 
       var key;
@@ -3306,6 +3330,8 @@
       var this$1 = this;
 
 
+      this._events = [];
+
       var ref = this.$options;
       var events = ref.events;
 
@@ -3329,7 +3355,7 @@
       this._events.forEach(function (unbind) {
         return unbind();
       });
-      this._events = [];
+      delete this._events;
     };
 
     UIkit.prototype._initObserver = function () {
@@ -3554,6 +3580,10 @@
 
     var DATA = UIkit.data;
 
+    UIkit.prototype.$create = function (component, element, data) {
+      return UIkit[component](element, data);
+    };
+
     UIkit.prototype.$mount = function (el) {
 
       var ref = this.$options;
@@ -3576,10 +3606,6 @@
       }
     };
 
-    UIkit.prototype.$emit = function (e) {
-      this._callUpdate(e);
-    };
-
     UIkit.prototype.$reset = function () {
       this._callDisconnected();
       this._callConnected();
@@ -3614,11 +3640,16 @@
       }
     };
 
-    UIkit.prototype.$create = function (component, element, data) {
-      return UIkit[component](element, data);
+    UIkit.prototype.$emit = function (e) {
+      this._callUpdate(e);
+    };
+
+    UIkit.prototype.$update = function (element, e) {
+      if (element === void 0) element = this.$el;
+
+      UIkit.update(element, e);
     };
 
-    UIkit.prototype.$update = UIkit.update;
     UIkit.prototype.$getComponent = UIkit.getComponent;
 
     var names = {};
@@ -3768,7 +3799,7 @@
   UIkit.data = '__uikit__';
   UIkit.prefix = 'uk-';
   UIkit.options = {};
-  UIkit.version = '3.3.0';
+  UIkit.version = '3.4.0';
 
   globalAPI(UIkit);
   hooksAPI(UIkit);
@@ -3855,16 +3886,6 @@
 
         });
 
-        // Force click event anywhere on iOS < 13
-        if (pointerDown === 'touchstart') {
-          css(document.body, 'cursor', 'pointer');
-          once(document, (pointerUp + " " + pointerCancel), function () {
-            return setTimeout(function () {
-              return css(document.body, 'cursor', '');
-            }, 50);
-          });
-        }
-
       }, {
         passive: true
       });
@@ -3901,7 +3922,13 @@
       }
 
       (new MutationObserver(function (mutations) {
-        return mutations.forEach(applyMutation);
+        var updates = [];
+        mutations.forEach(function (mutation) {
+          return applyMutation(mutation, updates);
+        });
+        updates.forEach(function (el) {
+          return UIkit.update(el);
+        });
       })).observe(document, {
         childList: true,
         subtree: true,
@@ -3912,7 +3939,7 @@
       UIkit._initialized = true;
     }
 
-    function applyMutation(mutation) {
+    function applyMutation(mutation, updates) {
 
       var target = mutation.target;
       var type = mutation.type;
@@ -3921,7 +3948,11 @@
         applyChildList(mutation) :
         applyAttribute(mutation);
 
-      update && UIkit.update(target);
+      if (update && !updates.some(function (element) {
+        return element.contains(target);
+      })) {
+        updates.push(target.contains ? target : target.parentNode); // IE 11 text node does not implement contains
+      }
 
     }
 
@@ -4052,7 +4083,7 @@
 
           var p;
 
-          if (!this$1.queued || !isUndefined(animate) || !isUndefined(show) || !this$1.hasAnimation || targets.length < 2) {
+          if (!this$1.queued || !isUndefined(show) || !this$1.hasAnimation || targets.length < 2) {
 
             p = all(targets);
 
@@ -4087,10 +4118,6 @@
         });
       },
 
-      toggleNow: function (targets, show) {
-        return this.toggleElement(targets, show, false);
-      },
-
       isToggled: function (el) {
         var nodes = toNodes(el || this.$el);
         return this.cls ?
@@ -4162,7 +4189,11 @@
         });
 
         this.updateAria(el);
-        changed && this.$update(el);
+
+        if (changed) {
+          trigger(el, 'toggled', [this]);
+          this.$update(el);
+        }
       }
 
     }
@@ -4212,22 +4243,21 @@
     };
   }
 
-  function toggleAnimation(ref) {
-    var animation = ref.animation;
-    var duration = ref.duration;
-    var origin = ref.origin;
-    var _toggle = ref._toggle;
-
+  function toggleAnimation(cmp) {
     return function (el, show) {
 
       Animation.cancel(el);
 
+      var animation = cmp.animation;
+      var duration = cmp.duration;
+      var _toggle = cmp._toggle;
+
       if (show) {
         _toggle(el, true);
-        return Animation.in(el, animation[0], duration, origin);
+        return Animation.in(el, animation[0], duration, cmp.origin);
       }
 
-      return Animation.out(el, animation[1] || animation[0], duration, origin).then(function () {
+      return Animation.out(el, animation[1] || animation[0], duration, cmp.origin).then(function () {
         return _toggle(el, false);
       });
     };
@@ -4244,7 +4274,8 @@
       multiple: Boolean,
       toggle: String,
       content: String,
-      transition: String
+      transition: String,
+      offset: Number
     },
 
     data: {
@@ -4256,15 +4287,43 @@
       clsOpen: 'uk-open',
       toggle: '> .uk-accordion-title',
       content: '> .uk-accordion-content',
-      transition: 'ease'
+      transition: 'ease',
+      offset: 0
     },
 
     computed: {
 
-      items: function (ref, $el) {
-        var targets = ref.targets;
+      items: {
+
+        get: function (ref, $el) {
+          var targets = ref.targets;
+
+          return $$(targets, $el);
+        },
+
+        watch: function (items, prev) {
+          var this$1 = this;
+
+
+          items.forEach(function (el) {
+            return hide($(this$1.content, el), !hasClass(el, this$1.clsOpen));
+          });
+
+          if (prev || hasClass(items, this.clsOpen)) {
+            return;
+          }
+
+          var active = this.active !== false && items[Number(this.active)] ||
+            !this.collapsible && items[0];
+
+          if (active) {
+            this.toggle(active, false);
+          }
+
+        },
+
+        immediate: true
 
-        return $$(targets, $el);
       }
 
     },
@@ -4288,91 +4347,66 @@
 
     ],
 
-    connected: function () {
-
-      if (this.active === false) {
-        return;
-      }
-
-      var active = this.items[Number(this.active)];
-      if (active && !hasClass(active, this.clsOpen)) {
-        this.toggle(active, false);
-      }
-    },
-
-    update: function () {
-      var this$1 = this;
-
-
-      this.items.forEach(function (el) {
-        return this$1._toggle($(this$1.content, el), hasClass(el, this$1.clsOpen));
-      });
-
-      var active = !this.collapsible && !hasClass(this.items, this.clsOpen) && this.items[0];
-      if (active) {
-        this.toggle(active, false);
-      }
-    },
-
     methods: {
 
       toggle: function (item, animate) {
         var this$1 = this;
 
 
-        var index = getIndex(item, this.items);
-        var active = filter(this.items, ("." + (this.clsOpen)));
+        var items = [this.items[getIndex(item, this.items)]];
+        var activeItems = filter(this.items, ("." + (this.clsOpen)));
+
+        if (!this.multiple && !includes(activeItems, items[0])) {
+          items = items.concat(activeItems);
+        }
+
+        if (!this.collapsible && !filter(items, (":not(." + (this.clsOpen) + ")")).length) {
+          return;
+        }
 
-        item = this.items[index];
+        items.forEach(function (el) {
+          return this$1.toggleElement(el, !hasClass(el, this$1.clsOpen), function (el, show) {
 
-        item && [item]
-          .concat(!this.multiple && !includes(active, item) && active || [])
-          .forEach(function (el) {
+            toggleClass(el, this$1.clsOpen, show);
 
-            var isItem = el === item;
-            var state = isItem && !hasClass(el, this$1.clsOpen);
+            var content = $(("" + (el._wrapper ? '> * ' : '') + (this$1.content)), el);
 
-            if (!state && isItem && !this$1.collapsible && active.length < 2) {
+            if (animate === false || !this$1.hasTransition) {
+              hide(content, !show);
               return;
             }
 
-            toggleClass(el, this$1.clsOpen, state);
-
-            var content = el._wrapper ? el._wrapper.firstElementChild : $(this$1.content, el);
-
             if (!el._wrapper) {
-              el._wrapper = wrapAll(content, '<div>');
-              attr(el._wrapper, 'hidden', state ? '' : null);
+              el._wrapper = wrapAll(content, ("<div" + (show ? ' hidden' : '') + ">"));
             }
 
-            this$1._toggle(content, true);
-            this$1.toggleElement(el._wrapper, state, animate).then(function () {
-
-              if (hasClass(el, this$1.clsOpen) !== state) {
-                return;
-              }
+            hide(content, false);
+            return toggleHeight(this$1)(el._wrapper, show).then(function () {
+              hide(content, !show);
+              delete el._wrapper;
+              unwrap(content);
 
-              if (!state) {
-                this$1._toggle(content, false);
-              } else {
+              if (show) {
                 var toggle = $(this$1.$props.toggle, el);
-                if (animate !== false && !isInView(toggle)) {
-                  scrollIntoView(toggle);
+                if (!isInView(toggle)) {
+                  scrollIntoView(toggle, {
+                    offset: this$1.offset
+                  });
                 }
               }
-
-              el._wrapper = null;
-              unwrap(content);
-
             });
-
           });
+        });
       }
 
     }
 
   };
 
+  function hide(el, hide) {
+    attr(el, 'hidden', hide ? '' : null);
+  }
+
   var alert = {
 
     mixins: [Class, Togglable],
@@ -4512,7 +4546,7 @@
       read: function () {
 
         var el = this.$el;
-        var ref = el.parentNode;
+        var ref = getPositionedParent(el) || el.parentNode;
         var height = ref.offsetHeight;
         var width = ref.offsetWidth;
         var dim = Dimensions.cover({
@@ -4546,6 +4580,14 @@
 
   };
 
+  function getPositionedParent(el) {
+    while ((el = parent(el))) {
+      if (css(el, 'position') !== 'static') {
+        return el;
+      }
+    }
+  }
+
   var Position = {
 
     props: {
@@ -4632,7 +4674,7 @@
 
   var active;
 
-  var Drop = {
+  var drop = {
 
     mixins: [Position, Togglable],
 
@@ -4821,7 +4863,7 @@
         },
 
         handler: function (e) {
-          if (!isTouch(e) && !matches(this.$el, ':hover')) {
+          if (!isTouch(e)) {
             this.hide();
           }
         }
@@ -4830,11 +4872,16 @@
 
       {
 
-        name: 'beforeshow',
+        name: 'toggled',
 
         self: true,
 
         handler: function () {
+
+          if (!this.isToggled()) {
+            return;
+          }
+
           this.clearTimers();
           Animation.cancel(this.$el);
           this.position();
@@ -4857,19 +4904,22 @@
           this.tracker.init();
           trigger(this.$el, 'updatearia');
 
-          // If triggered from an click event handler, delay adding the click handler
-          var off = delayOn(document, 'click', function (ref) {
-            var defaultPrevented = ref.defaultPrevented;
+          once(this.$el, 'hide', on(document, pointerDown, function (ref) {
             var target = ref.target;
 
-            if (!defaultPrevented && !within(target, this$1.$el) && !(this$1.toggle && within(target, this$1.toggle.$el))) {
-              this$1.hide(false);
-            }
-          });
+            return !within(target, this$1.$el) && once(document, (pointerUp + " " + pointerCancel + " scroll"), function (ref) {
+              var defaultPrevented = ref.defaultPrevented;
+              var type = ref.type;
+              var newTarget = ref.target;
 
-          once(this.$el, 'hide', off, {
+              if (!defaultPrevented && type === pointerUp && target === newTarget && !(this$1.toggle && within(target, this$1.toggle.$el))) {
+                this$1.hide(false);
+              }
+            }, true);
+          }), {
             self: true
           });
+
         }
 
       },
@@ -4985,7 +5035,7 @@
 
 
         var hide = function () {
-          return this$1.toggleNow(this$1.$el, false);
+          return this$1.toggleElement(this$1.$el, false, false);
         };
 
         this.clearTimers();
@@ -5018,11 +5068,6 @@
       position: function () {
 
         removeClasses(this.$el, ((this.clsDrop) + "-(stack|boundary)"));
-        css(this.$el, {
-          top: '',
-          left: '',
-          display: 'block'
-        });
         toggleClass(this.$el, ((this.clsDrop) + "-boundary"), this.boundaryAlign);
 
         var boundary = offset(this.boundary);
@@ -5037,8 +5082,6 @@
 
         this.positionAt(this.$el, this.boundaryAlign ? this.boundary : this.toggle.$el, this.boundary);
 
-        css(this.$el, 'display', '');
-
       }
 
     }
@@ -5046,25 +5089,13 @@
   };
 
   function getPositionedElements(el) {
-    var result = css(el, 'position') !== 'static' ? [el] : [];
-    return result.concat.apply(result, children(el).map(getPositionedElements));
-  }
-
-  function delayOn(el, type, fn) {
-    var off = once(el, type, function () {
-      return off = on(el, type, fn);
-    }, true);
-    return function () {
-      return off();
-    };
+    var result = [];
+    apply(el, function (el) {
+      return css(el, 'position') !== 'static' && result.push(el);
+    });
+    return result;
   }
 
-  var dropdown = {
-
-    extends: Drop
-
-  };
-
   var formCustom = {
 
     mixins: [Class],
@@ -5134,7 +5165,7 @@
         name: 'change',
 
         handler: function () {
-          this.$emit();
+          this.$update();
         }
       },
 
@@ -5146,7 +5177,7 @@
         },
 
         handler: function () {
-          this.$emit();
+          this.$update();
         }
       }
 
@@ -5193,22 +5224,10 @@
 
     update: {
 
-      read: function (data) {
-
-        var items = this.$el.children;
-        var rows = [
-          []
-        ];
-
-        if (!items.length || !isVisible(this.$el)) {
-          return data.rows = rows;
-        }
-
-        data.rows = getRows(items);
-        data.stacks = !data.rows.some(function (row) {
-          return row.length > 1;
-        });
-
+      read: function () {
+        return {
+          rows: getRows(this.$el.children)
+        };
       },
 
       write: function (ref) {
@@ -5232,6 +5251,7 @@
   };
 
   function getRows(items) {
+
     var rows = [
       []
     ];
@@ -5239,12 +5259,13 @@
     for (var i = 0; i < items.length; i++) {
 
       var el = items[i];
-      var dim = getOffset(el);
 
-      if (!dim.height) {
+      if (!isVisible(el)) {
         continue;
       }
 
+      var dim = getOffset(el);
+
       for (var j = rows.length - 1; j >= 0; j--) {
 
         var row = rows[j];
@@ -5267,7 +5288,7 @@
           break;
         }
 
-        if (dim.bottom > leftDim.top) {
+        if (dim.bottom > leftDim.top || dim.top === leftDim.top) {
 
           if (dim.left < leftDim.left && !isRtl) {
             row.unshift(el);
@@ -5354,11 +5375,21 @@
 
       {
 
-        write: function (ref) {
-          var stacks = ref.stacks;
-
-          toggleClass(this.$el, this.clsStack, stacks);
-        },
+        read: function (ref) {
+          var rows = ref.rows;
+
+          return {
+            stacks: !rows.some(function (row) {
+              return row.length > 1;
+            })
+          };
+        },
+
+        write: function (ref) {
+          var stacks = ref.stacks;
+
+          toggleClass(this.$el, this.clsStack, stacks);
+        },
 
         events: ['resize']
 
@@ -5370,19 +5401,18 @@
           var rows = ref.rows;
 
 
-          if (this.masonry || this.parallax) {
-            rows = rows.map(function (elements) {
-              return sortBy(elements, 'offsetLeft');
-            });
+          if (!this.masonry && !this.parallax) {
+            return false;
+          }
 
-            if (isRtl) {
-              rows.map(function (row) {
-                return row.reverse();
-              });
-            }
+          rows = rows.map(function (elements) {
+            return sortBy(elements, 'offsetLeft');
+          });
 
-          } else {
-            return false;
+          if (isRtl) {
+            rows.map(function (row) {
+              return row.reverse();
+            });
           }
 
           var transitionInProgress = rows.some(function (elements) {
@@ -5424,13 +5454,10 @@
         },
 
         write: function (ref) {
-          var stacks = ref.stacks;
           var height = ref.height;
           var padding = ref.padding;
 
 
-          toggleClass(this.$el, this.clsStack, stacks);
-
           css(this.$el, 'paddingBottom', padding);
           height !== false && css(this.$el, 'height', height);
 
@@ -5977,7 +6004,7 @@
     return svg && svg.hasChildNodes() && svg;
   }
 
-  var symbolRe = /<symbol(.*?id=(['"])(.*?)\2[^]*?<\/)symbol>/g;
+  var symbolRe = /<symbol([^]*?id=(['"])(.+?)\2[^]*?<\/)symbol>/g;
   var symbols = {};
 
   function parseSymbols(svg, icon) {
@@ -5986,13 +6013,13 @@
 
       symbols[svg] = {};
 
+      symbolRe.lastIndex = 0;
+
       var match;
       while ((match = symbolRe.exec(svg))) {
         symbols[svg][match[3]] = "<svg xmlns=\"http://www.w3.org/2000/svg\"" + (match[1]) + "svg>";
       }
 
-      symbolRe.lastIndex = 0;
-
     }
 
     return symbols[svg][icon];
@@ -6009,12 +6036,17 @@
   }
 
   function getMaxPathLength(el) {
-    return Math.ceil(Math.max.apply(Math, $$('[stroke]', el).map(function (stroke) {
-      return stroke.getTotalLength && stroke.getTotalLength() || 0;
-    }).concat([0])));
+    return Math.ceil(Math.max.apply(Math, [0].concat($$('[stroke]', el).map(function (stroke) {
+      try {
+        return stroke.getTotalLength();
+      } catch (e) {
+        return 0;
+      }
+    }))));
   }
 
   function insertSVG(el, root) {
+
     if (isVoidElement(root) || root.tagName === 'CANVAS') {
 
       attr(root, 'hidden', true);
@@ -6024,14 +6056,12 @@
         next :
         after(root, el);
 
-    } else {
-
-      var last = root.lastElementChild;
-      return equals(el, last) ?
-        last :
-        append(root, el);
-
     }
+
+    var last = root.lastElementChild;
+    return equals(el, last) ?
+      last :
+      append(root, el);
   }
 
   function equals(el, other) {
@@ -6426,7 +6456,7 @@
       observe: function () {
         var this$1 = this;
 
-        if (!this._data.image && this._connected) {
+        if (this._connected && !this._data.image) {
           this.target.forEach(function (el) {
             return this$1.observer.observe(el);
           });
@@ -6709,7 +6739,7 @@
 
     beforeDisconnect: function () {
       if (this.isToggled()) {
-        this.toggleNow(this.$el, false);
+        this.toggleElement(this.$el, false, false);
       }
     },
 
@@ -6743,7 +6773,10 @@
           }
 
           e.preventDefault();
-          this.toggle();
+
+          if (this.isToggled() === includes(active$1, this)) {
+            this.toggle();
+          }
         }
 
       },
@@ -6785,21 +6818,29 @@
             css(document.body, 'overflowY', 'scroll');
           }
 
+          this.stack && css(this.$el, 'zIndex', css(this.$el, 'zIndex') + active$1.length);
+
           addClass(document.documentElement, this.clsPage);
 
           if (this.bgClose) {
-            once(this.$el, 'hide', delayOn(document, 'click', function (ref) {
-              var defaultPrevented = ref.defaultPrevented;
+            once(this.$el, 'hide', on(document, pointerDown, function (ref) {
               var target = ref.target;
 
-              var current = last(active$1);
-              if (!defaultPrevented &&
-                current === this$1 &&
-                (!current.overlay || within(target, current.$el)) &&
-                !within(target, current.panel)
-              ) {
-                current.hide();
+
+              if (last(active$1) !== this$1 || this$1.overlay && !within(target, this$1.$el) || within(target, this$1.panel)) {
+                return;
               }
+
+              once(document, (pointerUp + " " + pointerCancel + " scroll"), function (ref) {
+                var defaultPrevented = ref.defaultPrevented;
+                var type = ref.type;
+                var newTarget = ref.target;
+
+                if (!defaultPrevented && type === pointerUp && target === newTarget) {
+                  this$1.hide();
+                }
+              }, true);
+
             }), {
               self: true
             });
@@ -6807,10 +6848,9 @@
 
           if (this.escClose) {
             once(this.$el, 'hide', on(document, 'keydown', function (e) {
-              var current = last(active$1);
-              if (e.keyCode === 27 && current === this$1) {
+              if (e.keyCode === 27 && last(active$1) === this$1) {
                 e.preventDefault();
-                current.hide();
+                this$1.hide();
               }
             }), {
               self: true
@@ -6836,6 +6876,8 @@
             css(document.body, 'overflowY', '');
           }
 
+          css(this.$el, 'zIndex', '');
+
           if (!active$1.some(function (modal) {
             return modal.clsPage === this$1.clsPage;
           })) {
@@ -6957,16 +6999,21 @@
 
   };
 
-  function install$1(UIkit) {
+  function install$1(ref) {
+    var modal = ref.modal;
+
 
-    UIkit.modal.dialog = function (content, options) {
+    modal.dialog = function (content, options) {
 
-      var dialog = UIkit.modal((" <div class=\"uk-modal\"> <div class=\"uk-modal-dialog\">" + content + "</div> </div> "), options);
+      var dialog = modal(
+        ("<div class=\"uk-modal\"> <div class=\"uk-modal-dialog\">" + content + "</div> </div>"),
+        options
+      );
 
       dialog.show();
 
       on(dialog.$el, 'hidden', function () {
-        return Promise.resolve(function () {
+        return Promise.resolve().then(function () {
           return dialog.$destroy(true);
         });
       }, {
@@ -6976,86 +7023,84 @@
       return dialog;
     };
 
-    UIkit.modal.alert = function (message, options) {
+    modal.alert = function (message, options) {
+      return openDialog(
+        function (ref) {
+          var labels = ref.labels;
 
-      options = assign({
-        bgClose: false,
-        escClose: false,
-        labels: UIkit.modal.labels
-      }, options);
-
-      return new Promise(
-        function (resolve) {
-          return on(UIkit.modal.dialog((" <div class=\"uk-modal-body\">" + (isString(message) ? message : html(message)) + "</div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-primary uk-modal-close\" autofocus>" + (options.labels.ok) + "</button> </div> "), options).$el, 'hide', resolve);
+          return ("<div class=\"uk-modal-body\">" + (isString(message) ? message : html(message)) + "</div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-primary uk-modal-close\" autofocus>" + (labels.ok) + "</button> </div>");
+        },
+        options,
+        function (deferred) {
+          return deferred.resolve();
         }
       );
     };
 
-    UIkit.modal.confirm = function (message, options) {
-
-      options = assign({
-        bgClose: false,
-        escClose: true,
-        labels: UIkit.modal.labels
-      }, options);
-
-      return new Promise(function (resolve, reject) {
+    modal.confirm = function (message, options) {
+      return openDialog(
+        function (ref) {
+          var labels = ref.labels;
 
-        var confirm = UIkit.modal.dialog((" <form> <div class=\"uk-modal-body\">" + (isString(message) ? message : html(message)) + "</div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-default uk-modal-close\" type=\"button\">" + (options.labels.cancel) + "</button> <button class=\"uk-button uk-button-primary\" autofocus>" + (options.labels.ok) + "</button> </div> </form> "), options);
+          return ("<form> <div class=\"uk-modal-body\">" + (isString(message) ? message : html(message)) + "</div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-default uk-modal-close\" type=\"button\">" + (labels.cancel) + "</button> <button class=\"uk-button uk-button-primary\" autofocus>" + (labels.ok) + "</button> </div> </form>");
+        },
+        options,
+        function (deferred) {
+          return deferred.reject();
+        }
+      );
+    };
 
-        var resolved = false;
+    modal.prompt = function (message, value, options) {
+      return openDialog(
+        function (ref) {
+          var labels = ref.labels;
 
-        on(confirm.$el, 'submit', 'form', function (e) {
-          e.preventDefault();
-          resolve();
-          resolved = true;
-          confirm.hide();
-        });
-        on(confirm.$el, 'hide', function () {
-          if (!resolved) {
-            reject();
-          }
-        });
+          return ("<form class=\"uk-form-stacked\"> <div class=\"uk-modal-body\"> <label>" + (isString(message) ? message : html(message)) + "</label> <input class=\"uk-input\" value=\"" + (value || '') + "\" autofocus> </div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-default uk-modal-close\" type=\"button\">" + (labels.cancel) + "</button> <button class=\"uk-button uk-button-primary\">" + (labels.ok) + "</button> </div> </form>");
+        },
+        options,
+        function (deferred) {
+          return deferred.resolve(null);
+        },
+        function (dialog) {
+          return $('input', dialog.$el).value;
+        }
+      );
+    };
 
-      });
+    modal.labels = {
+      ok: 'Ok',
+      cancel: 'Cancel'
     };
 
-    UIkit.modal.prompt = function (message, value, options) {
+    function openDialog(tmpl, options, hideFn, submitFn) {
 
       options = assign({
         bgClose: false,
         escClose: true,
-        labels: UIkit.modal.labels
+        labels: modal.labels
       }, options);
 
-      return new Promise(function (resolve) {
+      var dialog = modal.dialog(tmpl(options), options);
+      var deferred = new Deferred();
 
-        var prompt = UIkit.modal.dialog((" <form class=\"uk-form-stacked\"> <div class=\"uk-modal-body\"> <label>" + (isString(message) ? message : html(message)) + "</label> <input class=\"uk-input\" autofocus> </div> <div class=\"uk-modal-footer uk-text-right\"> <button class=\"uk-button uk-button-default uk-modal-close\" type=\"button\">" + (options.labels.cancel) + "</button> <button class=\"uk-button uk-button-primary\">" + (options.labels.ok) + "</button> </div> </form> "), options),
-          input = $('input', prompt.$el);
+      var resolved = false;
 
-        input.value = value;
-
-        var resolved = false;
-
-        on(prompt.$el, 'submit', 'form', function (e) {
-          e.preventDefault();
-          resolve(input.value);
-          resolved = true;
-          prompt.hide();
-        });
-        on(prompt.$el, 'hide', function () {
-          if (!resolved) {
-            resolve(null);
-          }
-        });
+      on(dialog.$el, 'submit', 'form', function (e) {
+        e.preventDefault();
+        deferred.resolve(submitFn && submitFn(dialog));
+        resolved = true;
+        dialog.hide();
+      });
 
+      on(dialog.$el, 'hide', function () {
+        return !resolved && hideFn(deferred);
       });
-    };
 
-    UIkit.modal.labels = {
-      ok: 'Ok',
-      cancel: 'Cancel'
-    };
+      deferred.promise.dialog = dialog;
+
+      return deferred.promise;
+    }
 
   }
 
@@ -7131,55 +7176,67 @@
         return ("bottom-" + align);
       },
 
-      dropdowns: function (ref, $el) {
-        var dropdown = ref.dropdown;
-        var clsDrop = ref.clsDrop;
+      dropbar: {
 
-        return $$((dropdown + " ." + clsDrop), $el);
-      }
+        get: function (ref) {
+          var dropbar = ref.dropbar;
 
-    },
 
-    beforeConnect: function () {
+          if (!dropbar) {
+            return null;
+          }
 
-      var ref = this.$props;
-      var dropbar = ref.dropbar;
+          dropbar = this._dropbar || query(dropbar, this.$el) || $('+ .uk-navbar-dropbar', this.$el);
 
-      this.dropbar = dropbar && (query(dropbar, this.$el) || $('+ .uk-navbar-dropbar', this.$el) || $('<div></div>'));
+          return dropbar ? dropbar : (this._dropbar = $('<div></div>'));
 
-      if (this.dropbar) {
+        },
 
-        addClass(this.dropbar, 'uk-navbar-dropbar');
+        watch: function (dropbar) {
+          addClass(dropbar, 'uk-navbar-dropbar');
+          toggleClass(dropbar, 'uk-navbar-dropbar-slide', this.dropbarMode === 'slide');
+        },
 
-        if (this.dropbarMode === 'slide') {
-          addClass(this.dropbar, 'uk-navbar-dropbar-slide');
-        }
-      }
+        immediate: true
 
-    },
+      },
 
-    disconnected: function () {
-      this.dropbar && remove(this.dropbar);
-    },
+      dropdowns: {
 
-    update: function () {
-      var this$1 = this;
+        get: function (ref, $el) {
+          var dropdown = ref.dropdown;
+          var clsDrop = ref.clsDrop;
 
+          return $$((dropdown + " ." + clsDrop), $el);
+        },
 
-      this.$create(
-        'drop',
-        this.dropdowns.filter(function (el) {
-          return !this$1.getDropdown(el);
-        }),
-        assign({}, this.$props, {
-          boundary: this.boundary,
-          pos: this.pos,
-          offset: this.dropbar || this.offset
-        })
-      );
+        watch: function (dropdowns) {
+          var this$1 = this;
+
+          this.$create(
+            'drop',
+            dropdowns.filter(function (el) {
+              return !this$1.getDropdown(el);
+            }),
+            assign({}, this.$props, {
+              boundary: this.boundary,
+              pos: this.pos,
+              offset: this.dropbar || this.offset
+            })
+          );
+        },
+
+        immediate: true
+
+      }
 
     },
 
+    disconnected: function () {
+      this.dropbar && remove(this.dropbar);
+      delete this._dropbar;
+    },
+
     events: [
 
       {
@@ -7702,12 +7759,10 @@
   var scroll = {
 
     props: {
-      duration: Number,
       offset: Number
     },
 
     data: {
-      duration: 1000,
       offset: 0
     },
 
@@ -7720,7 +7775,9 @@
         el = el && $(el) || document.body;
 
         if (trigger(this.$el, 'beforescroll', [this, el])) {
-          scrollIntoView(el, this.$props).then(function () {
+          scrollIntoView(el, {
+            offset: this.offset
+          }).then(function () {
             return trigger(this$1.$el, 'scrolled', [this$1, el]);
           });
         }
@@ -7774,25 +7831,27 @@
 
     computed: {
 
-      elements: function (ref, $el) {
-        var target = ref.target;
-
-        return target ? $$(target, $el) : [$el];
-      }
+      elements: {
 
-    },
-
-    update: [
+        get: function (ref, $el) {
+          var target = ref.target;
 
-      {
+          return target ? $$(target, $el) : [$el];
+        },
 
-        write: function () {
+        watch: function (elements) {
           if (this.hidden) {
-            css(filter(this.elements, (":not(." + (this.inViewClass) + ")")), 'visibility', 'hidden');
+            css(filter(elements, (":not(." + (this.inViewClass) + ")")), 'visibility', 'hidden');
           }
-        }
+        },
 
-      },
+        immediate: true
+
+      }
+
+    },
+
+    update: [
 
       {
 
@@ -7828,7 +7887,7 @@
 
           // Let child components be applied at least once first
           if (!data.update) {
-            this.$emit();
+            this.$update();
             return data.update = true;
           }
 
@@ -7903,10 +7962,24 @@
 
     computed: {
 
-      links: function (_, $el) {
-        return $$('a[href^="#"]', $el).filter(function (el) {
-          return el.hash;
-        });
+      links: {
+
+        get: function (_, $el) {
+          return $$('a[href^="#"]', $el).filter(function (el) {
+            return el.hash;
+          });
+        },
+
+        watch: function (links) {
+          if (this.scroll) {
+            this.$create('scroll', links, {
+              offset: this.offset || 0
+            });
+          }
+        },
+
+        immediate: true
+
       },
 
       targets: function () {
@@ -7918,27 +7991,13 @@
       elements: function (ref) {
         var selector = ref.closest;
 
-        return closest($$(this.targets.map(function (el) {
-          return ("[href=\"#" + (el.id) + "\"]");
-        }).join(',')), selector || '*');
+        return closest(this.links, selector || '*');
       }
 
     },
 
     update: [
 
-      {
-
-        read: function () {
-          if (this.scroll) {
-            this.$create('scroll', this.links, {
-              offset: this.offset || 0
-            });
-          }
-        }
-
-      },
-
       {
 
         read: function () {
@@ -7956,18 +8015,15 @@
           var scrollTop = scrollElement.scrollTop;
           var scrollHeight = scrollElement.scrollHeight;
           var viewport = getViewport(scrollElement);
-          var scroll = scrollTop;
           var max = scrollHeight - offset(viewport).height;
           var active = false;
 
-          if (scroll === max) {
+          if (scrollTop === max) {
             active = length - 1;
           } else {
 
             this.targets.every(function (el, i) {
-              var ref = position(el, viewport);
-              var top = ref.top;
-              if (top - this$1.offset <= 0) {
+              if (position(el, viewport).top - this$1.offset <= 0) {
                 active = i;
                 return true;
               }
@@ -8392,16 +8448,49 @@
 
     computed: {
 
-      connects: function (ref, $el) {
-        var connect = ref.connect;
+      connects: {
+
+        get: function (ref, $el) {
+          var connect = ref.connect;
+
+          return queryAll(connect, $el);
+        },
+
+        watch: function (connects) {
+          var this$1 = this;
+
+
+          connects.forEach(function (list) {
+            return this$1.updateAria(list.children);
+          });
+
+          if (this.swiping) {
+            css(connects, 'touch-action', 'pan-y pinch-zoom');
+          }
+
+        },
+
+        immediate: true
 
-        return queryAll(connect, $el);
       },
 
-      toggles: function (ref, $el) {
-        var toggle = ref.toggle;
+      toggles: {
+
+        get: function (ref, $el) {
+          var toggle = ref.toggle;
+
+          return $$(toggle, $el).filter(function (el) {
+            return !matches(el, '.uk-disabled *, .uk-disabled, [disabled]');
+          });
+        },
+
+        watch: function (toggles) {
+          var active = this.index();
+          this.show(~active && active || toggles[this.active] || toggles[0]);
+        },
+
+        immediate: true
 
-        return $$(toggle, $el);
       }
 
     },
@@ -8413,14 +8502,15 @@
         name: 'click',
 
         delegate: function () {
-          return ((this.toggle) + ":not(.uk-disabled)");
+          return this.toggle;
         },
 
         handler: function (e) {
+          if (!includes(this.toggles, e.current)) {
+            return;
+          }
           e.preventDefault();
-          this.show(children(this.$el).filter(function (el) {
-            return within(e.current, el);
-          })[0]);
+          this.show(e.current);
         }
 
       },
@@ -8458,69 +8548,49 @@
 
           this.show(endsWith(type, 'Left') ? 'next' : 'previous');
         }
-      }
+      },
 
-    ],
+      {
+        name: 'show',
 
-    update: function () {
-      var this$1 = this;
+        el: function () {
+          return this.connects;
+        },
 
+        handler: function () {
+          var this$1 = this;
 
-      this.connects.forEach(function (list) {
-        return this$1.updateAria(list.children);
-      });
-      var ref = this.$el;
-      var children = ref.children;
-      this.show(filter(children, ("." + (this.cls)))[0] || children[this.active] || children[0]);
+          var index = this.index();
 
-      this.swiping && css(this.connects, 'touch-action', 'pan-y pinch-zoom');
+          this.toggles.forEach(function (toggle, i) {
+            toggleClass(children(this$1.$el).filter(function (el) {
+              return within(toggle, el);
+            }), this$1.cls, index === i);
+            attr(toggle, 'aria-expanded', index === i);
+          });
+        }
+      }
 
-    },
+    ],
 
     methods: {
 
       index: function () {
-        return !isEmpty(this.connects) ? index(filter(this.connects[0].children, ("." + (this.cls)))[0]) : -1;
+        return index(children(this.connects[0], ("." + (this.cls)))[0]);
       },
 
       show: function (item) {
         var this$1 = this;
 
 
-        var ref = this.$el;
-        var children = ref.children;
-        var length = children.length;
         var prev = this.index();
-        var hasPrev = prev >= 0;
-        var dir = item === 'previous' ? -1 : 1;
-
-        var toggle, active, next = getIndex(item, children, prev);
-
-        for (var i = 0; i < length; i++, next = (next + dir + length) % length) {
-          if (!matches(this.toggles[next], '.uk-disabled *, .uk-disabled, [disabled]')) {
-            toggle = this.toggles[next];
-            active = children[next];
-            break;
-          }
-        }
-
-        if (!active || prev === next) {
-          return;
-        }
+        var next = getIndex(item, this.toggles, prev);
 
-        removeClass(children, this.cls);
-        addClass(active, this.cls);
-        attr(this.toggles, 'aria-expanded', false);
-        attr(toggle, 'aria-expanded', true);
+        this.connects.forEach(function (ref) {
+          var children = ref.children;
 
-        this.connects.forEach(function (list) {
-          if (!hasPrev) {
-            this$1.toggleNow(list.children[next]);
-          } else {
-            this$1.toggleElement([list.children[prev], list.children[next]]);
-          }
+          return this$1.toggleElement([children[prev], children[next]], undefined, prev >= 0);
         });
-
       }
 
     }
@@ -8582,18 +8652,24 @@
 
     computed: {
 
-      target: function (ref, $el) {
-        var href = ref.href;
-        var target = ref.target;
+      target: {
 
-        target = queryAll(target || href, $el);
-        return target.length && target || [$el];
-      }
+        get: function (ref, $el) {
+          var href = ref.href;
+          var target = ref.target;
 
-    },
+          target = queryAll(target || href, $el);
+          return target.length && target || [$el];
+        },
+
+        watch: function () {
+          trigger(this.target, 'updatearia', [this]);
+        },
+
+        immediate: true
+
+      }
 
-    connected: function () {
-      trigger(this.target, 'updatearia', [this]);
     },
 
     events: [
@@ -8680,14 +8756,13 @@
 
   };
 
-
   var coreComponents = /*#__PURE__*/ Object.freeze({
     __proto__: null,
     Accordion: Accordion,
     Alert: alert,
     Cover: cover,
-    Drop: Drop,
-    Dropdown: dropdown,
+    Drop: drop,
+    Dropdown: drop,
     FormCustom: formCustom,
     Gif: gif,
     Grid: grid,
@@ -8859,16 +8934,12 @@
     methods: {
 
       start: function () {
-        var this$1 = this;
-
 
         this.stop();
 
         if (this.date && this.units.length) {
-          this.$emit();
-          this.timer = setInterval(function () {
-            return this$1.$emit();
-          }, 1000);
+          this.$update();
+          this.timer = setInterval(this.$update, 1000);
         }
 
       },
@@ -8941,7 +9012,7 @@
         children$1.forEach(Transition.cancel);
 
         reset(this.target);
-        this.$update(this.target);
+        this.$update(this.target, 'resize');
         fastdom.flush();
 
         var newHeight = height(this.target);
@@ -8990,16 +9061,21 @@
         children$1.forEach(function (el, i) {
           return propsFrom[i] && css(el, propsFrom[i]);
         });
-        css(this.target, 'height', oldHeight);
+        css(this.target, {
+          height: oldHeight,
+          display: 'block'
+        });
         scrollTop(window, oldScrollY);
 
-        return Promise.all(children$1.map(function (el, i) {
-          return propsFrom[i] && propsTo[i] ?
-            Transition.start(el, propsTo[i], this$1.animation, 'ease') :
-            Promise.resolve();
-        }).concat(Transition.start(this.target, {
-          height: newHeight
-        }, this.animation, 'ease'))).then(function () {
+        return Promise.all(
+          children$1.map(function (el, i) {
+            return ['top', 'left', 'height', 'width'].some(function (prop) {
+              return propsFrom[i][prop] !== propsTo[i][prop];
+            }) && Transition.start(el, propsTo[i], this$1.animation, 'ease');
+          }).concat(oldHeight !== newHeight && Transition.start(this.target, {
+            height: newHeight
+          }, this.animation, 'ease'))
+        ).then(function () {
           children$1.forEach(function (el, i) {
             return css(el, {
               display: propsTo[i].opacity === 0 ? 'none' : '',
@@ -9007,7 +9083,7 @@
             });
           });
           reset(this$1.target);
-          this$1.$update(this$1.target);
+          this$1.$update(this$1.target, 'resize');
           fastdom.flush(); // needed for IE11
         }, noop);
 
@@ -9041,7 +9117,10 @@
       width: ''
     });
     removeClass(el, targetClass);
-    css(el, 'height', '');
+    css(el, {
+      height: '',
+      display: ''
+    });
   }
 
   function getPositionWithMargin(el) {
@@ -9102,8 +9181,21 @@
         },
 
         watch: function () {
+          var this$1 = this;
+
+
           this.updateState();
-        }
+
+          if (this.selActive !== false) {
+            var actives = $$(this.selActive, this.$el);
+            this.toggles.forEach(function (el) {
+              return toggleClass(el, this$1.cls, includes(actives, el));
+            });
+          }
+
+        },
+
+        immediate: true
 
       },
 
@@ -9149,21 +9241,6 @@
 
     ],
 
-    connected: function () {
-      var this$1 = this;
-
-
-      this.updateState();
-
-      if (this.selActive !== false) {
-        var actives = $$(this.selActive, this.$el);
-        this.toggles.forEach(function (el) {
-          return toggleClass(el, this$1.cls, includes(actives, el));
-        });
-      }
-
-    },
-
     methods: {
 
       apply: function (el) {
@@ -9711,6 +9788,9 @@
         name: 'touchmove',
         passive: false,
         handler: 'move',
+        filter: function () {
+          return pointerMove === 'touchmove';
+        },
         delegate: function () {
           return this.selSlides;
         }
@@ -9762,7 +9842,8 @@
           this$1.unbindMove = null;
         };
         on(window, 'scroll', this.unbindMove);
-        on(document, pointerUp, this.end, true);
+        on(window.visualViewport, 'resize', this.unbindMove);
+        on(document, (pointerUp + " " + pointerCancel), this.end, true);
 
         css(this.list, 'userSelect', 'none');
 
@@ -9854,6 +9935,7 @@
       end: function () {
 
         off(window, 'scroll', this.unbindMove);
+        off(window.visualViewport, 'resize', this.unbindMove);
         this.unbindMove && this.unbindMove();
         off(document, pointerUp, this.end, true);
 
@@ -9931,7 +10013,7 @@
 
         if (this.nav && this.length !== this.nav.children.length) {
           html(this.nav, this.slides.map(function (_, i) {
-            return ("<li " + (this$1.attrItem) + "=\"" + i + "\"><a href=\"#\"></a></li>");
+            return ("<li " + (this$1.attrItem) + "=\"" + i + "\"><a href></a></li>");
           }).join(''));
         }
 
@@ -10115,7 +10197,7 @@
           return;
         }
 
-        var prevIndex = this.index;
+        var prevIndex = this.getIndex(this.index);
         var prev = hasClass(this.slides, this.clsActive) && this.slides[prevIndex];
         var nextIndex = this.getIndex(index, this.index);
         var next = this.slides[nextIndex];
@@ -10339,7 +10421,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>"
       });
     },
 
@@ -10348,7 +10430,7 @@
       var $el = $(this.template);
       var list = $(this.selList, $el);
       this.items.forEach(function () {
-        return append(list, '<li></li>');
+        return append(list, '<li>');
       });
 
       this.$mount(append(this.container, $el));
@@ -10444,7 +10526,7 @@
 
         handler: function (e) {
 
-          if (!this.isToggled(this.$el)) {
+          if (!this.isToggled(this.$el) || !this.draggable) {
             return;
           }
 
@@ -10473,7 +10555,7 @@
 
           e.preventDefault();
 
-          this.toggleNow(this.$el, true);
+          this.toggleElement(this.$el, true, false);
 
           this.animation = Animations$1['scale'];
           removeClass(e.target, this.clsActive);
@@ -10487,20 +10569,12 @@
 
         name: 'itemshow',
 
-        handler: function (ref) {
-          var target = ref.target;
-
-
-          var i = index(target);
-          var ref$1 = this.getItem(i);
-          var caption = ref$1.caption;
+        handler: function () {
 
-          css(this.caption, 'display', caption ? '' : 'none');
-          html(this.caption, caption);
+          html(this.caption, this.getItem().caption || '');
 
-          for (var j = 0; j <= this.preload; j++) {
-            this.loadItem(this.getIndex(i + j));
-            this.loadItem(this.getIndex(i - j));
+          for (var j = -this.preload; j <= this.preload; j++) {
+            this.loadItem(this.index + j);
           }
 
         }
@@ -10525,24 +10599,44 @@
           var this$1 = this;
 
 
-          var source = item.source;
+          var src = item.source;
           var type = item.type;
           var alt = item.alt;
+          if (alt === void 0) alt = '';
+          var poster = item.poster;
+          var attrs = item.attrs;
+          if (attrs === void 0) attrs = {};
 
           this.setItem(item, '<span uk-spinner></span>');
 
-          if (!source) {
+          if (!src) {
             return;
           }
 
           var matches;
+          var iframeAttrs = {
+            frameborder: '0',
+            allow: 'autoplay',
+            allowfullscreen: '',
+            style: 'max-width: 100%; box-sizing: border-box;',
+            'uk-responsive': '',
+            'uk-video': ("" + (this.videoAutoplay))
+          };
 
           // Image
-          if (type === 'image' || source.match(/\.(jpe?g|png|gif|svg|webp)($|\?)/i)) {
+          if (type === 'image' || src.match(/\.(jpe?g|png|gif|svg|webp)($|\?)/i)) {
 
-            getImage(source).then(
-              function (img) {
-                return this$1.setItem(item, ("<img width=\"" + (img.width) + "\" height=\"" + (img.height) + "\" src=\"" + source + "\" alt=\"" + (alt ? alt : '') + "\">"));
+            getImage(src, attrs.srcset, attrs.size).then(
+              function (ref) {
+                var width = ref.width;
+                var height = ref.height;
+
+                return this$1.setItem(item, createEl('img', assign({
+                  src: src,
+                  width: width,
+                  height: height,
+                  alt: alt
+                }, attrs)));
               },
               function () {
                 return this$1.setError(item);
@@ -10550,81 +10644,68 @@
             );
 
             // Video
-          } else if (type === 'video' || source.match(/\.(mp4|webm|ogv)($|\?)/i)) {
-
-            var video = $(("<video controls playsinline" + (item.poster ? (" poster=\"" + (item.poster) + "\"") : '') + " uk-video=\"" + (this.videoAutoplay) + "\"></video>"));
-            attr(video, 'src', source);
-
-            once(video, 'error loadedmetadata', function (type) {
-              if (type === 'error') {
-                this$1.setError(item);
-              } else {
-                attr(video, {
-                  width: video.videoWidth,
-                  height: video.videoHeight
-                });
-                this$1.setItem(item, video);
-              }
+          } else if (type === 'video' || src.match(/\.(mp4|webm|ogv)($|\?)/i)) {
+
+            var video = createEl('video', assign({
+              src: src,
+              poster: poster,
+              controls: '',
+              playsinline: '',
+              'uk-video': ("" + (this.videoAutoplay))
+            }, attrs));
+
+            on(video, 'loadedmetadata', function () {
+              attr(video, {
+                width: video.videoWidth,
+                height: video.videoHeight
+              });
+              this$1.setItem(item, video);
+            });
+            on(video, 'error', function () {
+              return this$1.setError(item);
             });
 
             // Iframe
-          } else if (type === 'iframe' || source.match(/\.(html|php)($|\?)/i)) {
+          } else if (type === 'iframe' || src.match(/\.(html|php)($|\?)/i)) {
 
-            this.setItem(item, ("<iframe class=\"uk-lightbox-iframe\" src=\"" + source + "\" frameborder=\"0\" allowfullscreen></iframe>"));
+            this.setItem(item, createEl('iframe', assign({
+              src: src,
+              frameborder: '0',
+              allowfullscreen: '',
+              class: 'uk-lightbox-iframe'
+            }, attrs)));
 
             // YouTube
-          } else if ((matches = source.match(/\/\/.*?youtube(-nocookie)?\.[a-z]+\/watch\?v=([^&\s]+)/) || source.match(/()youtu\.be\/(.*)/))) {
-
-            var id = matches[2];
-            var setIframe = function (width, height) {
-              if (width === void 0) width = 640;
-              if (height === void 0) height = 450;
-
-              return this$1.setItem(item, getIframe(("https://www.youtube" + (matches[1] || '') + ".com/embed/" + id), width, height, this$1.videoAutoplay));
-            };
-
-            getImage(("https://img.youtube.com/vi/" + id + "/maxresdefault.jpg")).then(
-              function (ref) {
-                var width = ref.width;
-                var height = ref.height;
+          } else if ((matches = src.match(/\/\/(?:.*?youtube(-nocookie)?\..*?[?&]v=|youtu\.be\/)([\w-]{11})[&?]?(.*)?/))) {
 
-                // YouTube default 404 thumb, fall back to low resolution
-                if (width === 120 && height === 90) {
-                  getImage(("https://img.youtube.com/vi/" + id + "/0.jpg")).then(
-                    function (ref) {
-                      var width = ref.width;
-                      var height = ref.height;
-
-                      return setIframe(width, height);
-                    },
-                    setIframe
-                  );
-                } else {
-                  setIframe(width, height);
-                }
-              },
-              setIframe
-            );
+            this.setItem(item, createEl('iframe', assign({
+              src: ("https://www.youtube" + (matches[1] || '') + ".com/embed/" + (matches[2]) + (matches[3] ? ("?" + (matches[3])) : '')),
+              width: 1920,
+              height: 1080,
+            }, iframeAttrs, attrs)));
 
             // Vimeo
-          } else if ((matches = source.match(/(\/\/.*?)vimeo\.[a-z]+\/([0-9]+).*?/))) {
+          } else if ((matches = src.match(/\/\/.*?vimeo\.[a-z]+\/(\d+)[&?]?(.*)?/))) {
 
-            ajax(("https://vimeo.com/api/oembed.json?maxwidth=1920&url=" + (encodeURI(source))), {
+            ajax(("https://vimeo.com/api/oembed.json?maxwidth=1920&url=" + (encodeURI(src))), {
               responseType: 'json',
               withCredentials: false
-            })
-              .then(
-                function (ref) {
-                  var ref_response = ref.response;
-                  var height = ref_response.height;
-                  var width = ref_response.width;
-
-                  return this$1.setItem(item, getIframe(("https://player.vimeo.com/video/" + (matches[2])), width, height, this$1.videoAutoplay));
-                },
-                function () {
-                  return this$1.setError(item);
-                }
-              );
+            }).then(
+              function (ref) {
+                var ref_response = ref.response;
+                var height = ref_response.height;
+                var width = ref_response.width;
+
+                return this$1.setItem(item, createEl('iframe', assign({
+                  src: ("https://player.vimeo.com/video/" + (matches[1]) + (matches[2] ? ("?" + (matches[2])) : '')),
+                  width: width,
+                  height: height
+                }, iframeAttrs, attrs)));
+              },
+              function () {
+                return this$1.setError(item);
+              }
+            );
 
           }
 
@@ -10642,26 +10723,23 @@
 
         var item = this.getItem(index);
 
-        if (item.content) {
-          return;
+        if (!this.getSlide(item).childElementCount) {
+          trigger(this.$el, 'itemload', [item]);
         }
-
-        trigger(this.$el, 'itemload', [item]);
       },
 
       getItem: function (index) {
         if (index === void 0) index = this.index;
 
-        return this.items[index] || {};
+        return this.items[getIndex(index, this.slides)];
       },
 
       setItem: function (item, content) {
-        assign(item, {
-          content: content
-        });
-        var el = html(this.slides[this.items.indexOf(item)], content);
-        trigger(this.$el, 'itemloaded', [this, el]);
-        this.$update(el);
+        trigger(this.$el, 'itemloaded', [this, html(this.getSlide(item), content)]);
+      },
+
+      getSlide: function (item) {
+        return this.slides[this.items.indexOf(item)];
       },
 
       setError: function (item) {
@@ -10685,8 +10763,10 @@
 
   };
 
-  function getIframe(src, width, height, autoplay) {
-    return ("<iframe src=\"" + src + "\" width=\"" + width + "\" height=\"" + height + "\" style=\"max-width: 100%; box-sizing: border-box;\" frameborder=\"0\" allowfullscreen uk-video=\"autoplay: " + autoplay + "\" uk-responsive></iframe>");
+  function createEl(tag, attrs) {
+    var el = fragment(("<" + tag + ">"));
+    attr(el, attrs);
+    return el;
   }
 
   var lightbox = {
@@ -10715,10 +10795,6 @@
           this.hide();
         }
 
-      },
-
-      items: function () {
-        return uniqueBy(this.toggles.map(toItem), 'source');
       }
 
     },
@@ -10739,12 +10815,7 @@
 
         handler: function (e) {
           e.preventDefault();
-          var src = data(e.current, 'href');
-          this.show(findIndex(this.items, function (ref) {
-            var source = ref.source;
-
-            return source === src;
-          }));
+          this.show(e.current);
         }
 
       }
@@ -10757,8 +10828,20 @@
         var this$1 = this;
 
 
+        var items = uniqueBy(this.toggles.map(toItem), 'source');
+
+        if (isElement(index)) {
+          var ref = toItem(index);
+          var source = ref.source;
+          index = findIndex(items, function (ref) {
+            var src = ref.source;
+
+            return source === src;
+          });
+        }
+
         this.panel = this.panel || this.$create('lightboxPanel', assign({}, this.$props, {
-          items: this.items
+          items: items
         }));
 
         on(this.panel.$el, 'hidden', function () {
@@ -10793,16 +10876,20 @@
   }
 
   function toItem(el) {
-    return ['href', 'caption', 'type', 'poster', 'alt'].reduce(function (obj, attr) {
-      obj[attr === 'href' ? 'source' : attr] = data(el, attr);
-      return obj;
-    }, {});
+
+    var item = {};
+
+    ['href', 'caption', 'type', 'poster', 'alt', 'attrs'].forEach(function (attr) {
+      item[attr === 'href' ? 'source' : attr] = data(el, attr);
+    });
+
+    item.attrs = parseOptions(item.attrs);
+
+    return item;
   }
 
   var obj;
 
-  var containers = {};
-
   var notification = {
 
     functional: true,
@@ -10815,6 +10902,7 @@
       timeout: 5000,
       group: null,
       pos: 'top-center',
+      clsContainer: 'uk-notification',
       clsClose: 'uk-notification-close',
       clsMsg: 'uk-notification-message'
     },
@@ -10841,14 +10929,11 @@
 
     created: function () {
 
-      if (!containers[this.pos]) {
-        containers[this.pos] = append(this.$container, ("<div class=\"uk-notification uk-notification-" + (this.pos) + "\"></div>"));
-      }
-
-      var container = css(containers[this.pos], 'display', 'block');
+      var container = $(("." + (this.clsContainer) + "-" + (this.pos)), this.$container) ||
+        append(this.$container, ("<div class=\"" + (this.clsContainer) + " " + (this.clsContainer) + "-" + (this.pos) + "\" style=\"display: block\"></div>"));
 
       this.$mount(append(container,
-        ("<div class=\"" + (this.clsMsg) + (this.status ? (" " + (this.clsMsg) + "-" + (this.status)) : '') + "\"> <a href=\"#\" class=\"" + (this.clsClose) + "\" data-uk-close></a> <div>" + (this.message) + "</div> </div>")
+        ("<div class=\"" + (this.clsMsg) + (this.status ? (" " + (this.clsMsg) + "-" + (this.status)) : '') + "\"> <a href class=\"" + (this.clsClose) + "\" data-uk-close></a> <div>" + (this.message) + "</div> </div>")
       ));
 
     },
@@ -10899,11 +10984,13 @@
 
         var removeFn = function () {
 
+          var container = this$1.$el.parentNode;
+
           trigger(this$1.$el, 'close', [this$1]);
           remove(this$1.$el);
 
-          if (!containers[this$1.pos].children.length) {
-            css(containers[this$1.pos], 'display', 'none');
+          if (container && !container.hasChildNodes()) {
+            remove(container);
           }
 
         };
@@ -11102,7 +11189,7 @@
 
             if (!img.naturalWidth) {
               img.onload = function () {
-                return this$1.$emit();
+                return this$1.$update();
               };
             }
           }
@@ -12269,9 +12356,7 @@
       ['init', 'start', 'move', 'end'].forEach(function (key) {
         var fn = this$1[key];
         this$1[key] = function (e) {
-          this$1.scrollY = window.pageYOffset;
-          assign(this$1.pos, getEventPos(e, 'page'));
-
+          assign(this$1.pos, getEventPos(e));
           fn(e);
         };
       });
@@ -12285,33 +12370,110 @@
 
     },
 
+    computed: {
+
+      target: function () {
+        return (this.$el.tBodies || [this.$el])[0];
+      },
+
+      items: function () {
+        return children(this.target);
+      },
+
+      isEmpty: {
+
+        get: function () {
+          return isEmpty(this.items);
+        },
+
+        watch: function (empty) {
+          toggleClass(this.target, this.clsEmpty, empty);
+        },
+
+        immediate: true
+
+      },
+
+      handles: {
+
+        get: function (ref, el) {
+          var handle = ref.handle;
+
+          return handle ? $$(handle, el) : this.items;
+        },
+
+        watch: function (handles, prev) {
+          css(prev, {
+            touchAction: '',
+            userSelect: ''
+          });
+          css(handles, {
+            touchAction: hasTouch ? 'none' : '',
+            userSelect: 'none'
+          }); // touchAction set to 'none' causes a performance drop in Chrome 80
+        },
+
+        immediate: true
+
+      }
+
+    },
+
     update: {
 
       write: function () {
 
-        if (this.clsEmpty) {
-          toggleClass(this.$el, this.clsEmpty, isEmpty(this.$el.children));
+        if (!this.drag || !parent(this.placeholder)) {
+          return;
         }
 
-        css(this.handle ? $$(this.handle, this.$el) : this.$el.children, {
-          touchAction: 'none',
-          userSelect: 'none'
+        // clamp to viewport
+        var ref = this.pos;
+        var x = ref.x;
+        var y = ref.y;
+        var ref$1 = this.origin;
+        var offsetTop = ref$1.offsetTop;
+        var offsetLeft = ref$1.offsetLeft;
+        var ref$2 = this.drag;
+        var offsetHeight = ref$2.offsetHeight;
+        var offsetWidth = ref$2.offsetWidth;
+        var ref$3 = offset(window);
+        var right = ref$3.right;
+        var bottom = ref$3.bottom;
+        var target = document.elementFromPoint(x, y);
+
+        css(this.drag, {
+          top: clamp(y - offsetTop, 0, bottom - offsetHeight),
+          left: clamp(x - offsetLeft, 0, right - offsetWidth)
         });
 
-        if (this.drag) {
+        var sortable = this.getSortable(target);
+        var previous = this.getSortable(this.placeholder);
+        var move = sortable !== previous;
 
-          // clamp to viewport
-          var ref = offset(window);
-          var right = ref.right;
-          var bottom = ref.bottom;
-          offset(this.drag, {
-            top: clamp(this.pos.y + this.origin.top, 0, bottom - this.drag.offsetHeight),
-            left: clamp(this.pos.x + this.origin.left, 0, right - this.drag.offsetWidth)
-          });
+        if (!sortable || within(target, this.placeholder) || move && (!sortable.group || sortable.group !== previous.group)) {
+          return;
+        }
+
+        target = sortable.target === target.parentNode && target || sortable.items.filter(function (element) {
+          return within(target, element);
+        })[0];
+
+        if (move) {
+          previous.remove(this.placeholder);
+        } else if (!target) {
+          return;
+        }
+
+        sortable.insert(this.placeholder, target);
 
+        if (!includes(this.touched, sortable)) {
+          this.touched.push(sortable);
         }
 
-      }
+      },
+
+      events: ['move']
 
     },
 
@@ -12322,7 +12484,7 @@
         var target = e.target;
         var button = e.button;
         var defaultPrevented = e.defaultPrevented;
-        var ref = children(this.$el).filter(function (el) {
+        var ref = this.items.filter(function (el) {
           return within(target, el);
         });
         var placeholder = ref[0];
@@ -12348,7 +12510,6 @@
 
         on(document, pointerMove, this.move);
         on(document, pointerUp, this.end);
-        on(window, 'scroll', this.scroll);
 
         if (!this.threshold) {
           this.start(e);
@@ -12359,18 +12520,17 @@
       start: function (e) {
 
         this.drag = appendDrag(this.$container, this.placeholder);
-
-        var ref = offset(this.placeholder);
+        var ref = this.placeholder.getBoundingClientRect();
         var left = ref.left;
         var top = ref.top;
         assign(this.origin, {
-          left: left - this.pos.x,
-          top: top - this.pos.y
+          offsetLeft: this.pos.x - left,
+          offsetTop: this.pos.y - top
         });
 
         addClass(this.drag, this.clsDrag, this.clsCustom);
         addClass(this.placeholder, this.clsPlaceholder);
-        addClass(this.$el.children, this.clsItem);
+        addClass(this.items, this.clsItem);
         addClass(document.documentElement, this.clsDragState);
 
         trigger(this.$el, 'start', [this, this.placeholder]);
@@ -12382,41 +12542,10 @@
 
       move: function (e) {
 
-        if (!this.drag) {
-
-          if (Math.abs(this.pos.x - this.origin.x) > this.threshold || Math.abs(this.pos.y - this.origin.y) > this.threshold) {
-            this.start(e);
-          }
-
-          return;
-        }
-
-        this.$emit();
-
-        var target = e.type === 'mousemove' ? e.target : document.elementFromPoint(this.pos.x - window.pageXOffset, this.pos.y - window.pageYOffset);
-
-        var sortable = this.getSortable(target);
-        var previous = this.getSortable(this.placeholder);
-        var move = sortable !== previous;
-
-        if (!sortable || within(target, this.placeholder) || move && (!sortable.group || sortable.group !== previous.group)) {
-          return;
-        }
-
-        target = sortable.$el === target.parentNode && target || children(sortable.$el).filter(function (element) {
-          return within(target, element);
-        })[0];
-
-        if (move) {
-          previous.remove(this.placeholder);
-        } else if (!target) {
-          return;
-        }
-
-        sortable.insert(this.placeholder, target);
-
-        if (!includes(this.touched, sortable)) {
-          this.touched.push(sortable);
+        if (this.drag) {
+          this.$emit('move');
+        } else if (Math.abs(this.pos.x - this.origin.x) > this.threshold || Math.abs(this.pos.y - this.origin.y) > this.threshold) {
+          this.start(e);
         }
 
       },
@@ -12457,40 +12586,31 @@
           return ((sortable.clsPlaceholder) + " " + (sortable.clsItem));
         }).join(' ');
         this.touched.forEach(function (sortable) {
-          return removeClass(sortable.$el.children, classes);
+          return removeClass(sortable.items, classes);
         });
 
         removeClass(document.documentElement, this.clsDragState);
 
       },
 
-      scroll: function () {
-        var scroll = window.pageYOffset;
-        if (scroll !== this.scrollY) {
-          this.pos.y += scroll - this.scrollY;
-          this.scrollY = scroll;
-          this.$emit();
-        }
-      },
-
       insert: function (element, target) {
         var this$1 = this;
 
 
-        addClass(this.$el.children, this.clsItem);
+        addClass(this.items, this.clsItem);
 
         var insert = function () {
 
           if (target) {
 
-            if (!within(element, this$1.$el) || isPredecessor(element, target)) {
+            if (!within(element, this$1.target) || isPredecessor(element, target)) {
               before(target, element);
             } else {
               after(target, element);
             }
 
           } else {
-            append(this$1.$el, element);
+            append(this$1.target, element);
           }
 
         };
@@ -12505,15 +12625,10 @@
 
       remove: function (element) {
 
-        if (!within(element, this.$el)) {
+        if (!within(element, this.target)) {
           return;
         }
 
-        css(this.handle ? $$(this.handle, element) : element, {
-          touchAction: '',
-          userSelect: ''
-        });
-
         if (this.animation) {
           this.animate(function () {
             return remove(element);
@@ -12540,11 +12655,17 @@
 
   function trackScroll(pos) {
 
+    var last = Date.now();
     trackTimer = setInterval(function () {
 
       var x = pos.x;
       var y = pos.y;
-      scrollParents(document.elementFromPoint(x - window.pageXOffset, y - window.pageYOffset)).some(function (scrollEl) {
+      y += window.pageYOffset;
+
+      var dist = (Date.now() - last) * .3;
+      last = Date.now();
+
+      scrollParents(document.elementFromPoint(x, pos.y)).some(function (scrollEl) {
 
         var scroll = scrollEl.scrollTop;
         var scrollHeight = scrollEl.scrollHeight;
@@ -12555,9 +12676,9 @@
         var height = ref.height;
 
         if (top < y && top + 30 > y) {
-          scroll -= 5;
+          scroll -= dist;
         } else if (bottom > y && bottom - 30 < y) {
-          scroll += 5;
+          scroll += dist;
         } else {
           return;
         }
@@ -12578,7 +12699,9 @@
   }
 
   function appendDrag(container, element) {
-    var clone = append(container, element.outerHTML.replace(/(^<)li|li(\/>$)/g, '$1div$2'));
+    var clone = append(container, element.outerHTML.replace(/(^<)(?:li|tr)|(?:li|tr)(\/>$)/g, '$1div$2'));
+
+    attr(clone, 'style', ((attr(clone, 'style')) + ";margin:0!important"));
 
     css(clone, assign({
       boxSizing: 'border-box',
@@ -12653,50 +12776,60 @@
         });
 
         clearTimeout(this.showTimer);
-        this.showTimer = setTimeout(function () {
-          this$1._show();
-          this$1.hideTimer = setInterval(function () {
-
-            if (!isVisible(this$1.$el)) {
-              this$1.hide();
-            }
-
-          }, 150);
-        }, this.delay);
+        this.showTimer = setTimeout(this._show, this.delay);
       },
 
       hide: function () {
+        var this$1 = this;
+
 
         if (!this.isActive() || matches(this.$el, 'input:focus')) {
           return;
         }
 
-        actives.splice(actives.indexOf(this), 1);
+        this.toggleElement(this.tooltip, false, false).then(function () {
 
-        clearTimeout(this.showTimer);
-        clearInterval(this.hideTimer);
-        attr(this.$el, 'aria-expanded', false);
-        this.toggleElement(this.tooltip, false);
-        this.tooltip && remove(this.tooltip);
-        this.tooltip = false;
-        this._unbind();
+          actives.splice(actives.indexOf(this$1), 1);
+
+          clearTimeout(this$1.showTimer);
+          clearInterval(this$1.hideTimer);
 
+          this$1.tooltip = remove(this$1.tooltip);
+          this$1._unbind();
+        });
       },
 
       _show: function () {
+        var this$1 = this;
+
 
         this.tooltip = append(this.container,
-          ("<div class=\"" + (this.clsPos) + "\" aria-expanded=\"true\" aria-hidden> <div class=\"" + (this.clsPos) + "-inner\">" + (this.title) + "</div> </div>")
+          ("<div class=\"" + (this.clsPos) + "\"> <div class=\"" + (this.clsPos) + "-inner\">" + (this.title) + "</div> </div>")
         );
 
-        this.positionAt(this.tooltip, this.$el);
+        on(this.tooltip, 'toggled', function () {
+
+          var toggled = this$1.isToggled(this$1.tooltip);
+
+          attr(this$1.$el, 'aria-expanded', toggled);
 
-        this.origin = this.getAxis() === 'y' ?
-          ((flipPosition(this.dir)) + "-" + (this.align)) :
-          ((this.align) + "-" + (flipPosition(this.dir)));
+          if (!toggled) {
+            return;
+          }
+
+          this$1.positionAt(this$1.tooltip, this$1.$el);
+
+          this$1.origin = this$1.getAxis() === 'y' ?
+            ((flipPosition(this$1.dir)) + "-" + (this$1.align)) :
+            ((this$1.align) + "-" + (flipPosition(this$1.dir)));
+        });
 
         this.toggleElement(this.tooltip, true);
 
+        this.hideTimer = setInterval(function () {
+          return !isVisible(this$1.$el) && this$1.hide();
+        }, 150);
+
       },
 
       isActive: function () {
@@ -12935,7 +13068,6 @@
     e.stopPropagation();
   }
 
-
   var components = /*#__PURE__*/ Object.freeze({
     __proto__: null,
     Countdown: countdown,