uikit - npm Package Compare versions

Comparing version 3.0.0-beta.4 to 3.0.0-beta.5

CHANGELOG.md

 # Changelog
 
+## 3.0.0 beta 5 (January 18, 2017)
+
+### Changed
+
+- UIkit observes body tag too now
+- Performance improvements
+
+### Fixed
+
+- Fix regression with initialization (IE + Edge)
+- Fix beta 2 regression for Svg’s (Safari)
+- Fix Sticky width after resize
+- Fix page width on resizing Offcanvas
+- Fix props initialization for data-uk- components
+- Fix sortable children loosing event bindings after sort
+
 ## 3.0.0 beta 4 (January 18, 2017)
@@ -4,0 +20,0 @@

package.json

@@ -5,3 +5,3 @@ {
   "description": "UIkit is a lightweight and modular front-end framework for developing fast and powerful web interfaces.",
-  "version": "3.0.0-beta.4",
+  "version": "3.0.0-beta.5",
   "scripts": {
@@ -12,3 +12,3 @@ "compile-less": "mkdir dist & mkdir dist/css & npm run images && npm run compile-less-core && npm run compile-less-theme && node build/less && node build/css-minify",
     "images": "node build/images",
-    "compile-rtl": "npm run images && node build/rtl-before && npm run compile-less && node build/rtl-after",
+    "compile-rtl": "npm run compile-less && node build/rtl-before && npm run compile-less && node build/rtl-after",
     "compile-js": "node build/build && node build/all",
@@ -15,0 +15,0 @@ "compile": "npm run compile-less && npm run compile-js",

README.md

@@ -52,2 +52,8 @@ [![uikit banner](https://cloud.githubusercontent.com/assets/321047/21769911/474d7d9e-d681-11e6-9fe0-d95f8ccfd3a9.jpg)](http://getuikit.com/)
 
+Compile dist in rtl mode (experimental).
+
+```
+npm run compile-rtl
+```
+
 ## Contributing
@@ -54,0 +60,0 @@

src/js/api/boot.js

@@ -20,3 +20,3 @@ import { Observer, on, ready } from '../util/index';
 
-            })).observe(document.documentElement, {childList: true});
+            })).observe(document.documentElement, {childList: true, subtree: true});
 
@@ -28,3 +28,3 @@ }
         ready(() => {
-            apply(document.body, connect);
+            apply(document.body, UIkit.connect);
             on(document.body, 'DOMNodeInserted', e => apply(e.target, UIkit.connect));
@@ -38,4 +38,2 @@ on(document.body, 'DOMNodeRemoved', e => apply(e.target, UIkit.disconnect));
 
-        var forEach = Array.prototype.forEach;
-
         apply(document.body, UIkit.connect);
@@ -45,12 +43,14 @@
             mutations.forEach(mutation => {
-                forEach.call(mutation.addedNodes, node => {
-                    apply(node, UIkit.connect);
-                    UIkit.update('update', mutation.target, true);
-                });
-                forEach.call(mutation.removedNodes, node => {
-                    apply(node, UIkit.disconnect);
-                    UIkit.update('update', mutation.target, true);
-                });
+
+                for (var i = 0; i < mutation.addedNodes.length; i++) {
+                    apply(mutation.addedNodes[i], UIkit.connect)
+                }
+
+                for (i = 0; i < mutation.removedNodes.length; i++) {
+                    apply(mutation.removedNodes[i], UIkit.disconnect)
+                }
+
+                UIkit.update('update', mutation.target, true);
             })
-        )).observe(document.body, {childList: true, subtree: true});
+        )).observe(document.documentElement, {childList: true, subtree: true});
 
@@ -57,0 +57,0 @@ }

src/js/api/component.js

@@ -17,3 +17,3 @@ import { $, camelize, isPlainObject } from '../util/index';
         } else {
-            options.options.name = name
+            options.options.name = name;
         }
@@ -43,3 +43,3 @@
         if (document.body && !options.options.functional) {
-            UIkit[name](`[uk-${name}],[data-uk-${name}]`)
+            UIkit[name](`[uk-${name}],[data-uk-${name}]`);
         }
@@ -46,0 +46,0 @@

src/js/api/global.js

@@ -47,9 +47,5 @@ import { $, classify, createEvent, isString, mergeOptions } from '../util/index';
 
-            for (var id in UIkit.instances) {
-                if (UIkit.instances[id]._isReady) {
-                    UIkit.instances[id]._callUpdate(e);
-                }
-            }
+            update(UIkit.instances, e);
+            return;
 
-            return;
         }
@@ -59,12 +55,17 @@
 
-        UIkit.elements.forEach(el => {
-            if (el[DATA] && (el === element || $.contains.apply($, parents ? [el, element] : [element, el]))) {
-                for (var name in el[DATA]) {
-                    if (el[DATA][name]._isReady) {
-                        el[DATA][name]._callUpdate(e);
-                    }
-                }
-            }
-        });
+        if (parents) {
 
+            do {
+
+                update(element[DATA], e);
+                element = element.parentNode;
+
+            } while (element)
+
+        } else {
+
+            apply(element, element => update(element[DATA], e));
+
+        }
+
     };
