uikit 3.25.29-dev.f3e1c53 → 3.25.30-dev.188f79c

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.29-dev.f3e1c53",
+    "version": "3.25.30-dev.188f79c",
     "main": "dist/js/uikit.js",
     "style": "dist/css/uikit.css",
     "sideEffects": [
@@ -30,7 +30,7 @@
         "url": "https://github.com/uikit/uikit/issues"
     },
     "homepage": "https://getuikit.com",
-    "packageManager": "pnpm@12.9.1",
+    "packageManager": "pnpm@12.16.1",
     "devDependencies": {
         "@eslint/js": "^10.0.1",
         "@rollup/plugin-alias": "^6.0.0",

package/src/js/components/lightbox-panel.js

@@ -344,7 +344,7 @@ export default {
                     try {
                         const { height, width } = await (
                             await fetch(
-                                `https://vimeo.com/api/oembed.json?maxwidth=1920&url=${encodeURI(
+                                `https://vimeo.com/api/oembed.json?maxwidth=1920&url=${encodeURIComponent(
                                     src,
                                 )}`,
                                 { credentials: 'omit' },
@@ -463,9 +463,9 @@ function toThumbnavItem(item, videoAutoplay) {
 }
 
 function isImage(src) {
-    return src?.match(/\.(avif|jpe?g|jfif|a?png|gif|svg|webp)($|\?)/i);
+    return src?.match(/\.(avif|jpe?g|jfif|a?png|gif|svg|webp)($|[?#])/i);
 }
 
 function isVideo(src) {
-    return src?.match(/\.(mp4|webm|ogv)($|\?)/i);
+    return src?.match(/\.(mp4|webm|ogv)($|[?#])/i);
 }

package/src/js/components/lightbox.js

@@ -71,7 +71,7 @@ export default {
                 index = findIndex(items, ({ source: src }) => source === src);
             }
 
-            this.panel = this.panel || this.$create('lightboxPanel', { ...this.$props, items });
+            this.panel ||= this.$create('lightboxPanel', { ...this.$props, items });
 
             on(this.panel.$el, 'hidden', () => (this.panel = null));
 

package/src/js/core/grid.js

@@ -201,8 +201,6 @@ function transpose(rows) {
 }
 
 function push(array, index, value) {
-    if (!array[index]) {
-        array[index] = [];
-    }
+    array[index] ||= [];
     array[index].push(value);
 }

package/src/js/core/icon.js

@@ -251,9 +251,7 @@ function install(UIkit) {
         if (UIkit._initialized) {
             apply(document.body, (el) =>
                 each(UIkit.getComponents(el), (cmp) => {
-                    cmp.$options.isIcon &&
-                        (aliases[cmp.icon] || cmp.icon) in added &&
-                        cmp.$reset();
+                    cmp.$options.isIcon && (aliases[cmp.icon] || cmp.icon) in added && cmp.$reset();
                 }),
             );
         }
@@ -269,9 +267,7 @@ function getIcon(icon) {
         return null;
     }
 
-    if (!parsed[icon]) {
-        parsed[icon] = parseSVG(icons[applyRtl(icon)] || icons[icon]);
-    }
+    parsed[icon] ||= parseSVG(icons[applyRtl(icon)] || icons[icon]);
 
     return parsed[icon].cloneNode(true);
 }

package/src/js/core/svg.js

@@ -1,4 +1,14 @@
-import { addClass, attr, css, includes, isTag, memoize, once, removeAttr } from 'uikit-util';
+import {
+    addClass,
+    attr,
+    css,
+    hasAttr,
+    includes,
+    isTag,
+    memoize,
+    once,
+    removeAttr,
+} from 'uikit-util';
 import { mutation } from '../api/observables';
 import Svg, { parseSVG } from '../mixin/svg';
 import { getMaxPathLength } from '../util/svg';
@@ -51,7 +61,11 @@ export default {
     methods: {
         async getSvg() {
             if (isTag(this.$el, 'img') && !this.$el.complete && this.$el.loading === 'lazy') {
-                await new Promise((resolve) => once(this.$el, 'load', resolve));
+                await new Promise((resolve, reject) =>
+                    once(this.$el, 'load error', (event) =>
+                        event.type === 'load' ? resolve() : reject(event),
+                    ),
+                );
             }
 
             return parseSVG(await loadSVG(this.src), this.icon) || Promise.reject('SVG not found.');
@@ -60,7 +74,7 @@ export default {
 };
 
 function applyAttributes(el) {
-    const { $el } = this;
+    const { $el, attributes } = this;
 
     addClass(el, attr($el, 'class'), 'uk-svg');
 
@@ -69,12 +83,22 @@ function applyAttributes(el) {
         css(el, prop, css($el, prop));
     }
 
-    for (const attribute in this.attributes) {
-        const [prop, value] = this.attributes[attribute].split(':', 2);
+    for (const attribute in attributes) {
+        const [prop, value] = attributes[attribute].split(':', 2);
         attr(el, prop, value);
     }
 
-    el.ariaHidden = this.$el.ariaHidden;
+    el.ariaHidden ||= $el.ariaHidden;
+
+    if (!el.ariaHidden) {
+        el.ariaLabel ||= $el.ariaLabel || $el.alt || null;
+
+        if (el.ariaLabel) {
+            el.role ||= 'img';
+        } else if (hasAttr($el, 'alt')) {
+            el.ariaHidden = true;
+        }
+    }
 
     if (!this.$el.id) {
         removeAttr(el, 'id');

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

@@ -79,10 +79,7 @@ export default {
                     const slide = this.slides[item];
 
                     if (slide) {
-                        if (!slide.id) {
-                            slide.id = generateId(this, slide);
-                        }
-                        ariaControls = slide.id;
+                        ariaControls = slide.id ||= generateId(this, slide);
                     }
 
                     ariaLabel = this.t('slideX', toFloat(cmd) + 1);
@@ -90,18 +87,14 @@ export default {
                     button.role = 'tab';
                 } else {
                     if (this.list) {
-                        if (!this.list.id) {
-                            this.list.id = generateId(this, this.list);
-                        }
-
-                        ariaControls = this.list.id;
+                        ariaControls = this.list.id ||= generateId(this, this.list);
                     }
 
                     ariaLabel = this.t(cmd);
                 }
 
                 attr(button, 'aria-controls', ariaControls);
-                button.ariaLabel = button.ariaLabel || ariaLabel;
+                button.ariaLabel ||= ariaLabel;
             }
         },
 
@@ -126,7 +119,9 @@ export default {
     update: [
         {
             write() {
-                this.navItems.concat(this.nav).forEach((el) => el && (el.hidden = this.maxIndex < 1));
+                this.navItems
+                    .concat(this.nav)
+                    .forEach((el) => el && (el.hidden = this.maxIndex < 1));
                 this.updateNav();
             },
 

package/src/js/util/filter.js

@@ -83,7 +83,12 @@ export function isSameSiteAnchor(el) {
 export function getTargetedElement(el) {
     if (isSameSiteAnchor(el)) {
         const { hash, ownerDocument } = toNode(el);
-        const id = decodeURIComponent(hash).slice(1);
+        let id = hash.slice(1);
+        try {
+            id = decodeURIComponent(id);
+        } catch {
+            // Fall back to the literal fragment for malformed encoding.
+        }
         return id
             ? ownerDocument.getElementById(id) || ownerDocument.getElementsByName(id)[0]
             : ownerDocument.documentElement;

package/src/js/util/svg.js

@@ -1,10 +1,11 @@
 import { $$ } from './dom';
-import { isVisible } from './filter.js';
 
 export function getMaxPathLength(el) {
-    return isVisible(el)
-        ? Math.ceil(
-              Math.max(0, ...$$('[stroke]', el).map((stroke) => stroke.getTotalLength?.() || 0)),
-          )
-        : 0;
+    try {
+        return Math.ceil(
+            Math.max(0, ...$$('[stroke]', el).map((stroke) => stroke.getTotalLength?.() || 0)),
+        );
+    } catch {
+        return 0;
+    }
 }

package/src/js/util/viewport.js

@@ -209,7 +209,7 @@ export function offsetViewport(scrollElement) {
 
 export function getCoveringElement(target) {
     const { document } = toWindow(target);
-    target = target || document.body;
+    target ||= document.body;
     const { left, width, top } = dimensions(target);
     for (const position of top ? [0, top] : [0]) {
         let coverEl;