npm - uikit - Versions diffs - 3.13.9 → 3.13.11-dev.98491b3f4 - Mend

uikit 3.13.9 → 3.13.11-dev.98491b3f4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (90) hide show

package/CHANGELOG.md +34 -1
package/build/build.js +4 -1
package/dist/css/uikit-core-rtl.css +41 -6
package/dist/css/uikit-core-rtl.min.css +1 -1
package/dist/css/uikit-core.css +41 -6
package/dist/css/uikit-core.min.css +1 -1
package/dist/css/uikit-rtl.css +41 -4
package/dist/css/uikit-rtl.min.css +1 -1
package/dist/css/uikit.css +41 -4
package/dist/css/uikit.min.css +1 -1
package/dist/js/components/countdown.js +1 -1
package/dist/js/components/countdown.min.js +1 -1
package/dist/js/components/filter.js +1 -1
package/dist/js/components/filter.min.js +1 -1
package/dist/js/components/lightbox-panel.js +7 -3
package/dist/js/components/lightbox-panel.min.js +1 -1
package/dist/js/components/lightbox.js +7 -3
package/dist/js/components/lightbox.min.js +1 -1
package/dist/js/components/notification.js +1 -1
package/dist/js/components/notification.min.js +1 -1
package/dist/js/components/parallax.js +18 -11
package/dist/js/components/parallax.min.js +1 -1
package/dist/js/components/slider-parallax.js +18 -11
package/dist/js/components/slider-parallax.min.js +1 -1
package/dist/js/components/slider.js +1 -1
package/dist/js/components/slider.min.js +1 -1
package/dist/js/components/slideshow-parallax.js +18 -11
package/dist/js/components/slideshow-parallax.min.js +1 -1
package/dist/js/components/slideshow.js +1 -1
package/dist/js/components/slideshow.min.js +1 -1
package/dist/js/components/sortable.js +2 -2
package/dist/js/components/sortable.min.js +1 -1
package/dist/js/components/tooltip.js +62 -30
package/dist/js/components/tooltip.min.js +1 -1
package/dist/js/components/upload.js +1 -1
package/dist/js/components/upload.min.js +1 -1
package/dist/js/uikit-core.js +328 -260
package/dist/js/uikit-core.min.js +1 -1
package/dist/js/uikit-icons.js +1 -1
package/dist/js/uikit-icons.min.js +1 -1
package/dist/js/uikit.js +371 -266
package/dist/js/uikit.min.js +1 -1
package/package.json +1 -1
package/src/js/components/sortable.js +2 -3
package/src/js/components/tooltip.js +38 -3
package/src/js/core/drop.js +20 -16
package/src/js/core/navbar.js +18 -6
package/src/js/core/scrollspy-nav.js +4 -9
package/src/js/core/sticky.js +28 -16
package/src/js/core/toggle.js +8 -8
package/src/js/mixin/media.js +12 -9
package/src/js/mixin/modal.js +6 -2
package/src/js/mixin/parallax.js +5 -1
package/src/js/mixin/position.js +24 -24
package/src/js/uikit-core.js +0 -4
package/src/js/util/lang.js +0 -4
package/src/js/util/position.js +180 -125
package/src/js/util/viewport.js +42 -22
package/src/less/components/drop.less +0 -1
package/src/less/components/dropdown.less +11 -1
package/src/less/components/icon.less +3 -0
package/src/less/components/nav.less +22 -0
package/src/less/components/navbar.less +26 -2
package/src/less/components/search.less +2 -0
package/src/less/theme/dropdown.less +4 -0
package/src/less/theme/nav.less +6 -0
package/src/less/theme/navbar.less +4 -0
package/src/less/theme/search.less +6 -0
package/src/scss/components/drop.scss +0 -1
package/src/scss/components/dropdown.scss +11 -1
package/src/scss/components/icon.scss +3 -0
package/src/scss/components/nav.scss +22 -0
package/src/scss/components/navbar.scss +26 -2
package/src/scss/components/search.scss +2 -0
package/src/scss/mixins-theme.scss +5 -0
package/src/scss/mixins.scss +5 -0
package/src/scss/theme/dropdown.scss +4 -0
package/src/scss/theme/nav.scss +6 -0
package/src/scss/theme/navbar.scss +4 -0
package/src/scss/theme/search.scss +6 -0
package/src/scss/variables-theme.scss +5 -1
package/src/scss/variables.scss +5 -1
package/tests/animation.html +216 -214
package/tests/dropdown.html +16 -2
package/tests/nav.html +27 -0
package/tests/navbar.html +55 -4
package/tests/position.html +38 -39
package/tests/sticky-parallax.html +16 -0
package/tests/sticky.html +212 -36
package/src/js/core/core.js +0 -25

