vuikit
Version:
A Vuejs component library based on UIkit
1,786 lines (1,702 loc) • 132 kB
JavaScript
/**
* Vuikit 0.7.0
* (c) 2018 Miljan Aleksic
* @license MIT
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.Vuikit = factory());
}(this, (function () { 'use strict';
function toArray (val) {
if (val === null || isUndefined(val)) {
return []
}
return isArray(val) ? val : [val]
}
function toCapital (str) {
return str.charAt(0).toUpperCase() + str.slice(1)
}
function toFloat (value) {
return parseFloat(value) || 0
}
function toInteger (val) {
return parseInt(val, 10)
}
function isArray (val) {
return Array.isArray(val)
}
function isDocument (obj) {
return isObject(obj) && obj.nodeType === 9
}
function isEmpty (val) {
if (isObject(val)) {
return Object.keys(val).length === 0
}
if (isString(val)) {
return val === ''
}
if (isArray(val)) {
return val.length === 0
}
return !val
}
function isFunction (val) {
return toString$1(val) === '[object Function]'
}
function toString$1 (val) {
return Object.prototype.toString.call(val)
}
function isInteger (val) {
return Number.isInteger(val)
}
function isObject (val) {
var type = typeof val;
return val !== null && (type === 'object' || type === 'function')
}
function isString (val) {
return typeof val === 'string'
}
function isUndefined (val) {
return val === undefined
}
function isWindow (obj) {
return isObject(obj) && obj === obj.window
}
function cloneArray (arr) {
return arr.slice(0)
}
function debounce (fn, wait, immediate) {
var timeout;
return function () {
var context = this;
var args = arguments;
var later = function () {
timeout = null;
if (!immediate) { fn.apply(context, args); }
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) {
fn.apply(context, args);
}
}
}
function each (obj, cb) {
for (var key in obj) {
if (cb.call(obj[key], obj[key], key) === false) {
break
}
}
}
var strPrototype = String.prototype;
var endsWithFn = strPrototype.endsWith || function (search) {
return this.substr(-1 * search.length) === search
};
function endsWith (str, search) {
return endsWithFn.call(str, search)
}
function get (obj, path, defVal) {
var result = isObject(obj) && isString(path)
? get$1(obj, path)
: undefined;
return result === undefined
? defVal
: result
}
function get$1 (obj, path) {
return path.split('.').reduce(function (acc, val) { return acc && acc[val]; }, obj)
}
var strPrototype$1 = String.prototype;
var includesFn = function (search) { return ~this.indexOf(search) };
var includesStr = strPrototype$1.includes || includesFn;
var includesArray = Array.prototype.includes || includesFn;
function includes (obj, search) {
return obj && (isString(obj)
? includesStr
: includesArray
).call(obj, search)
}
function merge (host) {
var donors = slice$1(arguments, 1);
donors.forEach(function (donor) {
Object.keys(donor).forEach(function (key) {
host[key] = donor[key];
});
});
return host
}
function slice$1 (arr, i) {
return Array.prototype.slice.call(arr, i)
}
function getRange (start, stop, step) {
if ( step === void 0 ) step = 1;
if (typeof stop === 'undefined') {
stop = start;
start = 0;
}
return Array.from(new Array(Math.floor((stop - start) / step)), function (x, i) { return start + (i * step); })
}
var strPrototype$2 = String.prototype;
var startsWithFn = strPrototype$2.startsWith || function (search) {
return this.lastIndexOf(search, 0) === 0
};
function startsWith (str, search) {
return startsWithFn.call(str, search)
}
var breadcrumb = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('ul',{staticClass:"uk-breadcrumb"},[_vm._t("default")],2)},staticRenderFns: [],
name: 'Breadcrumb',
props: {
location: {
type: String,
default: '/'
}
},
computed: {
items: {
get: function get () {
return this.$slots.default.filter(function (c) { return c.componentOptions && c.componentOptions.tag === 'vk-breadcrumb-item'; }
)
},
cache: false
}
},
beforeMount: function beforeMount () {
this.updateItems();
},
beforeUpdate: function beforeUpdate () {
this.updateItems();
},
methods: {
updateItems: function updateItems () {
var this$1 = this;
this.items.forEach(function (item) {
var props = item.componentOptions.propsData;
props.active = this$1.location === props.path;
});
}
}
}
var breadcrumbItem = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('li',{class:{ 'uk-active': _vm.active }},[(!_vm.disabled && !_vm.active)?_c('a',{on:{"click":function($event){$event.preventDefault();_vm.$parent.$emit('change', _vm.path);}}},[_vm._t("default",[_vm._v(" "+_vm._s(_vm.label)+" ")])],2):_c('span',[_vm._t("default",[_vm._v(" "+_vm._s(_vm.label)+" ")])],2)])},staticRenderFns: [],
name: 'BreadcrumbItem',
props: {
label: String,
path: {
type: String,
required: true
},
active: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
}
}
}
function mergeData(){
var arguments$1 = arguments;
for(var e,a,s={},t=arguments.length;t--;){ for(var r=0,c=Object.keys(arguments[t]);r<c.length;r++){ switch(e=c[r]){case"class":case"style":case"directives":Array.isArray(s[e])||(s[e]=[]), s[e]=s[e].concat(arguments$1[t][e]);break;case"staticClass":if(!arguments$1[t][e]){ break; }void 0===s[e]&&(s[e]=""), s[e]&&(s[e]+=" "), s[e]+=arguments$1[t][e].trim();break;case"on":case"nativeOn":s[e]||(s[e]={});for(var o=0,n=Object.keys(arguments[t][e]);o<n.length;o++){ a=n[o], s[e][a]?s[e][a]=[].concat(s[e][a],arguments$1[t][e][a]):s[e][a]=arguments$1[t][e][a]; }break;case"attrs":case"props":case"domProps":case"scopedSlots":case"staticStyle":case"hook":case"transition":s[e]||(s[e]={}), s[e]=__assign({},arguments$1[t][e],s[e]);break;case"slot":case"key":case"ref":case"tag":case"show":case"keepAlive":default:s[e]||(s[e]=arguments$1[t][e]);} } }return s}var __assign=Object.assign||function(e){
var arguments$1 = arguments;
for(var a,s=1,t=arguments.length;s<t;s++){a=arguments$1[s];for(var r in a){ Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r]); }}return e};
var sizes = ['large', 'small'];
var styles = ['default', 'primary', 'secondary', 'danger', 'text', 'link'];
var button = {
functional: true,
props: {
active: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
type: {
type: String,
default: 'default',
validator: function (style) { return styles.indexOf(style) !== -1; }
},
size: {
type: String,
validator: function (size) { return !size || sizes.indexOf(size) !== -1; }
},
htmlType: {
type: String,
default: 'button'
}
},
render: function render (h, ref) {
var obj;
var data = ref.data;
var props = ref.props;
var children = ref.children;
var disabled = props.disabled;
var type = props.type;
var size = props.size;
var active = props.active;
var htmlType = props.htmlType;
var def = {
attrs: {
type: htmlType,
disabled: disabled
},
class: ['uk-button', ("uk-button-" + type), ( obj = {
'uk-active': active
}, obj[("uk-button-" + size)] = size, obj)]
};
return h('button', mergeData(data, def), [
children
])
}
}
function noop () {}
var warn = noop;
{
var hasConsole = typeof console !== 'undefined';
var classifyRE = /(?:^|[-_])(\w)/g;
var classify = function (str) { return str
.replace(classifyRE, function (c) { return c.toUpperCase(); })
.replace(/[-_]/g, ''); };
warn = function (msg, vm) {
if (hasConsole) {
console.error("[Vuikit warn]: " + msg + (
vm ? generateComponentTrace(vm) : ''
));
}
};
var formatComponentName = function (vm, includeFile) {
if (vm.$root === vm) {
return '<Root>'
}
var name = typeof vm === 'string'
? vm
: typeof vm === 'function' && vm.options
? vm.options.name
: vm._isVue
? vm.$options.name || vm.$options._componentTag
: vm.name;
var file = vm._isVue && vm.$options.__file;
if (!name && file) {
var match = file.match(/([^/\\]+)\.vue$/);
name = match && match[1];
}
return (
(name ? ("<" + (classify(name)) + ">") : "<Anonymous>") +
(file && includeFile !== false ? (" at " + file) : '')
)
};
var repeat = function (str, n) {
var res = '';
while (n) {
if (n % 2 === 1) { res += str; }
if (n > 1) { str += str; }
n >>= 1;
}
return res
};
var generateComponentTrace = function (vm) {
if (vm._isVue && vm.$parent) {
var tree = [];
var currentRecursiveSequence = 0;
while (vm) {
if (tree.length > 0) {
var last = tree[tree.length - 1];
if (last.constructor === vm.constructor) {
currentRecursiveSequence++;
vm = vm.$parent;
continue
} else if (currentRecursiveSequence > 0) {
tree[tree.length - 1] = [last, currentRecursiveSequence];
currentRecursiveSequence = 0;
}
}
tree.push(vm);
vm = vm.$parent;
}
return '\n\nfound in\n\n' + tree
.map(function (vm, i) { return ("" + (i === 0 ? '---> ' : repeat(' ', 5 + i * 2)) + (Array.isArray(vm)
? ((formatComponentName(vm[0])) + "... (" + (vm[1]) + " recursive calls)")
: formatComponentName(vm))); })
.join('\n')
} else {
return ("\n\n(found in " + (formatComponentName(vm)) + ")")
}
};
}
var buttonGroupCheckbox = {
functional: true,
render: function render (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
var listeners = ref.listeners;
var buttons = children.filter(function (n) { return n.tag; });
if (!validate(data, buttons)) {
return
}
var groupValue = toArray(data.model.value);
buttons.forEach(function (btn) {
var index = buttons.indexOf(btn);
var value = btn.data.attrs.value;
var isActive = includes(groupValue, value);
if (isActive) {
btn.data.class.push('uk-active');
}
btn.data.on = {
click: function () {
if (isActive) {
groupValue.splice(index, 1);
} else {
groupValue.splice(index, 0, value);
}
listeners.input(groupValue);
}
};
});
return h('div', {
class: ['uk-button-group']
}, [
children
])
}
}
function validate (data, buttons) {
if (!data.model) {
warn('ButtonGroupCheckbox declaration is missing the v-model directive.');
return false
}
var btnValues = buttons.map(function (btn) { return btn.data.attrs.value; });
if (includes(btnValues, undefined)) {
warn("Some of the ButtonGroupCheckbox buttons declaration is missing the 'value' prop.");
return false
}
return true
}
var buttonGroupRadio = {
functional: true,
render: function render (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
var listeners = ref.listeners;
var buttons = children.filter(function (n) { return n.tag; });
if (!validate$1(data, buttons)) {
return
}
var groupValue = data.model.value;
buttons.forEach(function (btn) {
var value = btn.data.attrs.value;
if (value === groupValue) {
btn.data.class.push('uk-active');
}
btn.data.on = {
click: function () { return listeners.input(value); }
};
});
return h('div', {
class: ['uk-button-group']
}, [
children
])
}
}
function validate$1 (data, buttons) {
if (!data.model) {
warn('ButtonGroupRadio declaration is missing the v-model directive.');
return false
}
var btnValues = buttons.map(function (btn) { return btn.data.attrs.value; });
if (includes(btnValues, undefined)) {
warn("Some of the ButtonGroupRadio buttons declaration is missing the 'value' prop.");
return false
}
return true
}
var padding = ['small', 'large'];
var types = ['primary', 'secondary', 'blank'];
var Header = {
functional: true,
render: function (h, ref) {
var children = ref.children;
return h('div', { class: 'uk-card-header' }, children);
}
};
var Body = {
functional: true,
render: function (h, ref) {
var children = ref.children;
return h('div', { class: 'uk-card-body' }, children);
}
};
var Footer = {
functional: true,
render: function (h, ref) {
var children = ref.children;
return h('div', { class: 'uk-card-footer' }, children);
}
};
var Badge = {
functional: true,
render: function (h, ref) {
var children = ref.children;
return h('div', { class: 'uk-card-badge' }, children);
}
};
var card = {
functional: true,
props: {
type: {
type: String,
validator: function (val) { return !val || includes(types, val); }
},
padding: {
type: String,
validator: function (val) { return !val || includes(padding, val); }
},
hover: {
type: Boolean,
default: false
}
},
render: function render (h, ref) {
var obj;
var props = ref.props;
var children = ref.children;
var data = ref.data;
var slots = ref.slots;
var type = props.type;
var padding = props.padding;
var hover = props.hover;
var _slots = slots();
return h('div', mergeData(data, {
class: ['uk-card', ( obj = {
'uk-card-default': !includes(types, type),
'uk-card-hover': hover
}, obj[("uk-card-" + type)] = type, obj[("uk-card-" + padding)] = padding, obj)]
}), [
_slots.header && h(Header, _slots.header),
_slots.default && h(Body, _slots.default),
_slots.footer && h(Footer, _slots.footer),
_slots.badge && h(Badge, _slots.badge)
])
}
}
var cardTitle = {
functional: true,
render: function render (h, ref) {
var props = ref.props;
var children = ref.children;
var data = ref.data;
return h('h3', mergeData(data, { class: 'uk-card-title' }), children)
}
}
var boundEvents = {};
function on (el, type, listener, namespace) {
type.split(' ')
.forEach(function (type) { return _on(el, type, listener, namespace); });
return function () { return off(el, type, namespace); }
}
function _on (el, type, listener, namespace) {
var events = getEvents(namespace);
events.push({ el: el, type: type, listener: listener });
el.addEventListener(type, listener);
}
function off (el, type, namespace) {
type.split(' ')
.forEach(function (type) { return removeEvent(el, type, namespace); });
}
function one (el, type, listener, condition) {
if ( condition === void 0 ) condition = false;
var off = on(el, type, function (e) {
var result = !condition || condition(e);
if (result) {
off();
listener(e, result);
}
});
return off
}
function offAll (namespace) {
removeAllEvents(namespace);
}
function getEvents (namespace) {
if ( namespace === void 0 ) namespace = 'default';
boundEvents[namespace] = boundEvents[namespace] || [];
return boundEvents[namespace]
}
function findEvent (el, type, namespace) {
if ( namespace === void 0 ) namespace = 'default';
var events = getEvents(namespace);
return events.find(function (bound) {
return bound.el === el && bound.type === type
})
}
function removeEvent (el, type, namespace) {
if ( namespace === void 0 ) namespace = 'default';
var event = findEvent(el, type, namespace);
if (event) {
el.removeEventListener(type, event.listener);
var index = boundEvents[namespace].indexOf(event);
boundEvents[namespace].splice(index, 1);
}
}
function removeAllEvents (namespace) {
if ( namespace === void 0 ) namespace = 'default';
var events = getEvents(namespace);
if (events) {
for (var i = 0; i < events.length; ++i) {
var event = events[i];
event.el.removeEventListener(event.type, event.listener);
}
deleteNamespace(namespace);
}
}
function deleteNamespace (namespace) {
if ( namespace === void 0 ) namespace = 'default';
if (boundEvents[namespace] !== undefined) {
delete boundEvents[namespace];
}
}
function css (el, style, val) {
if (isUndefined(val)) {
return _getStyle(el, style)
} else {
el.style[style] = val;
}
}
function _getStyle (el, style) {
if (!el || !style) {
return
}
return window.getComputedStyle
? window.getComputedStyle(el, null)[style]
: el.currentStyle[style]
}
var dirs = {
width: ['x', 'left', 'right'],
height: ['y', 'top', 'bottom']
};
var height = dimension('height');
var width = dimension('width');
function positionAt (ref) {
var element = ref.element;
var target = ref.target;
var elAttach = ref.elAttach;
var targetAttach = ref.targetAttach;
var elOffset = ref.elOffset;
var targetOffset = ref.targetOffset;
var flip = ref.flip;
var boundary = ref.boundary;
elAttach = getPos(elAttach);
targetAttach = getPos(targetAttach);
var flipped = { element: elAttach, target: targetAttach };
if (!element || !target) {
return flipped
}
var dim = getDimensions(element);
var targetDim = getDimensions(target);
var position = targetDim;
moveTo(position, elAttach, dim, -1);
moveTo(position, targetAttach, targetDim, 1);
elOffset = getOffsets(elOffset, dim.width, dim.height);
targetOffset = getOffsets(targetOffset, targetDim.width, targetDim.height);
elOffset['x'] += targetOffset['x'];
elOffset['y'] += targetOffset['y'];
position.left += elOffset['x'];
position.top += elOffset['y'];
boundary = getDimensions(boundary || getWindow(element));
if (flip) {
each(dirs, function (ref, prop) {
var dir = ref[0];
var align = ref[1];
var alignFlip = ref[2];
if (!(flip === true || includes(flip, dir))) {
return
}
var elemOffset = elAttach[dir] === align
? -dim[prop]
: elAttach[dir] === alignFlip
? dim[prop]
: 0;
var targetOffset = targetAttach[dir] === align
? targetDim[prop]
: targetAttach[dir] === alignFlip
? -targetDim[prop]
: 0;
if (position[align] < boundary[align] || position[align] + dim[prop] > boundary[alignFlip]) {
var centerOffset = dim[prop] / 2;
var centerTargetOffset = targetAttach[dir] === 'center' ? -targetDim[prop] / 2 : 0;
if (elAttach[dir] === 'center') {
apply(centerOffset, centerTargetOffset) || apply(-centerOffset, -centerTargetOffset);
} else {
apply(elemOffset, targetOffset);
}
}
function apply (elemOffset, targetOffset) {
var newVal = position[align] + elemOffset + targetOffset - elOffset[dir] * 2;
if (newVal >= boundary[align] && newVal + dim[prop] <= boundary[alignFlip]) {
position[align] = newVal
;['element', 'target'].forEach(function (el) {
flipped[el][dir] = !elemOffset
? flipped[el][dir]
: flipped[el][dir] === dirs[prop][1]
? dirs[prop][2]
: dirs[prop][1];
});
return true
}
}
});
}
offset(element, position);
return flipped
}
function offset (element, coordinates) {
if (coordinates) {
var currentOffset = offset(element);
var pos = css(element, 'position');['left', 'top'].forEach(function (prop) {
if (prop in coordinates) {
var value = css(element, prop);
element.style[prop] = ((coordinates[prop] - currentOffset[prop]) +
toFloat(pos === 'absolute' && value === 'auto' ? position$1(element)[prop] : value)) + "px";
}
});
return
}
return getDimensions(element)
}
function getDimensions (element) {
var ref = getWindow(element);
var top = ref.pageYOffset;
var left = ref.pageXOffset;
if (isWindow(element)) {
var height = element.innerHeight;
var width = element.innerWidth;
return {
top: top,
left: left,
height: height,
width: width,
bottom: top + height,
right: left + width
}
}
var display = false;
if (!isVisible(element)) {
display = element.style.display;
element.style.display = 'block';
}
var rect = element.getBoundingClientRect();
if (display !== false) {
element.style.display = display;
}
return {
height: rect.height,
width: rect.width,
top: rect.top + top,
left: rect.left + left,
bottom: rect.bottom + top,
right: rect.right + left
}
}
function position$1 (element) {
var parent = offsetParent(element);
var parentOffset = parent === docEl(element) ? {top: 0, left: 0} : offset(parent);
return ['top', 'left'].reduce(function (props, prop) {
var propName = toCapital(prop);
props[prop] -= parentOffset[prop] +
(toFloat(css(element, ("margin" + propName))) || 0) +
(toFloat(css(parent, ("border" + propName + "Width"))) || 0);
return props
}, offset(element))
}
function offsetParent (element) {
var parent = element.offsetParent;
while (parent && css(parent, 'position') === 'static') {
parent = parent.offsetParent;
}
return parent || docEl(element)
}
function dimension (prop) {
var propName = toCapital(prop);
return function (element, value) {
if (isUndefined(value)) {
if (isWindow(element)) {
return element[("inner" + propName)]
}
if (isDocument(element)) {
var doc = element.documentElement;
return Math.max(doc.offsetHeight, doc.scrollHeight)
}
value = css(element, prop);
value = value === 'auto' ? element[("offset" + propName)] : toFloat(value) || 0;
return getContentSize(prop, element, value)
} else {
css(element, prop, !value && value !== 0
? ''
: getContentSize(prop, element, value) + 'px'
);
}
}
}
function getContentSize (prop, element, value) {
return css(element, 'boxSizing') === 'border-box' ? dirs[prop].slice(1).map(toCapital).reduce(function (value, prop) { return value -
toFloat(css(element, ("padding" + prop))) -
toFloat(css(element, ("border" + prop + "Width"))); }
, value) : value
}
function getWindow (element) {
return isWindow(element)
? element
: document$1(element).defaultView
}
function moveTo (position, attach, dim, factor) {
each(dirs, function (ref, prop) {
var dir = ref[0];
var align = ref[1];
var alignFlip = ref[2];
if (attach[dir] === alignFlip) {
position[align] += dim[prop] * factor;
} else if (attach[dir] === 'center') {
position[align] += dim[prop] * factor / 2;
}
});
}
function getPos (pos) {
var x = /left|center|right/;
var y = /top|center|bottom/;
pos = (pos || '').split(' ');
if (pos.length === 1) {
pos = x.test(pos[0])
? pos.concat(['center'])
: y.test(pos[0])
? ['center'].concat(pos)
: ['center', 'center'];
}
return {
x: x.test(pos[0]) ? pos[0] : 'center',
y: y.test(pos[1]) ? pos[1] : 'center'
}
}
function getOffsets (offsets, width, height) {
var ref = (offsets || '').split(' ');
var x = ref[0];
var y = ref[1];
return {
x: x ? toFloat(x) * (endsWith(x, '%') ? width / 100 : 1) : 0,
y: y ? toFloat(y) * (endsWith(y, '%') ? height / 100 : 1) : 0
}
}
function flipPosition (pos) {
switch (pos) {
case 'left':
return 'right'
case 'right':
return 'left'
case 'top':
return 'bottom'
case 'bottom':
return 'top'
default:
return pos
}
}
function getPositionAxis (position) {
var ref = position.split('-');
var dir = ref[0];
return dir === 'top' || dir === 'bottom'
? 'y'
: 'x'
}
function document$1 (element) {
return element.ownerDocument
}
function docEl (element) {
return document$1(element).documentElement
}
function isVisible (element) {
return toArray(element).some(function (element) { return element.offsetHeight; })
}
var supportsMultiple;
var supportsForce;
var supportsClassList;
function hasClass (el, className) {
return el.classList.contains(className)
}
function addClass (el, classes) {
apply(el, classes, 'add');
}
function removeClass (el, classes) {
apply(el, classes, 'remove');
}
function toggleClass (el, classes) {
if (!supportsClassList || !classes) {
return
}
var args = getArgs(classes);
var force = !isString(args[args.length - 1])
? args.pop()
: undefined;
toArray(el).forEach(function (_el) {
var classList = _el.classList;
for (var i = 0; i < args.length; i++) {
if (supportsForce) {
_el.classList.toggle(args[i], force);
} else {
var check = !isUndefined(force)
? force
: !classList.contains(args[i]);
var action = check
? 'add'
: 'remove';
classList[action](args[i]);
}
}
});
}
function apply (element, args, fn) {
args = getArgs(args).filter(function (arg) { return arg; });
supportsClassList && args.length && toArray(element).forEach(function (ref) {
var classList = ref.classList;
supportsMultiple
? classList[fn].apply(classList, args)
: args.forEach(function (cls) { return classList[fn](cls); });
});
}
function getArgs (args) {
return toArray(args).reduce(function (args, arg) {
args.push.apply(args, isString(arg) && includes(arg, ' ') ? arg.trim().split(' ') : [arg]);
return args
}, [])
}
(function () {
var list = document.createElement('_').classList;
if (list) {
list.add('a', 'b');
list.toggle('c', false);
supportsMultiple = list.contains('b');
supportsForce = !list.contains('c');
supportsClassList = true;
}
list = null;
})();
var uid = 'v-position';
var positions$1 = [
'top-left',
'top-center',
'top-right',
'bottom-left',
'bottom-center',
'bottom-right',
'left-top',
'left-center',
'left-bottom',
'right-top',
'right-center',
'right-bottom'
];
var Position = {
inserted: function inserted (el, binding, vnode) {
var ctx = getContext(el, binding, vnode);
if (ctx) {
position(ctx);
}
},
componentUpdated: function componentUpdated (el, binding, vnode) {
var ctx = getContext(el, binding, vnode);
if (ctx) {
position(ctx);
}
},
unbind: function unbind (el, binding, vnode) {
offAll(uid);
}
}
function position (ctx) {
var el = ctx.el;
var props = ctx.props;
var vnode = ctx.vnode;
var target = props.target;
var position = props.position;
var offset$$1 = props.offset;
var boundary = props.boundary;
var flip = props.flip;
var classPrefix = props.classPrefix;
if (!includes(positions$1, position)) {
warn('Invalid v-position position', vnode);
}
var ref = position.split('-');
var dir = ref[0];
var align = ref[1];
var classesRx = new RegExp((classPrefix + "-(top|bottom|left|right)(-[a-z]+)?"));
el.className = el.className.replace(classesRx, '');
css(el, { top: '', left: '' });
var axis = getPositionAxis(position);
var elAttach = axis === 'x'
? ((flipPosition(dir)) + " " + align)
: (align + " " + (flipPosition(dir)));
var targetAttach = axis === 'x'
? (dir + " " + align)
: (align + " " + dir);
var elOffset = axis === 'x'
? ("" + (dir === 'left' ? -1 * offset$$1 : offset$$1))
: (" " + (dir === 'top' ? -1 * offset$$1 : offset$$1));
var ref$1 = positionAt({
flip: flip,
target: target,
boundary: boundary,
elAttach: elAttach,
elOffset: elOffset,
element: el,
targetAttach: targetAttach,
targetOffset: null
}).target;
var x = ref$1.x;
var y = ref$1.y;
dir = axis === 'x' ? x : y;
align = axis === 'x' ? y : x;
setResizeEvent(ctx);
if (classPrefix) {
addClass(el, (classPrefix + "-" + dir + "-" + align));
}
}
function getProps (ctx) {
var vnode = ctx.vnode;
var ref = ctx.binding;
var value = ref.value;
if (isUndefined(value) || !isObject(value)) {
warn('v-position configuration is missing or is not an Object', vnode.context);
return false
}
var target = value.target || null;
var delay = get(value, 'delay', 0);
var flip = get(value, 'flip', true);
var classPrefix = get(value, 'classPrefix', 'v-position');
var boundary = value.boundary || window;
var offset$$1 = toInteger(value.offset) || 0;
var position = value.position || 'top-center';
if (isString(target)) {
target = vnode.context.$refs[target];
}
return { target: target, delay: delay, offset: offset$$1, flip: flip, position: position, boundary: boundary, classPrefix: classPrefix }
}
function setResizeEvent (ctx) {
off(window, 'resize', uid);
on(window, 'resize', debounce(function () {
position(ctx);
}, 50), uid);
}
function getContext (el, binding, vnode) {
var ctx = { el: el, binding: binding, vnode: vnode };
ctx.props = getProps(ctx);
if (!ctx.props) {
binding.def.unbind(el, binding);
return
}
return ctx
}
var isRtl = document.documentElement.getAttribute('dir') === 'rtl';
var positions = [
'top-left',
'top-center',
'top-right',
'top-justify',
'bottom-left',
'bottom-center',
'bottom-right',
'bottom-justify',
'left-top',
'left-center',
'left-bottom',
'right-top',
'right-center',
'right-bottom'
];
var Drop = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{directives:[{name:"position",rawName:"v-position",value:({
flip: _vm.flip,
target: _vm.$target,
position: _vm.$position,
boundary: _vm.$boundary,
classPrefix: 'uk-drop'
}),expression:"{\n flip,\n target: $target,\n position: $position,\n boundary: $boundary,\n classPrefix: 'uk-drop'\n }"}],class:['uk-drop', { 'uk-open': _vm.show }],style:(_vm.$style),on:{"mouseenter":function($event){if($event.target !== $event.currentTarget){ return null; }_vm.triggerShow($event);},"mouseleave":function($event){if($event.target !== $event.currentTarget){ return null; }_vm.hideOnLeave && _vm.triggerHide();}}},[_vm._t("default")],2)},staticRenderFns: [],
name: 'Drop',
directives: {
Position: Position
},
props: {
// a Dom element to attach to
target: {},
// a Dom element as boundary
boundary: {
default: function () { return window; }
},
// a Dom element where to append the drop
placement: {
default: function () { return document.body; }
},
show: {
type: Boolean,
required: true
},
flip: {
type: Boolean,
default: true
},
position: {
type: String,
default: ("bottom-" + (isRtl ? 'right' : 'left')),
validator: function (pos) { return includes(positions, pos); }
},
triggers: {
type: String,
default: 'hover focus'
},
showDelay: {
type: Number,
default: 0
},
hideDelay: {
type: Number,
default: 100
},
// determines if hide should be
// trriggered on drop mouseleave
hideOnLeave: {
type: Boolean,
default: true
},
// determines if hide should be
// trriggered on click outside
hideOnClick: {
type: Boolean,
default: true
}
},
computed: {
$position: function $position () {
return this.position.replace('justify', 'center')
},
$dir: function $dir () {
return this.position.split('-')[0]
},
$align: function $align () {
return this.position.split('-')[1]
},
$style: function $style () {
var style = {};
var isJustified = this.$align === 'justify';
if (!this.target || !isJustified) {
return style
}
var rect = this.target.getBoundingClientRect();
var prop = getPositionAxis(this.position) === 'y'
? 'width'
: 'height';
style[prop] = (rect[prop]) + "px";
return style
},
$target: function $target () {
return isString(this.target)
? get(this.$vnode.context.$refs, this.target)
: this.target
},
$boundary: function $boundary () {
return isString(this.boundary)
? get(this.$vnode.context.$refs, this.boundary)
: this.boundary
},
$placement: function $placement () {
return isString(this.placement)
? get(this.$vnode.context.$refs, this.placement)
: this.placement
}
},
watch: {
triggers: function triggers () {
this.removeTargetEvents(this.target);
this.setTargetEvents(this.target);
},
target: function target (target$1, oldTarget) {
this.removeTargetEvents(oldTarget);
this.setTargetEvents();
},
show: function show (val) {
var this$1 = this;
if (val && this.triggers.match(/click/) && this.hideOnClick) {
// trigger events when clicked outside drop
on(window.document, 'click', function (e) {
var clickInside = this$1.$el.contains(e.target);
if (clickInside) {
return
}
this$1.triggerHide();
}, this._uid);
} else {
off(window.document, 'click', this._uid);
}
}
},
methods: {
removeTargetEvents: function removeTargetEvents (target) {
if (!target) {
return
}
off(target, 'click mouseenter mouseleave focusin focusout', this._uid);
},
setTargetEvents: function setTargetEvents () {
if (!this.$target) {
return
}
if (this.triggers.match(/click/)) {
on(this.$target, 'click', this.toggleShow, this._uid);
}
if (this.triggers.match(/hover/)) {
on(this.$target, 'mouseenter', this.triggerShow, this._uid);
on(this.$target, 'mouseleave', this.triggerHide, this._uid);
}
if (this.triggers.match(/focus/)) {
on(this.$target, 'focusin', this.triggerShow, this._uid);
on(this.$target, 'focusout', this.triggerHide, this._uid);
}
},
triggerShow: function triggerShow () {
var this$1 = this;
clearTimeout(this.hideTimeout);
this.showTimeout = setTimeout(function () {
this$1.$emit('update:show', true);
}, this.showDelay);
},
triggerHide: function triggerHide () {
var this$1 = this;
clearTimeout(this.showTimeout);
this.hideTimeout = setTimeout(function () {
this$1.$emit('update:show', false);
}, this.hideDelay);
},
toggleShow: function toggleShow () {
this.show
? this.triggerHide()
: this.triggerShow();
}
},
mounted: function mounted () {
// placed in root to avoid being styled
// from parent elements rules
if (this.$placement) {
this.$placement.appendChild(this.$el);
}
// set events
this.setTargetEvents();
},
beforeDestroy: function beforeDestroy () {
if (this.$el.parentNode) {
this.$el.parentNode.removeChild(this.$el);
}
}
}
var Dropdown = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{directives:[{name:"position",rawName:"v-position",value:({
flip: _vm.flip,
target: _vm.$target,
position: _vm.$position,
boundary: _vm.$boundary,
classPrefix: 'uk-dropdown',
}),expression:"{\n flip,\n target: $target,\n position: $position,\n boundary: $boundary,\n classPrefix: 'uk-dropdown',\n }"}],class:['uk-dropdown', { 'uk-open': _vm.show }],style:(_vm.$style),on:{"mouseenter":function($event){if($event.target !== $event.currentTarget){ return null; }_vm.triggerShow($event);},"mouseleave":function($event){if($event.target !== $event.currentTarget){ return null; }_vm.hideOnLeave && _vm.triggerHide();}}},[_vm._t("default")],2)},staticRenderFns: [],
name: 'Dropdown',
extends: Drop
}
var dropdownNav = {
functional: true,
props: Dropdown.props,
render: function (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
return h(Dropdown, mergeData(data, { props: props }), [
h('ul', { class: 'uk-nav uk-dropdown-nav' }, children)
]);
}
}
var VkIcon = {
functional: true,
props: {
name: {
type: String,
default: ''
},
viewBox: String,
ratio: [String, Number],
width: [String, Number],
height: [String, Number]
},
render: function (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
return h('span', mergeData(data, { class: ['uk-icon'] }), [
props.name
? h(("icon-" + (props.name)), { props: props })
: children
]);
}
}
var VkIconLink = {
functional: true,
props: mergeData(VkIcon.props, {
reset: {
type: Boolean,
default: false
}
}),
render: function (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
return h('a', mergeData(data, {
class: ['uk-icon', {
'uk-icon-link': props.reset
}]
}), [
props.name
? h(("icon-" + (props.name)), { props: props })
: children
]);
}
}
var iconButton = {
functional: true,
props: VkIcon.props,
render: function (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
return h('a', mergeData(data, { class: 'uk-icon uk-icon-button' }), [
props.name
? h(("icon-" + (props.name)), { props: props })
: children
]);
}
}
var iconnav = {
functional: true,
render: function (h, ref) {
var children = ref.children;
var data = ref.data;
return h('ul', mergeData(data, { class: 'uk-iconnav' }), children);
}
}
var iconnavItem = {
functional: true,
props: {
active: {
type: Boolean,
default: false
},
icon: {
type: String,
required: true
}
},
render: function render (h, ref) {
var props = ref.props;
var data = ref.data;
var active = props.active;
var icon = props.icon;
return h('li', { class: { 'uk-active': active } }, [
h(VkIconLink, mergeData(data, {
props: { name: icon }
}))
])
}
}
var iconnavVertical = {
functional: true,
render: function (h, ref) {
var children = ref.children;
var data = ref.data;
return h('ul', mergeData(data, { class: 'uk-iconnav uk-iconnav-vertical' }), children);
}
}
var obj;
var label = {
functional: true,
props: {
type: {
type: String,
default: '',
validator: function (val) { return !val || includes(['success', 'warning', 'danger'], val); }
}
},
render: function (h, ref) {
var data = ref.data;
var props = ref.props;
var children = ref.children;
return h('span', mergeData(data, {
class: ['uk-label', ( obj = {}, obj[("uk-label-" + (props.type))] = props.type, obj)]
}), children);
}
}
var win = window;
var doc$1 = document.body;
var docEl$1 = document.documentElement;
var Observer = win.MutationObserver || win.WebKitMutationObserver;
var requestAnimationFrame = win.requestAnimationFrame || (function (fn) { return setTimeout(fn, 1000 / 60); });
var transitionend = prefix('transition', 'transition-end');
var animationstart = prefix('animation', 'animation-start');
var animationend = prefix('animation', 'animation-end');
function prefix (name, event) {
var ucase = classify$1(name);
var lowered = classify$1(event).toLowerCase();
var classified = classify$1(event);
var element = doc$1.body || docEl$1;
var names = {};
names[name] = lowered;
names[("Webkit" + ucase)] = ("webkit" + classified);
names[("Moz" + ucase)] = lowered;
names[("o" + ucase)] = ("o" + classified + " o" + lowered);
for (name in names) {
if (element.style[name] !== undefined) {
return names[name]
}
}
}
function classify$1 (str) {
return str.replace(/(?:^|[-_/])(\w)/g, function (_, c) { return c ? c.toUpperCase() : ''; })
}
var doc = document.documentElement;
var active;
var activeModals;
var core = {
props: {
show: {
type: Boolean,
default: false
},
closeOnKey: {
type: [Number, Boolean],
default: 27
},
closeOnBg: {
type: Boolean,
default: true
}
},
methods: {
beforeEnter: function beforeEnter () {
addClass(doc, 'uk-modal-page');
},
enter: function enter (el, done) {
el.offsetWidth;
addClass(el, 'uk-open');
one(el, transitionend, done, function (e) { return e.target === el; });
},
afterEnter: function afterEnter () {
activeModals++;
if (active) {
active.$emit('update:show', false);
}
active = this;
},
beforeLeave: function beforeLeave (el) {
removeClass(el, 'uk-open');
},
leave: function leave (el, done) {
one(el, transitionend, done, function (e) { return e.target === el; });
},
afterLeave: function afterLeave () {
activeModals--;
if (!activeModals) {
removeClass(doc, 'uk-modal-page');
}
if (active === this) {
active = null;
}
}
},
mounted: function mounted () {
var this$1 = this;
this.$root.$el.appendChild(this.$el);
on(window, 'resize', debounce(function () {
if (!this$1.show) {
return
}
this$1.updateOverflowAuto();
}, 30), this._uid);
on(doc, 'keyup', function (e) {
if (this$1.closeOnKey && e.keyCode === this$1.closeOnKey) {
e.preventDefault();
this$1.$emit('update:show', false);
}
}, this._uid);
},
beforeDestroy: function beforeDestroy () {
off(doc, 'key', this._uid);
off(window, 'resize', this._uid);
this.$root.$el.removeChild(this.$el);
this.afterLeave();
}
}
var ModalTransition = {
functional: true,
render: function render (h, ref) {
var modal = ref.parent;
var children = ref.children;
var data = ref.data;
var def = {
props: {
css: false
},
on: {
beforeEnter: modal.beforeEnter,
enter: modal.enter,
afterEnter: modal.afterEnter,
beforeLeave: modal.beforeLeave,
leave: modal.leave,
afterLeave: modal.afterLeave
}
};
return h('transition', mergeData(data, def), children)
}
}
var IconClose = {
functional: true,
render: function (h, ctx) {
var props = ctx.props;
var ratio = props.ratio || 1;
var width = props.width || 14;
var height = props.height || 14;
var viewBox = props.viewBox || '0 0 14 14';
if (ratio !== 1) {
width = width * ratio;
height = height * ratio;
}
return h('svg', {
attrs: {
version: '1.1',
meta: 'icon-close-icon ratio-' + ratio,
width: width,
height: height,
viewBox: viewBox
},
domProps: {
innerHTML: '<path fill="none" stroke="#000" stroke-width="1.1" d="M1 1l12 12M13 1L1 13"/>'
}
})
}
}
var IconCloseLarge = {
functional: true,
render: function (h, ctx) {
var props = ctx.props;
var ratio = props.ratio || 1;
var width = props.width || 20;
var height = props.height || 20;
var viewBox = props.viewBox || '0 0 20 20';
if (ratio !== 1) {
width = width * ratio;
height = height * ratio;
}
return h('svg', {
attrs: {
version: '1.1',
meta: 'icon-close-large ratio-' + ratio,
width: width,
height: height,
viewBox: viewBox
},
domProps: {
innerHTML: '<path fill="none" stroke="#000" stroke-width="1.4" d="M1 1l18 18M19 1L1 19"/>'
}
})
}
}
var ModalBtnClose = {
functional: true,
props: ['type'],
render: function render (h, ref) {
var data = ref.data;
var props = ref.props;
var type = props.type;
var large = type === 'large';
var outside = type === 'outside';
var def = {
class: ['uk-close', 'uk-icon', {
'uk-modal-close-large': large,
'uk-modal-close-outside': outside
}],
attrs: {
type: 'button'
}
};
return h('button', mergeData(data, def), [
large
? h(IconCloseLarge)
: h(IconClose)
])
}
}
var modal = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('modal-transition',{on:{"enter":_vm.updateOverflowAuto}},[(_vm.show)?_c('div',{ref:"modal",class:['uk-modal', { 'uk-modal-container': _vm.container, 'uk-flex uk-flex-top': _vm.center }],style:({
display: _vm.center
? ''
: 'block'
}),on:{"click":function($event){if($event.target !== $event.currentTarget){ return null; }_vm.closeOnBg && _vm.$emit('update:show', false);}}},[_c('div',{ref:"dialog",class:['uk-modal-dialog', _vm.widthClasses, { 'uk-margin-auto-vertical': _vm.center }]},[(_vm.closeBtn)?_c('modal-btn-close',{staticClass:"uk-modal-close-default",attrs:{"type":_vm.closeBtn},on:{"click":function($event){_vm.$emit('update:show', false);}}}):_vm._e(),_vm._v(" "),(_vm.$slots.header)?_c('div',{ref:"header",staticClass:"uk-modal-header"},[_vm._t("header")],2):_vm._e(),_vm._v(" "),_vm._t("dialog"),_vm._v(" "),(_vm.$slots.default)?_c('div',{ref:"body",class:['uk-modal-body', { 'uk-overflow-auto': _vm.overflowAuto }]},[_vm._t("default")],2):_vm._e(),_vm._v(" "),(_vm.$slots.footer)?_c('div',{ref:"footer",staticClass:"uk-modal-footer"},[_vm._t("footer")],2):_vm._e()],2)]):_vm._e()])},staticRenderFns: [],
name: 'Modal',
extends: core,
components: {
ModalBtnClose: ModalBtnClose,
ModalTransition: ModalTransition
},
props: {
// determines if close button should be displayed
closeBtn: {
type: [Boolean, String],
default: false,
validator: function (val) { return !val || includes([true, 'outside'], val); }
},
// determines if the modal should auto
// adjust the height overflow
overflowAuto: {
type: Boolean,
default: false
},
// expands the modal dialog to the default Container width
container: {
type: Boolean,
default: false
},
// vertically centers the modal dialog
center: {
type: Boolean,
default: false
},
// allows setting the dialog with using the uk-width-* classes
width: {
type: String,
default: ''
}
},
computed: {
widthClasses: function widthClasses () {
return this.width
? this.width.split(' ').map(function (width$$1) { return ("uk-width-" + width$$1); })
: ''
}
},
methods: {
updateOverflowAuto: function updateOverflowAuto () {
if (!this.overflowAuto) {
return
}
var modal = this.$el;
var modalBody = this.$refs.body;
var modalDialog = this.$refs.dialog;
css(modalBody, 'maxHeight', '150px');
var maxHeight = Math.max(150, 150 + height(modal) - modalDialog.offsetHeight);
css(modalBody, 'maxHeight', (maxHeight + "px"));
}
}
}
var modalFull = {render: function(){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('modal-transition',[(_vm.show)?_c('div',{staticClass:"uk-modal uk-modal-full",staticStyle:{"display":"block"}},[_c('div',{staticClass:"uk-modal-dialog uk-flex uk-flex-center uk-flex-middle",staticStyle:{"box-sizing":"border-box","min-height":"100vh","height":"100vh"}},[(_vm.closeBtn)?_c('modal-btn-close',{staticClass:"uk-modal-close-full",attrs:{"type":_vm.closeBtn},on:{"click":function($event){_vm.$emit('update:show', false);}}}):_vm._e(),_vm._v(" "),_vm._t("default")],2)]):_vm._e()])},staticRenderFns: [],
name: 'ModalFull',
extends: core,
components: {
ModalBtnClose: ModalBtnClose,
ModalTransition: ModalTransition
},
props: {
// determines if close button should be displayed
closeBtn: {
type: [Boolean, String],
default: true,
validator: function (val) { return !val || includes([true, 'large'], val); }
}
}
}
var nav = {
functional: true,
props: {
center: {
type: Boolean,
default: false
},
primary: {
type: Boolean,
default: false
}
},
render: function render (h, ref) {
var props = ref.props;
var children = ref.children;
var data = ref.data;
var center = props.center;
var primary = props.primary;
return h('ul', mergeData(data, {
class: ['uk-nav', {
'uk-nav-center': center,
'uk-nav-default': !primary,
'uk-nav-primary': primary
}]
}), children)
}
}
var navItem = {
functional: true,
props: {
active: {
type: Boolean,
default: false
},
label: {
type: String,
required: true
},
icon: {
type: String
}
},
render: function render (h, ref) {
var props = ref.props;
var data = ref.data;
var active = props.active;
var label = props.label;
var icon = props.icon;
return h('li', mergeData(data, { class: { 'uk-active': active } }), [
h('a', [
icon && h(VkIcon, {
class: 'uk-margin-small-right',
props: { icon: icon }
}),
label
])
])
}
}
var navItemHeader = {
functional: true,
props: {
label: {
type: String,
required: true
}
},
render: function render (h, ref) {
var props = ref.props;
var children = ref.children;
return h('li', {
class: 'uk-nav-header'
}, [
props.label
])
}
}
var navItemParent = {
functional: true,
label: {
type: String,
required: true
},
render: function render (h, ref) {
var props = ref.props;
var children = ref.chi