uikit 3.17.9-dev.9f100be74 → 3.17.9-dev.f43c05fb3

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,
@@ -70,7 +70,9 @@ export function scrollIntoView(element, { offset: offsetBy = 0 } = {}) {
             const scroll = element.scrollTop;
             const duration = getDuration(Math.abs(top));
             const start = Date.now();
-            const targetTop = offset(targetEl).top;
+            const isScrollingElement = scrollingElement(element) === element;
+            const targetTop = offset(targetEl).top + (isScrollingElement ? 0 : scroll);
+
             let prev = 0;
             let frames = 15;
 
@@ -78,7 +80,10 @@ export function scrollIntoView(element, { offset: offsetBy = 0 } = {}) {
                 const percent = ease(clamp((Date.now() - start) / duration));
                 let diff = 0;
                 if (parents[0] === element && scroll + top < maxScroll) {
-                    diff = offset(targetEl).top - targetTop;
+                    diff =
+                        offset(targetEl).top +
+                        (isScrollingElement ? 0 : element.scrollTop) -
+                        targetTop;
                     const coverEl = getCoveringElement(targetEl);
                     diff -= coverEl ? offset(coverEl).height : 0;
                 }
@@ -199,21 +204,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) {