package/dist/js/uikit.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/*! UIkit 3.13.9 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
+/*! UIkit 3.13.11-dev.98491b3f4 | https://www.getuikit.com | (c) 2014 - 2022 YOOtheme | MIT License */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -141,10 +141,6 @@
       return (document == null ? void 0 : document.defaultView) || window;
     }
-    function toMs(time) {
-      return time ? endsWith(time, 'ms') ? toFloat(time) : toFloat(time) * 1000 : 0;
-    }
     function isEqual(value, other) {
       return (
         value === other ||
@@ -1788,7 +1784,7 @@
       return intersectRect(
       ...scrollParents(element).
       map((parent) => {
-        const { top, left, bottom, right } = offset(getViewport$1(parent));
+        const { top, left, bottom, right } = offsetViewport(parent);
         return {
           top: top - offsetTop,
@@ -1803,7 +1799,7 @@
     function scrollTop(element, top) {
       if (isWindow(element) || isDocument(element)) {
-        element = getScrollingElement(element);
+        element = scrollingElement(element);
       } else {
         element = toNode(element);
       }
@@ -1820,12 +1816,13 @@
       return parents.reduce(
       (fn, scrollElement, i) => {
         const { scrollTop, scrollHeight, offsetHeight } = scrollElement;
-        const maxScroll = scrollHeight - getViewportClientHeight(scrollElement);
-        const { height: elHeight, top: elTop } = offset(parents[i - 1] || element);
-        let top = Math.ceil(
-        elTop - offset(getViewport$1(scrollElement)).top - offsetBy + scrollTop);
+        const viewport = offsetViewport(scrollElement);
+        const maxScroll = scrollHeight - viewport.height;
+        const { height: elHeight, top: elTop } = parents[i - 1] ?
+        offsetViewport(parents[i - 1]) :
+        offset(element);
+        let top = Math.ceil(elTop - viewport.top - offsetBy + scrollTop);
         if (offsetBy > 0 && offsetHeight < elHeight + offsetBy) {
           top += offsetBy;
@@ -1883,7 +1880,7 @@
       const [scrollElement] = scrollParents(element, /auto|scroll/, true);
       const { scrollHeight, scrollTop } = scrollElement;
-      const viewportHeight = getViewportClientHeight(scrollElement);
+      const { height: viewportHeight } = offsetViewport(scrollElement);
       const maxScroll = scrollHeight - viewportHeight;
       const elementOffsetTop = offsetPosition(element)[0] - offsetPosition(scrollElement)[0];
@@ -1894,7 +1891,7 @@
     }
     function scrollParents(element, overflowRe, scrollable) {if (overflowRe === void 0) {overflowRe = /auto|scroll|hidden/;}if (scrollable === void 0) {scrollable = false;}
-      const scrollEl = getScrollingElement(element);
+      const scrollEl = scrollingElement(element);
       let ancestors = parents(element).reverse();
       ancestors = ancestors.slice(ancestors.indexOf(scrollEl) + 1);
@@ -1909,181 +1906,253 @@
       ancestors.filter(
       (parent) =>
       overflowRe.test(css(parent, 'overflow')) && (
-      !scrollable || parent.scrollHeight > getViewportClientHeight(parent)))).
+      !scrollable || parent.scrollHeight > offsetViewport(parent).height))).
       reverse();
     }
-    function getViewport$1(scrollElement) {
-      return scrollElement === getScrollingElement(scrollElement) ? window : scrollElement;
+    function offsetViewport(scrollElement) {
+      let viewportElement = getViewport$1(scrollElement);
+      // iOS 12 returns <body> as scrollingElement
+      if (viewportElement === scrollingElement(viewportElement)) {
+        viewportElement = document.documentElement;
+      }
+      let rect = offset(viewportElement);
+      for (let [prop, dir, start, end] of [
+      ['width', 'x', 'left', 'right'],
+      ['height', 'y', 'top', 'bottom']])
+      {
+        if (!isWindow(getViewport$1(viewportElement))) {
+          rect[start] += toFloat(css(viewportElement, "border" + ucfirst(start) + "Width"));
+        }
+        rect[prop] = rect[dir] = (
+        isWindow(viewportElement) ? scrollingElement(viewportElement) : viewportElement)["client" +
+        ucfirst(prop)];
+        rect[end] = rect[prop] + rect[start];
+      }
+      return rect;
     }
-    // iOS 12 returns <body> as scrollingElement
-    function getViewportClientHeight(scrollElement) {
-      return (
-      scrollElement === getScrollingElement(scrollElement) ?
-      document.documentElement :
-      scrollElement).
-      clientHeight;
+    function scrollingElement(element) {
+      const {
+        document: { scrollingElement } } =
+      toWindow(element);
+      return scrollingElement;
     }
-    function getScrollingElement(element) {
-      const { document } = toWindow(element);
-      return document.scrollingElement || document.documentElement;
+    function getViewport$1(scrollElement) {
+      return scrollElement === scrollingElement(scrollElement) ? window : scrollElement;
     }
-    const dirs = {
-      width: ['x', 'left', 'right'],
-      height: ['y', 'top', 'bottom'] };
+    const dirs = [
+    ['width', 'x', 'left', 'right'],
+    ['height', 'y', 'top', 'bottom']];
+    function positionAt(element, target, options) {
+      options = {
+        attach: {
+          element: ['left', 'top'],
+          target: ['left', 'top'],
+          ...options.attach },
+        offset: [0, 0],
+        ...options };
+      const dim = options.flip ?
+      attachToWithFlip(element, target, options) :
+      attachTo(element, target, options);
-    function positionAt(
-    element,
-    target,
-    elAttach,
-    targetAttach,
-    elOffset,
-    targetOffset,
-    flip,
-    boundary)
-    {
-      elAttach = getPos(elAttach);
-      targetAttach = getPos(targetAttach);
+      offset(element, dim);
+    }
+    function attachTo(element, target, options) {
+      let { attach, offset: offsetBy } = {
+        attach: {
+          element: ['left', 'top'],
+          target: ['left', 'top'],
+          ...options.attach },
-      const flipped = { element: elAttach, target: targetAttach };
+        offset: [0, 0],
+        ...options };
-      if (!element || !target) {
-        return flipped;
+      const position = offset(element);
+      const targetOffset = offset(target);
+      for (const i in dirs) {
+        const [prop, dir, start, end] = dirs[i];
+        position[start] = position[dir] =
+        targetOffset[start] +
+        moveBy(attach.target[i], end, targetOffset[prop]) -
+        moveBy(attach.element[i], end, position[prop]) +
+        +offsetBy[i];
+        position[end] = position[start] + position[prop];
       }
+      return position;
+    }
-      const dim = offset(element);
+    function attachToWithFlip(element, target, options) {
+      const position = attachTo(element, target, options);
       const targetDim = offset(target);
-      const position = targetDim;
+      const viewports = scrollParents(element, /auto|scroll/);
+      const [scrollElement] = viewports;
-      moveTo(position, elAttach, dim, -1);
-      moveTo(position, targetAttach, targetDim, 1);
+      let {
+        flip,
+        attach: { element: elAttach, target: targetAttach },
+        offset: elOffset,
+        boundary,
+        viewport,
+        viewportPadding } =
+      options;
-      elOffset = getOffsets(elOffset, dim.width, dim.height);
-      targetOffset = getOffsets(targetOffset, targetDim.width, targetDim.height);
+      viewports.push(viewport);
-      elOffset['x'] += targetOffset['x'];
-      elOffset['y'] += targetOffset['y'];
+      const offsetPosition = { ...position };
+      for (const i in dirs) {
+        const [prop, dir, start, end] = dirs[i];
-      position.left += elOffset['x'];
-      position.top += elOffset['y'];
+        if (flip !== true && !includes(flip, dir)) {
+          continue;
+        }
+        const willFlip =
+        !intersectLine(position, targetDim, i) && intersectLine(position, targetDim, 1 - i);
-      if (flip) {
-        let boundaries = scrollParents(element).map(getViewport$1);
+        viewport = getIntersectionArea(...viewports.filter(Boolean).map(offsetViewport));
-        if (boundary && !includes(boundaries, boundary)) {
-          boundaries.unshift(boundary);
+        if (viewportPadding) {
+          viewport[start] += viewportPadding;
+          viewport[end] -= viewportPadding;
         }
-        boundaries = boundaries.map((el) => offset(el));
+        if (boundary && !(willFlip || position[prop] > offset(boundary)[prop])) {
+          viewport = getIntersectionArea(viewport, offset(boundary));
+        }
-        each(dirs, (_ref, prop) => {let [dir, align, alignFlip] = _ref;
-          if (!(flip === true || includes(flip, dir))) {
-            return;
-          }
+        const isInStartBoundary = position[start] >= viewport[start];
+        const isInEndBoundary = position[end] <= viewport[end];
-          boundaries.some((boundary) => {
-            const elemOffset =
-            elAttach[dir] === align ?
-            -dim[prop] :
-            elAttach[dir] === alignFlip ?
-            dim[prop] :
-            0;
+        if (isInStartBoundary && isInEndBoundary) {
+          continue;
+        }
-            const targetOffset =
-            targetAttach[dir] === align ?
-            targetDim[prop] :
-            targetAttach[dir] === alignFlip ?
-            -targetDim[prop] :
-            0;
+        let offsetBy;
-            if (
-            position[align] < boundary[align] ||
-            position[align] + dim[prop] > boundary[alignFlip])
-            {
-              const centerOffset = dim[prop] / 2;
-              const centerTargetOffset =
-              targetAttach[dir] === 'center' ? -targetDim[prop] / 2 : 0;
+        // Flip
+        if (willFlip) {
+          if (
+          elAttach[i] === end && isInStartBoundary ||
+          elAttach[i] === start && isInEndBoundary)
+          {
+            continue;
+          }
+          offsetBy =
+          (elAttach[i] === start ?
+          -position[prop] :
+          elAttach[i] === end ?
+          position[prop] :
+          0) + (
+          targetAttach[i] === start ?
+          targetDim[prop] :
+          targetAttach[i] === end ?
+          -targetDim[prop] :
+          0) -
+          elOffset[i] * 2;
+          if (
+          !isInScrollArea(
+          {
+            ...position,
+            [start]: position[start] + offsetBy,
+            [end]: position[end] + offsetBy },
-              return (
-                elAttach[dir] === 'center' && (
-                apply(centerOffset, centerTargetOffset) ||
-                apply(-centerOffset, -centerTargetOffset)) ||
-                apply(elemOffset, targetOffset));
+          scrollElement,
+          i))
+          {
+            if (isInScrollArea(position, scrollElement, i)) {
+              continue;
             }
-            function apply(elemOffset, targetOffset) {
-              const newVal = toFloat(
-              (position[align] + elemOffset + targetOffset - elOffset[dir] * 2).toFixed(4));
+            if (options.recursion) {
+              return false;
+            }
+            const newPos = attachToWithFlip(element, target, {
+              ...options,
+              attach: {
+                element: elAttach.map(flipDir).reverse(),
+                target: targetAttach.map(flipDir).reverse() },
-              if (newVal >= boundary[align] && newVal + dim[prop] <= boundary[alignFlip]) {
-                position[align] = newVal;
+              offset: elOffset.reverse(),
+              flip: flip === true ? flip : [...flip, dirs[1 - i][1]],
+              recursion: true });
-                for (const el of ['element', 'target']) {
-                  if (elemOffset) {
-                    flipped[el][dir] =
-                    flipped[el][dir] === dirs[prop][1] ?
-                    dirs[prop][2] :
-                    dirs[prop][1];
-                  }
-                }
-                return true;
-              }
+            if (newPos && isInScrollArea(newPos, scrollElement, 1 - i)) {
+              return newPos;
             }
-          });
-        });
-      }
+          }
-      offset(element, position);
+          // Move
+        } else {
+          offsetBy =
+          clamp(
+          clamp(position[start], viewport[start], viewport[end] - position[prop]),
+          targetDim[start] - position[prop] + elOffset[i],
+          targetDim[end] - elOffset[i]) -
+          position[start];
+        }
-      return flipped;
-    }
+        offsetPosition[start] = position[dir] = position[start] + offsetBy;
+        offsetPosition[end] += offsetBy;
+      }
-    function moveTo(position, attach, dim, factor) {
-      each(dirs, (_ref2, prop) => {let [dir, align, alignFlip] = _ref2;
-        if (attach[dir] === alignFlip) {
-          position[align] += dim[prop] * factor;
-        } else if (attach[dir] === 'center') {
-          position[align] += dim[prop] * factor / 2;
-        }
-      });
+      return offsetPosition;
     }
-    function getPos(pos) {
-      const x = /left|center|right/;
-      const y = /top|center|bottom/;
-      pos = (pos || '').split(' ');
+    function moveBy(start, end, dim) {
+      return start === 'center' ? dim / 2 : start === end ? dim : 0;
+    }
-      if (pos.length === 1) {
-        pos = x.test(pos[0]) ?
-        pos.concat('center') :
-        y.test(pos[0]) ?
-        ['center'].concat(pos) :
-        ['center', 'center'];
+    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) {
+        for (const [,, start, end] of dirs) {
+          area[start] = Math.max(area[start] || 0, rect[start]);
+          area[end] = Math.min(...[area[end], rect[end]].filter(Boolean));
+        }
       }
+      return area;
+    }
-      return {
-        x: x.test(pos[0]) ? pos[0] : 'center',
-        y: y.test(pos[1]) ? pos[1] : 'center' };
+    function isInScrollArea(position, scrollElement, dir) {
+      const viewport = offsetViewport(scrollElement);
+      const [prop,, start, end] = dirs[dir];
+      viewport[start] -= scrollElement["scroll" + ucfirst(start)];
+      viewport[end] = viewport[start] + scrollElement["scroll" + ucfirst(prop)];
+      return position[start] >= viewport[start] && position[end] <= viewport[end];
     }
-    function getOffsets(offsets, width, height) {
-      const [x, y] = (offsets || '').split(' ');
-      return {
-        x: x ? toFloat(x) * (endsWith(x, '%') ? width / 100 : 1) : 0,
-        y: y ? toFloat(y) * (endsWith(y, '%') ? height / 100 : 1) : 0 };
+    function intersectLine(dimA, dimB, dir) {
+      const [,, start, end] = dirs[dir];
+      return dimA[end] > dimB[start] && dimB[end] > dimA[start];
+    }
+    function flipDir(prop) {
+      for (const i in dirs) {
+        const index = dirs[i].indexOf(prop);
+        if (~index) {
+          return dirs[1 - i][index % 2 + 2];
+        }
+      }
     }
     var util = /*#__PURE__*/Object.freeze({
@@ -2192,7 +2261,6 @@
         toNode: toNode,
         toNodes: toNodes,
         toWindow: toWindow,
-        toMs: toMs,
         isEqual: isEqual,
         swap: swap,
         last: last,
@@ -2231,9 +2299,7 @@
         scrollIntoView: scrollIntoView,
         scrolledOver: scrolledOver,
         scrollParents: scrollParents,
-        getViewport: getViewport$1,
-        getViewportClientHeight: getViewportClientHeight,
-        getScrollingElement: getScrollingElement
+        offsetViewport: offsetViewport
     });
     function globalAPI (UIkit) {
@@ -2892,7 +2958,7 @@
     UIkit.data = '__uikit__';
     UIkit.prefix = 'uk-';
     UIkit.options = {};
-    UIkit.version = '3.13.9';
+    UIkit.version = '3.13.11-dev.98491b3f4';
     globalAPI(UIkit);
     hooksAPI(UIkit);
@@ -2900,30 +2966,6 @@
     componentAPI(UIkit);
     instanceAPI(UIkit);
-    function Core () {
-      if (!inBrowser) {
-        return;
-      }
-      let started = 0;
-      on(
-      document,
-      'animationstart',
-      (_ref) => {let { target } = _ref;
-        if ((css(target, 'animationName') || '').match(/^uk-.*(left|right)/)) {
-          started++;
-          css(document.documentElement, 'overflowX', 'hidden');
-          setTimeout(() => {
-            if (! --started) {
-              css(document.documentElement, 'overflowX', '');
-            }
-          }, toMs(css(target, 'animationDuration')) + 100);
-        }
-      },
-      true);
-    }
     function boot (UIkit) {
       const { connect, disconnect } = UIkit;
@@ -3501,50 +3543,49 @@
       data: {
         pos: "bottom-" + (isRtl ? 'right' : 'left'),
         flip: true,
-        offset: false },
+        offset: false,
+        viewportPadding: 10 },
       connected() {
         this.pos = this.$props.pos.split('-').concat('center').slice(0, 2);
-        this.dir = this.pos[0];
-        this.align = this.pos[1];
+        this.axis = includes(['top', 'bottom'], this.pos[0]) ? 'y' : 'x';
       },
       methods: {
         positionAt(element, target, boundary) {
-          const axis = this.getAxis();
-          const dir = this.pos[0];
-          const align = this.pos[1];
+          const [dir, align] = this.pos;
           let { offset: offset$1 } = this;
           if (!isNumeric(offset$1)) {
             const node = $(offset$1);
             offset$1 = node ?
-            offset(node)[axis === 'x' ? 'left' : 'top'] -
-            offset(target)[axis === 'x' ? 'right' : 'bottom'] :
+            offset(node)[this.axis === 'x' ? 'left' : 'top'] -
+            offset(target)[this.axis === 'x' ? 'right' : 'bottom'] :
             0;
           }
           offset$1 = toPx(offset$1) + toPx(getCssVar('position-offset', element));
+          offset$1 = [includes(['left', 'top'], dir) ? -offset$1 : +offset$1, 0];
+          const attach = {
+            element: [flipPosition(dir), align],
+            target: [dir, align] };
+          if (this.axis === 'y') {
+            for (const prop in attach) {
+              attach[prop] = attach[prop].reverse();
+            }
+            offset$1 = offset$1.reverse();
+          }
+          positionAt(element, target, {
+            attach,
+            offset: offset$1,
+            boundary,
+            viewportPadding: this.viewportPadding,
+            flip: this.flip });
-          const { x, y } = positionAt(
-          element,
-          target,
-          axis === 'x' ? flipPosition(dir) + " " + align : align + " " + flipPosition(dir),
-          axis === 'x' ? dir + " " + align : align + " " + dir,
-          axis === 'x' ? "" + (
-          dir === 'left' ? -offset$1 : offset$1) : " " + (
-          dir === 'top' ? -offset$1 : offset$1),
-          null,
-          this.flip,
-          boundary).
-          target;
-          this.dir = axis === 'x' ? x : y;
-          this.align = axis === 'x' ? y : x;
-        },
-        getAxis() {
-          return this.dir === 'top' || this.dir === 'bottom' ? 'y' : 'x';
         } } };
     let active$1;
@@ -3761,13 +3802,7 @@
               this.hide(false);
             }
           }),
-          on(window, 'resize', () => this.$emit()),
-          on(
-          document,
-          'scroll',
-          (_ref4) => {let { target } = _ref4;return target.contains(this.$el) && this.$emit();},
-          true)])
+          on(window, 'resize', () => this.$emit())])
           {
             once(this.$el, 'hide', handler, { self: true });
           }
@@ -3787,7 +3822,7 @@
       {
         name: 'hide',
-        handler(_ref5) {let { target } = _ref5;
+        handler(_ref4) {let { target } = _ref4;
           if (this.$el !== target) {
             active$1 =
             active$1 === null && within(target, this.$el) && this.isToggled() ?
@@ -3878,25 +3913,33 @@
         },
         position() {
-          const boundary = query(this.boundary, this.$el) || window;
           removeClass(this.$el, this.clsDrop + "-stack");
           toggleClass(this.$el, this.clsDrop + "-boundary", this.boundaryAlign);
-          const boundaryOffset = offset(boundary);
-          const targetOffset = offset(this.target);
-          const alignTo = this.boundaryAlign ? boundaryOffset : targetOffset;
+          const boundary = query(this.boundary, this.$el);
+          const [scrollParent] = scrollParents(this.$el);
+          const scrollParentOffset = offsetViewport(scrollParent);
+          const boundaryOffset = boundary ? offset(boundary) : scrollParentOffset;
+          css(this.$el, 'maxWidth', '');
+          const maxWidth = scrollParentOffset.width - (boundary ? 0 : 2 * this.viewportPadding);
           if (this.pos[1] === 'justify') {
-            const prop = this.getAxis() === 'y' ? 'width' : 'height';
+            const prop = this.axis === 'y' ? 'width' : 'height';
+            const targetOffset = offset(this.target);
+            const alignTo = this.boundaryAlign ? boundaryOffset : targetOffset;
             css(this.$el, prop, alignTo[prop]);
-          } else if (
-          this.$el.offsetWidth >
-          Math.max(boundaryOffset.right - alignTo.left, alignTo.right - boundaryOffset.left))
-          {
+          } else if (this.$el.offsetWidth > maxWidth) {
             addClass(this.$el, this.clsDrop + "-stack");
           }
-          this.positionAt(this.$el, this.boundaryAlign ? boundary : this.target, boundary);
+          css(this.$el, 'maxWidth', maxWidth);
+          this.positionAt(
+          this.$el,
+          boundary && this.boundaryAlign ? boundary : this.target,
+          boundary);
         } } };
@@ -5000,16 +5043,19 @@
       connected() {
         const media = toMedia(this.media);
-        this.mediaObj = window.matchMedia(media);
-        const handler = () => {
-          this.matchMedia = this.mediaObj.matches;
-          trigger(this.$el, createEvent('mediachange', false, true, [this.mediaObj]));
-        };
-        this.offMediaObj = on(this.mediaObj, 'change', () => {
+        this.matchMedia = true;
+        if (media) {
+          this.mediaObj = window.matchMedia(media);
+          const handler = () => {
+            this.matchMedia = this.mediaObj.matches;
+            trigger(this.$el, createEvent('mediachange', false, true, [this.mediaObj]));
+          };
+          this.offMediaObj = on(this.mediaObj, 'change', () => {
+            handler();
+            this.$emit('resize');
+          });
           handler();
-          this.$emit('resize');
-        });
-        handler();
+        }
       },
       disconnected() {var _this$offMediaObj;
@@ -5298,7 +5344,7 @@
       return (el, show) =>
       new Promise((resolve, reject) =>
       once(el, 'show hide', () => {
-        el._reject && el._reject();
+        el._reject == null ? void 0 : el._reject();
         el._reject = reject;
         _toggle(el, show);
@@ -5323,6 +5369,10 @@
       then(() => delete el._reject);
     }
+    function toMs(time) {
+      return time ? endsWith(time, 'ms') ? toFloat(time) : toFloat(time) * 1000 : 0;
+    }
     var modal = {
       install: install$2,
@@ -5476,8 +5526,6 @@
         toggle: '> a',
         content: '> ul' } };
-    const navItem = '.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle';
     var navbar = {
       mixins: [Class, Container],
@@ -5497,7 +5545,7 @@
       data: {
-        dropdown: navItem,
+        dropdown: '.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle',
         align: isRtl ? 'right' : 'left',
         clsDrop: 'uk-navbar-dropdown',
         mode: undefined,
@@ -5583,9 +5631,23 @@
           immediate: true },
-        toggles(_ref6, $el) {let { dropdown } = _ref6;
-          return $$(dropdown, $el);
-        } },
+        toggles: {
+          get(_ref6, $el) {let { dropdown } = _ref6;
+            return $$(dropdown, $el);
+          },
+          watch() {
+            const justify = hasClass(this.$el, 'uk-navbar-justify');
+            for (const container of $$(
+            '.uk-navbar-nav, .uk-navbar-left, .uk-navbar-right',
+            this.$el))
+            {
+              css(container, 'flexGrow', justify ? $$(this.dropdown, container).length : '');
+            }
+          },
+          immediate: true } },
       disconnected() {
@@ -5746,7 +5808,7 @@
           return this.dropbar;
         },
-        handler(_, _ref10) {let { $el, dir } = _ref10;
+        handler(_, _ref10) {let { $el, pos: [dir] = [] } = _ref10;
           if (!hasClass($el, this.clsDrop)) {
             return;
           }
@@ -6480,19 +6542,15 @@
           const [scrollElement] = scrollParents(targets, /auto|scroll/, true);
           const { scrollTop, scrollHeight } = scrollElement;
-          const max = scrollHeight - getViewportClientHeight(scrollElement);
+          const viewport = offsetViewport(scrollElement);
+          const max = scrollHeight - viewport.height;
           let active = false;
           if (scrollTop === max) {
             active = length - 1;
           } else {
             for (const i in targets) {
-              if (
-              offset(targets[i]).top -
-              offset(getViewport$1(scrollElement)).top -
-              this.offset >
-              0)
-              {
+              if (offset(targets[i]).top - viewport.top - this.offset > 0) {
                 break;
               }
               active = +i;
@@ -6526,8 +6584,10 @@
       props: {
         position: String,
-        top: null,
+        top: Boolean,
         bottom: Boolean,
+        start: Boolean,
+        end: Boolean,
         offset: String,
         animation: String,
         clsActive: String,
@@ -6541,8 +6601,10 @@
       data: {
         position: 'top',
-        top: 0,
+        top: false,
         bottom: false,
+        start: false,
+        end: false,
         offset: 0,
         animation: '',
         clsActive: 'uk-active',
@@ -6565,6 +6627,9 @@
       },
       connected() {
+        this.start = this.start || this.top;
+        this.end = this.end || this.bottom;
         this.placeholder =
         $('+ .uk-sticky-placeholder', this.$el) ||
         $('<div class="uk-sticky-placeholder"></div>');
@@ -6599,7 +6664,7 @@
             return;
           }
-          fastdom.read(() => {
+          setTimeout(() => {
             const targetOffset = offset($(location.hash));
             const elOffset = offset(this.$el);
@@ -6639,7 +6704,7 @@
           if (hide) {
             this.show();
-            fastdom.write(() => css(this.selTarget, 'transition', ''));
+            requestAnimationFrame(() => css(this.selTarget, 'transition', ''));
           }
           const referenceElement = this.isFixed ? this.placeholder : this.$el;
@@ -6658,13 +6723,17 @@
           const overflow = Math.max(0, height$1 + offset$1 - windowHeight);
           const topOffset = offset(referenceElement).top;
-          const top = parseProp(this.top, this.$el, topOffset);
-          const bottom = parseProp(this.bottom, this.$el, topOffset + height$1, true);
-          const start = Math.max(top, topOffset) - offset$1;
-          const end = bottom ?
-          bottom - offset(this.$el).height + overflow - offset$1 :
-          getScrollingElement(this.$el).scrollHeight - windowHeight;
+          const start =
+          (this.start === false ?
+          topOffset :
+          parseProp(this.start, this.$el, topOffset)) - offset$1;
+          const end =
+          this.end === false ?
+          document.scrollingElement.scrollHeight - windowHeight :
+          parseProp(this.end, this.$el, topOffset + height$1, true) -
+          offset(this.$el).height +
+          overflow -
+          offset$1;
           return {
             start,
@@ -6710,7 +6779,9 @@
             prevDir,
             scroll,
             prevScroll,
-            offsetParentTop: offset(this.$el.offsetParent).top,
+            offsetParentTop: offset(
+            (this.isFixed ? this.placeholder : this.$el).offsetParent).
+            top,
             overflowScroll: clamp(
             overflowScroll + clamp(scroll, start, end) - clamp(prevScroll, start, end),
             0,
@@ -6865,8 +6936,8 @@
         return 0;
       }
-      if (isString(value) && value.match(/^-?\d/)) {
-        return propOffset + toPx(value);
+      if (isNumeric(value) || isString(value) && value.match(/^-?\d/)) {
+        return propOffset + toPx(value, 'height', el, true);
       } else {
         const refElement = value === true ? parent(el) : query(value, el);
         return (
@@ -7186,15 +7257,7 @@
       {
         name: 'click',
-        filter() {
-          return includes(this.mode, 'click');
-        },
         handler(e) {
-          if (this._preventClick) {
-            return this._preventClick = null;
-          }
           let link;
           if (
           closest(e.target, 'a[href="#"], a[href=""]') ||
@@ -7205,6 +7268,14 @@
             e.preventDefault();
           }
+          if (this._preventClick) {
+            return this._preventClick = null;
+          }
+          if (!includes(this.mode, 'click')) {
+            return;
+          }
           this.toggle();
         } },
@@ -7330,9 +7401,6 @@
     // register components
     each(components$1, (component, name) => UIkit.component(name, component));
-    // core functionality
-    UIkit.use(Core);
     boot(UIkit);
     const units = ['days', 'hours', 'minutes', 'seconds'];
@@ -9227,12 +9295,16 @@
     function transformFn(prop, el, stops) {
-      const unit = getUnit(stops) || { x: 'px', y: 'px', rotate: 'deg' }[prop] || '';
+      let unit = getUnit(stops) || { x: 'px', y: 'px', rotate: 'deg' }[prop] || '';
       let transformFn;
       if (prop === 'x' || prop === 'y') {
         prop = "translate" + ucfirst(prop);
         transformFn = (stop) => toFloat(toFloat(stop).toFixed(unit === 'px' ? 0 : 6));
+      } else if (prop === 'scale') {
+        unit = '';
+        transformFn = (stop) =>
+        getUnit([stop]) ? toPx(stop, 'width', el, true) / el.offsetWidth : stop;
       }
       if (stops.length === 1) {
@@ -10546,7 +10618,7 @@
         some((scrollEl) => {
           let { scrollTop: scroll, scrollHeight } = scrollEl;
-          const { top, bottom, height } = offset(getViewport$1(scrollEl));
+          const { top, bottom, height } = offsetViewport(scrollEl);
           if (top < y && top + 35 > y) {
             scroll -= dist;
@@ -10749,10 +10821,12 @@
             this.positionAt(this.tooltip, this.$el);
+            const [dir, align] = getAlignment(this.tooltip, this.$el, this.pos);
             this.origin =
-            this.getAxis() === 'y' ?
-            flipPosition(this.dir) + "-" + this.align :
-            this.align + "-" + flipPosition(this.dir);
+            this.axis === 'y' ?
+            flipPosition(dir) + "-" + align :
+            align + "-" + flipPosition(dir);
           });
           this.toggleElement(this.tooltip, true);
@@ -10789,6 +10863,37 @@
       }
     }
+    function getAlignment(el, target, _ref) {let [dir, align] = _ref;
+      const elOffset = offset(el);
+      const targetOffset = offset(target);
+      const properties = [
+      ['left', 'right'],
+      ['top', 'bottom']];
+      for (const props of properties) {
+        if (elOffset[props[0]] >= targetOffset[props[1]]) {
+          dir = props[1];
+          break;
+        }
+        if (elOffset[props[1]] <= targetOffset[props[0]]) {
+          dir = props[0];
+          break;
+        }
+      }
+      const props = includes(properties[0], dir) ? properties[1] : properties[0];
+      if (elOffset[props[0]] === targetOffset[props[0]]) {
+        align = props[0];
+      } else if (elOffset[props[1]] === targetOffset[props[1]]) {
+        align = props[1];
+      } else {
+        align = 'center';
+      }
+      return [dir, align];
+    }
     var upload = {
       props: {
         allow: String,