uikit 3.11.2-dev.c7ed3c19b → 3.11.2-dev.d8c101f07

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.11.2-dev.c7ed3c19b",
+    "version": "3.11.2-dev.d8c101f07",
     "main": "dist/js/uikit.js",
     "style": "dist/css/uikit.css",
     "sideEffects": [

package/src/js/api/component.js

@@ -1,13 +1,4 @@
-import {
-    $$,
-    assign,
-    camelize,
-    fastdom,
-    hyphenate,
-    isPlainObject,
-    memoize,
-    startsWith,
-} from 'uikit-util';
+import { $$, camelize, fastdom, hyphenate, isPlainObject, memoize, startsWith } from 'uikit-util';
 
 export default function (UIkit) {
     const DATA = UIkit.data;
@@ -51,7 +42,7 @@ export default function (UIkit) {
             }
         };
 
-        const opt = isPlainObject(options) ? assign({}, options) : options.options;
+        const opt = isPlainObject(options) ? { ...options } : options.options;
 
         opt.name = name;
 

package/src/js/api/hooks.js

@@ -105,7 +105,7 @@ export default function (UIkit) {
         const {
             $options: { computed },
         } = this;
-        const values = assign({}, this._computeds);
+        const values = { ...this._computeds };
         this._computeds = {};
 
         for (const key in computed) {

package/src/js/api/state.js

@@ -187,7 +187,7 @@ export default function (UIkit) {
         el = isFunction(el) ? el.call(component) : el || component.$el;
 
         if (isArray(el)) {
-            el.forEach((el) => registerEvent(component, assign({}, event, { el }), key));
+            el.forEach((el) => registerEvent(component, { ...event, el }, key));
             return;
         }
 

package/src/js/components/filter.js

@@ -2,7 +2,6 @@ import Animate from '../mixin/animate';
 import {
     $$,
     append,
-    assign,
     css,
     data,
     each,
@@ -105,7 +104,7 @@ export default {
         },
 
         setState(state, animate = true) {
-            state = assign({ filter: { '': '' }, sort: [] }, state);
+            state = { filter: { '': '' }, sort: [], ...state };
 
             trigger(this.$el, 'beforeFilter', [this, state]);
 
@@ -205,7 +204,7 @@ function getSelector({ filter }) {
 }
 
 function sortItems(nodes, sort, order) {
-    return assign([], nodes).sort(
+    return [...nodes].sort(
         (a, b) =>
             data(a, sort).localeCompare(data(b, sort), undefined, { numeric: true }) *
             (order === 'asc' || -1)

package/src/js/components/internal/lightbox-animations.js

@@ -1,7 +1,8 @@
 import Animations, { scale3d } from '../../mixin/internal/slideshow-animations';
-import { assign, css } from 'uikit-util';
+import { css } from 'uikit-util';
 
-export default assign({}, Animations, {
+export default {
+    ...Animations,
     fade: {
         show() {
             return [{ opacity: 0 }, { opacity: 1 }];
@@ -35,4 +36,4 @@ export default assign({}, Animations, {
             ];
         },
     },
-});
+};

package/src/js/components/internal/slideshow-animations.js

@@ -3,9 +3,10 @@ import Animations, {
     translate,
     translated,
 } from '../../mixin/internal/slideshow-animations';
-import { assign, css } from 'uikit-util';
+import { css } from 'uikit-util';
 
-export default assign({}, Animations, {
+export default {
+    ...Animations,
     fade: {
         show() {
             return [{ opacity: 0, zIndex: 0 }, { zIndex: -1 }];
@@ -96,4 +97,4 @@ export default assign({}, Animations, {
                   ];
         },
     },
-});
+};

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

@@ -7,7 +7,6 @@ import {
     $,
     addClass,
     append,
-    assign,
     attr,
     fragment,
     getImage,
@@ -219,29 +218,21 @@ export default {
                 if (type === 'image' || src.match(/\.(avif|jpe?g|a?png|gif|svg|webp)($|\?)/i)) {
                     try {
                         const { width, height } = await getImage(src, attrs.srcset, attrs.size);
-                        this.setItem(
-                            item,
-                            createEl('img', assign({ src, width, height, alt }, attrs))
-                        );
+                        this.setItem(item, createEl('img', { src, width, height, alt, ...attrs }));
                     } catch (e) {
                         this.setError(item);
                     }
 
                     // Video
                 } else if (type === 'video' || src.match(/\.(mp4|webm|ogv)($|\?)/i)) {
-                    const video = createEl(
-                        'video',
-                        assign(
-                            {
-                                src,
-                                poster,
-                                controls: '',
-                                playsinline: '',
-                                'uk-video': `${this.videoAutoplay}`,
-                            },
-                            attrs
-                        )
-                    );
+                    const video = createEl('video', {
+                        src,
+                        poster,
+                        controls: '',
+                        playsinline: '',
+                        'uk-video': `${this.videoAutoplay}`,
+                        ...attrs,
+                    });
 
                     on(video, 'loadedmetadata', () => {
                         attr(video, { width: video.videoWidth, height: video.videoHeight });
@@ -253,18 +244,13 @@ export default {
                 } else if (type === 'iframe' || src.match(/\.(html|php)($|\?)/i)) {
                     this.setItem(
                         item,
-                        createEl(
-                            'iframe',
-                            assign(
-                                {
-                                    src,
-                                    frameborder: '0',
-                                    allowfullscreen: '',
-                                    class: 'uk-lightbox-iframe',
-                                },
-                                attrs
-                            )
-                        )
+                        createEl('iframe', {
+                            src,
+                            frameborder: '0',
+                            allowfullscreen: '',
+                            class: 'uk-lightbox-iframe',
+                            ...attrs,
+                        })
                     );
 
                     // YouTube
@@ -275,20 +261,15 @@ export default {
                 ) {
                     this.setItem(
                         item,
-                        createEl(
-                            'iframe',
-                            assign(
-                                {
-                                    src: `https://www.youtube${matches[1] || ''}.com/embed/${
-                                        matches[2]
-                                    }${matches[3] ? `?${matches[3]}` : ''}`,
-                                    width: 1920,
-                                    height: 1080,
-                                },
-                                iframeAttrs,
-                                attrs
-                            )
-                        )
+                        createEl('iframe', {
+                            src: `https://www.youtube${matches[1] || ''}.com/embed/${matches[2]}${
+                                matches[3] ? `?${matches[3]}` : ''
+                            }`,
+                            width: 1920,
+                            height: 1080,
+                            ...iframeAttrs,
+                            ...attrs,
+                        })
                     );
 
                     // Vimeo
@@ -307,20 +288,15 @@ export default {
 
                         this.setItem(
                             item,
-                            createEl(
-                                'iframe',
-                                assign(
-                                    {
-                                        src: `https://player.vimeo.com/video/${matches[1]}${
-                                            matches[2] ? `?${matches[2]}` : ''
-                                        }`,
-                                        width,
-                                        height,
-                                    },
-                                    iframeAttrs,
-                                    attrs
-                                )
-                            )
+                            createEl('iframe', {
+                                src: `https://player.vimeo.com/video/${matches[1]}${
+                                    matches[2] ? `?${matches[2]}` : ''
+                                }`,
+                                width,
+                                height,
+                                ...iframeAttrs,
+                                ...attrs,
+                            })
                         );
                     } catch (e) {
                         this.setError(item);

package/src/js/components/lightbox.js

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

package/src/js/components/sortable.js

@@ -205,7 +205,7 @@ export default {
 
             this.touched = new Set([this]);
             this.placeholder = placeholder;
-            this.origin = assign({ target, index: index(placeholder) }, this.pos);
+            this.origin = { target, index: index(placeholder), ...this.pos };
 
             on(document, pointerMove, this.move);
             on(document, pointerUp, this.end);

package/src/js/core/alert.js

@@ -1,6 +1,5 @@
 import Class from '../mixin/class';
 import Togglable from '../mixin/togglable';
-import { assign } from 'uikit-util';
 
 export default {
     mixins: [Class, Togglable],
@@ -15,7 +14,7 @@ export default {
         animation: [true],
         selClose: '.uk-alert-close',
         duration: 150,
-        hideProps: assign({ opacity: 0 }, Togglable.data.hideProps),
+        hideProps: { opacity: 0, ...Togglable.data.hideProps },
     },
 
     events: [

package/src/js/core/modal.js

@@ -2,7 +2,6 @@ import Modal from '../mixin/modal';
 import {
     $,
     addClass,
-    assign,
     css,
     Deferred,
     hasClass,
@@ -136,7 +135,7 @@ function install({ modal }) {
     };
 
     function openDialog(tmpl, options, hideFn, submitFn) {
-        options = assign({ bgClose: false, escClose: true, labels: modal.labels }, options);
+        options = { bgClose: false, escClose: true, labels: modal.labels, ...options };
 
         const dialog = modal.dialog(tmpl(options), options);
         const deferred = new Deferred();

package/src/js/core/navbar.js

@@ -6,7 +6,6 @@ import {
     $$,
     addClass,
     after,
-    assign,
     css,
     findIndex,
     hasAttr,
@@ -126,11 +125,12 @@ export default {
                 this.$create(
                     'drop',
                     dropdowns.filter((el) => !this.getDropdown(el)),
-                    assign({}, this.$props, {
+                    {
+                        ...this.$props,
                         boundary: this.boundary,
                         pos: this.pos,
                         offset: this.dropbar || this.offset,
-                    })
+                    }
                 );
             },
 

package/src/js/mixin/internal/animate-slide.js

@@ -1,5 +1,4 @@
 import {
-    assign,
     children,
     css,
     fastdom,
@@ -44,7 +43,7 @@ export default function (action, target, duration) {
 
                 // Reset to previous state
                 nodes.forEach((el, i) => propsFrom[i] && css(el, propsFrom[i]));
-                css(target, assign({ display: 'block' }, targetProps));
+                css(target, { display: 'block', ...targetProps });
 
                 // Start transitions on next frame
                 requestAnimationFrame(() => {
@@ -76,16 +75,14 @@ function getProps(el, opacity) {
     const zIndex = css(el, 'zIndex');
 
     return isVisible(el)
-        ? assign(
-              {
-                  display: '',
-                  opacity: opacity ? css(el, 'opacity') : '0',
-                  pointerEvents: 'none',
-                  position: 'absolute',
-                  zIndex: zIndex === 'auto' ? index(el) : zIndex,
-              },
-              getPositionWithMargin(el)
-          )
+        ? {
+              display: '',
+              opacity: opacity ? css(el, 'opacity') : '0',
+              pointerEvents: 'none',
+              position: 'absolute',
+              zIndex: zIndex === 'auto' ? index(el) : zIndex,
+              ...getPositionWithMargin(el),
+          }
         : false;
 }
 

package/src/js/mixin/slider.js

@@ -4,7 +4,6 @@ import SliderNav from './slider-nav';
 import {
     $,
     $$,
-    assign,
     clamp,
     fastdom,
     getIndex,
@@ -170,21 +169,14 @@ export default {
         },
 
         _show(prev, next, force) {
-            this._transitioner = this._getTransitioner(
-                prev,
-                next,
-                this.dir,
-                assign(
-                    {
-                        easing: force
-                            ? next.offsetWidth < 600
-                                ? 'cubic-bezier(0.25, 0.46, 0.45, 0.94)' /* easeOutQuad */
-                                : 'cubic-bezier(0.165, 0.84, 0.44, 1)' /* easeOutQuart */
-                            : this.easing,
-                    },
-                    this.transitionOptions
-                )
-            );
+            this._transitioner = this._getTransitioner(prev, next, this.dir, {
+                easing: force
+                    ? next.offsetWidth < 600
+                        ? 'cubic-bezier(0.25, 0.46, 0.45, 0.94)' /* easeOutQuad */
+                        : 'cubic-bezier(0.165, 0.84, 0.44, 1)' /* easeOutQuart */
+                    : this.easing,
+                ...this.transitionOptions,
+            });
 
             if (!force && !prev) {
                 this._translate(1);

package/src/js/mixin/slideshow.js

@@ -1,7 +1,7 @@
 import Animations from './internal/slideshow-animations';
 import Transitioner from './internal/slideshow-transitioner';
 import Slider from './slider.js';
-import { addClass, assign, removeClass } from 'uikit-util';
+import { addClass, removeClass } from 'uikit-util';
 
 export default {
     mixins: [Slider],
@@ -19,7 +19,7 @@ export default {
 
     computed: {
         animation({ animation, Animations }) {
-            return assign(Animations[animation] || Animations.slide, { name: animation });
+            return { ...(Animations[animation] || Animations.slide), name: animation };
         },
 
         transitionOptions() {

package/src/js/mixin/togglable.js

@@ -2,7 +2,6 @@ import {
     $$,
     addClass,
     Animation,
-    assign,
     css,
     fastdom,
     hasClass,
@@ -175,7 +174,7 @@ export function toggleHeight({ isToggled, duration, initProps, hideProps, transi
             show
                 ? Transition.start(
                       el,
-                      assign({}, initProps, { overflow: 'hidden', height: endHeight }),
+                      { ...initProps, overflow: 'hidden', height: endHeight },
                       Math.round(duration * (1 - currentHeight / endHeight)),
                       transition
                   )

package/src/js/util/ajax.js

@@ -2,18 +2,15 @@ import { on } from './event';
 import { assign, noop } from './lang';
 
 export function ajax(url, options) {
-    const env = assign(
-        {
-            data: null,
-            method: 'GET',
-            headers: {},
-            xhr: new XMLHttpRequest(),
-            beforeSend: noop,
-            responseType: '',
-        },
-        options
-    );
-
+    const env = {
+        data: null,
+        method: 'GET',
+        headers: {},
+        xhr: new XMLHttpRequest(),
+        beforeSend: noop,
+        responseType: '',
+        ...options,
+    };
     return Promise.resolve()
         .then(() => env.beforeSend(env))
         .then(() => send(url, env));

package/src/js/util/animation.js

@@ -1,7 +1,7 @@
 import { attr } from './attr';
 import { once, trigger } from './event';
 import { css, propName } from './style';
-import { assign, startsWith, toNodes } from './lang';
+import { startsWith, toNodes } from './lang';
 import { addClass, hasClass, removeClass, removeClasses } from './class';
 
 export function transition(element, props, duration = 400, timing = 'linear') {
@@ -35,17 +35,12 @@ export function transition(element, props, duration = 400, timing = 'linear') {
                     );
 
                     addClass(element, 'uk-transition');
-                    css(
-                        element,
-                        assign(
-                            {
-                                transitionProperty: Object.keys(props).map(propName).join(','),
-                                transitionDuration: `${duration}ms`,
-                                transitionTimingFunction: timing,
-                            },
-                            props
-                        )
-                    );
+                    css(element, {
+                        transitionProperty: Object.keys(props).map(propName).join(','),
+                        transitionDuration: `${duration}ms`,
+                        transitionTimingFunction: timing,
+                        ...props,
+                    });
                 })
         )
     );

package/src/js/util/lang.js

@@ -216,7 +216,7 @@ export const Dimensions = {
     },
 
     contain(dimensions, maxDimensions) {
-        dimensions = assign({}, dimensions);
+        dimensions = { ...dimensions };
 
         each(
             dimensions,

package/src/js/util/options.js

@@ -1,13 +1,4 @@
-import {
-    assign,
-    hasOwn,
-    includes,
-    isArray,
-    isFunction,
-    isUndefined,
-    sortBy,
-    startsWith,
-} from './lang';
+import { hasOwn, includes, isArray, isFunction, isUndefined, sortBy, startsWith } from './lang';
 
 const strats = {};
 
@@ -48,7 +39,7 @@ strats.props = function (parentVal, childVal) {
 
 // extend strategy
 strats.computed = strats.methods = function (parentVal, childVal) {
-    return childVal ? (parentVal ? assign({}, parentVal, childVal) : childVal) : parentVal;
+    return childVal ? (parentVal ? { ...parentVal, ...childVal } : childVal) : parentVal;
 };
 
 // data strategy

package/src/js/util/player.js

@@ -1,5 +1,5 @@
 import { once } from './event';
-import { assign, includes, noop } from './lang';
+import { includes, noop } from './lang';
 
 export function play(el) {
     if (isIFrame(el)) {
@@ -64,7 +64,7 @@ async function call(el, cmd) {
 
 function post(el, cmd) {
     try {
-        el.contentWindow.postMessage(JSON.stringify(assign({ event: 'command' }, cmd)), '*');
+        el.contentWindow.postMessage(JSON.stringify({ event: 'command', ...cmd }), '*');
     } catch (e) {
         // noop
     }