vue-custom-properties
Version:
Make easier to use CSS custom properties in Vue components
54 lines (50 loc) • 1.34 kB
JavaScript
/*!
* vue-custom-properties v0.1.0
* https://github.com/ktsn/vue-custom-properties
*
* @license
* Copyright (c) 2017 katashin
* Released under the MIT license
* https://github.com/ktsn/vue-custom-properties/blob/master/LICENSE
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global.VueCustomProperties = factory());
}(this, (function () { 'use strict';
var Vue;
function install(Ctor) {
assert(!Vue, 'Already installed');
Vue = Ctor;
Vue.mixin({
mounted: init
});
}
function init() {
var _this = this;
var options = this.$options.customProperties || {};
Object.keys(options).forEach(function (key) {
var observer = options[key];
_this.$watch(observer, function (value) {
var style = _this.$el.style;
if (style) {
style.setProperty(key, value);
}
}, {
immediate: true
});
});
}
function assert(condition, message) {
if (!condition) {
throw new Error('[vue-custom-properties] ' + message);
}
}
if (typeof window !== 'undefined' && window.Vue) {
window.Vue.use(install);
}
var index = {
install: install
};
return index;
})));