240 lines
6.1 KiB
JavaScript
240 lines
6.1 KiB
JavaScript
'use strict';
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
|
|
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
|
|
|
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
|
|
|
var _linkRule = require('./utils/linkRule');
|
|
|
|
var _linkRule2 = _interopRequireDefault(_linkRule);
|
|
|
|
var _RuleList = require('./RuleList');
|
|
|
|
var _RuleList2 = _interopRequireDefault(_RuleList);
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
|
|
|
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
|
|
/* eslint-disable-next-line no-use-before-define */
|
|
var StyleSheet = function () {
|
|
function StyleSheet(styles, options) {
|
|
var _this = this;
|
|
|
|
_classCallCheck(this, StyleSheet);
|
|
|
|
this.update = function (name, data) {
|
|
if (typeof name === 'string') {
|
|
_this.rules.update(name, data);
|
|
} else {
|
|
_this.rules.update(name);
|
|
}
|
|
return _this;
|
|
};
|
|
|
|
this.attached = false;
|
|
this.deployed = false;
|
|
this.linked = false;
|
|
this.classes = {};
|
|
this.options = _extends({}, options, {
|
|
sheet: this,
|
|
parent: this,
|
|
classes: this.classes
|
|
});
|
|
this.renderer = new options.Renderer(this);
|
|
this.rules = new _RuleList2['default'](this.options);
|
|
|
|
for (var _name in styles) {
|
|
this.rules.add(_name, styles[_name]);
|
|
}
|
|
|
|
this.rules.process();
|
|
}
|
|
|
|
/**
|
|
* Attach renderable to the render tree.
|
|
*/
|
|
|
|
|
|
_createClass(StyleSheet, [{
|
|
key: 'attach',
|
|
value: function attach() {
|
|
if (this.attached) return this;
|
|
if (!this.deployed) this.deploy();
|
|
this.renderer.attach();
|
|
if (!this.linked && this.options.link) this.link();
|
|
this.attached = true;
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* Remove renderable from render tree.
|
|
*/
|
|
|
|
}, {
|
|
key: 'detach',
|
|
value: function detach() {
|
|
if (!this.attached) return this;
|
|
this.renderer.detach();
|
|
this.attached = false;
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* Add a rule to the current stylesheet.
|
|
* Will insert a rule also after the stylesheet has been rendered first time.
|
|
*/
|
|
|
|
}, {
|
|
key: 'addRule',
|
|
value: function addRule(name, decl, options) {
|
|
var queue = this.queue;
|
|
|
|
// Plugins can create rules.
|
|
// In order to preserve the right order, we need to queue all `.addRule` calls,
|
|
// which happen after the first `rules.add()` call.
|
|
|
|
if (this.attached && !queue) this.queue = [];
|
|
|
|
var rule = this.rules.add(name, decl, options);
|
|
this.options.jss.plugins.onProcessRule(rule);
|
|
|
|
if (this.attached) {
|
|
if (!this.deployed) return rule;
|
|
// Don't insert rule directly if there is no stringified version yet.
|
|
// It will be inserted all together when .attach is called.
|
|
if (queue) queue.push(rule);else {
|
|
this.insertRule(rule);
|
|
if (this.queue) {
|
|
this.queue.forEach(this.insertRule, this);
|
|
this.queue = undefined;
|
|
}
|
|
}
|
|
return rule;
|
|
}
|
|
|
|
// We can't add rules to a detached style node.
|
|
// We will redeploy the sheet once user will attach it.
|
|
this.deployed = false;
|
|
|
|
return rule;
|
|
}
|
|
|
|
/**
|
|
* Insert rule into the StyleSheet
|
|
*/
|
|
|
|
}, {
|
|
key: 'insertRule',
|
|
value: function insertRule(rule) {
|
|
var renderable = this.renderer.insertRule(rule);
|
|
if (renderable && this.options.link) (0, _linkRule2['default'])(rule, renderable);
|
|
}
|
|
|
|
/**
|
|
* Create and add rules.
|
|
* Will render also after Style Sheet was rendered the first time.
|
|
*/
|
|
|
|
}, {
|
|
key: 'addRules',
|
|
value: function addRules(styles, options) {
|
|
var added = [];
|
|
for (var _name2 in styles) {
|
|
added.push(this.addRule(_name2, styles[_name2], options));
|
|
}
|
|
return added;
|
|
}
|
|
|
|
/**
|
|
* Get a rule by name.
|
|
*/
|
|
|
|
}, {
|
|
key: 'getRule',
|
|
value: function getRule(name) {
|
|
return this.rules.get(name);
|
|
}
|
|
|
|
/**
|
|
* Delete a rule by name.
|
|
* Returns `true`: if rule has been deleted from the DOM.
|
|
*/
|
|
|
|
}, {
|
|
key: 'deleteRule',
|
|
value: function deleteRule(name) {
|
|
var rule = this.rules.get(name);
|
|
|
|
if (!rule) return false;
|
|
|
|
this.rules.remove(rule);
|
|
|
|
if (this.attached && rule.renderable) {
|
|
return this.renderer.deleteRule(rule.renderable);
|
|
}
|
|
|
|
return true;
|
|
}
|
|
|
|
/**
|
|
* Get index of a rule.
|
|
*/
|
|
|
|
}, {
|
|
key: 'indexOf',
|
|
value: function indexOf(rule) {
|
|
return this.rules.indexOf(rule);
|
|
}
|
|
|
|
/**
|
|
* Deploy pure CSS string to a renderable.
|
|
*/
|
|
|
|
}, {
|
|
key: 'deploy',
|
|
value: function deploy() {
|
|
this.renderer.deploy();
|
|
this.deployed = true;
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* Link renderable CSS rules from sheet with their corresponding models.
|
|
*/
|
|
|
|
}, {
|
|
key: 'link',
|
|
value: function link() {
|
|
var cssRules = this.renderer.getRules();
|
|
|
|
// Is undefined when VirtualRenderer is used.
|
|
if (cssRules) this.rules.link(cssRules);
|
|
this.linked = true;
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* Update the function values with a new data.
|
|
*/
|
|
|
|
}, {
|
|
key: 'toString',
|
|
|
|
|
|
/**
|
|
* Convert rules to a CSS string.
|
|
*/
|
|
value: function toString(options) {
|
|
return this.rules.toString(options);
|
|
}
|
|
}]);
|
|
|
|
return StyleSheet;
|
|
}();
|
|
|
|
exports['default'] = StyleSheet; |