uikit 3.16.25-dev.12f581d90 → 3.16.25-dev.931f07bf4

package/package.json

@@ -2,7 +2,7 @@
   "name": "uikit",
   "title": "UIkit",
   "description": "UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.",
-  "version": "3.16.25-dev.12f581d90",
+  "version": "3.16.25-dev.931f07bf4",
   "main": "dist/js/uikit.js",
   "style": "dist/css/uikit.css",
   "sideEffects": [

package/src/js/api/observables.js

@@ -15,6 +15,7 @@ import {
     pointerDown,
     pointerUp,
     removeAttr,
+    scrollParent,
     toNodes,
     trigger,
 } from 'uikit-util';
@@ -58,15 +59,12 @@ export function viewport() {
 export function scroll(options) {
     return observe(
         (target, handler) => ({
-            disconnect: on(target, 'scroll', handler, {
+            disconnect: on(toScrollTargets(target), 'scroll', handler, {
                 passive: true,
                 capture: true,
             }),
         }),
-        {
-            target: () => document,
-            ...options,
-        },
+        options,
         'scroll',
     );
 }
@@ -126,3 +124,11 @@ function swipeDirection(x1, y1, x2, y2) {
         ? 'Up'
         : 'Down';
 }
+
+function toScrollTargets(elements) {
+    return toNodes(elements).map((node) => {
+        const { ownerDocument } = node;
+        const parent = scrollParent(node, true);
+        return parent === ownerDocument.scrollingElement ? ownerDocument : parent;
+    });
+}

package/src/js/components/parallax.js

@@ -41,9 +41,9 @@ export default {
     },
 
     observe: [
-        resize({ target: ({ $el, target }) => [$el, target, scrollParent(target, true)] }),
-        scroll(),
         viewport(),
+        scroll({ target: ({ target }) => target }),
+        resize({ target: ({ $el, target }) => [$el, target, scrollParent(target, true)] }),
     ],
 
     update: {

package/src/js/core/sticky.js

@@ -98,9 +98,9 @@ export default {
     },
 
     observe: [
-        resize({ target: ({ $el }) => [$el, document.scrollingElement] }),
         viewport(),
-        scroll(),
+        scroll({ target: () => document.scrollingElement }),
+        resize({ target: ({ $el }) => [$el, document.scrollingElement] }),
     ],
 
     events: [

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

@@ -7,7 +7,6 @@ import {
     closest,
     data,
     empty,
-    isInView,
     isNumeric,
     matches,
     parent,
@@ -207,7 +206,7 @@ export default {
     methods: {
         updateNav() {
             const index = this.getValidIndex();
-            let focusEl;
+
             for (const el of this.navItems) {
                 const cmd = data(el, this.attrItem);
                 const button = $('a,button', el) || el;
@@ -223,8 +222,8 @@ export default {
                         tabindex: active ? null : -1,
                     });
 
-                    if (active) {
-                        focusEl ||= matches(parent(el), ':focus-within') && button;
+                    if (active && button && matches(parent(el), ':focus-within')) {
+                        button.focus();
                     }
                 } else {
                     toggleClass(
@@ -235,10 +234,6 @@ export default {
                                 (cmd === 'next' && index >= this.maxIndex)),
                     );
                 }
-
-                if (focusEl && isInView(focusEl)) {
-                    focusEl.focus();
-                }
             }
         },
     },

package/src/less/components/slider.less

@@ -39,10 +39,16 @@
  ========================================================================== */
 
 /*
- * Clip child elements
+ * 1. Clip child elements
+ * 2. Prevent accidental scrolling through elements in slide getting focused
  */
 
-.uk-slider-container { overflow: hidden; }
+.uk-slider-container {
+    /* 1 */
+    overflow: hidden;
+    /* 2 */
+    overflow: clip;
+}
 
 /*
  * Widen container to prevent box-shadows from clipping, `large-box-shadow`

package/src/scss/components/inverse.scss

@@ -20,7 +20,6 @@
  ========================================================================== */
 
 
-
 /*
  * Implemented class depends on the general theme color
  * `uk-light` is for light colors on dark backgrounds

package/src/scss/components/slider.scss

@@ -35,10 +35,16 @@
  ========================================================================== */
 
 /*
- * Clip child elements
+ * 1. Clip child elements
+ * 2. Prevent accidental scrolling through elements in slide getting focused
  */
 
-.uk-slider-container { overflow: hidden; }
+.uk-slider-container {
+    /* 1 */
+    overflow: hidden;
+    /* 2 */
+    overflow: clip;
+}
 
 /*
  * Widen container to prevent box-shadows from clipping, `large-box-shadow`