@@ -90,1 +91,29 @@
 }
+
+function apply(node, fn) {
+
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+        return;
+    }
+
+    fn(node);
+    node = node.firstChild;
+    while (node) {
+        apply(node, fn);
+        node = node.nextSibling;
+    }
+}
+
+function update(data, e) {
+
+    if (!data) {
+        return;
+    }
+
+    for (var name in data) {
+        if (data[name]._isReady) {
+            data[name]._callUpdate(e);
+        }
+    }
+
+}

src/js/api/internal.js

@@ -59,3 +59,3 @@ import { bind, camelize, coerce, createEvent, extend, fastdom, hasOwn, hyphenate, isArray, isPlainObject, isString, mergeOptions } from '../util/index';
             props = this.$options.props || {},
-            options = el.getAttribute(this.$name),
+            options = el.getAttribute(this.$name) || el.getAttribute(`data-${this.$name}`),
             key, prop;
@@ -62,0 +62,0 @@

src/js/components/sortable.js

@@ -267,5 +267,5 @@ import { container, mixin, util } from 'uikit';
             if (this.animation) {
-                this.animate(() => element.remove());
+                this.animate(() => element.detach());
             } else {
-                element.remove();
+                element.detach();
             }
@@ -272,0 +272,0 @@

src/js/components/tooltip.js

@@ -68,3 +68,3 @@ import { util, mixin, container } from 'uikit';
             this.toggleElement(this.tooltip, false);
-            this.tooltip.remove();
+            this.tooltip && this.tooltip.remove();
             this.tooltip = false;
@@ -71,0 +71,0 @@ }

src/js/core/accordion.js

@@ -0,3 +1,3 @@
+import { Class, Toggable } from '../mixin/index';
 import { $, getIndex, toJQuery, Transition } from '../util/index';
-import { Class, Toggable } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/core/alert.js

@@ -19,3 +19,4 @@ import { Class, Toggable } from '../mixin/index';
             close: '.uk-alert-close',
-            duration: 150
+            duration: 150,
+            hideProps: {opacity: 0}
         },
@@ -34,3 +35,2 @@
                 this.toggleElement(this.$el).then(() => this.$destroy(true));
-                requestAnimationFrame(() => this.$el.css('opacity', 0));
             }
@@ -37,0 +37,0 @@

src/js/core/drop.js

@@ -0,3 +1,3 @@
+import { Mouse, Position, Toggable } from '../mixin/index';
 import { doc, isWithin, removeClass, getDimensions, query } from '../util/index';
-import { Mouse, Position, Toggable } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/core/modal.js

@@ -0,3 +1,3 @@
+import { Class, Modal } from '../mixin/index';
 import { $, extend, isFunction, isString, query, toJQuery } from '../util/index';
-import { Class, Modal } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/core/navbar.js

@@ -0,3 +1,3 @@
+import { Class } from '../mixin/index';
 import { $, extend, isWithin, query, toJQuery, Transition } from '../util/index';
-import { Class } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/core/offcanvas.js

@@ -0,3 +1,3 @@
+import { Modal } from '../mixin/index';
 import { transitionend } from '../util/index';
-import { Modal } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/core/sticky.js

@@ -114,2 +114,5 @@ import { $, Animation, isNumeric, isString, query, requestAnimationFrame, win } from '../util/index';
 
+                    if (isActive) {
+                        this.update();
+                    }
                 },
@@ -116,0 +119,0 @@

src/js/core/svg.js

@@ -170,7 +170,7 @@ import { $, getStyle, fastdom, isVoidElement, toJQuery } from '../util/index';
 
-            el = el.clone().empty().attr('uk-no-boot', '').appendTo(document.body).show();
+            el = el.clone().empty()
+                .attr({'uk-no-boot': '', style: `${el.attr('style')};display:block !important;`})
+                .appendTo(document.body);
 
-            if (!el.is(':visible')) {
-                image = getBackgroundImage(el);
-            }
+            image = getBackgroundImage(el);
 
@@ -177,0 +177,0 @@ // safari workaround

src/js/core/switcher.js

@@ -0,3 +1,3 @@
+import { Toggable } from '../mixin/index';
 import { $, getIndex, toJQuery } from '../util/index';
-import { Toggable } from '../mixin/index';
 
