uikit 3.25.28-dev.fcd5185 → 3.25.29-dev.7b0f736

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.28-dev.fcd5185",
+    "version": "3.25.29-dev.7b0f736",
     "main": "dist/js/uikit.js",
     "style": "dist/css/uikit.css",
     "sideEffects": [

package/src/js/api/component.js

@@ -21,7 +21,7 @@ export function component(name, options) {
 
     App[name] = (element, data) => createComponent(name, element, data);
 
-    const opt = options.options ?? { ...options };
+    const opt = options.options || { ...options };
 
     opt.id = id;
     opt.name = name;

package/src/js/api/computed.js

@@ -74,7 +74,7 @@ export function initComputedUpdates(instance) {
 }
 
 function resetComputed(instance) {
-    const values = { ...instance._computed };
+    const values = instance._computed;
     instance._computed = {};
     return values;
 }

package/src/js/api/log.js

@@ -5,6 +5,6 @@ export function log(instance, eventName, eventData) {
         instance._uid,
         'font-weight:bold;',
         eventName,
-        [...(eventData ?? []), instance, instance.$el],
+        [...(eventData || []), instance, instance.$el],
     );
 }

package/src/js/api/observables.js

@@ -83,13 +83,14 @@ export function swipe(options) {
             const pos = getEventPos(e);
             const target = 'tagName' in e.target ? e.target : parent(e.target);
             once(document, `${pointerUp} ${pointerCancel} scroll`, (e) => {
+                if (e.type !== pointerUp || !target) {
+                    return;
+                }
+
                 const { x, y } = getEventPos(e);
 
                 // swipe
-                if (
-                    (e.type !== 'scroll' && target && x && Math.abs(pos.x - x) > 100) ||
-                    (y && Math.abs(pos.y - y) > 100)
-                ) {
+                if ((x && Math.abs(pos.x - x) > 100) || (y && Math.abs(pos.y - y) > 100)) {
                     setTimeout(() => {
                         trigger(target, 'swipe');
                         trigger(target, `swipe${swipeDirection(pos.x, pos.y, x, y)}`);

package/src/js/api/observer.js

@@ -3,19 +3,18 @@ import { registerComputed } from './computed';
 import { registerWatch } from './watch';
 
 export function initObservers(instance) {
-    for (const observer of instance.$options.observe || []) {
-        registerObservable(instance, observer);
+    for (const [index, observer] of (instance.$options.observe || []).entries()) {
+        registerObservable(instance, observer, `_observe${index}`);
     }
 }
 
-function registerObservable(instance, observable) {
+function registerObservable(instance, observable, key) {
     let { observe, target = instance.$el, handler, options, filter, args } = observable;
 
     if (filter && !filter.call(instance, instance)) {
         return;
     }
 
-    const key = `_observe${instance._disconnect.length}`;
     if (isFunction(target) && !hasOwn(instance, key)) {
         registerComputed(instance, key, () => {
             const targets = target.call(instance, instance);

package/src/js/api/update.js

@@ -20,24 +20,25 @@ export function callUpdate(instance, e = 'update') {
         return;
     }
 
-    if (!instance._updateCount) {
-        instance._updateCount = 0;
-        requestAnimationFrame(() => (instance._updateCount = 0));
-    }
-
     if (!instance._queued) {
         instance._queued = new Set();
         fastdom.read(() => {
             if (instance._connected) {
-                runUpdates(instance, instance._queued);
+                if (!instance._updateCount) {
+                    instance._updateCount = 0;
+                    requestAnimationFrame(() => (instance._updateCount = 0));
+                }
+
+                if (instance._updateCount < 10) {
+                    instance._updateCount++;
+                    runUpdates(instance, instance._queued);
+                }
             }
             instance._queued = null;
         });
     }
 
-    if (instance._updateCount++ < 20) {
-        instance._queued.add(e.type || e);
-    }
+    instance._queued.add(e.type || e);
 }
 
 function runUpdates(instance, types) {

package/src/js/components/upload.js

@@ -95,48 +95,49 @@ export default {
 
     methods: {
         async upload(files) {
-            files = toArray(files);
+            try {
+                files = toArray(files);
 
-            if (!files.length) {
-                return;
-            }
-
-            if (!this.multiple) {
-                files = files.slice(0, 1);
-            }
-
-            trigger(this.$el, 'upload', [files]);
-
-            for (const file of files) {
-                if (this.maxSize && this.maxSize * 1000 < file.size) {
-                    this.fail(this.t('invalidSize', this.maxSize));
+                if (!files.length) {
                     return;
                 }
 
-                if (this.allow && !match(this.allow, file.name)) {
-                    this.fail(this.t('invalidName', this.allow));
-                    return;
+                if (!this.multiple) {
+                    files = files.slice(0, 1);
                 }
 
-                if (this.mime && !match(this.mime, file.type)) {
-                    this.fail(this.t('invalidMime', this.mime));
-                    return;
+                trigger(this.$el, 'upload', [files]);
+
+                for (const file of files) {
+                    if (this.maxSize && this.maxSize * 1000 < file.size) {
+                        this.fail(this.t('invalidSize', this.maxSize));
+                        return;
+                    }
+
+                    if (this.allow && !match(this.allow, file.name)) {
+                        this.fail(this.t('invalidName', this.allow));
+                        return;
+                    }
+
+                    if (this.mime && !match(this.mime, file.type)) {
+                        this.fail(this.t('invalidMime', this.mime));
+                        return;
+                    }
                 }
-            }
 
-            this.beforeAll(this, files);
+                await this.beforeAll(this, files);
 
-            const chunks = chunk(files, this.concurrent);
-            const upload = async (files) => {
-                const data = new FormData();
+                const size = this.concurrent;
 
-                files.forEach((file) => data.append(this.name, file));
+                for (let i = 0; i < files.length; i += size) {
+                    const data = new FormData();
 
-                for (const key in this.params) {
-                    data.append(key, this.params[key]);
-                }
+                    files.slice(i, i + size).forEach((file) => data.append(this.name, file));
+
+                    for (const key in this.params) {
+                        data.append(key, this.params[key]);
+                    }
 
-                try {
                     const xhr = await ajax(this.url, {
                         data,
                         method: this.method,
@@ -154,19 +155,15 @@ export default {
 
                     this.complete(xhr);
 
-                    if (chunks.length) {
-                        await upload(chunks.shift());
-                    } else {
+                    if (i + size >= files.length) {
                         this.completeAll(xhr);
                     }
-                } catch (e) {
-                    if (e.name !== 'AbortError') {
-                        this.error(e);
-                    }
                 }
-            };
-
-            await upload(chunks.shift());
+            } catch (e) {
+                if (e?.name !== 'AbortError') {
+                    this.error(e);
+                }
+            }
         },
     },
 };
@@ -174,20 +171,12 @@ export default {
 function match(pattern, path) {
     const expression = pattern.replace(
         /\*\*|[.*+?^${}()|[\]\\]/g,
-        (s) => ({ '**': '.*', '*': '[^/]+', '?': '[^/]', '|': '|' })[s] ?? `\\${s}`,
+        (s) => ({ '**': '.*', '*': '[^/]+', '?': '[^/]', '|': '|' })[s] || `\\${s}`,
     );
 
     return new RegExp(`^(?:${expression})$`, 'i').test(path);
 }
 
-function chunk(files, size) {
-    const chunks = [];
-    for (let i = 0; i < files.length; i += size) {
-        chunks.push(files.slice(i, i + size));
-    }
-    return chunks;
-}
-
 function stop(e) {
     e.preventDefault();
     e.stopPropagation();

package/src/js/core/drop.js

@@ -114,11 +114,11 @@ export default {
         this._style = pick(this.$el.style, ['width', 'height']);
     },
 
+    beforeDisconnect() {
+        this.hide(false, false);
+    },
+
     disconnected() {
-        if (this.isActive()) {
-            this.hide(false);
-            active = null;
-        }
         css(this.$el, this._style);
     },
 

package/src/js/core/form-custom.js

@@ -1,4 +1,4 @@
-import { $, $$, isInput, matches, parent, selInput } from 'uikit-util';
+import { $, isInput, parent, selInput } from 'uikit-util';
 import Class from '../mixin/class';
 
 export default {
@@ -37,15 +37,10 @@ export default {
             return;
         }
 
-        let option;
         const prop = isInput(target) ? 'value' : 'textContent';
         const prev = target[prop];
-        const value = input.files?.[0]
-            ? input.files[0].name
-            : matches(input, 'select') &&
-                (option = $$('option', input).find((el) => el.selected))
-              ? option.textContent
-              : input.value;
+        const value =
+            input.files?.[0]?.name ?? input.selectedOptions?.[0]?.label ?? input.value;
 
         if (prev !== value) {
             target[prop] = value;

package/src/js/core/svg.js

@@ -84,7 +84,7 @@ function applyAttributes(el) {
 const loadSVG = memoize(async (src) => {
     if (src) {
         const response = await fetch(src);
-        if (response.headers.get('Content-Type') === 'image/svg+xml') {
+        if (/^image\/svg\+xml\s*(;|$)/i.test(response.headers.get('Content-Type'))) {
             return response.text();
         }
     }

package/src/js/core/toggle.js

@@ -177,8 +177,6 @@ export default {
 
             filter: ({ mode }) => includes(mode, 'media'),
 
-            el: ({ target }) => target,
-
             handler(e, mediaObj) {
                 if (mediaObj.matches ^ this.isToggled(this.target)) {
                     this.toggle();

package/src/js/mixin/modal.js

@@ -239,7 +239,7 @@ function animate(el, show, { transitionElement, _toggle }) {
             _toggle(el, show);
 
             Promise.all(
-                (transitionElement?.getAnimations?.() ?? []).map(({ finished }) => finished),
+                (transitionElement?.getAnimations?.() || []).map(({ finished }) => finished),
             ).then(resolve, reject);
         }),
     ).then(() => {