uikit 3.17.9-dev.73842811 → 3.17.9-dev.77c1d012a

package/src/js/core/scroll.js

@@ -6,7 +6,6 @@ import {
     on,
     scrollIntoView,
     trigger,
-    within,
 } from 'uikit-util';
 
 export default {
@@ -61,7 +60,7 @@ function clickHandler(e) {
     }
 
     for (const instance of instances) {
-        if (within(e.target, instance.$el) && isSameSiteAnchor(instance.$el)) {
+        if (instance.$el.contains(e.target) && isSameSiteAnchor(instance.$el)) {
             e.preventDefault();
             if (window.location.href !== instance.$el.href) {
                 window.history.pushState({}, '', instance.$el.href);

package/src/js/core/scrollspy-nav.js

@@ -1,6 +1,5 @@
 import {
     $$,
-    closest,
     getCoveringElement,
     getTargetedElement,
     hasClass,
@@ -35,7 +34,7 @@ export default {
         links: (_, $el) => $$('a[href*="#"]', $el).filter((el) => el.hash && isSameSiteAnchor(el)),
 
         elements({ closest: selector }) {
-            return this.links.map((el) => closest(el, selector || '*'));
+            return this.links.map((el) => el.closest(selector || '*'));
         },
     },
 

package/src/js/core/sticky.js

@@ -25,7 +25,6 @@ import {
     toPx,
     toggleClass,
     trigger,
-    within,
 } from 'uikit-util';
 import { resize, scroll, viewport } from '../api/observables';
 import Class from '../mixin/class';
@@ -253,7 +252,7 @@ export default {
 
                 css(placeholder, { height, width, margin });
 
-                if (!within(placeholder, document)) {
+                if (!document.contains(placeholder)) {
                     placeholder.hidden = true;
                 }
                 (sticky ? before : after)(this.$el, placeholder);
@@ -456,9 +455,7 @@ function parseProp(value, el, propOffset, padding) {
         const refElement = value === true ? parent(el) : query(value, el);
         return (
             getOffset(refElement).bottom -
-            (padding && refElement && within(el, refElement)
-                ? toFloat(css(refElement, 'paddingBottom'))
-                : 0)
+            (padding && refElement?.contains(el) ? toFloat(css(refElement, 'paddingBottom')) : 0)
         );
     }
 }

package/src/js/core/switcher.js

@@ -2,7 +2,6 @@ import {
     $$,
     attr,
     children,
-    closest,
     css,
     data,
     endsWith,
@@ -15,7 +14,6 @@ import {
     queryAll,
     toArray,
     toggleClass,
-    within,
 } from 'uikit-util';
 import { generateId } from '../api/instance';
 import { lazyload, swipe } from '../api/observables';
@@ -61,7 +59,7 @@ export default {
 
         children(_, $el) {
             return children($el).filter((child) =>
-                this.toggles.some((toggle) => within(toggle, child)),
+                this.toggles.some((toggle) => child.contains(toggle)),
             );
         },
     },
@@ -132,14 +130,14 @@ export default {
                     keyCode === keyMap.HOME
                         ? 0
                         : keyCode === keyMap.END
-                        ? 'last'
-                        : (keyCode === keyMap.LEFT && !isVertical) ||
-                          (keyCode === keyMap.UP && isVertical)
-                        ? 'previous'
-                        : (keyCode === keyMap.RIGHT && !isVertical) ||
-                          (keyCode === keyMap.DOWN && isVertical)
-                        ? 'next'
-                        : -1;
+                          ? 'last'
+                          : (keyCode === keyMap.LEFT && !isVertical) ||
+                              (keyCode === keyMap.UP && isVertical)
+                            ? 'previous'
+                            : (keyCode === keyMap.RIGHT && !isVertical) ||
+                                (keyCode === keyMap.DOWN && isVertical)
+                              ? 'next'
+                              : -1;
 
                 if (~i) {
                     e.preventDefault();
@@ -165,7 +163,7 @@ export default {
             },
 
             handler(e) {
-                if (closest(e.target, 'a,button')) {
+                if (e.target.closest('a,button')) {
                     e.preventDefault();
                     this.show(data(e.current, this.attrItem));
                 }

package/src/js/core/tab.js

@@ -21,8 +21,8 @@ export default {
         const cls = hasClass(this.$el, 'uk-tab-left')
             ? 'uk-tab-left'
             : hasClass(this.$el, 'uk-tab-right')
-            ? 'uk-tab-right'
-            : false;
+              ? 'uk-tab-right'
+              : false;
 
         if (cls) {
             this.$create('toggle', this.$el, { cls, mode: 'media', media: this.media });

package/src/js/core/toggle.js

@@ -1,6 +1,5 @@
 import {
     attr,
-    closest,
     hasAttr,
     hasClass,
     includes,
@@ -15,7 +14,6 @@ import {
     pointerLeave,
     queryAll,
     trigger,
-    within,
 } from 'uikit-util';
 import { lazyload } from '../api/observables';
 import Media from '../mixin/media';
@@ -85,7 +83,7 @@ export default {
                     pointerDown,
                     () => trigger(this.$el, 'blur'),
                     true,
-                    (e) => !within(e.target, this.$el),
+                    (e) => !this.$el.contains(e.target),
                 );
 
                 // Prevent initial click to prevent double toggle through focus + click
@@ -163,8 +161,8 @@ export default {
                 let link;
                 if (
                     this._preventClick ||
-                    closest(e.target, 'a[href="#"], a[href=""]') ||
-                    ((link = closest(e.target, 'a[href]')) &&
+                    e.target.closest('a[href="#"], a[href=""]') ||
+                    ((link = e.target.closest('a[href]')) &&
                         (!this.isToggled(this.target) ||
                             (link.hash && matches(this.target, link.hash))))
                 ) {

package/src/js/mixin/animate.js

@@ -20,13 +20,13 @@ export default {
                 name === 'fade'
                     ? fade
                     : name === 'delayed-fade'
-                    ? (...args) => fade(...args, 40)
-                    : name
-                    ? slide
-                    : () => {
-                          action();
-                          return Promise.resolve();
-                      };
+                      ? (...args) => fade(...args, 40)
+                      : name
+                        ? slide
+                        : () => {
+                              action();
+                              return Promise.resolve();
+                          };
 
             return animationFn(action, target, this.duration).catch(noop);
         },

package/src/js/mixin/internal/animate-fade.js

@@ -93,8 +93,8 @@ export default function fade(action, target, duration, stagger = 0) {
     return hasClass(target, clsLeave)
         ? waitTransitionend(target).then(enterFn)
         : hasClass(target, clsEnter)
-        ? waitTransitionend(target).then(leaveFn).then(enterFn)
-        : leaveFn().then(enterFn);
+          ? waitTransitionend(target).then(leaveFn).then(enterFn)
+          : leaveFn().then(enterFn);
 }
 
 function transitionIndex(target, next) {

package/src/js/mixin/modal.js

@@ -18,7 +18,6 @@ import {
     pointerUp,
     removeClass,
     toFloat,
-    within,
 } from 'uikit-util';
 import Class from './class';
 import Container from './container';
@@ -89,8 +88,7 @@ export default {
                     !defaultPrevented &&
                     hash &&
                     isSameSiteAnchor(current) &&
-                    !within(hash, this.$el) &&
-                    $(hash, document.body)
+                    !this.$el.contains($(hash))
                 ) {
                     this.hide();
                 } else if (matches(current, this.selClose)) {
@@ -259,7 +257,7 @@ function toMs(time) {
 
 function preventBackgroundFocus(modal) {
     return on(document, 'focusin', (e) => {
-        if (last(active) === modal && !within(e.target, modal.$el)) {
+        if (last(active) === modal && !modal.$el.contains(e.target)) {
             modal.$el.focus();
         }
     });
@@ -269,8 +267,8 @@ function listenForBackgroundClose(modal) {
     return on(document, pointerDown, ({ target }) => {
         if (
             last(active) !== modal ||
-            (modal.overlay && !within(target, modal.$el)) ||
-            within(target, modal.panel)
+            (modal.overlay && !modal.$el.contains(target)) ||
+            modal.panel.contains(target)
         ) {
             return;
         }

package/src/js/mixin/slider-drag.js

@@ -1,5 +1,4 @@
 import {
-    closest,
     css,
     getEventPos,
     includes,
@@ -57,7 +56,7 @@ export default {
                 if (
                     !this.draggable ||
                     (!isTouch(e) && hasSelectableText(e.target)) ||
-                    closest(e.target, selInput) ||
+                    e.target.closest(selInput) ||
                     e.button > 0 ||
                     this.length < 2
                 ) {

package/src/js/mixin/slider-nav.js

@@ -4,7 +4,6 @@ import {
     append,
     attr,
     children,
-    closest,
     data,
     empty,
     isNumeric,
@@ -151,7 +150,7 @@ export default {
 
             handler(e) {
                 if (
-                    closest(e.target, 'a,button') &&
+                    e.target.closest('a,button') &&
                     (e.type === 'click' || e.keyCode === keyMap.SPACE)
                 ) {
                     e.preventDefault();
@@ -184,12 +183,12 @@ export default {
                     keyCode === keyMap.HOME
                         ? 0
                         : keyCode === keyMap.END
-                        ? 'last'
-                        : keyCode === keyMap.LEFT
-                        ? 'previous'
-                        : keyCode === keyMap.RIGHT
-                        ? 'next'
-                        : -1;
+                          ? 'last'
+                          : keyCode === keyMap.LEFT
+                            ? 'previous'
+                            : keyCode === keyMap.RIGHT
+                              ? 'next'
+                              : -1;
 
                 if (~i) {
                     e.preventDefault();

package/src/js/mixin/togglable.js

@@ -64,10 +64,10 @@ export default {
                             isFunction(animate)
                                 ? animate
                                 : animate === false || !this.hasAnimation
-                                ? toggleInstant
-                                : this.hasTransition
-                                ? toggleTransition
-                                : toggleAnimation
+                                  ? toggleInstant
+                                  : this.hasTransition
+                                    ? toggleTransition
+                                    : toggleAnimation
                         )(el, show, this);
 
                         const cls = show ? this.clsEnter : this.clsLeave;
@@ -100,10 +100,10 @@ export default {
             return hasClass(el, this.clsEnter)
                 ? true
                 : hasClass(el, this.clsLeave)
-                ? false
-                : this.cls
-                ? hasClass(el, this.cls.split(' ')[0])
-                : isVisible(el);
+                  ? false
+                  : this.cls
+                    ? hasClass(el, this.cls.split(' ')[0])
+                    : isVisible(el);
         },
 
         _toggle(el, toggled) {

package/src/js/util/dimensions.js

@@ -178,10 +178,10 @@ export function toPx(value, property = 'width', element = window, offsetDim = fa
                   unit === 'vh'
                       ? getViewportHeight()
                       : unit === 'vw'
-                      ? width(toWindow(element))
-                      : offsetDim
-                      ? element[`offset${ucfirst(property)}`]
-                      : dimensions(element)[property],
+                        ? width(toWindow(element))
+                        : offsetDim
+                          ? element[`offset${ucfirst(property)}`]
+                          : dimensions(element)[property],
                   value,
               )
             : value;

package/src/js/util/event.js

@@ -1,4 +1,3 @@
-import { closest, within } from './filter';
 import { isArray, isFunction, isString, toNode, toNodes } from './lang';
 import { findAll } from './selector';
 
@@ -91,8 +90,8 @@ function delegate(selector, listener) {
             selector[0] === '>'
                 ? findAll(selector, e.currentTarget)
                       .reverse()
-                      .filter((element) => within(e.target, element))[0]
-                : closest(e.target, selector);
+                      .find((element) => element.contains(e.target))
+                : e.target.closest(selector);
 
         if (current) {
             e.current = current;
@@ -126,10 +125,10 @@ export function toEventTargets(target) {
     return isArray(target)
         ? target.map(toEventTarget).filter(Boolean)
         : isString(target)
-        ? findAll(target)
-        : isEventTarget(target)
-        ? [target]
-        : toNodes(target);
+          ? findAll(target)
+          : isEventTarget(target)
+            ? [target]
+            : toNodes(target);
 }
 
 export function isTouch(e) {

package/src/js/util/lang.js

@@ -95,10 +95,10 @@ export function toBoolean(value) {
     return isBoolean(value)
         ? value
         : value === 'true' || value === '1' || value === ''
-        ? true
-        : value === 'false' || value === '0'
-        ? false
-        : value;
+          ? true
+          : value === 'false' || value === '0'
+            ? false
+            : value;
 }
 
 export function toNumber(value) {
@@ -258,12 +258,12 @@ export function getIndex(i, elements, current = 0, finite = false) {
     i = isNumeric(i)
         ? toNumber(i)
         : i === 'next'
-        ? current + 1
-        : i === 'previous'
-        ? current - 1
-        : i === 'last'
-        ? length - 1
-        : elements.indexOf(toNode(i));
+          ? current + 1
+          : i === 'previous'
+            ? current - 1
+            : i === 'last'
+              ? length - 1
+              : elements.indexOf(toNode(i));
 
     if (finite) {
         return clamp(i, 0, length - 1);

package/src/js/util/position.js

@@ -1,5 +1,4 @@
 import { offset } from './dimensions';
-import { within } from './filter';
 import { clamp, isArray, ucfirst } from './lang';
 import { css } from './style';
 import { offsetViewport, overflowParents } from './viewport';
@@ -169,7 +168,7 @@ function getScrollArea(element, target, viewportOffset, i) {
 }
 
 function commonScrollParents(element, target) {
-    return overflowParents(target).filter((parent) => within(element, parent));
+    return overflowParents(target).filter((parent) => parent.contains(element));
 }
 
 function getIntersectionArea(...rects) {

package/src/js/util/selector.js

@@ -1,5 +1,5 @@
 import { attr } from './attr';
-import { closest, index, matches, parent } from './filter';
+import { index, matches, parent } from './filter';
 import { isDocument, isString, memoize, toNode, toNodes } from './lang';
 
 export function query(selector, context) {
@@ -45,7 +45,7 @@ function _query(selector, context = document, queryFn) {
 
             if (sel[0] === '!') {
                 const selectors = sel.substr(1).trim().split(' ');
-                ctx = closest(parent(context), selectors[0]);
+                ctx = parent(context).closest(selectors[0]);
                 sel = selectors.slice(1).join(' ').trim();
                 if (!sel.length && split.length === 1) {
                     return ctx;

package/src/js/util/style.js

@@ -44,8 +44,8 @@ export function css(element, property, value, priority) {
                     isNumeric(value) && !cssNumber[property]
                         ? `${value}px`
                         : value || isNumber(value)
-                        ? value
-                        : '',
+                          ? value
+                          : '',
                     priority,
                 );
             }

package/src/js/util/viewport.js

@@ -1,5 +1,5 @@
 import { offset, offsetPosition } from './dimensions';
-import { isVisible, parent, parents, within } from './filter';
+import { isVisible, parent, parents } from './filter';
 import {
     clamp,
     findIndex,
@@ -199,21 +199,25 @@ export function offsetViewport(scrollElement) {
 }
 
 export function getCoveringElement(target) {
-    return target.ownerDocument
-        .elementsFromPoint(offset(target).left, 0)
-        .find(
-            (el) =>
-                !el.contains(target) &&
-                ((css(el, 'position') === 'fixed' && !hasHigherZIndex(target, el)) ||
-                    (css(el, 'position') === 'sticky' && within(target, parent(el)))),
-        );
+    return target.ownerDocument.elementsFromPoint(offset(target).left, 0).find(
+        (el) =>
+            !el.contains(target) &&
+            ((hasPosition(el, 'fixed') &&
+                zIndex(
+                    parents(target)
+                        .reverse()
+                        .find((parent) => !parent.contains(el) && !hasPosition(parent, 'static')),
+                ) < zIndex(el)) ||
+                (hasPosition(el, 'sticky') && parent(el).contains(target))),
+    );
 }
 
-function hasHigherZIndex(element1, element2) {
-    return (
-        parent(element1) === parent(element2) &&
-        toFloat(css(element1, 'zIndex')) > toFloat(css(element2, 'zIndex'))
-    );
+function zIndex(element) {
+    return toFloat(css(element, 'zIndex'));
+}
+
+function hasPosition(element, position) {
+    return css(element, 'position') === position;
 }
 
 function scrollingElement(element) {