jekyll-uikit 0.1.5 → 0.1.7

data/assets/node_modules/uikit/src/js/core/navbar.js

@@ -0,0 +1,205 @@
+import { Class } from '../mixin/index';
+import { $$, addClass, after, append, assign, css, height, includes, isRtl, isVisible, matches, noop, query, toFloat, Transition, within } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('navbar', {
+
+        mixins: [Class],
+
+        props: {
+            dropdown: String,
+            mode: 'list',
+            align: String,
+            offset: Number,
+            boundary: Boolean,
+            boundaryAlign: Boolean,
+            clsDrop: String,
+            delayShow: Number,
+            delayHide: Number,
+            dropbar: Boolean,
+            dropbarMode: String,
+            dropbarAnchor: 'query',
+            duration: Number
+        },
+
+        defaults: {
+            dropdown: '.uk-navbar-nav > li',
+            align: !isRtl ? 'left' : 'right',
+            clsDrop: 'uk-navbar-dropdown',
+            mode: undefined,
+            offset: undefined,
+            delayShow: undefined,
+            delayHide: undefined,
+            boundaryAlign: undefined,
+            flip: 'x',
+            boundary: true,
+            dropbar: false,
+            dropbarMode: 'slide',
+            dropbarAnchor: false,
+            duration: 200,
+        },
+
+        computed: {
+
+            boundary({boundary, boundaryAlign}, $el) {
+                return (boundary === true || boundaryAlign) ? $el : boundary
+            },
+
+            pos({align}) {
+                return `bottom-${align}`;
+            }
+
+        },
+
+        ready() {
+
+            if (this.dropbar) {
+                UIkit.navbarDropbar(
+                    query(this.dropbar, this.$el) || after(this.dropbarAnchor || this.$el, '<div></div>'),
+                    {clsDrop: this.clsDrop, mode: this.dropbarMode, duration: this.duration, navbar: this}
+                );
+            }
+
+        },
+
+        update() {
+
+            UIkit.drop(
+                $$(`${this.dropdown} .${this.clsDrop}`, this.$el).filter(el => !UIkit.getComponent(el, 'dropdown')),
+                assign({}, this.$props, {boundary: this.boundary, pos: this.pos})
+            );
+
+        },
+
+        events: [
+
+            {
+                name: 'mouseover',
+
+                delegate() {
+                    return this.dropdown;
+                },
+
+                handler({current}) {
+                    var active = this.getActive();
+                    if (active && active.toggle && !within(active.toggle.$el, current) && !active.tracker.movesTo(active.$el)) {
+                        active.hide(false);
+                    }
+                }
+
+            }
+
+        ],
+
+        methods: {
+
+            getActive() {
+                var active = UIkit.drop.getActive();
+                return active && includes(active.mode, 'hover') && within(active.toggle.$el, this.$el) && active;
+            }
+
+        }
+
+    });
+
+    UIkit.component('navbar-dropbar', {
+
+        mixins: [Class],
+
+        defaults: {
+            clsDrop: '',
+            mode: 'slide',
+            navbar: null,
+            duration: 200
+        },
+
+        init() {
+
+            if (this.mode === 'slide') {
+                addClass(this.$el, 'uk-navbar-dropbar-slide');
+            }
+
+        },
+
+        events: [
+
+            {
+                name: 'beforeshow',
+
+                el() {
+                    return this.navbar.$el;
+                },
+
+                handler(e, drop) {
+                    var {$el, dir} = drop;
+                    if (dir === 'bottom' && !within($el, this.$el)) {
+                        append(this.$el, $el);
+                        drop.show();
+                        e.preventDefault();
+                    }
+                }
+            },
+
+            {
+                name: 'mouseleave',
+
+                handler() {
+                    var active = this.navbar.getActive();
+
+                    if (active && !matches(this.$el, ':hover')) {
+                        active.hide();
+                    }
+                }
+            },
+
+            {
+                name: 'show',
+
+                handler(_, {$el}) {
+                    this.clsDrop && addClass($el, `${this.clsDrop}-dropbar`);
+                    this.transitionTo($el.offsetHeight + toFloat(css($el, 'margin-top')) + toFloat(css($el, 'margin-bottom')));
+                }
+            },
+
+            {
+                name: 'beforehide',
+
+                handler(e, {$el}) {
+
+                    var active = this.navbar.getActive();
+
+                    if (matches(this.$el, ':hover') && active && active.$el === $el) {
+                        e.preventDefault();
+                    }
+                }
+            },
+
+            {
+                name: 'hide',
+
+                handler(_, {$el}) {
+
+                    var active = this.navbar.getActive();
+
+                    if (!active || active && active.$el === $el) {
+                        this.transitionTo(0);
+                    }
+                }
+            }
+
+        ],
+
+        methods: {
+
+            transitionTo(newHeight) {
+                height(this.$el, isVisible(this.$el) ? height(this.$el) : 0);
+                Transition.cancel(this.$el);
+                return Transition.start(this.$el, {height: newHeight}, this.duration).catch(noop);
+            }
+
+        }
+
+    });
+
+}

