uikit 3.17.10 → 3.17.12-dev.a7c73679a

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.17.10",
+  "version": "3.17.12-dev.a7c73679a",
   "main": "dist/js/uikit.js",
   "style": "dist/css/uikit.css",
   "sideEffects": [

package/src/js/api/instance.js

@@ -60,19 +60,7 @@ export default function (App) {
     });
 }
 
-const ids = Object.create(null);
-export function generateId(instance, el = instance.$el, postfix = '') {
-    if (el.id) {
-        return el.id;
-    }
-
-    let id = `${instance.$options.id}-${instance._uid}${postfix}`;
-
-    if (ids[id]) {
-        id = generateId(instance, el, `${postfix}-2`);
-    }
-
-    ids[id] = true;
-
-    return id;
+let id = 1;
+export function generateId(instance, el = null) {
+    return el?.id || `${instance.$options.id}-${id++}`;
 }

package/src/js/components/sortable.js

@@ -13,7 +13,6 @@ import {
     hasTouch,
     height,
     index,
-    isEmpty,
     isInput,
     isTag,
     off,
@@ -90,7 +89,7 @@ export default {
         },
 
         isEmpty() {
-            return isEmpty(this.items);
+            return !this.items.length;
         },
 
         handles({ handle }, $el) {

package/src/js/components/tooltip.js

@@ -3,7 +3,6 @@ import {
     attr,
     flipPosition,
     data as getData,
-    hasAttr,
     includes,
     isFocusable,
     isTouch,
@@ -54,13 +53,19 @@ export default {
                 return;
             }
 
-            this.title = title;
-            this.id ||= generateId(this, {});
-            this._hasTitle = hasAttr(this.$el, 'title');
-            attr(this.$el, { title: null, 'aria-describedby': this.id });
+            const titleAttr = attr(this.$el, 'title');
+            const off = on(this.$el, ['blur', pointerLeave], (e) => !isTouch(e) && this.hide());
+
+            this.reset = () => {
+                attr(this.$el, { title: titleAttr, 'aria-describedby': null });
+                off();
+            };
+
+            const id = generateId(this);
+            attr(this.$el, { title: null, 'aria-describedby': id });
 
             clearTimeout(this.showTimer);
-            this.showTimer = setTimeout(this._show, delay);
+            this.showTimer = setTimeout(() => this._show(title, id), delay);
         },
 
         async hide() {
@@ -74,16 +79,16 @@ export default {
                 await this.toggleElement(this.tooltip, false, false);
             }
 
-            attr(this.$el, { title: this._hasTitle ? this.title : null, 'aria-describedby': null });
+            this.reset?.();
             remove(this.tooltip);
             this.tooltip = null;
         },
 
-        async _show() {
+        async _show(title, id) {
             this.tooltip = append(
                 this.container,
-                `<div id="${this.id}" class="uk-${this.$options.name}" role="tooltip">
-                    <div class="uk-${this.$options.name}-inner">${this.title}</div>
+                `<div id="${id}" class="uk-${this.$options.name}" role="tooltip">
+                    <div class="uk-${this.$options.name}-inner">${title}</div>
                  </div>`,
             );
 
@@ -115,7 +120,6 @@ export default {
                     on([document, ...overflowParents(this.$el)], 'scroll', update, {
                         passive: true,
                     }),
-                    on(this.$el, ['blur', pointerLeave], (e) => !isTouch(e) && this.hide()),
                 ];
                 once(this.tooltip, 'hide', () => handlers.forEach((handler) => handler()), {
                     self: true,

package/src/js/core/accordion.js

@@ -144,8 +144,8 @@ export default {
                 continue;
             }
 
-            toggle.id = generateId(this, toggle, `-title-${index}`);
-            content.id = generateId(this, content, `-content-${index}`);
+            toggle.id = generateId(this, toggle);
+            content.id = generateId(this, content);
 
             const active = includes(activeItems, this.items[index]);
             attr(toggle, {

package/src/js/core/svg.js

@@ -62,9 +62,7 @@ export default {
     methods: {
         async getSvg() {
             if (isTag(this.$el, 'img') && !this.$el.complete && this.$el.loading === 'lazy') {
-                return new Promise((resolve) =>
-                    once(this.$el, 'load', () => resolve(this.getSvg())),
-                );
+                await new Promise((resolve) => once(this.$el, 'load', resolve));
             }
 
             return parseSVG(await loadSVG(this.src), this.icon) || Promise.reject('SVG not found.');

package/src/js/core/switcher.js

@@ -201,8 +201,8 @@ export default {
                 continue;
             }
 
-            toggle.id = generateId(this, toggle, `-tab-${index}`);
-            item.id = generateId(this, item, `-tabpanel-${index}`);
+            toggle.id = generateId(this, toggle);
+            item.id = generateId(this, item);
 
             attr(toggle, 'aria-controls', item.id);
             attr(item, { role: 'tabpanel', 'aria-labelledby': toggle.id });

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

@@ -74,7 +74,7 @@ export default {
 
                     if (slide) {
                         if (!slide.id) {
-                            slide.id = generateId(this, slide, `-item-${cmd}`);
+                            slide.id = generateId(this, slide);
                         }
                         ariaControls = slide.id;
                     }
@@ -85,7 +85,7 @@ export default {
                 } else {
                     if (this.list) {
                         if (!this.list.id) {
-                            this.list.id = generateId(this, this.list, '-items');
+                            this.list.id = generateId(this, this.list);
                         }
 
                         ariaControls = this.list.id;