@@ -4,0 +4,0 @@ export default function (UIkit) {

src/js/mixin/modal.js

@@ -183,3 +183,3 @@ import { $, doc, isWithin, toJQuery, transitionend } from '../util/index';
 
-            var scrollbarWidth = window.innerWidth - this.page.width();
+            var scrollbarWidth = window.innerWidth - this.page.outerWidth(true);
 
@@ -186,0 +186,0 @@ if (width) {

src/js/mixin/toggable.js

 import { $, Animation, extend, isString, Transition } from '../util/index';
 
-var initProps = {
-        overflow: '',
-        height: '',
-        paddingTop: '',
-        paddingBottom: '',
-        marginTop: '',
-        marginBottom: ''
-    },
-    hideProps = {
-        overflow: 'hidden',
-        height: 0,
-        paddingTop: 0,
-        paddingBottom: 0,
-        marginTop: 0,
-        marginBottom: 0
-    };
-
 export default {
@@ -37,3 +20,22 @@
         transition: 'linear',
-        queued: false
+        queued: false,
+
+        initProps: {
+            overflow: '',
+            height: '',
+            paddingTop: '',
+            paddingBottom: '',
+            marginTop: '',
+            marginBottom: ''
+        },
+
+        hideProps: {
+            overflow: 'hidden',
+            height: 0,
+            paddingTop: 0,
+            paddingBottom: 0,
+            marginTop: 0,
+            marginBottom: 0
+        }
+
     },
@@ -133,2 +135,3 @@
         _toggle(el, toggled) {
+
             el = $(el);
@@ -171,6 +174,6 @@
             return show
-                ? Transition.start(el, extend(initProps, {overflow: 'hidden', height: endHeight}), Math.round(this.duration * (1 - height / endHeight)), this.transition)
-                : Transition.start(el, hideProps, Math.round(this.duration * (height / endHeight)), this.transition).then(() => {
+                ? Transition.start(el, extend(this.initProps, {overflow: 'hidden', height: endHeight}), Math.round(this.duration * (1 - height / endHeight)), this.transition)
+                : Transition.start(el, this.hideProps, Math.round(this.duration * (height / endHeight)), this.transition).then(() => {
                         this._toggle(el, false);
-                        el.css(initProps);
+                        el.css(this.initProps);
                     });
@@ -177,0 +180,0 @@

src/js/util/dom.js

@@ -110,3 +110,3 @@ import $ from 'jquery';
         .one(animationend || 'animationend', () => d.resolve().then(reset))
-        .css('animation-duration', duration + 'ms')
+        .css('animation-duration', `${duration}ms`)
         .addClass(animation)
@@ -141,6 +141,4 @@ .addClass(cls);
     cancel(element) {
-        var deferred = $.Deferred();
         $(element).trigger(animationend || 'animationend');
-        requestAnimationFrame(() => deferred.resolve());
-        return deferred.promise();
+        return $.Deferred().resolve();
     }
@@ -147,0 +145,0 @@

src/js/util/options.js

@@ -73,3 +73,3 @@ import { extend, isArray, isFunction, isUndefined, hasOwn } from './index';
         ? parentVal
-            ? extend({}, parentVal, childVal)
+            ? extend(true, {}, parentVal, childVal)
             : childVal
@@ -76,0 +76,0 @@ : parentVal;

tests/js/index.js

@@ -50,10 +50,3 @@ var storage = window.sessionStorage, key = '_uikit_style', keyinverse = '_uikit_inverse', themes = {}, $html = $('html');
     var $label = $('<label></label>').css('margin', '20px').appendTo($container);
-    // var $rtl = $('<input type="checkbox" class="uk-checkbox uk-form-width-small" />');
 
-    // Display toggle only when compiled RTL version exists
-    // $.ajax({url: style.file.replace('.css', '.rtl.css')}).done(() => {
-    //     $rtl.appendTo($label);
-    //     $('<span>RTL</span>').css('margin', '5px').appendTo($label);
-    // });
-
     // Tests
@@ -179,18 +172,19 @@ // ------------------------------
 
-    // // RTL toggle
-    // // ------------------------------
-    //
-    // $rtl.on('change', () => {
-    //     var isRTL = $rtl.is(':checked'),
-    //         from = isRTL ? '.css' : '.rtl.css',
-    //         to = isRTL ? '.rtl.css' : '.css';
-    //
-    //     $html.attr("dir", isRTL ? "rtl" : "ltr");
-    //     $('link[rel=stylesheet]').each((i, el) => $(el).attr('href', $(el).attr('href').replace(from, to)));
-    //
-    // });
+    // RTL
+    // ------------------------------
 
+    var dir = storage._uikit_dir || 'ltr';
 
+    var $rtl = $('<input type="checkbox" class="uk-checkbox uk-form-width-small" />').on('change', () => {
+        storage._uikit_dir = $rtl.prop('checked') ? 'rtl':'ltr';
+        location.reload();
+    }).appendTo($label).after('<span style="margin:5px;">RTL</span>');
+
+    if (dir == 'rtl') {
+        $html.attr('dir', dir);
+        $rtl.prop('checked', true);
+        $('link[rel=stylesheet]').each((i, el) => $(el).attr('href', el.href.replace('.css' , '.rtl.css')));
+    }
+
     $html.css('padding-top', '');
-
 });
@@ -197,0 +191,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4606471

increased by0.01%

Lines of code

4911

increased by0.18%

Number of lines in readme file

77

increased by8.45%

No dependency changes