data/assets/node_modules/uikit/src/js/core/offcanvas.js

@@ -0,0 +1,224 @@
+import { Modal } from '../mixin/index';
+import { $, addClass, css, doc, docEl, hasClass, height, isTouch, once, removeClass, transitionend, trigger, unwrap, width, win, wrapAll } from '../util/index';
+
+var scroll;
+
+export default function (UIkit) {
+
+    UIkit.component('offcanvas', {
+
+        mixins: [Modal],
+
+        args: 'mode',
+
+        props: {
+            content: String,
+            mode: String,
+            flip: Boolean,
+            overlay: Boolean
+        },
+
+        defaults: {
+            content: '.uk-offcanvas-content',
+            mode: 'slide',
+            flip: false,
+            overlay: false,
+            clsPage: 'uk-offcanvas-page',
+            clsContainer: 'uk-offcanvas-container',
+            clsPanel: 'uk-offcanvas-bar',
+            clsFlip: 'uk-offcanvas-flip',
+            clsContent: 'uk-offcanvas-content',
+            clsContentAnimation: 'uk-offcanvas-content-animation',
+            clsSidebarAnimation: 'uk-offcanvas-bar-animation',
+            clsMode: 'uk-offcanvas',
+            clsOverlay: 'uk-offcanvas-overlay',
+            selClose: '.uk-offcanvas-close'
+        },
+
+        computed: {
+
+            content({content}) {
+                return $(content);
+            },
+
+            clsFlip({flip, clsFlip}) {
+                return flip ? clsFlip : '';
+            },
+
+            clsOverlay({overlay, clsOverlay}) {
+                return overlay ? clsOverlay : '';
+            },
+
+            clsMode({mode, clsMode}) {
+                return `${clsMode}-${mode}`;
+            },
+
+            clsSidebarAnimation({mode, clsSidebarAnimation}) {
+                return mode === 'none' || mode === 'reveal' ? '' : clsSidebarAnimation;
+            },
+
+            clsContentAnimation({mode, clsContentAnimation}) {
+                return mode !== 'push' && mode !== 'reveal' ? '' : clsContentAnimation
+            },
+
+            transitionElement({mode}) {
+                return mode === 'reveal' ? this.panel.parentNode : this.panel;
+            }
+
+        },
+
+        update: {
+
+            write() {
+
+                if (this.getActive() === this) {
+
+                    if (this.overlay || this.clsContentAnimation) {
+                        width(this.content, width(win) - this.scrollbarWidth);
+                    }
+
+                    if (this.overlay) {
+                        height(this.content, height(win));
+                        if (scroll) {
+                            this.content.scrollTop = scroll.y;
+                        }
+                    }
+
+                }
+
+            },
+
+            events: ['resize']
+
+        },
+
+        events: [
+
+            {
+
+                name: 'click',
+
+                delegate() {
+                    return 'a[href^="#"]';
+                },
+
+                handler({current}) {
+                    if (current.hash && $(current.hash, this.content)) {
+                        scroll = null;
+                        this.hide();
+                    }
+                }
+
+            },
+
+            {
+
+                name: 'beforescroll',
+
+                filter() {
+                    return this.overlay;
+                },
+
+                handler(e, scroll, target) {
+                    if (scroll && target && this.isToggled() && $(target, this.content)) {
+                        once(this.$el, 'hidden', () => scroll.scrollTo(target));
+                        e.preventDefault();
+                    }
+                }
+
+            },
+
+            {
+                name: 'show',
+
+                self: true,
+
+                handler() {
+
+                    scroll = scroll || {x: win.pageXOffset, y: win.pageYOffset};
+
+                    if (this.mode === 'reveal' && !hasClass(this.panel, this.clsMode)) {
+                        wrapAll(this.panel, '<div>');
+                        addClass(this.panel.parentNode, this.clsMode);
+                    }
+
+                    css(docEl, 'overflowY', (!this.clsContentAnimation || this.flip) && this.scrollbarWidth && this.overlay ? 'scroll' : '');
+                    addClass(doc.body, `${this.clsContainer} ${this.clsFlip} ${this.clsOverlay}`);
+                    height(doc.body); // force reflow
+                    addClass(this.content, this.clsContentAnimation);
+                    addClass(this.panel, `${this.clsSidebarAnimation} ${this.mode !== 'reveal' ? this.clsMode : ''}`);
+                    addClass(this.$el, this.clsOverlay);
+                    css(this.$el, 'display', 'block');
+                    height(this.$el); // force reflow
+
+                }
+            },
+
+            {
+                name: 'hide',
+
+                self: true,
+
+                handler() {
+                    removeClass(this.content, this.clsContentAnimation);
+
+                    var active = this.getActive();
+                    if (this.mode === 'none' || active && active !== this && active !== this.prev) {
+                        trigger(this.panel, transitionend);
+                    }
+                }
+            },
+
+            {
+                name: 'hidden',
+
+                self: true,
+
+                handler() {
+
+                    if (this.mode === 'reveal') {
+                        unwrap(this.panel);
+                    }
+
+                    if (!this.overlay) {
+                        scroll = {x: win.pageXOffset, y: win.pageYOffset}
+                    } else if (!scroll) {
+                        var {scrollLeft: x, scrollTop: y} = this.content;
+                        scroll = {x, y};
+                    }
+
+                    removeClass(this.panel, `${this.clsSidebarAnimation} ${this.clsMode}`);
+                    removeClass(this.$el, this.clsOverlay);
+                    css(this.$el, 'display', '');
+                    removeClass(doc.body, `${this.clsContainer} ${this.clsFlip} ${this.clsOverlay}`);
+                    doc.body.scrollTop = scroll.y;
+
+                    css(docEl, 'overflow-y', '');
+
+                    width(this.content, '');
+                    height(this.content, '');
+
+                    win.scrollTo(scroll.x, scroll.y);
+
+                    scroll = null;
+
+                }
+            },
+
+            {
+                name: 'swipeLeft swipeRight',
+
+                handler(e) {
+
+                    if (this.isToggled() && isTouch(e) && (e.type === 'swipeLeft' && !this.flip || e.type === 'swipeRight' && this.flip)) {
+                        this.hide();
+                    }
+
+                }
+            }
+
+        ]
+
+    });
+
+}

data/assets/node_modules/uikit/src/js/core/responsive.js

@@ -0,0 +1,37 @@
+import { addClass, Dimensions, height, isVisible, width } from '../util/index';
+
+export default function (UIkit) {
+
+    UIkit.component('responsive', {
+
+        props: ['width', 'height'],
+
+        init() {
+            addClass(this.$el, 'uk-responsive-width');
+        },
+
+        update: {
+
+            read() {
+
+                this.dim = isVisible(this.$el) && this.width && this.height
+                    ? {width: width(this.$el.parentNode), height: this.height}
+                    : false;
+
+            },
+
+            write() {
+
+                if (this.dim) {
+                    height(this.$el, Dimensions.contain({height: this.height, width: this.width}, this.dim).height);
+                }
+
+            },
+
+            events: ['load', 'resize']
+
+        }
+
+    });
+
+}