uikit 3.11.2-dev.19d26d0f9 → 3.11.2-dev.21a5b7139

package/src/js/uikit.js

@@ -1,9 +1,7 @@
 import UIkit from './uikit-core';
 import * as components from './components/index';
-import {each} from 'uikit-util';
+import { each } from 'uikit-util';
 
-each(components, (component, name) =>
-    UIkit.component(name, component)
-);
+each(components, (component, name) => UIkit.component(name, component));
 
 export default UIkit;

package/src/js/util/ajax.js

@@ -1,17 +1,18 @@
-import {on} from './event';
-import {Promise} from './promise';
-import {assign, isString, noop} from './lang';
+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 = assign(
+        {
+            data: null,
+            method: 'GET',
+            headers: {},
+            xhr: new XMLHttpRequest(),
+            beforeSend: noop,
+            responseType: '',
+        },
+        options
+    );
 
     return Promise.resolve()
         .then(() => env.beforeSend(env))
@@ -20,15 +21,15 @@ export function ajax(url, options) {
 
 function send(url, env) {
     return new Promise((resolve, reject) => {
-        let {xhr} = env;
+        const { xhr } = env;
 
         for (const prop in env) {
             if (prop in xhr) {
                 try {
-
                     xhr[prop] = env[prop];
-
-                } catch (e) {}
+                } catch (e) {
+                    // noop
+                }
             }
         }
 
@@ -39,51 +40,34 @@ function send(url, env) {
         }
 
         on(xhr, 'load', () => {
-
-            if (xhr.status === 0 || xhr.status >= 200 && xhr.status < 300 || xhr.status === 304) {
-
-                // IE 11 does not support responseType 'json'
-                if (env.responseType === 'json' && isString(xhr.response)) {
-                    xhr = assign(copyXhr(xhr), {response: JSON.parse(xhr.response)});
-                }
-
+            if (xhr.status === 0 || (xhr.status >= 200 && xhr.status < 300) || xhr.status === 304) {
                 resolve(xhr);
-
             } else {
-                reject(assign(Error(xhr.statusText), {
-                    xhr,
-                    status: xhr.status
-                }));
+                reject(
+                    assign(Error(xhr.statusText), {
+                        xhr,
+                        status: xhr.status,
+                    })
+                );
             }
-
         });
 
-        on(xhr, 'error', () => reject(assign(Error('Network Error'), {xhr})));
-        on(xhr, 'timeout', () => reject(assign(Error('Network Timeout'), {xhr})));
+        on(xhr, 'error', () => reject(assign(Error('Network Error'), { xhr })));
+        on(xhr, 'timeout', () => reject(assign(Error('Network Timeout'), { xhr })));
 
         xhr.send(env.data);
     });
 }
 
 export function getImage(src, srcset, sizes) {
-
     return new Promise((resolve, reject) => {
         const img = new Image();
 
-        img.onerror = e => reject(e);
+        img.onerror = (e) => reject(e);
         img.onload = () => resolve(img);
 
         sizes && (img.sizes = sizes);
         srcset && (img.srcset = srcset);
         img.src = src;
     });
-
-}
-
-function copyXhr(source) {
-    const target = {};
-    for (const key in source) {
-        target[key] = source[key];
-    }
-    return target;
 }

package/src/js/util/animation.js

@@ -1,49 +1,57 @@
-import {attr} from './attr';
-import {Promise} from './promise';
-import {once, trigger} from './event';
-import {css, propName} from './style';
-import {assign, startsWith, toNodes} from './lang';
-import {addClass, hasClass, removeClass, removeClasses} from './class';
+import { attr } from './attr';
+import { once, trigger } from './event';
+import { css, propName } from './style';
+import { assign, startsWith, toNodes } from './lang';
+import { addClass, hasClass, removeClass, removeClasses } from './class';
 
 export function transition(element, props, duration = 400, timing = 'linear') {
-
-    return Promise.all(toNodes(element).map(element =>
-        new Promise((resolve, reject) => {
-
-            for (const name in props) {
-                const value = css(element, name);
-                if (value === '') {
-                    css(element, name, value);
-                }
-            }
-
-            const timer = setTimeout(() => trigger(element, 'transitionend'), duration);
-
-            once(element, 'transitionend transitioncanceled', ({type}) => {
-                clearTimeout(timer);
-                removeClass(element, 'uk-transition');
-                css(element, {
-                    transitionProperty: '',
-                    transitionDuration: '',
-                    transitionTimingFunction: ''
-                });
-                type === 'transitioncanceled' ? reject() : resolve(element);
-            }, {self: true});
-
-            addClass(element, 'uk-transition');
-            css(element, assign({
-                transitionProperty: Object.keys(props).map(propName).join(','),
-                transitionDuration: `${duration}ms`,
-                transitionTimingFunction: timing
-            }, props));
-
-        })
-    ));
-
+    return Promise.all(
+        toNodes(element).map(
+            (element) =>
+                new Promise((resolve, reject) => {
+                    for (const name in props) {
+                        const value = css(element, name);
+                        if (value === '') {
+                            css(element, name, value);
+                        }
+                    }
+
+                    const timer = setTimeout(() => trigger(element, 'transitionend'), duration);
+
+                    once(
+                        element,
+                        'transitionend transitioncanceled',
+                        ({ type }) => {
+                            clearTimeout(timer);
+                            removeClass(element, 'uk-transition');
+                            css(element, {
+                                transitionProperty: '',
+                                transitionDuration: '',
+                                transitionTimingFunction: '',
+                            });
+                            type === 'transitioncanceled' ? reject() : resolve(element);
+                        },
+                        { self: true }
+                    );
+
+                    addClass(element, 'uk-transition');
+                    css(
+                        element,
+                        assign(
+                            {
+                                transitionProperty: Object.keys(props).map(propName).join(','),
+                                transitionDuration: `${duration}ms`,
+                                transitionTimingFunction: timing,
+                            },
+                            props
+                        )
+                    );
+                })
+        )
+    );
 }
 
 export const Transition = {
-
     start: transition,
 
     stop(element) {
@@ -57,47 +65,47 @@ export const Transition = {
 
     inProgress(element) {
         return hasClass(element, 'uk-transition');
-    }
-
+    },
 };
 
 const animationPrefix = 'uk-animation-';
 
 export function animate(element, animation, duration = 200, origin, out) {
-
-    return Promise.all(toNodes(element).map(element =>
-        new Promise((resolve, reject) => {
-
-            trigger(element, 'animationcanceled');
-            const timer = setTimeout(() => trigger(element, 'animationend'), duration);
-
-            once(element, 'animationend animationcanceled', ({type}) => {
-
-                clearTimeout(timer);
-
-                type === 'animationcanceled' ? reject() : resolve(element);
-
-                css(element, 'animationDuration', '');
-                removeClasses(element, `${animationPrefix}\\S*`);
-
-            }, {self: true});
-
-            css(element, 'animationDuration', `${duration}ms`);
-            addClass(element, animation, animationPrefix + (out ? 'leave' : 'enter'));
-
-            if (startsWith(animation, animationPrefix)) {
-                origin && addClass(element, `uk-transform-origin-${origin}`);
-                out && addClass(element, `${animationPrefix}reverse`);
-            }
-
-        })
-    ));
-
+    return Promise.all(
+        toNodes(element).map(
+            (element) =>
+                new Promise((resolve, reject) => {
+                    trigger(element, 'animationcanceled');
+                    const timer = setTimeout(() => trigger(element, 'animationend'), duration);
+
+                    once(
+                        element,
+                        'animationend animationcanceled',
+                        ({ type }) => {
+                            clearTimeout(timer);
+
+                            type === 'animationcanceled' ? reject() : resolve(element);
+
+                            css(element, 'animationDuration', '');
+                            removeClasses(element, `${animationPrefix}\\S*`);
+                        },
+                        { self: true }
+                    );
+
+                    css(element, 'animationDuration', `${duration}ms`);
+                    addClass(element, animation, animationPrefix + (out ? 'leave' : 'enter'));
+
+                    if (startsWith(animation, animationPrefix)) {
+                        origin && addClass(element, `uk-transform-origin-${origin}`);
+                        out && addClass(element, `${animationPrefix}reverse`);
+                    }
+                })
+        )
+    );
 }
 
 const inProgress = new RegExp(`${animationPrefix}(enter|leave)`);
 export const Animation = {
-
     in: animate,
 
     out(element, animation, duration, origin) {
@@ -110,6 +118,5 @@ export const Animation = {
 
     cancel(element) {
         trigger(element, 'animationcanceled');
-    }
-
+    },
 };

package/src/js/util/attr.js

@@ -1,7 +1,6 @@
-import {isFunction, isObject, isUndefined, toNode, toNodes} from './lang';
+import { isFunction, isObject, isUndefined, toNode, toNodes } from './lang';
 
 export function attr(element, name, value) {
-
     if (isObject(name)) {
         for (const key in name) {
             attr(element, key, name[key]);
@@ -10,11 +9,9 @@ export function attr(element, name, value) {
     }
 
     if (isUndefined(value)) {
-        element = toNode(element);
-        return element && element.getAttribute(name);
+        return toNode(element)?.getAttribute(name);
     } else {
-        toNodes(element).forEach(element => {
-
+        toNodes(element).forEach((element) => {
             if (isFunction(value)) {
                 value = value.call(element, attr(element, name));
             }
@@ -26,19 +23,16 @@ export function attr(element, name, value) {
             }
         });
     }
-
 }
 
 export function hasAttr(element, name) {
-    return toNodes(element).some(element => element.hasAttribute(name));
+    return toNodes(element).some((element) => element.hasAttribute(name));
 }
 
 export function removeAttr(element, name) {
     element = toNodes(element);
-    name.split(' ').forEach(name =>
-        element.forEach(element =>
-            element.hasAttribute(name) && element.removeAttribute(name)
-        )
+    name.split(' ').forEach((name) =>
+        element.forEach((element) => element.hasAttribute(name) && element.removeAttribute(name))
     );
 }
 

package/src/js/util/class.js

@@ -1,5 +1,5 @@
-import {attr} from './attr';
-import {isUndefined, toNodes} from './lang';
+import { attr } from './attr';
+import { isUndefined, toNodes } from './lang';
 
 export function addClass(element, ...args) {
     apply(element, args, 'add');
@@ -10,7 +10,7 @@ export function removeClass(element, ...args) {
 }
 
 export function removeClasses(element, cls) {
-    attr(element, 'class', value => (value || '').replace(new RegExp(`\\b${cls}\\b`, 'g'), ''));
+    attr(element, 'class', (value) => (value || '').replace(new RegExp(`\\b${cls}\\b`, 'g'), ''));
 }
 
 export function replaceClass(element, ...args) {
@@ -20,9 +20,8 @@ export function replaceClass(element, ...args) {
 
 export function hasClass(element, cls) {
     [cls] = getClasses(cls);
-    const nodes = toNodes(element);
-    for (let n = 0; n < nodes.length; n++) {
-        if (cls && nodes[n].classList.contains(cls)) {
+    for (const node of toNodes(element)) {
+        if (cls && node.classList.contains(cls)) {
             return true;
         }
     }
@@ -30,64 +29,27 @@ export function hasClass(element, cls) {
 }
 
 export function toggleClass(element, cls, force) {
+    const classes = getClasses(cls);
 
-    cls = getClasses(cls);
+    if (!isUndefined(force)) {
+        force = !!force;
+    }
 
-    const nodes = toNodes(element);
-    for (let n = 0; n < nodes.length; n++) {
-        const list = nodes[n].classList;
-        for (let i = 0; i < cls.length; i++) {
-            if (isUndefined(force)) {
-                list.toggle(cls[i]);
-            } else if (supports.Force) {
-                list.toggle(cls[i], !!force);
-            } else {
-                list[force ? 'add' : 'remove'](cls[i]);
-            }
+    for (const node of toNodes(element)) {
+        for (const cls of classes) {
+            node.classList.toggle(cls, force);
         }
     }
 }
 
 function apply(element, args, fn) {
-
     args = args.reduce((args, arg) => args.concat(getClasses(arg)), []);
 
-    const nodes = toNodes(element);
-    for (let n = 0; n < nodes.length; n++) {
-        if (supports.Multiple) {
-            nodes[n].classList[fn](...args);
-        } else {
-            args.forEach(cls => nodes[n].classList[fn](cls));
-        }
+    for (const node of toNodes(element)) {
+        node.classList[fn](...args);
     }
 }
 
 function getClasses(str) {
     return String(str).split(/\s|,/).filter(Boolean);
 }
-
-// IE 11
-let supports = {
-
-    get Multiple() {
-        return this.get('Multiple');
-    },
-
-    get Force() {
-        return this.get('Force');
-    },
-
-    get(key) {
-
-        const {classList} = document.createElement('_');
-        classList.add('a', 'b');
-        classList.toggle('c', false);
-        supports = {
-            Multiple: classList.contains('b'),
-            Force: !classList.contains('c')
-        };
-
-        return supports[key];
-    }
-
-};

package/src/js/util/dimensions.js

@@ -1,16 +1,27 @@
-import {css} from './style';
-import {each, isDocument, isElement, isString, isUndefined, isWindow, memoize, toFloat, toNode, toWindow, ucfirst} from './lang';
+import { css } from './style';
+import {
+    each,
+    isDocument,
+    isElement,
+    isString,
+    isUndefined,
+    isWindow,
+    memoize,
+    toFloat,
+    toNode,
+    toWindow,
+    ucfirst,
+} from './lang';
 
 const dirs = {
     width: ['left', 'right'],
-    height: ['top', 'bottom']
+    height: ['top', 'bottom'],
 };
 
 export function dimensions(element) {
-
     const rect = isElement(element)
         ? toNode(element).getBoundingClientRect()
-        : {height: height(element), width: width(element), top: 0, left: 0};
+        : { height: height(element), width: width(element), top: 0, left: 0 };
 
     return {
         height: rect.height,
@@ -18,17 +29,16 @@ export function dimensions(element) {
         top: rect.top,
         left: rect.left,
         bottom: rect.top + rect.height,
-        right: rect.left + rect.width
+        right: rect.left + rect.width,
     };
 }
 
 export function offset(element, coordinates) {
-
     const currentOffset = dimensions(element);
 
     if (element) {
-        const {pageYOffset, pageXOffset} = toWindow(element);
-        const offsetBy = {height: pageYOffset, width: pageXOffset};
+        const { pageYOffset, pageXOffset } = toWindow(element);
+        const offsetBy = { height: pageYOffset, width: pageXOffset };
 
         for (const dir in dirs) {
             for (const i in dirs[dir]) {
@@ -44,23 +54,30 @@ export function offset(element, coordinates) {
     const pos = css(element, 'position');
 
     each(css(element, ['left', 'top']), (value, prop) =>
-        css(element, prop, coordinates[prop]
-            - currentOffset[prop]
-            + toFloat(pos === 'absolute' && value === 'auto'
-                ? position(element)[prop]
-                : value)
+        css(
+            element,
+            prop,
+            coordinates[prop] -
+                currentOffset[prop] +
+                toFloat(pos === 'absolute' && value === 'auto' ? position(element)[prop] : value)
         )
     );
 }
 
 export function position(element) {
+    let { top, left } = offset(element);
 
-    let {top, left} = offset(element);
-
-    const {ownerDocument: {body, documentElement}, offsetParent} = toNode(element);
+    const {
+        ownerDocument: { body, documentElement },
+        offsetParent,
+    } = toNode(element);
     let parent = offsetParent || documentElement;
 
-    while (parent && (parent === body || parent === documentElement) && css(parent, 'position') === 'static') {
+    while (
+        parent &&
+        (parent === body || parent === documentElement) &&
+        css(parent, 'position') === 'static'
+    ) {
         parent = parent.parentNode;
     }
 
@@ -72,7 +89,7 @@ export function position(element) {
 
     return {
         top: top - toFloat(css(element, 'marginTop')),
-        left: left - toFloat(css(element, 'marginLeft'))
+        left: left - toFloat(css(element, 'marginLeft')),
     };
 }
 
@@ -82,7 +99,6 @@ export function offsetPosition(element) {
     element = toNode(element);
 
     do {
-
         offset[0] += element.offsetTop;
         offset[1] += element.offsetLeft;
 
@@ -92,7 +108,6 @@ export function offsetPosition(element) {
             offset[1] += win.pageXOffset;
             return offset;
         }
-
     } while ((element = element.offsetParent));
 
     return offset;
@@ -104,9 +119,7 @@ export const width = dimension('width');
 function dimension(prop) {
     const propName = ucfirst(prop);
     return (element, value) => {
-
         if (isUndefined(value)) {
-
             if (isWindow(element)) {
                 return element[`inner${propName}`];
             }
@@ -122,26 +135,27 @@ function dimension(prop) {
             value = value === 'auto' ? element[`offset${propName}`] : toFloat(value) || 0;
 
             return value - boxModelAdjust(element, prop);
-
         } else {
-
-            return css(element, prop, !value && value !== 0
-                ? ''
-                : +value + boxModelAdjust(element, prop) + 'px'
+            return css(
+                element,
+                prop,
+                !value && value !== 0 ? '' : +value + boxModelAdjust(element, prop) + 'px'
             );
-
         }
-
     };
 }
 
 export function boxModelAdjust(element, prop, sizing = 'border-box') {
     return css(element, 'boxSizing') === sizing
-        ? dirs[prop].map(ucfirst).reduce((value, prop) =>
-            value
-            + toFloat(css(element, `padding${prop}`))
-            + toFloat(css(element, `border${prop}Width`))
-            , 0)
+        ? dirs[prop]
+              .map(ucfirst)
+              .reduce(
+                  (value, prop) =>
+                      value +
+                      toFloat(css(element, `padding${prop}`)) +
+                      toFloat(css(element, `border${prop}Width`)),
+                  0
+              )
         : 0;
 }
 
@@ -157,7 +171,6 @@ export function flipPosition(pos) {
 }
 
 export function toPx(value, property = 'width', element = window, offsetDim = false) {
-
     if (!isString(value)) {
         return toFloat(value);
     }
@@ -169,10 +182,10 @@ export function toPx(value, property = 'width', element = window, offsetDim = fa
                 unit === 'vh'
                     ? height(toWindow(element))
                     : unit === 'vw'
-                        ? width(toWindow(element))
-                        : offsetDim
-                            ? element[`offset${ucfirst(property)}`]
-                            : dimensions(element)[property],
+                    ? width(toWindow(element))
+                    : offsetDim
+                    ? element[`offset${ucfirst(property)}`]
+                    : dimensions(element)[property],
                 value
             );
         }
@@ -182,10 +195,10 @@ export function toPx(value, property = 'width', element = window, offsetDim = fa
 }
 
 const calcRe = /-?\d+(?:\.\d+)?(?:v[wh]|%|px)?/g;
-const parseCalc = memoize(calc => calc.toString().replace(/\s/g, '').match(calcRe) || []);
+const parseCalc = memoize((calc) => calc.toString().replace(/\s/g, '').match(calcRe) || []);
 const unitRe = /(?:v[hw]|%)$/;
-const parseUnit = memoize(str => (str.match(unitRe) || [])[0]);
+const parseUnit = memoize((str) => (str.match(unitRe) || [])[0]);
 
 function percent(base, value) {
-    return base * toFloat(value) / 100;
+    return (base * toFloat(value)) / 100;
 }