uikit 3.25.3 → 3.25.5-dev.7295faa9

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.25.3",
+  "version": "3.25.5-dev.7295faa9",
   "main": "dist/js/uikit.js",
   "style": "dist/css/uikit.css",
   "sideEffects": [
@@ -34,7 +34,7 @@
     "execa": "^9.6.1",
     "fs-extra": "^11.3.2",
     "glob": "^13.0.0",
-    "globals": "^16.5.0",
+    "globals": "^17.0.0",
     "inquirer": "^13.1.0",
     "less": "^4.5.1",
     "minimist": "^1.2.8",

package/src/js/core/accordion.js

@@ -109,10 +109,16 @@ export default {
                     return;
                 }
 
+                const item = index(this.toggles, e.current);
+
+                if (item === -1) {
+                    return;
+                }
+
                 maybeDefaultPreventClick(e);
 
                 const off = keepScrollPosition(e.target);
-                this.toggle(index(this.toggles, e.current)).finally(off);
+                this.toggle(item).finally(off);
             },
         },
         {

package/src/js/core/overflow-fade.js

@@ -1,22 +1,45 @@
-import { children, clamp, css, toggleClass } from 'uikit-util';
+import {
+    children,
+    clamp,
+    css,
+    getEventPos,
+    hasClass,
+    isInput,
+    isTouch,
+    on,
+    pointerCancel,
+    pointerDown,
+    pointerMove,
+    pointerUp,
+    selInput,
+    toggleClass,
+} from 'uikit-util';
 import { mutation, resize } from '../api/observables';
 
 export default {
     data: {
+        threshold: 5,
         fadeDuration: 0.05,
     },
 
-    events: {
-        name: 'scroll',
+    events: [
+        {
+            name: 'scroll',
 
-        self: true,
+            self: true,
 
-        passive: true,
+            passive: true,
 
-        handler() {
-            this.$emit();
+            handler() {
+                this.$emit();
+            },
         },
-    },
+        {
+            name: pointerDown,
+
+            handler: handleMouseDrag,
+        },
+    ],
 
     observe: [
         mutation({
@@ -65,3 +88,55 @@ export default {
         events: ['resize'],
     },
 };
+
+function handleMouseDrag(e) {
+    const { target, button, defaultPrevented } = e;
+
+    if (
+        defaultPrevented ||
+        button > 0 ||
+        isTouch(e) ||
+        target.closest(selInput) ||
+        isInput(target)
+    ) {
+        return;
+    }
+
+    e.preventDefault();
+
+    const pointerOptions = { passive: false, capture: true };
+    const { $el: el, threshold, $options } = this;
+    let started;
+
+    const off = on(document, pointerMove, move(e), pointerOptions);
+    on(document, [pointerUp, pointerCancel], end, { capture: true, once: true });
+
+    function move(e) {
+        let origin = getEventPos(e);
+        let pos = origin;
+        let lastPos = pos;
+
+        return function (e) {
+            lastPos = pos;
+            pos = getEventPos(e);
+
+            const isVertical = hasClass(el, `${$options.id}-vertical`);
+            const prop = isVertical ? 'y' : 'x';
+
+            started ||= Math.abs(pos[prop] - origin[prop]) > threshold;
+
+            if (started) {
+                const delta = lastPos[prop] - pos[prop];
+                el[isVertical ? 'scrollTop' : 'scrollLeft'] += delta;
+            }
+        };
+    }
+
+    function end() {
+        off();
+
+        if (started) {
+            setTimeout(on(el, 'click', (e) => e.preventDefault(), pointerOptions));
+        }
+    }
+}

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

@@ -13,7 +13,6 @@ import {
 } from 'uikit-util';
 
 const pointerOptions = { passive: false, capture: true };
-const pointerUpOptions = { passive: true, capture: true };
 const pointerDown = 'touchstart mousedown';
 const pointerMove = 'touchmove mousemove';
 const pointerUp = 'touchend touchcancel mouseup click input scroll';
@@ -104,7 +103,7 @@ export default {
             on(document, pointerMove, this.move, pointerOptions);
 
             // 'input' event is triggered by video controls
-            on(document, pointerUp, this.end, pointerUpOptions);
+            on(document, pointerUp, this.end, { passive: true, capture: true, once: true });
 
             css(this.list, 'userSelect', 'none');
         },
@@ -181,7 +180,6 @@ export default {
 
         end() {
             off(document, pointerMove, this.move, pointerOptions);
-            off(document, pointerUp, this.end, pointerUpOptions);
 
             if (this.dragging) {
                 setTimeout(on(this.list, 'click', (e) => e.preventDefault(), pointerOptions));

package/src/less/components/nav.less

@@ -375,7 +375,6 @@ ul.uk-nav-sub {
  */
 
 .uk-nav-secondary > li > a {
-
     color: @nav-secondary-item-color;
     .hook-nav-secondary-item();
 }

package/src/scss/components/nav.scss

@@ -312,7 +312,6 @@ ul.uk-nav-sub {
  */
 
 .uk-nav-secondary > li > a {
-
     color: $nav-secondary-item-color;
     @if(meta.mixin-exists(hook-nav-secondary-item)) {@include hook-nav-secondary-item();}
 }