uikit 3.20.10 → 3.20.11-dev.43d76edf7

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.20.10",
+  "version": "3.20.11-dev.43d76edf7",
   "main": "dist/js/uikit.js",
   "style": "dist/css/uikit.css",
   "sideEffects": [
@@ -28,10 +28,10 @@
     "chokidar-cli": "^3.0.0",
     "clean-css": "^5.3.3",
     "dateformat": "^5.0.3",
-    "esbuild": "^0.20.2",
+    "esbuild": "^0.21.2",
     "eslint": "^9.1.1",
     "eslint-config-prettier": "^9.1.0",
-    "execa": "^8.0.1",
+    "execa": "^9.0.2",
     "fs-extra": "^11.2.0",
     "glob": "^10.3.12",
     "globals": "^15.0.0",

package/src/js/api/observer.js

@@ -1,4 +1,4 @@
-import { hasOwn, includes, isArray, isFunction, isString } from 'uikit-util';
+import { hasOwn, includes, isArray, isFunction, isString, toNodes } from 'uikit-util';
 import { registerComputed } from './computed';
 import { registerWatch } from './watch';
 
@@ -28,7 +28,7 @@ function registerObservable(instance, observable) {
 
     const key = `_observe${instance._observers.length}`;
     if (isFunction(target) && !hasOwn(instance, key)) {
-        registerComputed(instance, key, () => target.call(instance, instance));
+        registerComputed(instance, key, () => toNodes(target.call(instance, instance)));
     }
 
     handler = isString(handler) ? instance[handler] : handler.bind(instance);

package/src/js/components/filter.js

@@ -5,7 +5,6 @@ import {
     attr,
     css,
     data,
-    each,
     fastdom,
     children as getChildren,
     hasClass,
@@ -139,7 +138,7 @@ function isEqualState(stateA, stateB) {
 }
 
 function applyState(state, target, children) {
-    const selector = getSelector(state);
+    const selector = Object.values(state.filter).join('');
 
     for (const el of children) {
         css(el, 'display', selector && !matches(el, selector) ? 'none' : '');
@@ -195,12 +194,6 @@ function matchFilter(
         : stateSort === sort && stateOrder === order;
 }
 
-function getSelector({ filter }) {
-    let selector = '';
-    each(filter, (value) => (selector += value || ''));
-    return selector;
-}
-
 function sortItems(nodes, sort, order) {
     return [...nodes].sort(
         (a, b) =>

package/src/js/core/icon.js

@@ -35,6 +35,7 @@ import spinner from '../../images/components/spinner.svg';
 import totop from '../../images/components/totop.svg';
 import I18n from '../mixin/i18n';
 import Svg from '../mixin/svg';
+import { stringToSvg } from './svg';
 
 const icons = {
     spinner,
@@ -261,7 +262,7 @@ function getIcon(icon) {
     }
 
     if (!parsed[icon]) {
-        parsed[icon] = $((icons[applyRtl(icon)] || icons[icon]).trim());
+        parsed[icon] = stringToSvg(icons[applyRtl(icon)] || icons[icon]);
     }
 
     return parsed[icon].cloneNode(true);

package/src/js/core/svg.js

@@ -1,5 +1,4 @@
 import {
-    $,
     addClass,
     attr,
     css,
@@ -107,8 +106,7 @@ function parseSVG(svg, icon) {
         svg = parseSymbols(svg)[icon] || svg;
     }
 
-    svg = $(svg.substr(svg.indexOf('<svg')));
-    return svg?.hasChildNodes() && svg;
+    return stringToSvg(svg);
 }
 
 const symbolRe = /<symbol([^]*?id=(['"])(.+?)\2[^]*?<\/)symbol>/g;
@@ -133,3 +131,9 @@ function applyAnimation(el) {
         css(el, '--uk-animation-stroke', length);
     }
 }
+
+export function stringToSvg(string) {
+    const container = document.createElement('template');
+    container.innerHTML = string;
+    return container.content.firstElementChild;
+}

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

@@ -40,6 +40,11 @@ export default {
             }
 
             const target = this.parallaxTarget;
+
+            if (!target) {
+                return false;
+            }
+
             const start = toPx(this.parallaxStart, 'height', target, true);
             const end = toPx(this.parallaxEnd, 'height', target, true);
             const percent = ease(scrolledOver(target, start, end), this.parallaxEasing);