Socket
Socket
Sign inDemoInstall

jss

Package Overview
Dependencies
5
Maintainers
1
Versions
186
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 10.7.1 to 10.8.0

src/flow-types/cssom.js
src/flow-types/dom.js
src/flow-types/index.js
src/flow-types/jss.js
src/index.js.flow
src/Jss.js.flow
src/plugins/conditionalRule.js.flow
src/plugins/fontFaceRule.js.flow
src/plugins/index.js.flow
src/plugins/keyframeRule.js.flow
src/plugins/keyframesRule.js.flow
src/plugins/simpleRule.js.flow
src/plugins/styleRule.js.flow
src/plugins/viewportRule.js.flow
src/PluginsRegistry.js.flow
src/RuleList.js.flow
src/SheetsManager.js.flow
src/SheetsRegistry.js.flow
src/StyleSheet.js.flow
src/utils/cloneStyle.js.flow
src/utils/createGenerateId.js.flow
src/utils/createJss.js
src/utils/createJss.js.flow
src/utils/createRule.js.flow
src/utils/escape.js.flow
src/utils/getDynamicStyles.js.flow
src/utils/getWhitespaceSymbols.js
src/utils/hasCSSTOMSupport.js
src/utils/hasCSSTOMSupport.js.flow
src/utils/moduleId.js.flow
src/utils/toCss.js.flow
src/utils/toCssValue.js.flow

301

dist/jss.bundle.js

@@ -118,5 +118,4 @@ function _extends() {

};
/**
* Converts array values to string.
* Converts JSS array value to a CSS string.
*

@@ -128,2 +127,4 @@ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`

*/
var toCssValue = function toCssValue(value, ignoreImportant) {

@@ -153,2 +154,16 @@ if (ignoreImportant === void 0) {

function getWhitespaceSymbols(options) {
if (options && options.format === false) {
return {
linebreak: '',
space: ''
};
}
return {
linebreak: '\n',
space: ' '
};
}
/**

@@ -158,2 +173,3 @@ * Indent a string.

*/
function indentStr(str, indent) {

@@ -184,2 +200,11 @@ var result = '';

var fallbacks = style.fallbacks;
if (options.format === false) {
indent = -Infinity;
}
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak,
space = _getWhitespaceSymbols.space;
if (selector) indent++; // Apply fallbacks first.

@@ -197,4 +222,4 @@

if (value != null) {
if (result) result += '\n';
result += indentStr(prop + ": " + toCssValue(value) + ";", indent);
if (result) result += linebreak;
result += indentStr(prop + ":" + space + toCssValue(value) + ";", indent);
}

@@ -209,4 +234,4 @@ }

if (_value != null) {
if (result) result += '\n';
result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop + ":" + space + toCssValue(_value) + ";", indent);
}

@@ -221,4 +246,4 @@ }

if (_value2 != null && _prop2 !== 'fallbacks') {
if (result) result += '\n';
result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop2 + ":" + space + toCssValue(_value2) + ";", indent);
}

@@ -232,4 +257,4 @@ } // Allow empty style in this case, because properties will be added dynamically.

indent--;
if (result) result = "\n" + result + "\n";
return indentStr(selector + " {" + result, indent) + indentStr('}', indent);
if (result) result = "" + linebreak + result + linebreak;
return indentStr("" + selector + space + "{" + result, indent) + indentStr('}', indent);
}

@@ -248,8 +273,3 @@

this.type = 'style';
this.key = void 0;
this.isProcessed = false;
this.style = void 0;
this.renderer = void 0;
this.renderable = void 0;
this.options = void 0;
var sheet = options.sheet,

@@ -314,5 +334,2 @@ Renderer = options.Renderer;

_this = _BaseStyleRule.call(this, key, style, options) || this;
_this.selectorText = void 0;
_this.id = void 0;
_this.renderable = void 0;
var selector = options.selector,

@@ -414,8 +431,8 @@ scoped = options.scoped,

var pluginStyleRule = {
onCreateRule: function onCreateRule(name, style, options) {
if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') {
onCreateRule: function onCreateRule(key, style, options) {
if (key[0] === '@' || options.parent && options.parent.type === 'keyframes') {
return null;
}
return new StyleRule(name, style, options);
return new StyleRule(key, style, options);
}

@@ -438,9 +455,3 @@ };

this.type = 'conditional';
this.at = void 0;
this.key = void 0;
this.query = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -501,2 +512,5 @@ var atMatch = key.match(atRegExp);

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions.indent;

@@ -510,3 +524,3 @@ if (options.children == null) options.children = defaultToStringOptions.children;

var children = this.rules.toString(options);
return children ? this.query + " {\n" + children + "\n}" : '';
return children ? this.query + " {" + linebreak + children + linebreak + "}" : '';
};

@@ -538,9 +552,3 @@

this.at = '@keyframes';
this.key = void 0;
this.name = void 0;
this.id = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
var nameMatch = key.match(nameRegExp);

@@ -585,2 +593,5 @@

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions$1.indent;

@@ -594,3 +605,3 @@ if (options.children == null) options.children = defaultToStringOptions$1.children;

var children = this.rules.toString(options);
if (children) children = "\n" + children + "\n";
if (children) children = "" + linebreak + children + linebreak;
return this.at + " " + this.id + " {" + children + "}";

@@ -632,3 +643,3 @@ };

var plugin = {
var pluginKeyframesRule = {
onCreateRule: function onCreateRule(key, frames, options) {

@@ -670,11 +681,3 @@ return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null;

function KeyframeRule() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this;
_this.renderable = void 0;
return _this;
return _BaseStyleRule.apply(this, arguments) || this;
}

@@ -714,7 +717,3 @@

this.at = '@font-face';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -732,2 +731,5 @@ this.style = style;

_proto.toString = function toString(options) {
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (Array.isArray(this.style)) {

@@ -738,3 +740,3 @@ var str = '';

str += toCss(this.at, this.style[index]);
if (this.style[index + 1]) str += '\n';
if (this.style[index + 1]) str += linebreak;
}

@@ -763,7 +765,3 @@

this.at = '@viewport';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -797,7 +795,3 @@ this.style = style;

this.type = 'simple';
this.key = void 0;
this.value = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -843,3 +837,3 @@ this.value = value;

var plugins = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];
var plugins = [pluginStyleRule, pluginConditionalRule, pluginKeyframesRule, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];

@@ -871,5 +865,2 @@ var defaultUpdateOptions = {

this.counter = 0;
this.options = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.options = options;

@@ -1013,10 +1004,7 @@ this.classes = options.classes;

if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') {
name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index]
name = arguments.length <= 0 ? undefined : arguments[0];
data = arguments.length <= 1 ? undefined : arguments[1];
options = arguments.length <= 2 ? undefined : arguments[2];
} else {
data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 0 ? undefined : arguments[0];
options = arguments.length <= 1 ? undefined : arguments[1];

@@ -1053,12 +1041,11 @@ name = null;

var styleRule = rule;
var style = styleRule.style;
var style = rule.style;
plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook.
if (options.process && style && style !== styleRule.style) {
if (options.process && style && style !== rule.style) {
// We need to run the plugins in case new `style` relies on syntax plugins.
plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props.
plugins.onProcessStyle(rule.style, rule, sheet); // Update and add props.
for (var prop in styleRule.style) {
var nextValue = styleRule.style[prop];
for (var prop in rule.style) {
var nextValue = rule.style[prop];
var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1068,3 +1055,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (nextValue !== prevValue) {
styleRule.prop(prop, nextValue, forceUpdateOptions);
rule.prop(prop, nextValue, forceUpdateOptions);
}

@@ -1075,3 +1062,3 @@ } // Remove props.

for (var _prop in style) {
var _nextValue = styleRule.style[_prop];
var _nextValue = rule.style[_prop];
var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1081,3 +1068,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (_nextValue == null && _nextValue !== _prevValue) {
styleRule.prop(_prop, null, forceUpdateOptions);
rule.prop(_prop, null, forceUpdateOptions);
}

@@ -1097,2 +1084,5 @@ }

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
for (var index = 0; index < this.index.length; index++) {

@@ -1103,3 +1093,3 @@ var rule = this.index[index];

if (!css && !link) continue;
if (str) str += '\n';
if (str) str += linebreak;
str += css;

@@ -1118,10 +1108,2 @@ }

function StyleSheet(styles, options) {
this.options = void 0;
this.deployed = void 0;
this.attached = void 0;
this.rules = void 0;
this.renderer = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.queue = void 0;
this.attached = false;

@@ -1328,3 +1310,3 @@ this.deployed = false;

};
this.registry = void 0;
this.registry = {};
}

@@ -1368,3 +1350,2 @@

for (var i = 0; i < this.registry.onProcessStyle.length; i++) {
// $FlowFixMe[prop-missing]
rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet);

@@ -1465,4 +1446,5 @@ }

/**
* Sheets registry to access them all at one place.
* Sheets registry to access all instances in one place.
*/
var SheetsRegistry =

@@ -1525,2 +1507,5 @@ /*#__PURE__*/

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
var css = '';

@@ -1535,3 +1520,3 @@

if (css) css += '\n';
if (css) css += linebreak;
css += sheet.toString(options);

@@ -1564,3 +1549,3 @@ }

var registry = new SheetsRegistry();
var sheets = new SheetsRegistry();

@@ -1590,3 +1575,2 @@ /* eslint-disable */

var maxRules = 1e10;
/**

@@ -1597,2 +1581,3 @@ * Returns a function which generates unique class names based on counters.

*/
var createGenerateId = function createGenerateId(options) {

@@ -1639,2 +1624,3 @@ if (options === void 0) {

*/
var memoize = function memoize(fn) {

@@ -1647,6 +1633,7 @@ var value;

};
/**
* Get a style property value.
*/
var getPropertyValue = function getPropertyValue(cssRule, prop) {

@@ -1665,6 +1652,7 @@ try {

};
/**
* Set a style property.
*/
var setProperty = function setProperty(cssRule, prop, value) {

@@ -1696,6 +1684,7 @@ try {

};
/**
* Remove a style property.
*/
var removeProperty = function removeProperty(cssRule, prop) {

@@ -1713,6 +1702,7 @@ try {

};
/**
* Set the selector.
*/
var setSelector = function setSelector(cssRule, selectorText) {

@@ -1782,12 +1772,13 @@ cssRule.selectorText = selectorText; // Return false if setter was not successful.

}
/**
* Find a node before which we can insert the sheet.
*/
function findPrevNode(options) {
var registry$1 = registry.registry;
var registry = sheets.registry;
if (registry$1.length > 0) {
if (registry.length > 0) {
// Try to insert before the next higher sheet.
var sheet = findHigherSheet(registry$1, options);
var sheet = findHigherSheet(registry, options);

@@ -1802,3 +1793,3 @@ if (sheet && sheet.renderer) {

sheet = findHighestSheet(registry$1, options);
sheet = findHighestSheet(registry, options);

@@ -1849,3 +1840,2 @@ if (sheet && sheet.renderer) {

if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
// https://stackoverflow.com/questions/41328728/force-casting-in-flow
var insertionPointElement = insertionPoint;

@@ -1872,9 +1862,6 @@ var parentNode = insertionPointElement.parentNode;

if ('insertRule' in container) {
var c = container;
c.insertRule(rule, index);
container.insertRule(rule, index);
} // Keyframes rule.
else if ('appendRule' in container) {
var _c = container;
_c.appendRule(rule);
container.appendRule(rule);
}

@@ -1912,3 +1899,2 @@ } catch (err) {

function () {
// HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696
// Will be empty if link: true option is not set, because

@@ -1921,8 +1907,6 @@ // it is only for use together with insertRule API.

this.setSelector = setSelector;
this.element = void 0;
this.sheet = void 0;
this.hasInsertedRules = false;
this.cssRules = [];
// There is no sheet when the renderer is used from a standalone StyleRule.
if (sheet) registry.add(sheet);
if (sheet) sheets.add(sheet);
this.sheet = sheet;

@@ -2114,3 +2098,3 @@

this.id = instanceCounter++;
this.version = "10.7.1";
this.version = "10.8.0";
this.plugins = new PluginsRegistry();

@@ -2187,3 +2171,3 @@ this.options = {

if (typeof index !== 'number') {
index = registry.index === 0 ? 0 : registry.index + 1;
index = sheets.index === 0 ? 0 : sheets.index + 1;
}

@@ -2208,3 +2192,3 @@

sheet.detach();
registry.remove(sheet);
sheets.remove(sheet);
return this;

@@ -2229,7 +2213,5 @@ }

if (typeof name === 'object') {
// $FlowFixMe[incompatible-call]
return this.createRule(undefined, name, style);
} // $FlowFixMe[incompatible-type]
}
var ruleOptions = _extends({}, options, {

@@ -2271,32 +2253,12 @@ name: name,

/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
var createJss = function createJss(options) {
return new Jss(options);
};
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* SheetsManager is like a WeakMap which is designed to count StyleSheet
* instances and attach/detach automatically.
* Used in react-jss.
*/
var SheetsManager =

@@ -2366,2 +2328,34 @@ /*#__PURE__*/

/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* A better abstraction over CSS.

@@ -2373,22 +2367,5 @@ *

*/
var index = createJss();
/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Creates a new instance of Jss.
*/
var create = function create(options) {
return new Jss(options);
};
/**
* A global Jss instance.
*/
var jss = create();
export default jss;
export { RuleList, SheetsManager, SheetsRegistry, create, createGenerateId, createRule, getDynamicStyles, hasCSSTOMSupport, registry as sheets, toCssValue };
export default index;
export { RuleList, SheetsManager, SheetsRegistry, createJss as create, createGenerateId, createRule, getDynamicStyles, hasCSSTOMSupport, sheets, toCssValue };

303

dist/jss.cjs.js

@@ -70,5 +70,4 @@ 'use strict';

};
/**
* Converts array values to string.
* Converts JSS array value to a CSS string.
*

@@ -80,2 +79,4 @@ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`

*/
var toCssValue = function toCssValue(value, ignoreImportant) {

@@ -105,2 +106,16 @@ if (ignoreImportant === void 0) {

function getWhitespaceSymbols(options) {
if (options && options.format === false) {
return {
linebreak: '',
space: ''
};
}
return {
linebreak: '\n',
space: ' '
};
}
/**

@@ -110,2 +125,3 @@ * Indent a string.

*/
function indentStr(str, indent) {

@@ -136,2 +152,11 @@ var result = '';

var fallbacks = style.fallbacks;
if (options.format === false) {
indent = -Infinity;
}
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak,
space = _getWhitespaceSymbols.space;
if (selector) indent++; // Apply fallbacks first.

@@ -149,4 +174,4 @@

if (value != null) {
if (result) result += '\n';
result += indentStr(prop + ": " + toCssValue(value) + ";", indent);
if (result) result += linebreak;
result += indentStr(prop + ":" + space + toCssValue(value) + ";", indent);
}

@@ -161,4 +186,4 @@ }

if (_value != null) {
if (result) result += '\n';
result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop + ":" + space + toCssValue(_value) + ";", indent);
}

@@ -173,4 +198,4 @@ }

if (_value2 != null && _prop2 !== 'fallbacks') {
if (result) result += '\n';
result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop2 + ":" + space + toCssValue(_value2) + ";", indent);
}

@@ -184,4 +209,4 @@ } // Allow empty style in this case, because properties will be added dynamically.

indent--;
if (result) result = "\n" + result + "\n";
return indentStr(selector + " {" + result, indent) + indentStr('}', indent);
if (result) result = "" + linebreak + result + linebreak;
return indentStr("" + selector + space + "{" + result, indent) + indentStr('}', indent);
}

@@ -200,8 +225,3 @@

this.type = 'style';
this.key = void 0;
this.isProcessed = false;
this.style = void 0;
this.renderer = void 0;
this.renderable = void 0;
this.options = void 0;
var sheet = options.sheet,

@@ -266,5 +286,2 @@ Renderer = options.Renderer;

_this = _BaseStyleRule.call(this, key, style, options) || this;
_this.selectorText = void 0;
_this.id = void 0;
_this.renderable = void 0;
var selector = options.selector,

@@ -366,8 +383,8 @@ scoped = options.scoped,

var pluginStyleRule = {
onCreateRule: function onCreateRule(name, style, options) {
if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') {
onCreateRule: function onCreateRule(key, style, options) {
if (key[0] === '@' || options.parent && options.parent.type === 'keyframes') {
return null;
}
return new StyleRule(name, style, options);
return new StyleRule(key, style, options);
}

@@ -390,9 +407,3 @@ };

this.type = 'conditional';
this.at = void 0;
this.key = void 0;
this.query = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -453,2 +464,5 @@ var atMatch = key.match(atRegExp);

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions.indent;

@@ -462,3 +476,3 @@ if (options.children == null) options.children = defaultToStringOptions.children;

var children = this.rules.toString(options);
return children ? this.query + " {\n" + children + "\n}" : '';
return children ? this.query + " {" + linebreak + children + linebreak + "}" : '';
};

@@ -490,9 +504,3 @@

this.at = '@keyframes';
this.key = void 0;
this.name = void 0;
this.id = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
var nameMatch = key.match(nameRegExp);

@@ -537,2 +545,5 @@

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions$1.indent;

@@ -546,3 +557,3 @@ if (options.children == null) options.children = defaultToStringOptions$1.children;

var children = this.rules.toString(options);
if (children) children = "\n" + children + "\n";
if (children) children = "" + linebreak + children + linebreak;
return this.at + " " + this.id + " {" + children + "}";

@@ -584,3 +595,3 @@ };

var plugin = {
var pluginKeyframesRule = {
onCreateRule: function onCreateRule(key, frames, options) {

@@ -622,11 +633,3 @@ return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null;

function KeyframeRule() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this;
_this.renderable = void 0;
return _this;
return _BaseStyleRule.apply(this, arguments) || this;
}

@@ -666,7 +669,3 @@

this.at = '@font-face';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -684,2 +683,5 @@ this.style = style;

_proto.toString = function toString(options) {
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (Array.isArray(this.style)) {

@@ -690,3 +692,3 @@ var str = '';

str += toCss(this.at, this.style[index]);
if (this.style[index + 1]) str += '\n';
if (this.style[index + 1]) str += linebreak;
}

@@ -715,7 +717,3 @@

this.at = '@viewport';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -749,7 +747,3 @@ this.style = style;

this.type = 'simple';
this.key = void 0;
this.value = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -795,3 +789,3 @@ this.value = value;

var plugins = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];
var plugins = [pluginStyleRule, pluginConditionalRule, pluginKeyframesRule, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];

@@ -823,5 +817,2 @@ var defaultUpdateOptions = {

this.counter = 0;
this.options = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.options = options;

@@ -965,10 +956,7 @@ this.classes = options.classes;

if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') {
name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index]
name = arguments.length <= 0 ? undefined : arguments[0];
data = arguments.length <= 1 ? undefined : arguments[1];
options = arguments.length <= 2 ? undefined : arguments[2];
} else {
data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 0 ? undefined : arguments[0];
options = arguments.length <= 1 ? undefined : arguments[1];

@@ -1005,12 +993,11 @@ name = null;

var styleRule = rule;
var style = styleRule.style;
var style = rule.style;
plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook.
if (options.process && style && style !== styleRule.style) {
if (options.process && style && style !== rule.style) {
// We need to run the plugins in case new `style` relies on syntax plugins.
plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props.
plugins.onProcessStyle(rule.style, rule, sheet); // Update and add props.
for (var prop in styleRule.style) {
var nextValue = styleRule.style[prop];
for (var prop in rule.style) {
var nextValue = rule.style[prop];
var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1020,3 +1007,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (nextValue !== prevValue) {
styleRule.prop(prop, nextValue, forceUpdateOptions);
rule.prop(prop, nextValue, forceUpdateOptions);
}

@@ -1027,3 +1014,3 @@ } // Remove props.

for (var _prop in style) {
var _nextValue = styleRule.style[_prop];
var _nextValue = rule.style[_prop];
var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1033,3 +1020,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (_nextValue == null && _nextValue !== _prevValue) {
styleRule.prop(_prop, null, forceUpdateOptions);
rule.prop(_prop, null, forceUpdateOptions);
}

@@ -1049,2 +1036,5 @@ }

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
for (var index = 0; index < this.index.length; index++) {

@@ -1055,3 +1045,3 @@ var rule = this.index[index];

if (!css && !link) continue;
if (str) str += '\n';
if (str) str += linebreak;
str += css;

@@ -1070,10 +1060,2 @@ }

function StyleSheet(styles, options) {
this.options = void 0;
this.deployed = void 0;
this.attached = void 0;
this.rules = void 0;
this.renderer = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.queue = void 0;
this.attached = false;

@@ -1280,3 +1262,3 @@ this.deployed = false;

};
this.registry = void 0;
this.registry = {};
}

@@ -1320,3 +1302,2 @@

for (var i = 0; i < this.registry.onProcessStyle.length; i++) {
// $FlowFixMe[prop-missing]
rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet);

@@ -1402,4 +1383,5 @@ }

/**
* Sheets registry to access them all at one place.
* Sheets registry to access all instances in one place.
*/
var SheetsRegistry =

@@ -1462,2 +1444,5 @@ /*#__PURE__*/

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
var css = '';

@@ -1472,3 +1457,3 @@

if (css) css += '\n';
if (css) css += linebreak;
css += sheet.toString(options);

@@ -1501,3 +1486,3 @@ }

var registry = new SheetsRegistry();
var sheets = new SheetsRegistry();

@@ -1527,3 +1512,2 @@ /* eslint-disable */

var maxRules = 1e10;
/**

@@ -1534,2 +1518,3 @@ * Returns a function which generates unique class names based on counters.

*/
var createGenerateId = function createGenerateId(options) {

@@ -1576,2 +1561,3 @@ if (options === void 0) {

*/
var memoize = function memoize(fn) {

@@ -1584,6 +1570,7 @@ var value;

};
/**
* Get a style property value.
*/
var getPropertyValue = function getPropertyValue(cssRule, prop) {

@@ -1602,6 +1589,7 @@ try {

};
/**
* Set a style property.
*/
var setProperty = function setProperty(cssRule, prop, value) {

@@ -1633,6 +1621,7 @@ try {

};
/**
* Remove a style property.
*/
var removeProperty = function removeProperty(cssRule, prop) {

@@ -1650,6 +1639,7 @@ try {

};
/**
* Set the selector.
*/
var setSelector = function setSelector(cssRule, selectorText) {

@@ -1719,12 +1709,13 @@ cssRule.selectorText = selectorText; // Return false if setter was not successful.

}
/**
* Find a node before which we can insert the sheet.
*/
function findPrevNode(options) {
var registry$1 = registry.registry;
var registry = sheets.registry;
if (registry$1.length > 0) {
if (registry.length > 0) {
// Try to insert before the next higher sheet.
var sheet = findHigherSheet(registry$1, options);
var sheet = findHigherSheet(registry, options);

@@ -1739,3 +1730,3 @@ if (sheet && sheet.renderer) {

sheet = findHighestSheet(registry$1, options);
sheet = findHighestSheet(registry, options);

@@ -1786,3 +1777,2 @@ if (sheet && sheet.renderer) {

if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
// https://stackoverflow.com/questions/41328728/force-casting-in-flow
var insertionPointElement = insertionPoint;

@@ -1809,9 +1799,6 @@ var parentNode = insertionPointElement.parentNode;

if ('insertRule' in container) {
var c = container;
c.insertRule(rule, index);
container.insertRule(rule, index);
} // Keyframes rule.
else if ('appendRule' in container) {
var _c = container;
_c.appendRule(rule);
container.appendRule(rule);
}

@@ -1849,3 +1836,2 @@ } catch (err) {

function () {
// HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696
// Will be empty if link: true option is not set, because

@@ -1858,8 +1844,6 @@ // it is only for use together with insertRule API.

this.setSelector = setSelector;
this.element = void 0;
this.sheet = void 0;
this.hasInsertedRules = false;
this.cssRules = [];
// There is no sheet when the renderer is used from a standalone StyleRule.
if (sheet) registry.add(sheet);
if (sheet) sheets.add(sheet);
this.sheet = sheet;

@@ -2051,3 +2035,3 @@

this.id = instanceCounter++;
this.version = "10.7.1";
this.version = "10.8.0";
this.plugins = new PluginsRegistry();

@@ -2124,3 +2108,3 @@ this.options = {

if (typeof index !== 'number') {
index = registry.index === 0 ? 0 : registry.index + 1;
index = sheets.index === 0 ? 0 : sheets.index + 1;
}

@@ -2145,3 +2129,3 @@

sheet.detach();
registry.remove(sheet);
sheets.remove(sheet);
return this;

@@ -2166,7 +2150,5 @@ }

if (typeof name === 'object') {
// $FlowFixMe[incompatible-call]
return this.createRule(undefined, name, style);
} // $FlowFixMe[incompatible-type]
}
var ruleOptions = _extends__default['default']({}, options, {

@@ -2208,32 +2190,12 @@ name: name,

/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
var createJss = function createJss(options) {
return new Jss(options);
};
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* SheetsManager is like a WeakMap which is designed to count StyleSheet
* instances and attach/detach automatically.
* Used in react-jss.
*/
var SheetsManager =

@@ -2303,2 +2265,34 @@ /*#__PURE__*/

/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* A better abstraction over CSS.

@@ -2310,31 +2304,14 @@ *

*/
var index = createJss();
/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Creates a new instance of Jss.
*/
var create = function create(options) {
return new Jss(options);
};
/**
* A global Jss instance.
*/
var jss = create();
exports.RuleList = RuleList;
exports.SheetsManager = SheetsManager;
exports.SheetsRegistry = SheetsRegistry;
exports.create = create;
exports.create = createJss;
exports.createGenerateId = createGenerateId;
exports.createRule = createRule;
exports.default = jss;
exports.default = index;
exports.getDynamicStyles = getDynamicStyles;
exports.hasCSSTOMSupport = hasCSSTOMSupport;
exports.sheets = registry;
exports.sheets = sheets;
exports.toCssValue = toCssValue;

301

dist/jss.esm.js

@@ -56,5 +56,4 @@ import _extends from '@babel/runtime/helpers/esm/extends';

};
/**
* Converts array values to string.
* Converts JSS array value to a CSS string.
*

@@ -66,2 +65,4 @@ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`

*/
var toCssValue = function toCssValue(value, ignoreImportant) {

@@ -91,2 +92,16 @@ if (ignoreImportant === void 0) {

function getWhitespaceSymbols(options) {
if (options && options.format === false) {
return {
linebreak: '',
space: ''
};
}
return {
linebreak: '\n',
space: ' '
};
}
/**

@@ -96,2 +111,3 @@ * Indent a string.

*/
function indentStr(str, indent) {

@@ -122,2 +138,11 @@ var result = '';

var fallbacks = style.fallbacks;
if (options.format === false) {
indent = -Infinity;
}
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak,
space = _getWhitespaceSymbols.space;
if (selector) indent++; // Apply fallbacks first.

@@ -135,4 +160,4 @@

if (value != null) {
if (result) result += '\n';
result += indentStr(prop + ": " + toCssValue(value) + ";", indent);
if (result) result += linebreak;
result += indentStr(prop + ":" + space + toCssValue(value) + ";", indent);
}

@@ -147,4 +172,4 @@ }

if (_value != null) {
if (result) result += '\n';
result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop + ":" + space + toCssValue(_value) + ";", indent);
}

@@ -159,4 +184,4 @@ }

if (_value2 != null && _prop2 !== 'fallbacks') {
if (result) result += '\n';
result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop2 + ":" + space + toCssValue(_value2) + ";", indent);
}

@@ -170,4 +195,4 @@ } // Allow empty style in this case, because properties will be added dynamically.

indent--;
if (result) result = "\n" + result + "\n";
return indentStr(selector + " {" + result, indent) + indentStr('}', indent);
if (result) result = "" + linebreak + result + linebreak;
return indentStr("" + selector + space + "{" + result, indent) + indentStr('}', indent);
}

@@ -186,8 +211,3 @@

this.type = 'style';
this.key = void 0;
this.isProcessed = false;
this.style = void 0;
this.renderer = void 0;
this.renderable = void 0;
this.options = void 0;
var sheet = options.sheet,

@@ -252,5 +272,2 @@ Renderer = options.Renderer;

_this = _BaseStyleRule.call(this, key, style, options) || this;
_this.selectorText = void 0;
_this.id = void 0;
_this.renderable = void 0;
var selector = options.selector,

@@ -352,8 +369,8 @@ scoped = options.scoped,

var pluginStyleRule = {
onCreateRule: function onCreateRule(name, style, options) {
if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') {
onCreateRule: function onCreateRule(key, style, options) {
if (key[0] === '@' || options.parent && options.parent.type === 'keyframes') {
return null;
}
return new StyleRule(name, style, options);
return new StyleRule(key, style, options);
}

@@ -376,9 +393,3 @@ };

this.type = 'conditional';
this.at = void 0;
this.key = void 0;
this.query = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -439,2 +450,5 @@ var atMatch = key.match(atRegExp);

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions.indent;

@@ -448,3 +462,3 @@ if (options.children == null) options.children = defaultToStringOptions.children;

var children = this.rules.toString(options);
return children ? this.query + " {\n" + children + "\n}" : '';
return children ? this.query + " {" + linebreak + children + linebreak + "}" : '';
};

@@ -476,9 +490,3 @@

this.at = '@keyframes';
this.key = void 0;
this.name = void 0;
this.id = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
var nameMatch = key.match(nameRegExp);

@@ -523,2 +531,5 @@

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions$1.indent;

@@ -532,3 +543,3 @@ if (options.children == null) options.children = defaultToStringOptions$1.children;

var children = this.rules.toString(options);
if (children) children = "\n" + children + "\n";
if (children) children = "" + linebreak + children + linebreak;
return this.at + " " + this.id + " {" + children + "}";

@@ -570,3 +581,3 @@ };

var plugin = {
var pluginKeyframesRule = {
onCreateRule: function onCreateRule(key, frames, options) {

@@ -608,11 +619,3 @@ return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null;

function KeyframeRule() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this;
_this.renderable = void 0;
return _this;
return _BaseStyleRule.apply(this, arguments) || this;
}

@@ -652,7 +655,3 @@

this.at = '@font-face';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -670,2 +669,5 @@ this.style = style;

_proto.toString = function toString(options) {
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (Array.isArray(this.style)) {

@@ -676,3 +678,3 @@ var str = '';

str += toCss(this.at, this.style[index]);
if (this.style[index + 1]) str += '\n';
if (this.style[index + 1]) str += linebreak;
}

@@ -701,7 +703,3 @@

this.at = '@viewport';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -735,7 +733,3 @@ this.style = style;

this.type = 'simple';
this.key = void 0;
this.value = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -781,3 +775,3 @@ this.value = value;

var plugins = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];
var plugins = [pluginStyleRule, pluginConditionalRule, pluginKeyframesRule, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];

@@ -809,5 +803,2 @@ var defaultUpdateOptions = {

this.counter = 0;
this.options = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.options = options;

@@ -951,10 +942,7 @@ this.classes = options.classes;

if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') {
name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index]
name = arguments.length <= 0 ? undefined : arguments[0];
data = arguments.length <= 1 ? undefined : arguments[1];
options = arguments.length <= 2 ? undefined : arguments[2];
} else {
data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 0 ? undefined : arguments[0];
options = arguments.length <= 1 ? undefined : arguments[1];

@@ -991,12 +979,11 @@ name = null;

var styleRule = rule;
var style = styleRule.style;
var style = rule.style;
plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook.
if (options.process && style && style !== styleRule.style) {
if (options.process && style && style !== rule.style) {
// We need to run the plugins in case new `style` relies on syntax plugins.
plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props.
plugins.onProcessStyle(rule.style, rule, sheet); // Update and add props.
for (var prop in styleRule.style) {
var nextValue = styleRule.style[prop];
for (var prop in rule.style) {
var nextValue = rule.style[prop];
var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1006,3 +993,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (nextValue !== prevValue) {
styleRule.prop(prop, nextValue, forceUpdateOptions);
rule.prop(prop, nextValue, forceUpdateOptions);
}

@@ -1013,3 +1000,3 @@ } // Remove props.

for (var _prop in style) {
var _nextValue = styleRule.style[_prop];
var _nextValue = rule.style[_prop];
var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1019,3 +1006,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (_nextValue == null && _nextValue !== _prevValue) {
styleRule.prop(_prop, null, forceUpdateOptions);
rule.prop(_prop, null, forceUpdateOptions);
}

@@ -1035,2 +1022,5 @@ }

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
for (var index = 0; index < this.index.length; index++) {

@@ -1041,3 +1031,3 @@ var rule = this.index[index];

if (!css && !link) continue;
if (str) str += '\n';
if (str) str += linebreak;
str += css;

@@ -1056,10 +1046,2 @@ }

function StyleSheet(styles, options) {
this.options = void 0;
this.deployed = void 0;
this.attached = void 0;
this.rules = void 0;
this.renderer = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.queue = void 0;
this.attached = false;

@@ -1266,3 +1248,3 @@ this.deployed = false;

};
this.registry = void 0;
this.registry = {};
}

@@ -1306,3 +1288,2 @@

for (var i = 0; i < this.registry.onProcessStyle.length; i++) {
// $FlowFixMe[prop-missing]
rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet);

@@ -1388,4 +1369,5 @@ }

/**
* Sheets registry to access them all at one place.
* Sheets registry to access all instances in one place.
*/
var SheetsRegistry =

@@ -1448,2 +1430,5 @@ /*#__PURE__*/

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
var css = '';

@@ -1458,3 +1443,3 @@

if (css) css += '\n';
if (css) css += linebreak;
css += sheet.toString(options);

@@ -1487,3 +1472,3 @@ }

var registry = new SheetsRegistry();
var sheets = new SheetsRegistry();

@@ -1513,3 +1498,2 @@ /* eslint-disable */

var maxRules = 1e10;
/**

@@ -1520,2 +1504,3 @@ * Returns a function which generates unique class names based on counters.

*/
var createGenerateId = function createGenerateId(options) {

@@ -1562,2 +1547,3 @@ if (options === void 0) {

*/
var memoize = function memoize(fn) {

@@ -1570,6 +1556,7 @@ var value;

};
/**
* Get a style property value.
*/
var getPropertyValue = function getPropertyValue(cssRule, prop) {

@@ -1588,6 +1575,7 @@ try {

};
/**
* Set a style property.
*/
var setProperty = function setProperty(cssRule, prop, value) {

@@ -1619,6 +1607,7 @@ try {

};
/**
* Remove a style property.
*/
var removeProperty = function removeProperty(cssRule, prop) {

@@ -1636,6 +1625,7 @@ try {

};
/**
* Set the selector.
*/
var setSelector = function setSelector(cssRule, selectorText) {

@@ -1705,12 +1695,13 @@ cssRule.selectorText = selectorText; // Return false if setter was not successful.

}
/**
* Find a node before which we can insert the sheet.
*/
function findPrevNode(options) {
var registry$1 = registry.registry;
var registry = sheets.registry;
if (registry$1.length > 0) {
if (registry.length > 0) {
// Try to insert before the next higher sheet.
var sheet = findHigherSheet(registry$1, options);
var sheet = findHigherSheet(registry, options);

@@ -1725,3 +1716,3 @@ if (sheet && sheet.renderer) {

sheet = findHighestSheet(registry$1, options);
sheet = findHighestSheet(registry, options);

@@ -1772,3 +1763,2 @@ if (sheet && sheet.renderer) {

if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
// https://stackoverflow.com/questions/41328728/force-casting-in-flow
var insertionPointElement = insertionPoint;

@@ -1795,9 +1785,6 @@ var parentNode = insertionPointElement.parentNode;

if ('insertRule' in container) {
var c = container;
c.insertRule(rule, index);
container.insertRule(rule, index);
} // Keyframes rule.
else if ('appendRule' in container) {
var _c = container;
_c.appendRule(rule);
container.appendRule(rule);
}

@@ -1835,3 +1822,2 @@ } catch (err) {

function () {
// HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696
// Will be empty if link: true option is not set, because

@@ -1844,8 +1830,6 @@ // it is only for use together with insertRule API.

this.setSelector = setSelector;
this.element = void 0;
this.sheet = void 0;
this.hasInsertedRules = false;
this.cssRules = [];
// There is no sheet when the renderer is used from a standalone StyleRule.
if (sheet) registry.add(sheet);
if (sheet) sheets.add(sheet);
this.sheet = sheet;

@@ -2037,3 +2021,3 @@

this.id = instanceCounter++;
this.version = "10.7.1";
this.version = "10.8.0";
this.plugins = new PluginsRegistry();

@@ -2110,3 +2094,3 @@ this.options = {

if (typeof index !== 'number') {
index = registry.index === 0 ? 0 : registry.index + 1;
index = sheets.index === 0 ? 0 : sheets.index + 1;
}

@@ -2131,3 +2115,3 @@

sheet.detach();
registry.remove(sheet);
sheets.remove(sheet);
return this;

@@ -2152,7 +2136,5 @@ }

if (typeof name === 'object') {
// $FlowFixMe[incompatible-call]
return this.createRule(undefined, name, style);
} // $FlowFixMe[incompatible-type]
}
var ruleOptions = _extends({}, options, {

@@ -2194,32 +2176,12 @@ name: name,

/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
var createJss = function createJss(options) {
return new Jss(options);
};
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* SheetsManager is like a WeakMap which is designed to count StyleSheet
* instances and attach/detach automatically.
* Used in react-jss.
*/
var SheetsManager =

@@ -2289,2 +2251,34 @@ /*#__PURE__*/

/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* A better abstraction over CSS.

@@ -2296,22 +2290,5 @@ *

*/
var index = createJss();
/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Creates a new instance of Jss.
*/
var create = function create(options) {
return new Jss(options);
};
/**
* A global Jss instance.
*/
var jss = create();
export default jss;
export { RuleList, SheetsManager, SheetsRegistry, create, createGenerateId, createRule, getDynamicStyles, hasCSSTOMSupport, registry as sheets, toCssValue };
export default index;
export { RuleList, SheetsManager, SheetsRegistry, createJss as create, createGenerateId, createRule, getDynamicStyles, hasCSSTOMSupport, sheets, toCssValue };

303

dist/jss.js

@@ -124,5 +124,4 @@ (function (global, factory) {

};
/**
* Converts array values to string.
* Converts JSS array value to a CSS string.
*

@@ -134,2 +133,4 @@ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`

*/
var toCssValue = function toCssValue(value, ignoreImportant) {

@@ -159,2 +160,16 @@ if (ignoreImportant === void 0) {

function getWhitespaceSymbols(options) {
if (options && options.format === false) {
return {
linebreak: '',
space: ''
};
}
return {
linebreak: '\n',
space: ' '
};
}
/**

@@ -164,2 +179,3 @@ * Indent a string.

*/
function indentStr(str, indent) {

@@ -190,2 +206,11 @@ var result = '';

var fallbacks = style.fallbacks;
if (options.format === false) {
indent = -Infinity;
}
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak,
space = _getWhitespaceSymbols.space;
if (selector) indent++; // Apply fallbacks first.

@@ -203,4 +228,4 @@

if (value != null) {
if (result) result += '\n';
result += indentStr(prop + ": " + toCssValue(value) + ";", indent);
if (result) result += linebreak;
result += indentStr(prop + ":" + space + toCssValue(value) + ";", indent);
}

@@ -215,4 +240,4 @@ }

if (_value != null) {
if (result) result += '\n';
result += indentStr(_prop + ": " + toCssValue(_value) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop + ":" + space + toCssValue(_value) + ";", indent);
}

@@ -227,4 +252,4 @@ }

if (_value2 != null && _prop2 !== 'fallbacks') {
if (result) result += '\n';
result += indentStr(_prop2 + ": " + toCssValue(_value2) + ";", indent);
if (result) result += linebreak;
result += indentStr(_prop2 + ":" + space + toCssValue(_value2) + ";", indent);
}

@@ -238,4 +263,4 @@ } // Allow empty style in this case, because properties will be added dynamically.

indent--;
if (result) result = "\n" + result + "\n";
return indentStr(selector + " {" + result, indent) + indentStr('}', indent);
if (result) result = "" + linebreak + result + linebreak;
return indentStr("" + selector + space + "{" + result, indent) + indentStr('}', indent);
}

@@ -254,8 +279,3 @@

this.type = 'style';
this.key = void 0;
this.isProcessed = false;
this.style = void 0;
this.renderer = void 0;
this.renderable = void 0;
this.options = void 0;
var sheet = options.sheet,

@@ -320,5 +340,2 @@ Renderer = options.Renderer;

_this = _BaseStyleRule.call(this, key, style, options) || this;
_this.selectorText = void 0;
_this.id = void 0;
_this.renderable = void 0;
var selector = options.selector,

@@ -420,8 +437,8 @@ scoped = options.scoped,

var pluginStyleRule = {
onCreateRule: function onCreateRule(name, style, options) {
if (name[0] === '@' || options.parent && options.parent.type === 'keyframes') {
onCreateRule: function onCreateRule(key, style, options) {
if (key[0] === '@' || options.parent && options.parent.type === 'keyframes') {
return null;
}
return new StyleRule(name, style, options);
return new StyleRule(key, style, options);
}

@@ -444,9 +461,3 @@ };

this.type = 'conditional';
this.at = void 0;
this.key = void 0;
this.query = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -507,2 +518,5 @@ var atMatch = key.match(atRegExp);

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions.indent;

@@ -516,3 +530,3 @@ if (options.children == null) options.children = defaultToStringOptions.children;

var children = this.rules.toString(options);
return children ? this.query + " {\n" + children + "\n}" : '';
return children ? this.query + " {" + linebreak + children + linebreak + "}" : '';
};

@@ -544,9 +558,3 @@

this.at = '@keyframes';
this.key = void 0;
this.name = void 0;
this.id = void 0;
this.rules = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
var nameMatch = key.match(nameRegExp);

@@ -591,2 +599,5 @@

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (options.indent == null) options.indent = defaultToStringOptions$1.indent;

@@ -600,3 +611,3 @@ if (options.children == null) options.children = defaultToStringOptions$1.children;

var children = this.rules.toString(options);
if (children) children = "\n" + children + "\n";
if (children) children = "" + linebreak + children + linebreak;
return this.at + " " + this.id + " {" + children + "}";

@@ -638,3 +649,3 @@ };

var plugin = {
var pluginKeyframesRule = {
onCreateRule: function onCreateRule(key, frames, options) {

@@ -676,11 +687,3 @@ return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null;

function KeyframeRule() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _BaseStyleRule.call.apply(_BaseStyleRule, [this].concat(args)) || this;
_this.renderable = void 0;
return _this;
return _BaseStyleRule.apply(this, arguments) || this;
}

@@ -720,7 +723,3 @@

this.at = '@font-face';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -738,2 +737,5 @@ this.style = style;

_proto.toString = function toString(options) {
var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
if (Array.isArray(this.style)) {

@@ -744,3 +746,3 @@ var str = '';

str += toCss(this.at, this.style[index]);
if (this.style[index + 1]) str += '\n';
if (this.style[index + 1]) str += linebreak;
}

@@ -769,7 +771,3 @@

this.at = '@viewport';
this.key = void 0;
this.style = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -803,7 +801,3 @@ this.style = style;

this.type = 'simple';
this.key = void 0;
this.value = void 0;
this.options = void 0;
this.isProcessed = false;
this.renderable = void 0;
this.key = key;

@@ -849,3 +843,3 @@ this.value = value;

var plugins = [pluginStyleRule, pluginConditionalRule, plugin, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];
var plugins = [pluginStyleRule, pluginConditionalRule, pluginKeyframesRule, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];

@@ -877,5 +871,2 @@ var defaultUpdateOptions = {

this.counter = 0;
this.options = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.options = options;

@@ -1019,10 +1010,7 @@ this.classes = options.classes;

if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') {
name = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 1 ? undefined : arguments[1]; // $FlowFixMe[invalid-tuple-index]
name = arguments.length <= 0 ? undefined : arguments[0];
data = arguments.length <= 1 ? undefined : arguments[1];
options = arguments.length <= 2 ? undefined : arguments[2];
} else {
data = arguments.length <= 0 ? undefined : arguments[0]; // $FlowFixMe[invalid-tuple-index]
data = arguments.length <= 0 ? undefined : arguments[0];
options = arguments.length <= 1 ? undefined : arguments[1];

@@ -1059,12 +1047,11 @@ name = null;

var styleRule = rule;
var style = styleRule.style;
var style = rule.style;
plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook.
if (options.process && style && style !== styleRule.style) {
if (options.process && style && style !== rule.style) {
// We need to run the plugins in case new `style` relies on syntax plugins.
plugins.onProcessStyle(styleRule.style, styleRule, sheet); // Update and add props.
plugins.onProcessStyle(rule.style, rule, sheet); // Update and add props.
for (var prop in styleRule.style) {
var nextValue = styleRule.style[prop];
for (var prop in rule.style) {
var nextValue = rule.style[prop];
var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1074,3 +1061,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (nextValue !== prevValue) {
styleRule.prop(prop, nextValue, forceUpdateOptions);
rule.prop(prop, nextValue, forceUpdateOptions);
}

@@ -1081,3 +1068,3 @@ } // Remove props.

for (var _prop in style) {
var _nextValue = styleRule.style[_prop];
var _nextValue = rule.style[_prop];
var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

@@ -1087,3 +1074,3 @@ // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.

if (_nextValue == null && _nextValue !== _prevValue) {
styleRule.prop(_prop, null, forceUpdateOptions);
rule.prop(_prop, null, forceUpdateOptions);
}

@@ -1103,2 +1090,5 @@ }

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
for (var index = 0; index < this.index.length; index++) {

@@ -1109,3 +1099,3 @@ var rule = this.index[index];

if (!css && !link) continue;
if (str) str += '\n';
if (str) str += linebreak;
str += css;

@@ -1124,10 +1114,2 @@ }

function StyleSheet(styles, options) {
this.options = void 0;
this.deployed = void 0;
this.attached = void 0;
this.rules = void 0;
this.renderer = void 0;
this.classes = void 0;
this.keyframes = void 0;
this.queue = void 0;
this.attached = false;

@@ -1334,3 +1316,3 @@ this.deployed = false;

};
this.registry = void 0;
this.registry = {};
}

@@ -1374,3 +1356,2 @@

for (var i = 0; i < this.registry.onProcessStyle.length; i++) {
// $FlowFixMe[prop-missing]
rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet);

@@ -1471,4 +1452,5 @@ }

/**
* Sheets registry to access them all at one place.
* Sheets registry to access all instances in one place.
*/
var SheetsRegistry =

@@ -1531,2 +1513,5 @@ /*#__PURE__*/

var _getWhitespaceSymbols = getWhitespaceSymbols(options),
linebreak = _getWhitespaceSymbols.linebreak;
var css = '';

@@ -1541,3 +1526,3 @@

if (css) css += '\n';
if (css) css += linebreak;
css += sheet.toString(options);

@@ -1570,3 +1555,3 @@ }

var registry = new SheetsRegistry();
var sheets = new SheetsRegistry();

@@ -1596,3 +1581,2 @@ /* eslint-disable */

var maxRules = 1e10;
/**

@@ -1603,2 +1587,3 @@ * Returns a function which generates unique class names based on counters.

*/
var createGenerateId = function createGenerateId(options) {

@@ -1645,2 +1630,3 @@ if (options === void 0) {

*/
var memoize = function memoize(fn) {

@@ -1653,6 +1639,7 @@ var value;

};
/**
* Get a style property value.
*/
var getPropertyValue = function getPropertyValue(cssRule, prop) {

@@ -1671,6 +1658,7 @@ try {

};
/**
* Set a style property.
*/
var setProperty = function setProperty(cssRule, prop, value) {

@@ -1702,6 +1690,7 @@ try {

};
/**
* Remove a style property.
*/
var removeProperty = function removeProperty(cssRule, prop) {

@@ -1719,6 +1708,7 @@ try {

};
/**
* Set the selector.
*/
var setSelector = function setSelector(cssRule, selectorText) {

@@ -1788,12 +1778,13 @@ cssRule.selectorText = selectorText; // Return false if setter was not successful.

}
/**
* Find a node before which we can insert the sheet.
*/
function findPrevNode(options) {
var registry$1 = registry.registry;
var registry = sheets.registry;
if (registry$1.length > 0) {
if (registry.length > 0) {
// Try to insert before the next higher sheet.
var sheet = findHigherSheet(registry$1, options);
var sheet = findHigherSheet(registry, options);

@@ -1808,3 +1799,3 @@ if (sheet && sheet.renderer) {

sheet = findHighestSheet(registry$1, options);
sheet = findHighestSheet(registry, options);

@@ -1855,3 +1846,2 @@ if (sheet && sheet.renderer) {

if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
// https://stackoverflow.com/questions/41328728/force-casting-in-flow
var insertionPointElement = insertionPoint;

@@ -1878,9 +1868,6 @@ var parentNode = insertionPointElement.parentNode;

if ('insertRule' in container) {
var c = container;
c.insertRule(rule, index);
container.insertRule(rule, index);
} // Keyframes rule.
else if ('appendRule' in container) {
var _c = container;
_c.appendRule(rule);
container.appendRule(rule);
}

@@ -1918,3 +1905,2 @@ } catch (err) {

function () {
// HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696
// Will be empty if link: true option is not set, because

@@ -1927,8 +1913,6 @@ // it is only for use together with insertRule API.

this.setSelector = setSelector;
this.element = void 0;
this.sheet = void 0;
this.hasInsertedRules = false;
this.cssRules = [];
// There is no sheet when the renderer is used from a standalone StyleRule.
if (sheet) registry.add(sheet);
if (sheet) sheets.add(sheet);
this.sheet = sheet;

@@ -2120,3 +2104,3 @@

this.id = instanceCounter++;
this.version = "10.7.1";
this.version = "10.8.0";
this.plugins = new PluginsRegistry();

@@ -2193,3 +2177,3 @@ this.options = {

if (typeof index !== 'number') {
index = registry.index === 0 ? 0 : registry.index + 1;
index = sheets.index === 0 ? 0 : sheets.index + 1;
}

@@ -2214,3 +2198,3 @@

sheet.detach();
registry.remove(sheet);
sheets.remove(sheet);
return this;

@@ -2235,7 +2219,5 @@ }

if (typeof name === 'object') {
// $FlowFixMe[incompatible-call]
return this.createRule(undefined, name, style);
} // $FlowFixMe[incompatible-type]
}
var ruleOptions = _extends({}, options, {

@@ -2277,32 +2259,12 @@ name: name,

/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
var createJss = function createJss(options) {
return new Jss(options);
};
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* SheetsManager is like a WeakMap which is designed to count StyleSheet
* instances and attach/detach automatically.
* Used in react-jss.
*/
var SheetsManager =

@@ -2372,2 +2334,34 @@ /*#__PURE__*/

/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Extracts a styles object with only props that contain function values.
*/
function getDynamicStyles(styles) {
var to = null;
for (var key in styles) {
var value = styles[key];
var type = typeof value;
if (type === 'function') {
if (!to) to = {};
to[key] = value;
} else if (type === 'object' && value !== null && !Array.isArray(value)) {
var extracted = getDynamicStyles(value);
if (extracted) {
if (!to) to = {};
to[key] = extracted;
}
}
}
return to;
}
/**
* A better abstraction over CSS.

@@ -2379,31 +2373,14 @@ *

*/
var index = createJss();
/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
/**
* Creates a new instance of Jss.
*/
var create = function create(options) {
return new Jss(options);
};
/**
* A global Jss instance.
*/
var jss = create();
exports.RuleList = RuleList;
exports.SheetsManager = SheetsManager;
exports.SheetsRegistry = SheetsRegistry;
exports.create = create;
exports.create = createJss;
exports.createGenerateId = createGenerateId;
exports.createRule = createRule;
exports.default = jss;
exports.default = index;
exports.getDynamicStyles = getDynamicStyles;
exports.hasCSSTOMSupport = hasCSSTOMSupport;
exports.sheets = registry;
exports.sheets = sheets;
exports.toCssValue = toCssValue;

@@ -2410,0 +2387,0 @@

5

dist/jss.min.js

@@ -1,2 +0,2 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).jss={})}(this,(function(e){"use strict";function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r="object"===("undefined"==typeof window?"undefined":n(window))&&"object"===("undefined"==typeof document?"undefined":n(document))&&9===document.nodeType,i={}.constructor;function s(e){if(null==e||"object"!=typeof e)return e;if(Array.isArray(e))return e.map(s);if(e.constructor!==i)return e;var t={};for(var n in e)t[n]=s(e[n]);return t}function o(e,t,n){void 0===e&&(e="unnamed");var r=n.jss,i=s(t),o=r.plugins.onCreateRule(e,i,n);return o||(e[0],null)}function a(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function u(e,t,n){return t&&a(e.prototype,t),n&&a(e,n),e}function h(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}function l(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}var d=function(e,t){for(var n="",r=0;r<e.length&&"!important"!==e[r];r++)n&&(n+=t),n+=e[r];return n},c=function(e,t){if(void 0===t&&(t=!1),!Array.isArray(e))return e;var n="";if(Array.isArray(e[0]))for(var r=0;r<e.length&&"!important"!==e[r];r++)n&&(n+=", "),n+=d(e[r]," ");else n=d(e,", ");return t||"!important"!==e[e.length-1]||(n+=" !important"),n};function f(e,t){for(var n="",r=0;r<t;r++)n+=" ";return n+e}function p(e,t,n){void 0===n&&(n={});var r="";if(!t)return r;var i=n.indent,s=void 0===i?0:i,o=t.fallbacks;if(e&&s++,o)if(Array.isArray(o))for(var a=0;a<o.length;a++){var u=o[a];for(var h in u){var l=u[h];null!=l&&(r&&(r+="\n"),r+=f(h+": "+c(l)+";",s))}}else for(var d in o){var p=o[d];null!=p&&(r&&(r+="\n"),r+=f(d+": "+c(p)+";",s))}for(var y in t){var v=t[y];null!=v&&"fallbacks"!==y&&(r&&(r+="\n"),r+=f(y+": "+c(v)+";",s))}return(r||n.allowEmpty)&&e?(r&&(r="\n"+r+"\n"),f(e+" {"+r,--s)+f("}",s)):r}var y=/([[\].#*$><+~=|^:(),"'`\s])/g,v="undefined"!=typeof CSS&&CSS.escape,g=function(e){return v?v(e):e.replace(y,"\\$1")},m=function(){function e(e,t,n){this.type="style",this.key=void 0,this.isProcessed=!1,this.style=void 0,this.renderer=void 0,this.renderable=void 0,this.options=void 0;var r=n.sheet,i=n.Renderer;this.key=e,this.options=n,this.style=t,r?this.renderer=r.renderer:i&&(this.renderer=new i)}return e.prototype.prop=function(e,t,n){if(void 0===t)return this.style[e];var r=!!n&&n.force;if(!r&&this.style[e]===t)return this;var i=t;n&&!1===n.process||(i=this.options.jss.plugins.onChangeValue(t,e,this));var s=null==i||!1===i,o=e in this.style;if(s&&!o&&!r)return this;var a=s&&o;if(a?delete this.style[e]:this.style[e]=i,this.renderable&&this.renderer)return a?this.renderer.removeProperty(this.renderable,e):this.renderer.setProperty(this.renderable,e,i),this;var u=this.options.sheet;return u&&u.attached,this},e}(),R=function(e){function n(t,n,r){var i;(i=e.call(this,t,n,r)||this).selectorText=void 0,i.id=void 0,i.renderable=void 0;var s=r.selector,o=r.scoped,a=r.sheet,u=r.generateId;return s?i.selectorText=s:!1!==o&&(i.id=u(l(l(i)),a),i.selectorText="."+g(i.id)),i}h(n,e);var r=n.prototype;return r.applyTo=function(e){var t=this.renderer;if(t){var n=this.toJSON();for(var r in n)t.setProperty(e,r,n[r])}return this},r.toJSON=function(){var e={};for(var t in this.style){var n=this.style[t];"object"!=typeof n?e[t]=n:Array.isArray(n)&&(e[t]=c(n))}return e},r.toString=function(e){var n=this.options.sheet,r=!!n&&n.options.link?t({},e,{allowEmpty:!0}):e;return p(this.selectorText,this.style,r)},u(n,[{key:"selector",set:function(e){if(e!==this.selectorText){this.selectorText=e;var t=this.renderer,n=this.renderable;if(n&&t)t.setSelector(n,e)||t.replaceRule(n,this)}},get:function(){return this.selectorText}}]),n}(m),S={onCreateRule:function(e,t,n){return"@"===e[0]||n.parent&&"keyframes"===n.parent.type?null:new R(e,t,n)}},b={indent:1,children:!0},x=/@([\w-]+)/,k=function(){function e(e,n,r){this.type="conditional",this.at=void 0,this.key=void 0,this.query=void 0,this.rules=void 0,this.options=void 0,this.isProcessed=!1,this.renderable=void 0,this.key=e;var i=e.match(x);for(var s in this.at=i?i[1]:"unknown",this.query=r.name||"@"+this.at,this.options=r,this.rules=new L(t({},r,{parent:this})),n)this.rules.add(s,n[s]);this.rules.process()}var n=e.prototype;return n.getRule=function(e){return this.rules.get(e)},n.indexOf=function(e){return this.rules.indexOf(e)},n.addRule=function(e,t,n){var r=this.rules.add(e,t,n);return r?(this.options.jss.plugins.onProcessRule(r),r):null},n.toString=function(e){if(void 0===e&&(e=b),null==e.indent&&(e.indent=b.indent),null==e.children&&(e.children=b.children),!1===e.children)return this.query+" {}";var t=this.rules.toString(e);return t?this.query+" {\n"+t+"\n}":""},e}(),P=/@media|@supports\s+/,w={onCreateRule:function(e,t,n){return P.test(e)?new k(e,t,n):null}},C={indent:1,children:!0},O=/@keyframes\s+([\w-]+)/,j=function(){function e(e,n,r){this.type="keyframes",this.at="@keyframes",this.key=void 0,this.name=void 0,this.id=void 0,this.rules=void 0,this.options=void 0,this.isProcessed=!1,this.renderable=void 0;var i=e.match(O);i&&i[1]?this.name=i[1]:this.name="noname",this.key=this.type+"-"+this.name,this.options=r;var s=r.scoped,o=r.sheet,a=r.generateId;for(var u in this.id=!1===s?this.name:g(a(this,o)),this.rules=new L(t({},r,{parent:this})),n)this.rules.add(u,n[u],t({},r,{parent:this}));this.rules.process()}return e.prototype.toString=function(e){if(void 0===e&&(e=C),null==e.indent&&(e.indent=C.indent),null==e.children&&(e.children=C.children),!1===e.children)return this.at+" "+this.id+" {}";var t=this.rules.toString(e);return t&&(t="\n"+t+"\n"),this.at+" "+this.id+" {"+t+"}"},e}(),A=/@keyframes\s+/,I=/\$([\w-]+)/g,T=function(e,t){return"string"==typeof e?e.replace(I,(function(e,n){return n in t?t[n]:e})):e},q=function(e,t,n){var r=e[t],i=T(r,n);i!==r&&(e[t]=i)},M={onCreateRule:function(e,t,n){return"string"==typeof e&&A.test(e)?new j(e,t,n):null},onProcessStyle:function(e,t,n){return"style"===t.type&&n?("animation-name"in e&&q(e,"animation-name",n.keyframes),"animation"in e&&q(e,"animation",n.keyframes),e):e},onChangeValue:function(e,t,n){var r=n.options.sheet;if(!r)return e;switch(t){case"animation":case"animation-name":return T(e,r.keyframes);default:return e}}},N=function(e){function n(){for(var t,n=arguments.length,r=new Array(n),i=0;i<n;i++)r[i]=arguments[i];return(t=e.call.apply(e,[this].concat(r))||this).renderable=void 0,t}return h(n,e),n.prototype.toString=function(e){var n=this.options.sheet,r=!!n&&n.options.link?t({},e,{allowEmpty:!0}):e;return p(this.key,this.style,r)},n}(m),V={onCreateRule:function(e,t,n){return n.parent&&"keyframes"===n.parent.type?new N(e,t,n):null}},E=function(){function e(e,t,n){this.type="font-face",this.at="@font-face",this.key=void 0,this.style=void 0,this.options=void 0,this.isProcessed=!1,this.renderable=void 0,this.key=e,this.style=t,this.options=n}return e.prototype.toString=function(e){if(Array.isArray(this.style)){for(var t="",n=0;n<this.style.length;n++)t+=p(this.at,this.style[n]),this.style[n+1]&&(t+="\n");return t}return p(this.at,this.style,e)},e}(),G=/@font-face/,_={onCreateRule:function(e,t,n){return G.test(e)?new E(e,t,n):null}},U=function(){function e(e,t,n){this.type="viewport",this.at="@viewport",this.key=void 0,this.style=void 0,this.options=void 0,this.isProcessed=!1,this.renderable=void 0,this.key=e,this.style=t,this.options=n}return e.prototype.toString=function(e){return p(this.key,this.style,e)},e}(),B={onCreateRule:function(e,t,n){return"@viewport"===e||"@-ms-viewport"===e?new U(e,t,n):null}},$=function(){function e(e,t,n){this.type="simple",this.key=void 0,this.value=void 0,this.options=void 0,this.isProcessed=!1,this.renderable=void 0,this.key=e,this.value=t,this.options=n}return e.prototype.toString=function(e){if(Array.isArray(this.value)){for(var t="",n=0;n<this.value.length;n++)t+=this.key+" "+this.value[n]+";",this.value[n+1]&&(t+="\n");return t}return this.key+" "+this.value+";"},e}(),J={"@charset":!0,"@import":!0,"@namespace":!0},z=[S,w,M,V,_,B,{onCreateRule:function(e,t,n){return e in J?new $(e,t,n):null}}],D={process:!0},F={force:!0,process:!0},L=function(){function e(e){this.map={},this.raw={},this.index=[],this.counter=0,this.options=void 0,this.classes=void 0,this.keyframes=void 0,this.options=e,this.classes=e.classes,this.keyframes=e.keyframes}var n=e.prototype;return n.add=function(e,n,r){var i=this.options,s=i.parent,a=i.sheet,u=i.jss,h=i.Renderer,l=i.generateId,d=i.scoped,c=t({classes:this.classes,parent:s,sheet:a,jss:u,Renderer:h,generateId:l,scoped:d,name:e,keyframes:this.keyframes,selector:void 0},r),f=e;e in this.raw&&(f=e+"-d"+this.counter++),this.raw[f]=n,f in this.classes&&(c.selector="."+g(this.classes[f]));var p=o(f,n,c);if(!p)return null;this.register(p);var y=void 0===c.index?this.index.length:c.index;return this.index.splice(y,0,p),p},n.get=function(e){return this.map[e]},n.remove=function(e){this.unregister(e),delete this.raw[e.key],this.index.splice(this.index.indexOf(e),1)},n.indexOf=function(e){return this.index.indexOf(e)},n.process=function(){var e=this.options.jss.plugins;this.index.slice(0).forEach(e.onProcessRule,e)},n.register=function(e){this.map[e.key]=e,e instanceof R?(this.map[e.selector]=e,e.id&&(this.classes[e.key]=e.id)):e instanceof j&&this.keyframes&&(this.keyframes[e.name]=e.id)},n.unregister=function(e){delete this.map[e.key],e instanceof R?(delete this.map[e.selector],delete this.classes[e.key]):e instanceof j&&delete this.keyframes[e.name]},n.update=function(){var e,t,n;if("string"==typeof(arguments.length<=0?void 0:arguments[0])?(e=arguments.length<=0?void 0:arguments[0],t=arguments.length<=1?void 0:arguments[1],n=arguments.length<=2?void 0:arguments[2]):(t=arguments.length<=0?void 0:arguments[0],n=arguments.length<=1?void 0:arguments[1],e=null),e)this.updateOne(this.map[e],t,n);else for(var r=0;r<this.index.length;r++)this.updateOne(this.index[r],t,n)},n.updateOne=function(t,n,r){void 0===r&&(r=D);var i=this.options,s=i.jss.plugins,o=i.sheet;if(t.rules instanceof e)t.rules.update(n,r);else{var a=t,u=a.style;if(s.onUpdate(n,t,o,r),r.process&&u&&u!==a.style){for(var h in s.onProcessStyle(a.style,a,o),a.style){var l=a.style[h];l!==u[h]&&a.prop(h,l,F)}for(var d in u){var c=a.style[d],f=u[d];null==c&&c!==f&&a.prop(d,null,F)}}}},n.toString=function(e){for(var t="",n=this.options.sheet,r=!!n&&n.options.link,i=0;i<this.index.length;i++){var s=this.index[i].toString(e);(s||r)&&(t&&(t+="\n"),t+=s)}return t},e}(),W=function(){function e(e,n){for(var r in this.options=void 0,this.deployed=void 0,this.attached=void 0,this.rules=void 0,this.renderer=void 0,this.classes=void 0,this.keyframes=void 0,this.queue=void 0,this.attached=!1,this.deployed=!1,this.classes={},this.keyframes={},this.options=t({},n,{sheet:this,parent:this,classes:this.classes,keyframes:this.keyframes}),n.Renderer&&(this.renderer=new n.Renderer(this)),this.rules=new L(this.options),e)this.rules.add(r,e[r]);this.rules.process()}var n=e.prototype;return n.attach=function(){return this.attached||(this.renderer&&this.renderer.attach(),this.attached=!0,this.deployed||this.deploy()),this},n.detach=function(){return this.attached?(this.renderer&&this.renderer.detach(),this.attached=!1,this):this},n.addRule=function(e,t,n){var r=this.queue;this.attached&&!r&&(this.queue=[]);var i=this.rules.add(e,t,n);return i?(this.options.jss.plugins.onProcessRule(i),this.attached?this.deployed?(r?r.push(i):(this.insertRule(i),this.queue&&(this.queue.forEach(this.insertRule,this),this.queue=void 0)),i):i:(this.deployed=!1,i)):null},n.insertRule=function(e){this.renderer&&this.renderer.insertRule(e)},n.addRules=function(e,t){var n=[];for(var r in e){var i=this.addRule(r,e[r],t);i&&n.push(i)}return n},n.getRule=function(e){return this.rules.get(e)},n.deleteRule=function(e){var t="object"==typeof e?e:this.rules.get(e);return!(!t||this.attached&&!t.renderable)&&(this.rules.remove(t),!(this.attached&&t.renderable&&this.renderer)||this.renderer.deleteRule(t.renderable))},n.indexOf=function(e){return this.rules.indexOf(e)},n.deploy=function(){return this.renderer&&this.renderer.deploy(),this.deployed=!0,this},n.update=function(){var e;return(e=this.rules).update.apply(e,arguments),this},n.updateOne=function(e,t,n){return this.rules.updateOne(e,t,n),this},n.toString=function(e){return this.rules.toString(e)},e}(),H=function(){function e(){this.plugins={internal:[],external:[]},this.registry=void 0}var t=e.prototype;return t.onCreateRule=function(e,t,n){for(var r=0;r<this.registry.onCreateRule.length;r++){var i=this.registry.onCreateRule[r](e,t,n);if(i)return i}return null},t.onProcessRule=function(e){if(!e.isProcessed){for(var t=e.options.sheet,n=0;n<this.registry.onProcessRule.length;n++)this.registry.onProcessRule[n](e,t);e.style&&this.onProcessStyle(e.style,e,t),e.isProcessed=!0}},t.onProcessStyle=function(e,t,n){for(var r=0;r<this.registry.onProcessStyle.length;r++)t.style=this.registry.onProcessStyle[r](t.style,t,n)},t.onProcessSheet=function(e){for(var t=0;t<this.registry.onProcessSheet.length;t++)this.registry.onProcessSheet[t](e)},t.onUpdate=function(e,t,n,r){for(var i=0;i<this.registry.onUpdate.length;i++)this.registry.onUpdate[i](e,t,n,r)},t.onChangeValue=function(e,t,n){for(var r=e,i=0;i<this.registry.onChangeValue.length;i++)r=this.registry.onChangeValue[i](r,t,n);return r},t.use=function(e,t){void 0===t&&(t={queue:"external"});var n=this.plugins[t.queue];-1===n.indexOf(e)&&(n.push(e),this.registry=[].concat(this.plugins.external,this.plugins.internal).reduce((function(e,t){for(var n in t)n in e&&e[n].push(t[n]);return e}),{onCreateRule:[],onProcessRule:[],onProcessStyle:[],onProcessSheet:[],onChangeValue:[],onUpdate:[]}))},e}();var K=function(){function e(){this.registry=[]}var t=e.prototype;return t.add=function(e){var t=this.registry,n=e.options.index;if(-1===t.indexOf(e))if(0===t.length||n>=this.index)t.push(e);else for(var r=0;r<t.length;r++)if(t[r].options.index>n)return void t.splice(r,0,e)},t.reset=function(){this.registry=[]},t.remove=function(e){var t=this.registry.indexOf(e);this.registry.splice(t,1)},t.toString=function(e){for(var t=void 0===e?{}:e,n=t.attached,r=function(e,t){if(null==e)return{};var n,r,i={},s=Object.keys(e);for(r=0;r<s.length;r++)n=s[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(t,["attached"]),i="",s=0;s<this.registry.length;s++){var o=this.registry[s];null!=n&&o.attached!==n||(i&&(i+="\n"),i+=o.toString(r))}return i},u(e,[{key:"index",get:function(){return 0===this.registry.length?0:this.registry[this.registry.length-1].options.index}}]),e}(),Q=new K,X="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window&&window.Math===Math?window:"undefined"!=typeof self&&self.Math===Math?self:Function("return this")(),Y="2f1acc6c3a606b082e5eef5e54414ffb";null==X[Y]&&(X[Y]=0);var Z=X[Y]++,ee=function(e){void 0===e&&(e={});var t=0;return function(n,r){t+=1;var i="",s="";return r&&(r.options.classNamePrefix&&(s=r.options.classNamePrefix),null!=r.options.jss.id&&(i=String(r.options.jss.id))),e.minify?""+(s||"c")+Z+i+t:s+n.key+"-"+Z+(i?"-"+i:"")+"-"+t}},te=function(e){var t;return function(){return t||(t=e()),t}},ne=function(e,t){try{return e.attributeStyleMap?e.attributeStyleMap.get(t):e.style.getPropertyValue(t)}catch(e){return""}},re=function(e,t,n){try{var r=n;if(Array.isArray(n)&&(r=c(n,!0),"!important"===n[n.length-1]))return e.style.setProperty(t,r,"important"),!0;e.attributeStyleMap?e.attributeStyleMap.set(t,r):e.style.setProperty(t,r)}catch(e){return!1}return!0},ie=function(e,t){try{e.attributeStyleMap?e.attributeStyleMap.delete(t):e.style.removeProperty(t)}catch(e){}},se=function(e,t){return e.selectorText=t,e.selectorText===t},oe=te((function(){return document.querySelector("head")}));function ae(e){var t=Q.registry;if(t.length>0){var n=function(e,t){for(var n=0;n<e.length;n++){var r=e[n];if(r.attached&&r.options.index>t.index&&r.options.insertionPoint===t.insertionPoint)return r}return null}(t,e);if(n&&n.renderer)return{parent:n.renderer.element.parentNode,node:n.renderer.element};if((n=function(e,t){for(var n=e.length-1;n>=0;n--){var r=e[n];if(r.attached&&r.options.insertionPoint===t.insertionPoint)return r}return null}(t,e))&&n.renderer)return{parent:n.renderer.element.parentNode,node:n.renderer.element.nextSibling}}var r=e.insertionPoint;if(r&&"string"==typeof r){var i=function(e){for(var t=oe(),n=0;n<t.childNodes.length;n++){var r=t.childNodes[n];if(8===r.nodeType&&r.nodeValue.trim()===e)return r}return null}(r);if(i)return{parent:i.parentNode,node:i.nextSibling}}return!1}var ue=te((function(){var e=document.querySelector('meta[property="csp-nonce"]');return e?e.getAttribute("content"):null})),he=function(e,t,n){try{if("insertRule"in e)e.insertRule(t,n);else if("appendRule"in e){e.appendRule(t)}}catch(e){return!1}return e.cssRules[n]},le=function(e,t){var n=e.cssRules.length;return void 0===t||t>n?n:t},de=function(){function e(e){this.getPropertyValue=ne,this.setProperty=re,this.removeProperty=ie,this.setSelector=se,this.element=void 0,this.sheet=void 0,this.hasInsertedRules=!1,this.cssRules=[],e&&Q.add(e),this.sheet=e;var t,n=this.sheet?this.sheet.options:{},r=n.media,i=n.meta,s=n.element;this.element=s||((t=document.createElement("style")).textContent="\n",t),this.element.setAttribute("data-jss",""),r&&this.element.setAttribute("media",r),i&&this.element.setAttribute("data-meta",i);var o=ue();o&&this.element.setAttribute("nonce",o)}var t=e.prototype;return t.attach=function(){if(!this.element.parentNode&&this.sheet){!function(e,t){var n=t.insertionPoint,r=ae(t);if(!1!==r&&r.parent)r.parent.insertBefore(e,r.node);else if(n&&"number"==typeof n.nodeType){var i=n,s=i.parentNode;s&&s.insertBefore(e,i.nextSibling)}else oe().appendChild(e)}(this.element,this.sheet.options);var e=Boolean(this.sheet&&this.sheet.deployed);this.hasInsertedRules&&e&&(this.hasInsertedRules=!1,this.deploy())}},t.detach=function(){if(this.sheet){var e=this.element.parentNode;e&&e.removeChild(this.element),this.sheet.options.link&&(this.cssRules=[],this.element.textContent="\n")}},t.deploy=function(){var e=this.sheet;e&&(e.options.link?this.insertRules(e.rules):this.element.textContent="\n"+e.toString()+"\n")},t.insertRules=function(e,t){for(var n=0;n<e.index.length;n++)this.insertRule(e.index[n],n,t)},t.insertRule=function(e,t,n){if(void 0===n&&(n=this.element.sheet),e.rules){var r=e,i=n;if("conditional"===e.type||"keyframes"===e.type){var s=le(n,t);if(!1===(i=he(n,r.toString({children:!1}),s)))return!1;this.refCssRule(e,s,i)}return this.insertRules(r.rules,i),i}var o=e.toString();if(!o)return!1;var a=le(n,t),u=he(n,o,a);return!1!==u&&(this.hasInsertedRules=!0,this.refCssRule(e,a,u),u)},t.refCssRule=function(e,t,n){e.renderable=n,e.options.parent instanceof W&&(this.cssRules[t]=n)},t.deleteRule=function(e){var t=this.element.sheet,n=this.indexOf(e);return-1!==n&&(t.deleteRule(n),this.cssRules.splice(n,1),!0)},t.indexOf=function(e){return this.cssRules.indexOf(e)},t.replaceRule=function(e,t){var n=this.indexOf(e);return-1!==n&&(this.element.sheet.deleteRule(n),this.cssRules.splice(n,1),this.insertRule(t,n))},t.getRules=function(){return this.element.sheet.cssRules},e}(),ce=0,fe=function(){function e(e){this.id=ce++,this.version="10.7.1",this.plugins=new H,this.options={id:{minify:!1},createGenerateId:ee,Renderer:r?de:null,plugins:[]},this.generateId=ee({minify:!1});for(var t=0;t<z.length;t++)this.plugins.use(z[t],{queue:"internal"});this.setup(e)}var n=e.prototype;return n.setup=function(e){return void 0===e&&(e={}),e.createGenerateId&&(this.options.createGenerateId=e.createGenerateId),e.id&&(this.options.id=t({},this.options.id,e.id)),(e.createGenerateId||e.id)&&(this.generateId=this.options.createGenerateId(this.options.id)),null!=e.insertionPoint&&(this.options.insertionPoint=e.insertionPoint),"Renderer"in e&&(this.options.Renderer=e.Renderer),e.plugins&&this.use.apply(this,e.plugins),this},n.createStyleSheet=function(e,n){void 0===n&&(n={});var r=n.index;"number"!=typeof r&&(r=0===Q.index?0:Q.index+1);var i=new W(e,t({},n,{jss:this,generateId:n.generateId||this.generateId,insertionPoint:this.options.insertionPoint,Renderer:this.options.Renderer,index:r}));return this.plugins.onProcessSheet(i),i},n.removeStyleSheet=function(e){return e.detach(),Q.remove(e),this},n.createRule=function(e,n,r){if(void 0===n&&(n={}),void 0===r&&(r={}),"object"==typeof e)return this.createRule(void 0,e,n);var i=t({},r,{name:e,jss:this,Renderer:this.options.Renderer});i.generateId||(i.generateId=this.generateId),i.classes||(i.classes={}),i.keyframes||(i.keyframes={});var s=o(e,n,i);return s&&this.plugins.onProcessRule(s),s},n.use=function(){for(var e=this,t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return n.forEach((function(t){e.plugins.use(t)})),this},e}();var pe=function(){function e(){this.length=0,this.sheets=new WeakMap}var t=e.prototype;return t.get=function(e){var t=this.sheets.get(e);return t&&t.sheet},t.add=function(e,t){this.sheets.has(e)||(this.length++,this.sheets.set(e,{sheet:t,refs:0}))},t.manage=function(e){var t=this.sheets.get(e);if(t)return 0===t.refs&&t.sheet.attach(),t.refs++,t.sheet},t.unmanage=function(e){var t=this.sheets.get(e);t&&t.refs>0&&(t.refs--,0===t.refs&&t.sheet.detach())},u(e,[{key:"size",get:function(){return this.length}}]),e}(),ye="object"==typeof CSS&&null!=CSS&&"number"in CSS,ve=function(e){return new fe(e)},ge=ve();
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).jss={})}(this,(function(e){"use strict";function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r="object"===("undefined"==typeof window?"undefined":n(window))&&"object"===("undefined"==typeof document?"undefined":n(document))&&9===document.nodeType,i={}.constructor;function s(e){if(null==e||"object"!=typeof e)return e;if(Array.isArray(e))return e.map(s);if(e.constructor!==i)return e;var t={};for(var n in e)t[n]=s(e[n]);return t}function o(e,t,n){void 0===e&&(e="unnamed");var r=n.jss,i=s(t),o=r.plugins.onCreateRule(e,i,n);return o||(e[0],null)}function a(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function u(e,t,n){return t&&a(e.prototype,t),n&&a(e,n),e}function h(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,e.__proto__=t}function l(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}var c=function(e,t){for(var n="",r=0;r<e.length&&"!important"!==e[r];r++)n&&(n+=t),n+=e[r];return n},f=function(e,t){if(void 0===t&&(t=!1),!Array.isArray(e))return e;var n="";if(Array.isArray(e[0]))for(var r=0;r<e.length&&"!important"!==e[r];r++)n&&(n+=", "),n+=c(e[r]," ");else n=c(e,", ");return t||"!important"!==e[e.length-1]||(n+=" !important"),n};function d(e){return e&&!1===e.format?{linebreak:"",space:""}:{linebreak:"\n",space:" "}}function p(e,t){for(var n="",r=0;r<t;r++)n+=" ";return n+e}function y(e,t,n){void 0===n&&(n={});var r="";if(!t)return r;var i=n.indent,s=void 0===i?0:i,o=t.fallbacks;!1===n.format&&(s=-1/0);var a=d(n),u=a.linebreak,h=a.space;if(e&&s++,o)if(Array.isArray(o))for(var l=0;l<o.length;l++){var c=o[l];for(var y in c){var v=c[y];null!=v&&(r&&(r+=u),r+=p(y+":"+h+f(v)+";",s))}}else for(var g in o){var m=o[g];null!=m&&(r&&(r+=u),r+=p(g+":"+h+f(m)+";",s))}for(var R in t){var S=t[R];null!=S&&"fallbacks"!==R&&(r&&(r+=u),r+=p(R+":"+h+f(S)+";",s))}return(r||n.allowEmpty)&&e?(r&&(r=""+u+r+u),p(""+e+h+"{"+r,--s)+p("}",s)):r}var v=/([[\].#*$><+~=|^:(),"'`\s])/g,g="undefined"!=typeof CSS&&CSS.escape,m=function(e){return g?g(e):e.replace(v,"\\$1")},R=function(){function e(e,t,n){this.type="style",this.isProcessed=!1;var r=n.sheet,i=n.Renderer;this.key=e,this.options=n,this.style=t,r?this.renderer=r.renderer:i&&(this.renderer=new i)}return e.prototype.prop=function(e,t,n){if(void 0===t)return this.style[e];var r=!!n&&n.force;if(!r&&this.style[e]===t)return this;var i=t;n&&!1===n.process||(i=this.options.jss.plugins.onChangeValue(t,e,this));var s=null==i||!1===i,o=e in this.style;if(s&&!o&&!r)return this;var a=s&&o;if(a?delete this.style[e]:this.style[e]=i,this.renderable&&this.renderer)return a?this.renderer.removeProperty(this.renderable,e):this.renderer.setProperty(this.renderable,e,i),this;var u=this.options.sheet;return u&&u.attached,this},e}(),S=function(e){function n(t,n,r){var i;i=e.call(this,t,n,r)||this;var s=r.selector,o=r.scoped,a=r.sheet,u=r.generateId;return s?i.selectorText=s:!1!==o&&(i.id=u(l(l(i)),a),i.selectorText="."+m(i.id)),i}h(n,e);var r=n.prototype;return r.applyTo=function(e){var t=this.renderer;if(t){var n=this.toJSON();for(var r in n)t.setProperty(e,r,n[r])}return this},r.toJSON=function(){var e={};for(var t in this.style){var n=this.style[t];"object"!=typeof n?e[t]=n:Array.isArray(n)&&(e[t]=f(n))}return e},r.toString=function(e){var n=this.options.sheet,r=!!n&&n.options.link?t({},e,{allowEmpty:!0}):e;return y(this.selectorText,this.style,r)},u(n,[{key:"selector",set:function(e){if(e!==this.selectorText){this.selectorText=e;var t=this.renderer,n=this.renderable;if(n&&t)t.setSelector(n,e)||t.replaceRule(n,this)}},get:function(){return this.selectorText}}]),n}(R),b={onCreateRule:function(e,t,n){return"@"===e[0]||n.parent&&"keyframes"===n.parent.type?null:new S(e,t,n)}},x={indent:1,children:!0},k=/@([\w-]+)/,P=function(){function e(e,n,r){this.type="conditional",this.isProcessed=!1,this.key=e;var i=e.match(k);for(var s in this.at=i?i[1]:"unknown",this.query=r.name||"@"+this.at,this.options=r,this.rules=new W(t({},r,{parent:this})),n)this.rules.add(s,n[s]);this.rules.process()}var n=e.prototype;return n.getRule=function(e){return this.rules.get(e)},n.indexOf=function(e){return this.rules.indexOf(e)},n.addRule=function(e,t,n){var r=this.rules.add(e,t,n);return r?(this.options.jss.plugins.onProcessRule(r),r):null},n.toString=function(e){void 0===e&&(e=x);var t=d(e).linebreak;if(null==e.indent&&(e.indent=x.indent),null==e.children&&(e.children=x.children),!1===e.children)return this.query+" {}";var n=this.rules.toString(e);return n?this.query+" {"+t+n+t+"}":""},e}(),w=/@media|@supports\s+/,C={onCreateRule:function(e,t,n){return w.test(e)?new P(e,t,n):null}},O={indent:1,children:!0},j=/@keyframes\s+([\w-]+)/,A=function(){function e(e,n,r){this.type="keyframes",this.at="@keyframes",this.isProcessed=!1;var i=e.match(j);i&&i[1]?this.name=i[1]:this.name="noname",this.key=this.type+"-"+this.name,this.options=r;var s=r.scoped,o=r.sheet,a=r.generateId;for(var u in this.id=!1===s?this.name:m(a(this,o)),this.rules=new W(t({},r,{parent:this})),n)this.rules.add(u,n[u],t({},r,{parent:this}));this.rules.process()}return e.prototype.toString=function(e){void 0===e&&(e=O);var t=d(e).linebreak;if(null==e.indent&&(e.indent=O.indent),null==e.children&&(e.children=O.children),!1===e.children)return this.at+" "+this.id+" {}";var n=this.rules.toString(e);return n&&(n=""+t+n+t),this.at+" "+this.id+" {"+n+"}"},e}(),I=/@keyframes\s+/,T=/\$([\w-]+)/g,M=function(e,t){return"string"==typeof e?e.replace(T,(function(e,n){return n in t?t[n]:e})):e},q=function(e,t,n){var r=e[t],i=M(r,n);i!==r&&(e[t]=i)},N={onCreateRule:function(e,t,n){return"string"==typeof e&&I.test(e)?new A(e,t,n):null},onProcessStyle:function(e,t,n){return"style"===t.type&&n?("animation-name"in e&&q(e,"animation-name",n.keyframes),"animation"in e&&q(e,"animation",n.keyframes),e):e},onChangeValue:function(e,t,n){var r=n.options.sheet;if(!r)return e;switch(t){case"animation":case"animation-name":return M(e,r.keyframes);default:return e}}},V=function(e){function n(){return e.apply(this,arguments)||this}return h(n,e),n.prototype.toString=function(e){var n=this.options.sheet,r=!!n&&n.options.link?t({},e,{allowEmpty:!0}):e;return y(this.key,this.style,r)},n}(R),E={onCreateRule:function(e,t,n){return n.parent&&"keyframes"===n.parent.type?new V(e,t,n):null}},G=function(){function e(e,t,n){this.type="font-face",this.at="@font-face",this.isProcessed=!1,this.key=e,this.style=t,this.options=n}return e.prototype.toString=function(e){var t=d(e).linebreak;if(Array.isArray(this.style)){for(var n="",r=0;r<this.style.length;r++)n+=y(this.at,this.style[r]),this.style[r+1]&&(n+=t);return n}return y(this.at,this.style,e)},e}(),_=/@font-face/,U={onCreateRule:function(e,t,n){return _.test(e)?new G(e,t,n):null}},B=function(){function e(e,t,n){this.type="viewport",this.at="@viewport",this.isProcessed=!1,this.key=e,this.style=t,this.options=n}return e.prototype.toString=function(e){return y(this.key,this.style,e)},e}(),$={onCreateRule:function(e,t,n){return"@viewport"===e||"@-ms-viewport"===e?new B(e,t,n):null}},J=function(){function e(e,t,n){this.type="simple",this.isProcessed=!1,this.key=e,this.value=t,this.options=n}return e.prototype.toString=function(e){if(Array.isArray(this.value)){for(var t="",n=0;n<this.value.length;n++)t+=this.key+" "+this.value[n]+";",this.value[n+1]&&(t+="\n");return t}return this.key+" "+this.value+";"},e}(),z={"@charset":!0,"@import":!0,"@namespace":!0},D=[b,C,N,E,U,$,{onCreateRule:function(e,t,n){return e in z?new J(e,t,n):null}}],F={process:!0},L={force:!0,process:!0},W=function(){function e(e){this.map={},this.raw={},this.index=[],this.counter=0,this.options=e,this.classes=e.classes,this.keyframes=e.keyframes}var n=e.prototype;return n.add=function(e,n,r){var i=this.options,s=i.parent,a=i.sheet,u=i.jss,h=i.Renderer,l=i.generateId,c=i.scoped,f=t({classes:this.classes,parent:s,sheet:a,jss:u,Renderer:h,generateId:l,scoped:c,name:e,keyframes:this.keyframes,selector:void 0},r),d=e;e in this.raw&&(d=e+"-d"+this.counter++),this.raw[d]=n,d in this.classes&&(f.selector="."+m(this.classes[d]));var p=o(d,n,f);if(!p)return null;this.register(p);var y=void 0===f.index?this.index.length:f.index;return this.index.splice(y,0,p),p},n.get=function(e){return this.map[e]},n.remove=function(e){this.unregister(e),delete this.raw[e.key],this.index.splice(this.index.indexOf(e),1)},n.indexOf=function(e){return this.index.indexOf(e)},n.process=function(){var e=this.options.jss.plugins;this.index.slice(0).forEach(e.onProcessRule,e)},n.register=function(e){this.map[e.key]=e,e instanceof S?(this.map[e.selector]=e,e.id&&(this.classes[e.key]=e.id)):e instanceof A&&this.keyframes&&(this.keyframes[e.name]=e.id)},n.unregister=function(e){delete this.map[e.key],e instanceof S?(delete this.map[e.selector],delete this.classes[e.key]):e instanceof A&&delete this.keyframes[e.name]},n.update=function(){var e,t,n;if("string"==typeof(arguments.length<=0?void 0:arguments[0])?(e=arguments.length<=0?void 0:arguments[0],t=arguments.length<=1?void 0:arguments[1],n=arguments.length<=2?void 0:arguments[2]):(t=arguments.length<=0?void 0:arguments[0],n=arguments.length<=1?void 0:arguments[1],e=null),e)this.updateOne(this.map[e],t,n);else for(var r=0;r<this.index.length;r++)this.updateOne(this.index[r],t,n)},n.updateOne=function(t,n,r){void 0===r&&(r=F);var i=this.options,s=i.jss.plugins,o=i.sheet;if(t.rules instanceof e)t.rules.update(n,r);else{var a=t.style;if(s.onUpdate(n,t,o,r),r.process&&a&&a!==t.style){for(var u in s.onProcessStyle(t.style,t,o),t.style){var h=t.style[u];h!==a[u]&&t.prop(u,h,L)}for(var l in a){var c=t.style[l],f=a[l];null==c&&c!==f&&t.prop(l,null,L)}}}},n.toString=function(e){for(var t="",n=this.options.sheet,r=!!n&&n.options.link,i=d(e).linebreak,s=0;s<this.index.length;s++){var o=this.index[s].toString(e);(o||r)&&(t&&(t+=i),t+=o)}return t},e}(),H=function(){function e(e,n){for(var r in this.attached=!1,this.deployed=!1,this.classes={},this.keyframes={},this.options=t({},n,{sheet:this,parent:this,classes:this.classes,keyframes:this.keyframes}),n.Renderer&&(this.renderer=new n.Renderer(this)),this.rules=new W(this.options),e)this.rules.add(r,e[r]);this.rules.process()}var n=e.prototype;return n.attach=function(){return this.attached||(this.renderer&&this.renderer.attach(),this.attached=!0,this.deployed||this.deploy()),this},n.detach=function(){return this.attached?(this.renderer&&this.renderer.detach(),this.attached=!1,this):this},n.addRule=function(e,t,n){var r=this.queue;this.attached&&!r&&(this.queue=[]);var i=this.rules.add(e,t,n);return i?(this.options.jss.plugins.onProcessRule(i),this.attached?this.deployed?(r?r.push(i):(this.insertRule(i),this.queue&&(this.queue.forEach(this.insertRule,this),this.queue=void 0)),i):i:(this.deployed=!1,i)):null},n.insertRule=function(e){this.renderer&&this.renderer.insertRule(e)},n.addRules=function(e,t){var n=[];for(var r in e){var i=this.addRule(r,e[r],t);i&&n.push(i)}return n},n.getRule=function(e){return this.rules.get(e)},n.deleteRule=function(e){var t="object"==typeof e?e:this.rules.get(e);return!(!t||this.attached&&!t.renderable)&&(this.rules.remove(t),!(this.attached&&t.renderable&&this.renderer)||this.renderer.deleteRule(t.renderable))},n.indexOf=function(e){return this.rules.indexOf(e)},n.deploy=function(){return this.renderer&&this.renderer.deploy(),this.deployed=!0,this},n.update=function(){var e;return(e=this.rules).update.apply(e,arguments),this},n.updateOne=function(e,t,n){return this.rules.updateOne(e,t,n),this},n.toString=function(e){return this.rules.toString(e)},e}(),K=function(){function e(){this.plugins={internal:[],external:[]},this.registry={}}var t=e.prototype;return t.onCreateRule=function(e,t,n){for(var r=0;r<this.registry.onCreateRule.length;r++){var i=this.registry.onCreateRule[r](e,t,n);if(i)return i}return null},t.onProcessRule=function(e){if(!e.isProcessed){for(var t=e.options.sheet,n=0;n<this.registry.onProcessRule.length;n++)this.registry.onProcessRule[n](e,t);e.style&&this.onProcessStyle(e.style,e,t),e.isProcessed=!0}},t.onProcessStyle=function(e,t,n){for(var r=0;r<this.registry.onProcessStyle.length;r++)t.style=this.registry.onProcessStyle[r](t.style,t,n)},t.onProcessSheet=function(e){for(var t=0;t<this.registry.onProcessSheet.length;t++)this.registry.onProcessSheet[t](e)},t.onUpdate=function(e,t,n,r){for(var i=0;i<this.registry.onUpdate.length;i++)this.registry.onUpdate[i](e,t,n,r)},t.onChangeValue=function(e,t,n){for(var r=e,i=0;i<this.registry.onChangeValue.length;i++)r=this.registry.onChangeValue[i](r,t,n);return r},t.use=function(e,t){void 0===t&&(t={queue:"external"});var n=this.plugins[t.queue];-1===n.indexOf(e)&&(n.push(e),this.registry=[].concat(this.plugins.external,this.plugins.internal).reduce((function(e,t){for(var n in t)n in e&&e[n].push(t[n]);return e}),{onCreateRule:[],onProcessRule:[],onProcessStyle:[],onProcessSheet:[],onChangeValue:[],onUpdate:[]}))},e}();var Q=function(){function e(){this.registry=[]}var t=e.prototype;return t.add=function(e){var t=this.registry,n=e.options.index;if(-1===t.indexOf(e))if(0===t.length||n>=this.index)t.push(e);else for(var r=0;r<t.length;r++)if(t[r].options.index>n)return void t.splice(r,0,e)},t.reset=function(){this.registry=[]},t.remove=function(e){var t=this.registry.indexOf(e);this.registry.splice(t,1)},t.toString=function(e){for(var t=void 0===e?{}:e,n=t.attached,r=function(e,t){if(null==e)return{};var n,r,i={},s=Object.keys(e);for(r=0;r<s.length;r++)n=s[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(t,["attached"]),i=d(r).linebreak,s="",o=0;o<this.registry.length;o++){var a=this.registry[o];null!=n&&a.attached!==n||(s&&(s+=i),s+=a.toString(r))}return s},u(e,[{key:"index",get:function(){return 0===this.registry.length?0:this.registry[this.registry.length-1].options.index}}]),e}(),X=new Q,Y="undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window&&window.Math===Math?window:"undefined"!=typeof self&&self.Math===Math?self:Function("return this")(),Z="2f1acc6c3a606b082e5eef5e54414ffb";null==Y[Z]&&(Y[Z]=0);var ee=Y[Z]++,te=function(e){void 0===e&&(e={});var t=0;return function(n,r){t+=1;var i="",s="";return r&&(r.options.classNamePrefix&&(s=r.options.classNamePrefix),null!=r.options.jss.id&&(i=String(r.options.jss.id))),e.minify?""+(s||"c")+ee+i+t:s+n.key+"-"+ee+(i?"-"+i:"")+"-"+t}},ne=function(e){var t;return function(){return t||(t=e()),t}},re=function(e,t){try{return e.attributeStyleMap?e.attributeStyleMap.get(t):e.style.getPropertyValue(t)}catch(e){return""}},ie=function(e,t,n){try{var r=n;if(Array.isArray(n)&&(r=f(n,!0),"!important"===n[n.length-1]))return e.style.setProperty(t,r,"important"),!0;e.attributeStyleMap?e.attributeStyleMap.set(t,r):e.style.setProperty(t,r)}catch(e){return!1}return!0},se=function(e,t){try{e.attributeStyleMap?e.attributeStyleMap.delete(t):e.style.removeProperty(t)}catch(e){}},oe=function(e,t){return e.selectorText=t,e.selectorText===t},ae=ne((function(){return document.querySelector("head")}));function ue(e){var t=X.registry;if(t.length>0){var n=function(e,t){for(var n=0;n<e.length;n++){var r=e[n];if(r.attached&&r.options.index>t.index&&r.options.insertionPoint===t.insertionPoint)return r}return null}(t,e);if(n&&n.renderer)return{parent:n.renderer.element.parentNode,node:n.renderer.element};if((n=function(e,t){for(var n=e.length-1;n>=0;n--){var r=e[n];if(r.attached&&r.options.insertionPoint===t.insertionPoint)return r}return null}(t,e))&&n.renderer)return{parent:n.renderer.element.parentNode,node:n.renderer.element.nextSibling}}var r=e.insertionPoint;if(r&&"string"==typeof r){var i=function(e){for(var t=ae(),n=0;n<t.childNodes.length;n++){var r=t.childNodes[n];if(8===r.nodeType&&r.nodeValue.trim()===e)return r}return null}(r);if(i)return{parent:i.parentNode,node:i.nextSibling}}return!1}var he=ne((function(){var e=document.querySelector('meta[property="csp-nonce"]');return e?e.getAttribute("content"):null})),le=function(e,t,n){try{"insertRule"in e?e.insertRule(t,n):"appendRule"in e&&e.appendRule(t)}catch(e){return!1}return e.cssRules[n]},ce=function(e,t){var n=e.cssRules.length;return void 0===t||t>n?n:t},fe=function(){function e(e){this.getPropertyValue=re,this.setProperty=ie,this.removeProperty=se,this.setSelector=oe,this.hasInsertedRules=!1,this.cssRules=[],e&&X.add(e),this.sheet=e;var t,n=this.sheet?this.sheet.options:{},r=n.media,i=n.meta,s=n.element;this.element=s||((t=document.createElement("style")).textContent="\n",t),this.element.setAttribute("data-jss",""),r&&this.element.setAttribute("media",r),i&&this.element.setAttribute("data-meta",i);var o=he();o&&this.element.setAttribute("nonce",o)}var t=e.prototype;return t.attach=function(){if(!this.element.parentNode&&this.sheet){!function(e,t){var n=t.insertionPoint,r=ue(t);if(!1!==r&&r.parent)r.parent.insertBefore(e,r.node);else if(n&&"number"==typeof n.nodeType){var i=n,s=i.parentNode;s&&s.insertBefore(e,i.nextSibling)}else ae().appendChild(e)}(this.element,this.sheet.options);var e=Boolean(this.sheet&&this.sheet.deployed);this.hasInsertedRules&&e&&(this.hasInsertedRules=!1,this.deploy())}},t.detach=function(){if(this.sheet){var e=this.element.parentNode;e&&e.removeChild(this.element),this.sheet.options.link&&(this.cssRules=[],this.element.textContent="\n")}},t.deploy=function(){var e=this.sheet;e&&(e.options.link?this.insertRules(e.rules):this.element.textContent="\n"+e.toString()+"\n")},t.insertRules=function(e,t){for(var n=0;n<e.index.length;n++)this.insertRule(e.index[n],n,t)},t.insertRule=function(e,t,n){if(void 0===n&&(n=this.element.sheet),e.rules){var r=e,i=n;if("conditional"===e.type||"keyframes"===e.type){var s=ce(n,t);if(!1===(i=le(n,r.toString({children:!1}),s)))return!1;this.refCssRule(e,s,i)}return this.insertRules(r.rules,i),i}var o=e.toString();if(!o)return!1;var a=ce(n,t),u=le(n,o,a);return!1!==u&&(this.hasInsertedRules=!0,this.refCssRule(e,a,u),u)},t.refCssRule=function(e,t,n){e.renderable=n,e.options.parent instanceof H&&(this.cssRules[t]=n)},t.deleteRule=function(e){var t=this.element.sheet,n=this.indexOf(e);return-1!==n&&(t.deleteRule(n),this.cssRules.splice(n,1),!0)},t.indexOf=function(e){return this.cssRules.indexOf(e)},t.replaceRule=function(e,t){var n=this.indexOf(e);return-1!==n&&(this.element.sheet.deleteRule(n),this.cssRules.splice(n,1),this.insertRule(t,n))},t.getRules=function(){return this.element.sheet.cssRules},e}(),de=0,pe=function(){function e(e){this.id=de++,this.version="10.8.0",this.plugins=new K,this.options={id:{minify:!1},createGenerateId:te,Renderer:r?fe:null,plugins:[]},this.generateId=te({minify:!1});for(var t=0;t<D.length;t++)this.plugins.use(D[t],{queue:"internal"});this.setup(e)}var n=e.prototype;return n.setup=function(e){return void 0===e&&(e={}),e.createGenerateId&&(this.options.createGenerateId=e.createGenerateId),e.id&&(this.options.id=t({},this.options.id,e.id)),(e.createGenerateId||e.id)&&(this.generateId=this.options.createGenerateId(this.options.id)),null!=e.insertionPoint&&(this.options.insertionPoint=e.insertionPoint),"Renderer"in e&&(this.options.Renderer=e.Renderer),e.plugins&&this.use.apply(this,e.plugins),this},n.createStyleSheet=function(e,n){void 0===n&&(n={});var r=n.index;"number"!=typeof r&&(r=0===X.index?0:X.index+1);var i=new H(e,t({},n,{jss:this,generateId:n.generateId||this.generateId,insertionPoint:this.options.insertionPoint,Renderer:this.options.Renderer,index:r}));return this.plugins.onProcessSheet(i),i},n.removeStyleSheet=function(e){return e.detach(),X.remove(e),this},n.createRule=function(e,n,r){if(void 0===n&&(n={}),void 0===r&&(r={}),"object"==typeof e)return this.createRule(void 0,e,n);var i=t({},r,{name:e,jss:this,Renderer:this.options.Renderer});i.generateId||(i.generateId=this.generateId),i.classes||(i.classes={}),i.keyframes||(i.keyframes={});var s=o(e,n,i);return s&&this.plugins.onProcessRule(s),s},n.use=function(){for(var e=this,t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return n.forEach((function(t){e.plugins.use(t)})),this},e}(),ye=function(e){return new pe(e)},ve=function(){function e(){this.length=0,this.sheets=new WeakMap}var t=e.prototype;return t.get=function(e){var t=this.sheets.get(e);return t&&t.sheet},t.add=function(e,t){this.sheets.has(e)||(this.length++,this.sheets.set(e,{sheet:t,refs:0}))},t.manage=function(e){var t=this.sheets.get(e);if(t)return 0===t.refs&&t.sheet.attach(),t.refs++,t.sheet},t.unmanage=function(e){var t=this.sheets.get(e);t&&t.refs>0&&(t.refs--,0===t.refs&&t.sheet.detach())},u(e,[{key:"size",get:function(){return this.length}}]),e}(),ge="object"==typeof CSS&&null!=CSS&&"number"in CSS;
/**

@@ -8,2 +8,3 @@ * A better abstraction over CSS.

* @license MIT
*/e.RuleList=L,e.SheetsManager=pe,e.SheetsRegistry=K,e.create=ve,e.createGenerateId=ee,e.createRule=o,e.default=ge,e.getDynamicStyles=function e(t){var n=null;for(var r in t){var i=t[r],s=typeof i;if("function"===s)n||(n={}),n[r]=i;else if("object"===s&&null!==i&&!Array.isArray(i)){var o=e(i);o&&(n||(n={}),n[r]=o)}}return n},e.hasCSSTOMSupport=ye,e.sheets=Q,e.toCssValue=c,Object.defineProperty(e,"__esModule",{value:!0})}));
*/
var me=ye();e.RuleList=W,e.SheetsManager=ve,e.SheetsRegistry=Q,e.create=ye,e.createGenerateId=te,e.createRule=o,e.default=me,e.getDynamicStyles=function e(t){var n=null;for(var r in t){var i=t[r],s=typeof i;if("function"===s)n||(n={}),n[r]=i;else if("object"===s&&null!==i&&!Array.isArray(i)){var o=e(i);o&&(n||(n={}),n[r]=o)}}return n},e.hasCSSTOMSupport=ge,e.sheets=X,e.toCssValue=f,Object.defineProperty(e,"__esModule",{value:!0})}));

4

package.json
{
"name": "jss",
"description": "A lib for generating Style Sheets with JavaScript.",
"version": "10.7.1",
"version": "10.8.0",
"license": "MIT",

@@ -50,3 +50,3 @@ "homepage": "https://cssinjs.org/",

},
"gitHead": "2b54776c03d97a3bccbbcb28b63508f74103ebbc"
"gitHead": "d2e1aea99b2a8a9c2d8725df1dfcd222d2504a7a"
}

2

readme.md

@@ -11,3 +11,3 @@ # jss

See our website [jss](https://cssinjs.org/setup?v=v10.7.1) for more information.
See our website [jss](https://cssinjs.org/setup?v=v10.8.0) for more information.

@@ -14,0 +14,0 @@ ## Install

140

src/DomRenderer.js

@@ -1,2 +0,1 @@

// @flow
import warning from 'tiny-warning'

@@ -6,25 +5,7 @@ import StyleSheet from './StyleSheet'

import toCssValue from './utils/toCssValue'
import type {
CSSStyleRule,
CSSMediaRule,
CSSKeyframesRule,
CSSKeyframeRule,
HTMLElementWithStyleMap,
AnyCSSRule,
Rule,
RuleList,
ContainerRule,
JssValue,
InsertionPoint
} from './types'
type PriorityOptions = {
index: number,
insertionPoint?: InsertionPoint
}
/**
* Cache the value from the first time a function is called.
*/
const memoize = <Value>(fn: () => Value): (() => Value) => {
const memoize = (fn) => {
let value

@@ -37,8 +18,6 @@ return () => {

type GetPropertyValue = (HTMLElementWithStyleMap | CSSStyleRule | CSSKeyframeRule, string) => string
/**
* Get a style property value.
*/
const getPropertyValue: GetPropertyValue = (cssRule, prop) => {
const getPropertyValue = (cssRule, prop) => {
try {

@@ -56,14 +35,8 @@ // Support CSSTOM.

type SetProperty = (
HTMLElementWithStyleMap | CSSStyleRule | CSSKeyframeRule,
string,
JssValue
) => boolean
/**
* Set a style property.
*/
const setProperty: SetProperty = (cssRule, prop, value) => {
const setProperty = (cssRule, prop, value) => {
try {
let cssValue = ((value: any): string)
let cssValue = value

@@ -92,8 +65,6 @@ if (Array.isArray(value)) {

type RemoveProperty = (HTMLElementWithStyleMap | CSSStyleRule | CSSKeyframeRule, string) => void
/**
* Remove a style property.
*/
const removeProperty: RemoveProperty = (cssRule, prop) => {
const removeProperty = (cssRule, prop) => {
try {

@@ -114,8 +85,6 @@ // Support CSSTOM.

type SetSelector = (CSSStyleRule, string) => boolean
/**
* Set the selector.
*/
const setSelector: SetSelector = (cssRule, selectorText) => {
const setSelector = (cssRule, selectorText) => {
cssRule.selectorText = selectorText

@@ -132,3 +101,3 @@

*/
const getHead = memoize((): HTMLElement => (document.querySelector('head'): any))
const getHead = memoize(() => document.querySelector('head'))

@@ -138,3 +107,3 @@ /**

*/
function findHigherSheet(registry: Array<StyleSheet>, options: PriorityOptions): StyleSheet | null {
function findHigherSheet(registry, options) {
for (let i = 0; i < registry.length; i++) {

@@ -156,6 +125,3 @@ const sheet = registry[i]

*/
function findHighestSheet(
registry: Array<StyleSheet>,
options: PriorityOptions
): StyleSheet | null {
function findHighestSheet(registry, options) {
for (let i = registry.length - 1; i >= 0; i--) {

@@ -173,3 +139,3 @@ const sheet = registry[i]

*/
function findCommentNode(text: string): Node | null {
function findCommentNode(text) {
const head = getHead()

@@ -185,11 +151,6 @@ for (let i = 0; i < head.childNodes.length; i++) {

type PrevNode = {
parent: ?Node,
node: ?Node
}
/**
* Find a node before which we can insert the sheet.
*/
function findPrevNode(options: PriorityOptions): PrevNode | false {
function findPrevNode(options) {
const {registry} = sheets

@@ -239,3 +200,3 @@

*/
function insertStyle(style: HTMLElement, options: PriorityOptions) {
function insertStyle(style, options) {
const {insertionPoint} = options

@@ -252,4 +213,3 @@ const nextNode = findPrevNode(options)

if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
// https://stackoverflow.com/questions/41328728/force-casting-in-flow
const insertionPointElement: HTMLElement = (insertionPoint: any)
const insertionPointElement = insertionPoint
const {parentNode} = insertionPointElement

@@ -267,23 +227,15 @@ if (parentNode) parentNode.insertBefore(style, insertionPointElement.nextSibling)

*/
const getNonce = memoize(
(): ?string => {
const node = document.querySelector('meta[property="csp-nonce"]')
return node ? node.getAttribute('content') : null
}
)
const getNonce = memoize(() => {
const node = document.querySelector('meta[property="csp-nonce"]')
return node ? node.getAttribute('content') : null
})
const insertRule = (
container: CSSStyleSheet | CSSMediaRule | CSSKeyframesRule,
rule: string,
index: number
): false | any => {
const insertRule = (container, rule, index) => {
try {
if ('insertRule' in container) {
const c = ((container: any): CSSStyleSheet)
c.insertRule(rule, index)
container.insertRule(rule, index)
}
// Keyframes rule.
else if ('appendRule' in container) {
const c = ((container: any): CSSKeyframesRule)
c.appendRule(rule)
container.appendRule(rule)
}

@@ -297,6 +249,3 @@ } catch (err) {

const getValidRuleInsertionIndex = (
container: CSSStyleSheet | CSSMediaRule | CSSKeyframesRule,
index?: number
): number => {
const getValidRuleInsertionIndex = (container, index) => {
const maxIndex = container.cssRules.length

@@ -311,3 +260,3 @@ // In case previous insertion fails, passed index might be wrong

const createStyle = (): HTMLElement => {
const createStyle = () => {
const el = document.createElement('style')

@@ -322,22 +271,17 @@ // Without it, IE will have a broken source order specificity if we

export default class DomRenderer {
getPropertyValue: GetPropertyValue = getPropertyValue
getPropertyValue = getPropertyValue
setProperty: SetProperty = setProperty
setProperty = setProperty
removeProperty: RemoveProperty = removeProperty
removeProperty = removeProperty
setSelector: SetSelector = setSelector
setSelector = setSelector
// HTMLStyleElement needs fixing https://github.com/facebook/flow/issues/2696
element: any
hasInsertedRules = false
sheet: StyleSheet | void
hasInsertedRules: boolean = false
// Will be empty if link: true option is not set, because
// it is only for use together with insertRule API.
cssRules: AnyCSSRule[] = []
cssRules = []
constructor(sheet?: StyleSheet) {
constructor(sheet) {
// There is no sheet when the renderer is used from a standalone StyleRule.

@@ -359,3 +303,3 @@ if (sheet) sheets.add(sheet)

*/
attach(): void {
attach() {
// In the case the element node is external and it is already in the DOM.

@@ -378,3 +322,3 @@ if (this.element.parentNode || !this.sheet) return

*/
detach(): void {
detach() {
if (!this.sheet) return

@@ -394,3 +338,3 @@ const {parentNode} = this.element

*/
deploy(): void {
deploy() {
const {sheet} = this

@@ -409,3 +353,3 @@ if (!sheet) return

insertRules(rules: RuleList, nativeParent?: CSSStyleSheet | CSSMediaRule | CSSKeyframesRule) {
insertRules(rules, nativeParent) {
for (let i = 0; i < rules.index.length; i++) {

@@ -419,9 +363,5 @@ this.insertRule(rules.index[i], i, nativeParent)

*/
insertRule(
rule: Rule,
index?: number,
nativeParent?: CSSStyleSheet | CSSMediaRule | CSSKeyframesRule = this.element.sheet
): false | CSSStyleSheet | AnyCSSRule {
insertRule(rule, index, nativeParent = this.element.sheet) {
if (rule.rules) {
const parent: ContainerRule = (rule: any)
const parent = rule
let latestNativeParent = nativeParent

@@ -461,3 +401,3 @@ if (rule.type === 'conditional' || rule.type === 'keyframes') {

refCssRule(rule: Rule, index: number, cssRule: any) {
refCssRule(rule, index, cssRule) {
rule.renderable = cssRule

@@ -474,3 +414,3 @@ // We only want to reference the top level rules, deleteRule API doesn't support removing nested rules

*/
deleteRule(cssRule: AnyCSSRule): boolean {
deleteRule(cssRule) {
const {sheet} = this.element

@@ -487,3 +427,3 @@ const index = this.indexOf(cssRule)

*/
indexOf(cssRule: AnyCSSRule): number {
indexOf(cssRule) {
return this.cssRules.indexOf(cssRule)

@@ -497,3 +437,3 @@ }

*/
replaceRule(cssRule: AnyCSSRule, rule: Rule): false | CSSStyleSheet | AnyCSSRule {
replaceRule(cssRule, rule) {
const index = this.indexOf(cssRule)

@@ -509,5 +449,5 @@ if (index === -1) return false

*/
getRules(): CSSRuleList {
getRules() {
return this.element.sheet.cssRules
}
}

9

src/index.d.ts

@@ -9,8 +9,8 @@ import {Properties as CSSProperties} from 'csstype'

export interface MinimalObservable<T> {
subscribe(
nextOrObserver: ((value: T) => void) | {next: (value: T) => void}
): {unsubscribe: () => void}
subscribe(nextOrObserver: ((value: T) => void) | {next: (value: T) => void}): {
unsubscribe: () => void
}
}
type Func<P, T, R> = T extends undefined ? ((data: P) => R) : ((data: P & {theme: T}) => R)
type Func<P, T, R> = T extends undefined ? (data: P) => R : (data: P & {theme: T}) => R

@@ -75,2 +75,3 @@ type NormalCssProperties = CSSProperties<string | number>

indent?: number
format?: boolean
allowEmpty?: boolean

@@ -77,0 +78,0 @@ }

100

src/index.js

@@ -1,2 +0,1 @@

// @flow
/**

@@ -9,100 +8,15 @@ * A better abstraction over CSS.

*/
import Jss from './Jss'
import type StyleSheet from './StyleSheet'
import type {
ConditionalRule,
KeyframesRule,
StyleRule,
ViewportRule,
SimpleRule,
FontFaceRule
} from './plugins'
import type {JssOptions} from './types'
/**
* Export types for better typing inside plugins and integrations.
*/
export type {
StyleSheetFactoryOptions,
JssValue,
JssOptions,
JssStyle,
Plugin,
RuleListOptions,
Rule,
Renderer,
RuleOptions,
UpdateOptions,
Classes,
BaseRule,
ContainerRule
} from './types'
export type {GenerateId, CreateGenerateId, CreateGenerateIdOptions} from './utils/createGenerateId'
import create from './utils/createJss'
export type {
Jss,
StyleSheet,
ConditionalRule,
KeyframesRule,
StyleRule,
ViewportRule,
SimpleRule,
FontFaceRule
}
/**
* Export a constant indicating if this browser has CSSTOM support.
* https://developers.google.com/web/updates/2018/03/cssom
*/
export const hasCSSTOMSupport: boolean = typeof CSS === 'object' && CSS != null && 'number' in CSS
/**
* Extracts a styles object with only rules that contain function values.
*/
export {default as getDynamicStyles} from './utils/getDynamicStyles'
/**
* Converts JSS array value to a CSS string.
*/
export {default as toCssValue} from './utils/toCssValue'
/**
* Create a rule instance.
*/
export {default as createRule} from './utils/createRule'
/**
* SheetsRegistry for SSR.
*/
export {default as SheetsRegistry} from './SheetsRegistry'
/**
* SheetsManager for react-jss and co.
*/
export {default as SheetsManager} from './SheetsManager'
/**
* RuleList for plugins.
*/
export {default as RuleList} from './RuleList'
/**
* Default global SheetsRegistry instance.
*/
export {default as sheets} from './sheets'
/**
* Class name generator creator.
*/
export {default as hasCSSTOMSupport} from './utils/hasCSSTOMSupport'
export {default as getDynamicStyles} from './utils/getDynamicStyles'
export {default as toCssValue} from './utils/toCssValue'
export {default as createRule} from './utils/createRule'
export {default as createGenerateId} from './utils/createGenerateId'
/**
* Creates a new instance of Jss.
*/
export const create = (options?: JssOptions): Jss => new Jss(options)
/**
* A global Jss instance.
*/
const jss: Jss = create()
export default jss
export {create}
export default create()

40

src/Jss.js

@@ -1,2 +0,1 @@

// @flow
import isInBrowser from 'is-in-browser'

@@ -10,13 +9,2 @@ import StyleSheet from './StyleSheet'

import DomRenderer from './DomRenderer'
import type {
Rule,
RuleFactoryOptions,
RuleOptions,
StyleSheetFactoryOptions,
Plugin,
JssOptions,
InternalJssOptions,
JssStyle
} from './types'
import type {GenerateId} from './utils/createGenerateId'

@@ -26,9 +14,9 @@ let instanceCounter = 0

export default class Jss {
id: number = instanceCounter++
id = instanceCounter++
version: string | void = process.env.VERSION
version = process.env.VERSION
plugins: PluginsRegistry = new PluginsRegistry()
plugins = new PluginsRegistry()
options: InternalJssOptions = {
options = {
id: {minify: false},

@@ -40,5 +28,5 @@ createGenerateId: createGenerateIdDefault,

generateId: GenerateId = createGenerateIdDefault({minify: false})
generateId = createGenerateIdDefault({minify: false})
constructor(options?: JssOptions) {
constructor(options) {
for (let i = 0; i < internalPlugins.length; i++) {

@@ -55,3 +43,3 @@ this.plugins.use(internalPlugins[i], {queue: 'internal'})

*/
setup(options?: JssOptions = {}): this {
setup(options = {}) {
if (options.createGenerateId) {

@@ -86,3 +74,3 @@ this.options.createGenerateId = options.createGenerateId

*/
createStyleSheet(styles: Object, options: StyleSheetFactoryOptions = ({}: any)): StyleSheet {
createStyleSheet(styles, options = {}) {
let {index} = options

@@ -108,3 +96,3 @@ if (typeof index !== 'number') {

*/
removeStyleSheet(sheet: StyleSheet): this {
removeStyleSheet(sheet) {
sheet.detach()

@@ -119,11 +107,9 @@ sheets.remove(sheet)

*/
createRule(name: string, style?: JssStyle = {}, options?: RuleFactoryOptions = {}): Rule | null {
createRule(name, style = {}, options = {}) {
// Enable rule without name for inline styles.
if (typeof name === 'object') {
// $FlowFixMe[incompatible-call]
return this.createRule(undefined, name, style)
}
// $FlowFixMe[incompatible-type]
const ruleOptions: RuleOptions = {...options, name, jss: this, Renderer: this.options.Renderer}
const ruleOptions = {...options, name, jss: this, Renderer: this.options.Renderer}

@@ -144,4 +130,4 @@ if (!ruleOptions.generateId) ruleOptions.generateId = this.generateId

*/
use(...plugins: Array<Plugin>): this {
plugins.forEach(plugin => {
use(...plugins) {
plugins.forEach((plugin) => {
this.plugins.use(plugin)

@@ -148,0 +134,0 @@ })

36

src/plugins/conditionalRule.js

@@ -1,4 +0,3 @@

// @flow
import RuleList from '../RuleList'
import type {CSSMediaRule, Rule, RuleOptions, ToCssOptions, JssStyle, ContainerRule} from '../types'
import getWhitespaceSymbols from '../utils/getWhitespaceSymbols'

@@ -15,20 +14,8 @@ const defaultToStringOptions = {

*/
export class ConditionalRule implements ContainerRule {
type: string = 'conditional'
export class ConditionalRule {
type = 'conditional'
at: string
isProcessed = false
key: string
query: string
rules: RuleList
options: RuleOptions
isProcessed: boolean = false
renderable: ?CSSMediaRule
constructor(key: string, styles: Object, options: RuleOptions) {
constructor(key, styles, options) {
this.key = key

@@ -52,3 +39,3 @@ const atMatch = key.match(atRegExp)

*/
getRule(name: string): Rule {
getRule(name) {
return this.rules.get(name)

@@ -60,3 +47,3 @@ }

*/
indexOf(rule: Rule): number {
indexOf(rule) {
return this.rules.indexOf(rule)

@@ -68,3 +55,3 @@ }

*/
addRule(name: string, style: JssStyle, options?: RuleOptions): Rule | null {
addRule(name, style, options) {
const rule = this.rules.add(name, style, options)

@@ -79,3 +66,4 @@ if (!rule) return null

*/
toString(options?: ToCssOptions = defaultToStringOptions): string {
toString(options = defaultToStringOptions) {
const {linebreak} = getWhitespaceSymbols(options)
if (options.indent == null) options.indent = defaultToStringOptions.indent

@@ -87,3 +75,3 @@ if (options.children == null) options.children = defaultToStringOptions.children

const children = this.rules.toString(options)
return children ? `${this.query} {\n${children}\n}` : ''
return children ? `${this.query} {${linebreak}${children}${linebreak}}` : ''
}

@@ -95,5 +83,5 @@ }

export default {
onCreateRule(key: string, styles: JssStyle, options: RuleOptions): ConditionalRule | null {
onCreateRule(key, styles, options) {
return keyRegExp.test(key) ? new ConditionalRule(key, styles, options) : null
}
}

28

src/plugins/fontFaceRule.js

@@ -1,21 +0,12 @@

// @flow
import toCss from '../utils/toCss'
import type {CSSFontFaceRule, RuleOptions, JssStyle, ToCssOptions, BaseRule} from '../types'
import getWhitespaceSymbols from '../utils/getWhitespaceSymbols'
export class FontFaceRule implements BaseRule {
type: string = 'font-face'
export class FontFaceRule {
type = 'font-face'
at: string = '@font-face'
at = '@font-face'
key: string
isProcessed = false
style: JssStyle
options: RuleOptions
isProcessed: boolean = false
renderable: ?CSSFontFaceRule
constructor(key: string, style: JssStyle, options: RuleOptions) {
constructor(key, style, options) {
this.key = key

@@ -29,3 +20,4 @@ this.style = style

*/
toString(options?: ToCssOptions): string {
toString(options) {
const {linebreak} = getWhitespaceSymbols(options)
if (Array.isArray(this.style)) {

@@ -35,3 +27,3 @@ let str = ''

str += toCss(this.at, this.style[index])
if (this.style[index + 1]) str += '\n'
if (this.style[index + 1]) str += linebreak
}

@@ -48,5 +40,5 @@ return str

export default {
onCreateRule(key: string, style: JssStyle, options: RuleOptions): FontFaceRule | null {
onCreateRule(key, style, options) {
return keyRegExp.test(key) ? new FontFaceRule(key, style, options) : null
}
}

1

src/plugins/index.js

@@ -1,2 +0,1 @@

// @flow
import pluginStyleRule, {StyleRule} from './styleRule'

@@ -3,0 +2,0 @@ import pluginConditionalRule, {ConditionalRule} from './conditionalRule'

8

src/plugins/keyframeRule.js

@@ -1,13 +0,9 @@

// @flow
import toCss from '../utils/toCss'
import type {JssStyle, RuleOptions, ToCssOptions, CSSKeyframeRule} from '../types'
import {BaseStyleRule} from './styleRule'
export class KeyframeRule extends BaseStyleRule {
renderable: ?CSSKeyframeRule
/**
* Generates a CSS string.
*/
toString(options?: ToCssOptions): string {
toString(options) {
const {sheet} = this.options

@@ -21,3 +17,3 @@ const link = sheet ? sheet.options.link : false

export default {
onCreateRule(key: string, style: JssStyle, options: RuleOptions): KeyframeRule | null {
onCreateRule(key, style, options) {
if (options.parent && options.parent.type === 'keyframes') {

@@ -24,0 +20,0 @@ return new KeyframeRule(key, style, options)

44

src/plugins/keyframesRule.js

@@ -1,14 +0,5 @@

// @flow
import warning from 'tiny-warning'
import RuleList from '../RuleList'
import type {
CSSKeyframesRule,
JssStyle,
RuleOptions,
ToCssOptions,
ContainerRule,
KeyframesMap,
Plugin
} from '../types'
import escape from '../utils/escape'
import getWhitespaceSymbols from '../utils/getWhitespaceSymbols'

@@ -25,22 +16,10 @@ const defaultToStringOptions = {

*/
export class KeyframesRule implements ContainerRule {
type: string = 'keyframes'
export class KeyframesRule {
type = 'keyframes'
at: string = '@keyframes'
at = '@keyframes'
key: string
isProcessed = false
name: string
id: string
rules: RuleList
options: RuleOptions
isProcessed: boolean = false
renderable: ?CSSKeyframesRule
constructor(key: string, frames: Object, options: RuleOptions) {
constructor(key, frames, options) {
const nameMatch = key.match(nameRegExp)

@@ -72,3 +51,4 @@ if (nameMatch && nameMatch[1]) {

*/
toString(options?: ToCssOptions = defaultToStringOptions): string {
toString(options = defaultToStringOptions) {
const {linebreak} = getWhitespaceSymbols(options)
if (options.indent == null) options.indent = defaultToStringOptions.indent

@@ -80,3 +60,3 @@ if (options.children == null) options.children = defaultToStringOptions.children

let children = this.rules.toString(options)
if (children) children = `\n${children}\n`
if (children) children = `${linebreak}${children}${linebreak}`
return `${this.at} ${this.id} {${children}}`

@@ -109,3 +89,3 @@ }

*/
const replaceRef = (style: JssStyle, prop: string, keyframes: KeyframesMap) => {
const replaceRef = (style, prop, keyframes) => {
const value = style[prop]

@@ -119,3 +99,3 @@ const refKeyframe = findReferencedKeyframe(value, keyframes)

const plugin: Plugin = {
export default {
onCreateRule(key, frames, options) {

@@ -153,3 +133,1 @@ return typeof key === 'string' && keyRegExp.test(key)

}
export default plugin

31

src/plugins/simpleRule.js

@@ -1,26 +0,7 @@

// @flow
import type {
CSSCharsetRule,
CSSImportRule,
CSSNamespaceRule,
RuleOptions,
JssStyle,
ToCssOptions,
BaseRule
} from '../types'
export class SimpleRule {
type = 'simple'
export class SimpleRule implements BaseRule {
type: string = 'simple'
isProcessed = false
key: string
value: string | Array<string>
options: RuleOptions
isProcessed: boolean = false
renderable: ?CSSCharsetRule | CSSImportRule | CSSNamespaceRule
constructor(key: string, value: string, options: RuleOptions) {
constructor(key, value, options) {
this.key = key

@@ -35,3 +16,3 @@ this.value = value

// eslint-disable-next-line no-unused-vars
toString(options?: ToCssOptions): string {
toString(options) {
if (Array.isArray(this.value)) {

@@ -57,5 +38,5 @@ let str = ''

export default {
onCreateRule(key: string, value: JssStyle, options: RuleOptions): SimpleRule | null {
onCreateRule(key, value, options) {
return key in keysMap ? new SimpleRule(key, value, options) : null
}
}

56

src/plugins/styleRule.js

@@ -1,2 +0,1 @@

// @flow
import warning from 'tiny-warning'

@@ -6,30 +5,9 @@ import toCss from '../utils/toCss'

import escape from '../utils/escape'
import type {
CSSStyleRule,
HTMLElementWithStyleMap,
ToCssOptions,
RuleOptions,
UpdateOptions,
Renderer as RendererInterface,
JssStyle,
JssValue,
BaseRule
} from '../types'
export class BaseStyleRule implements BaseRule {
type: string = 'style'
export class BaseStyleRule {
type = 'style'
key: string
isProcessed = false
isProcessed: boolean = false
style: JssStyle
renderer: RendererInterface | null
renderable: ?Object
options: RuleOptions
constructor(key: string, style: JssStyle, options: RuleOptions) {
constructor(key, style, options) {
const {sheet, Renderer} = options

@@ -46,3 +24,3 @@ this.key = key

*/
prop(name: string, value?: JssValue, options?: UpdateOptions): this | string {
prop(name, value, options) {
// It's a getter.

@@ -88,9 +66,3 @@ if (value === undefined) return this.style[name]

export class StyleRule extends BaseStyleRule {
selectorText: string
id: ?string
renderable: ?CSSStyleRule
constructor(key: string, style: JssStyle, options: RuleOptions) {
constructor(key, style, options) {
super(key, style, options)

@@ -111,3 +83,3 @@ const {selector, scoped, sheet, generateId} = options

*/
set selector(selector: string): void {
set selector(selector) {
if (selector === this.selectorText) return

@@ -132,3 +104,3 @@

*/
get selector(): string {
get selector() {
return this.selectorText

@@ -140,3 +112,3 @@ }

*/
applyTo(renderable: HTMLElementWithStyleMap): this {
applyTo(renderable) {
const {renderer} = this

@@ -157,3 +129,3 @@ if (renderer) {

*/
toJSON(): Object {
toJSON() {
const json = {}

@@ -171,3 +143,3 @@ for (const prop in this.style) {

*/
toString(options?: ToCssOptions): string {
toString(options) {
const {sheet} = this.options

@@ -181,8 +153,8 @@ const link = sheet ? sheet.options.link : false

export default {
onCreateRule(name: string, style: JssStyle, options: RuleOptions): StyleRule | null {
if (name[0] === '@' || (options.parent && options.parent.type === 'keyframes')) {
onCreateRule(key, style, options) {
if (key[0] === '@' || (options.parent && options.parent.type === 'keyframes')) {
return null
}
return new StyleRule(name, style, options)
return new StyleRule(key, style, options)
}
}

24

src/plugins/viewportRule.js

@@ -1,21 +0,11 @@

// @flow
import toCss from '../utils/toCss'
import type {CSSViewportRule, RuleOptions, JssStyle, ToCssOptions, BaseRule} from '../types'
export class ViewportRule implements BaseRule {
type: string = 'viewport'
export class ViewportRule {
type = 'viewport'
at: string = '@viewport'
at = '@viewport'
key: string
isProcessed = false
style: JssStyle
options: RuleOptions
isProcessed: boolean = false
renderable: ?CSSViewportRule
constructor(key: string, style: JssStyle, options: RuleOptions) {
constructor(key, style, options) {
this.key = key

@@ -29,3 +19,3 @@ this.style = style

*/
toString(options?: ToCssOptions): string {
toString(options) {
return toCss(this.key, this.style, options)

@@ -36,3 +26,3 @@ }

export default {
onCreateRule(key: string, style: JssStyle, options: RuleOptions): ViewportRule | null {
onCreateRule(key, style, options) {
return key === '@viewport' || key === '@-ms-viewport'

@@ -39,0 +29,0 @@ ? new ViewportRule(key, style, options)

50

src/PluginsRegistry.js

@@ -1,34 +0,5 @@

// @flow
import warning from 'tiny-warning'
import type StyleSheet from './StyleSheet'
import type {
Plugin,
Rule,
RuleOptions,
UpdateOptions,
JssStyle,
JssValue,
OnCreateRule,
OnProcessRule,
OnProcessStyle,
OnProcessSheet,
OnChangeValue,
OnUpdate
} from './types'
import type {StyleRule, BaseStyleRule} from './plugins/styleRule'
type Registry = {
onCreateRule: Array<OnCreateRule>,
onProcessRule: Array<OnProcessRule>,
onProcessStyle: Array<OnProcessStyle>,
onProcessSheet: Array<OnProcessSheet>,
onChangeValue: Array<OnChangeValue>,
onUpdate: Array<OnUpdate>
}
export default class PluginsRegistry {
plugins: {
internal: Array<Plugin>,
external: Array<Plugin>
} = {
plugins = {
internal: [],

@@ -38,3 +9,3 @@ external: []

registry: Registry
registry = {}

@@ -44,3 +15,3 @@ /**

*/
onCreateRule(name: string, decl: JssStyle, options: RuleOptions): Rule | null {
onCreateRule(name, decl, options) {
for (let i = 0; i < this.registry.onCreateRule.length; i++) {

@@ -57,3 +28,3 @@ const rule = this.registry.onCreateRule[i](name, decl, options)

*/
onProcessRule(rule: Rule): void {
onProcessRule(rule) {
if (rule.isProcessed) return

@@ -73,5 +44,4 @@ const {sheet} = rule.options

*/
onProcessStyle(style: JssStyle, rule: Rule, sheet?: StyleSheet): void {
onProcessStyle(style, rule, sheet) {
for (let i = 0; i < this.registry.onProcessStyle.length; i++) {
// $FlowFixMe[prop-missing]
rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet)

@@ -84,3 +54,3 @@ }

*/
onProcessSheet(sheet: StyleSheet): void {
onProcessSheet(sheet) {
for (let i = 0; i < this.registry.onProcessSheet.length; i++) {

@@ -94,3 +64,3 @@ this.registry.onProcessSheet[i](sheet)

*/
onUpdate(data: Object, rule: Rule, sheet?: StyleSheet, options: UpdateOptions): void {
onUpdate(data, rule, sheet, options) {
for (let i = 0; i < this.registry.onUpdate.length; i++) {

@@ -104,3 +74,3 @@ this.registry.onUpdate[i](data, rule, sheet, options)

*/
onChangeValue(value: JssValue, prop: string, rule: StyleRule | BaseStyleRule): JssValue {
onChangeValue(value, prop, rule) {
let processedValue = value

@@ -116,3 +86,3 @@ for (let i = 0; i < this.registry.onChangeValue.length; i++) {

*/
use(newPlugin: Plugin, options: {queue: 'internal' | 'external'} = {queue: 'external'}): void {
use(newPlugin, options = {queue: 'external'}) {
const plugins = this.plugins[options.queue]

@@ -128,3 +98,3 @@

this.registry = [...this.plugins.external, ...this.plugins.internal].reduce(
(registry: Registry, plugin: Plugin) => {
(registry, plugin) => {
for (const name in plugin) {

@@ -131,0 +101,0 @@ if (name in registry) {

72

src/RuleList.js

@@ -1,16 +0,5 @@

// @flow
import createRule from './utils/createRule'
import {StyleRule, KeyframesRule} from './plugins/index'
import type {
RuleListOptions,
ToCssOptions,
Rule,
RuleOptions,
JssStyle,
Classes,
KeyframesMap,
UpdateArguments,
UpdateOptions
} from './types'
import escape from './utils/escape'
import getWhitespaceSymbols from './utils/getWhitespaceSymbols'

@@ -33,19 +22,13 @@ const defaultUpdateOptions = {

// It contains the same rule registered by name and by selector.
map: {[key: string]: Rule} = {}
map = {}
// Original styles object.
raw: {[key: string]: JssStyle} = {}
raw = {}
// Used to ensure correct rules order.
index: Array<Rule> = []
index = []
counter: number = 0
counter = 0
options: RuleListOptions
classes: Classes
keyframes: KeyframesMap
constructor(options: RuleListOptions) {
constructor(options) {
this.options = options

@@ -61,3 +44,3 @@ this.classes = options.classes

*/
add(name: string, decl: JssStyle, ruleOptions?: RuleOptions): Rule | null {
add(name, decl, ruleOptions) {
const {parent, sheet, jss, Renderer, generateId, scoped} = this.options

@@ -110,3 +93,3 @@ const options = {

*/
get(name: string): Rule {
get(name) {
return this.map[name]

@@ -118,3 +101,3 @@ }

*/
remove(rule: Rule): void {
remove(rule) {
this.unregister(rule)

@@ -128,3 +111,3 @@ delete this.raw[rule.key]

*/
indexOf(rule: Rule): number {
indexOf(rule) {
return this.index.indexOf(rule)

@@ -136,3 +119,3 @@ }

*/
process(): void {
process() {
const {plugins} = this.options.jss

@@ -147,3 +130,3 @@ // We need to clone array because if we modify the index somewhere else during a loop

*/
register(rule: Rule): void {
register(rule) {
this.map[rule.key] = rule

@@ -161,3 +144,3 @@ if (rule instanceof StyleRule) {

*/
unregister(rule: Rule): void {
unregister(rule) {
delete this.map[rule.key]

@@ -175,3 +158,3 @@ if (rule instanceof StyleRule) {

*/
update(...args: UpdateArguments): void {
update(...args) {
let name

@@ -183,9 +166,6 @@ let data

name = args[0]
// $FlowFixMe[invalid-tuple-index]
data = args[1]
// $FlowFixMe[invalid-tuple-index]
options = args[2]
} else {
data = args[0]
// $FlowFixMe[invalid-tuple-index]
options = args[1]

@@ -207,3 +187,3 @@ name = null

*/
updateOne(rule: Rule, data: Object, options?: UpdateOptions = defaultUpdateOptions) {
updateOne(rule, data, options = defaultUpdateOptions) {
const {

@@ -220,4 +200,3 @@ jss: {plugins},

const styleRule: StyleRule = (rule: any)
const {style} = styleRule
const {style} = rule

@@ -227,9 +206,9 @@ plugins.onUpdate(data, rule, sheet, options)

// We rely on a new `style` ref in case it was mutated during onUpdate hook.
if (options.process && style && style !== styleRule.style) {
if (options.process && style && style !== rule.style) {
// We need to run the plugins in case new `style` relies on syntax plugins.
plugins.onProcessStyle(styleRule.style, styleRule, sheet)
plugins.onProcessStyle(rule.style, rule, sheet)
// Update and add props.
for (const prop in styleRule.style) {
const nextValue = styleRule.style[prop]
for (const prop in rule.style) {
const nextValue = rule.style[prop]
const prevValue = style[prop]

@@ -239,3 +218,3 @@ // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

if (nextValue !== prevValue) {
styleRule.prop(prop, nextValue, forceUpdateOptions)
rule.prop(prop, nextValue, forceUpdateOptions)
}

@@ -246,3 +225,3 @@ }

for (const prop in style) {
const nextValue = styleRule.style[prop]
const nextValue = rule.style[prop]
const prevValue = style[prop]

@@ -252,3 +231,3 @@ // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.

if (nextValue == null && nextValue !== prevValue) {
styleRule.prop(prop, null, forceUpdateOptions)
rule.prop(prop, null, forceUpdateOptions)
}

@@ -262,6 +241,7 @@ }

*/
toString(options?: ToCssOptions): string {
toString(options) {
let str = ''
const {sheet} = this.options
const link = sheet ? sheet.options.link : false
const {linebreak} = getWhitespaceSymbols(options)

@@ -275,3 +255,3 @@ for (let index = 0; index < this.index.length; index++) {

if (str) str += '\n'
if (str) str += linebreak
str += css

@@ -278,0 +258,0 @@ }

4

src/sheets.js

@@ -1,2 +0,1 @@

// @flow
import SheetsRegistry from './SheetsRegistry'

@@ -10,3 +9,2 @@

*/
const registry: SheetsRegistry = new SheetsRegistry()
export default registry
export default new SheetsRegistry()

23

src/SheetsManager.js

@@ -1,4 +0,2 @@

// @flow
import warn from 'tiny-warning'
import type StyleSheet from './StyleSheet'

@@ -8,19 +6,14 @@ /**

* instances and attach/detach automatically.
* Used in react-jss.
*/
export default class SheetsManager {
length: number = 0
length = 0
sheets: WeakMap<
Object,
{
refs: number,
sheet: StyleSheet
}
> = new WeakMap()
sheets = new WeakMap()
get size(): number {
get size() {
return this.length
}
get(key: Object): ?StyleSheet {
get(key) {
const entry = this.sheets.get(key)

@@ -30,3 +23,3 @@ return entry && entry.sheet

add(key: Object, sheet: StyleSheet) {
add(key, sheet) {
if (this.sheets.has(key)) return

@@ -42,3 +35,3 @@

manage(key: Object): ?StyleSheet {
manage(key) {
const entry = this.sheets.get(key)

@@ -61,3 +54,3 @@

unmanage(key: Object) {
unmanage(key) {
const entry = this.sheets.get(key)

@@ -64,0 +57,0 @@

22

src/SheetsRegistry.js

@@ -1,10 +0,7 @@

// @flow
import type {ToCssOptions} from './types'
import type StyleSheet from './StyleSheet'
import getWhitespaceSymbols from './utils/getWhitespaceSymbols'
/**
* Sheets registry to access them all at one place.
* Sheets registry to access all instances in one place.
*/
export default class SheetsRegistry {
registry: Array<StyleSheet> = []
registry = []

@@ -14,3 +11,3 @@ /**

*/
get index(): number {
get index() {
return this.registry.length === 0 ? 0 : this.registry[this.registry.length - 1].options.index

@@ -22,3 +19,3 @@ }

*/
add(sheet: StyleSheet): void {
add(sheet) {
const {registry} = this

@@ -46,3 +43,3 @@ const {index} = sheet.options

*/
reset(): void {
reset() {
this.registry = []

@@ -54,3 +51,3 @@ }

*/
remove(sheet: StyleSheet): void {
remove(sheet) {
const index = this.registry.indexOf(sheet)

@@ -63,3 +60,4 @@ this.registry.splice(index, 1)

*/
toString({attached, ...options}: {|attached?: boolean, ...ToCssOptions|} = {}): string {
toString({attached, ...options} = {}) {
const {linebreak} = getWhitespaceSymbols(options)
let css = ''

@@ -71,3 +69,3 @@ for (let i = 0; i < this.registry.length; i++) {

}
if (css) css += '\n'
if (css) css += linebreak
css += sheet.toString(options)

@@ -74,0 +72,0 @@ }

57

src/StyleSheet.js

@@ -1,36 +0,5 @@

// @flow
import RuleList from './RuleList'
import type {
InternalStyleSheetOptions,
Rule,
ToCssOptions,
RuleOptions,
StyleSheetOptions,
JssStyle,
Classes,
KeyframesMap,
JssStyles,
Renderer,
UpdateArguments,
UpdateOptions
} from './types'
export default class StyleSheet {
options: InternalStyleSheetOptions
deployed: boolean
attached: boolean
rules: RuleList
renderer: Renderer | null
classes: Classes
keyframes: KeyframesMap
queue: ?Array<Rule>
constructor(styles: JssStyles, options: StyleSheetOptions) {
constructor(styles, options) {
this.attached = false

@@ -62,3 +31,3 @@ this.deployed = false

*/
attach(): this {
attach() {
if (this.attached) return this

@@ -75,3 +44,3 @@ if (this.renderer) this.renderer.attach()

*/
detach(): this {
detach() {
if (!this.attached) return this

@@ -87,3 +56,3 @@ if (this.renderer) this.renderer.detach()

*/
addRule(name: string, decl: JssStyle, options?: RuleOptions): Rule | null {
addRule(name, decl, options) {
const {queue} = this

@@ -127,3 +96,3 @@

*/
insertRule(rule: Rule) {
insertRule(rule) {
if (this.renderer) {

@@ -138,3 +107,3 @@ this.renderer.insertRule(rule)

*/
addRules(styles: JssStyles, options?: RuleOptions): Array<Rule> {
addRules(styles, options) {
const added = []

@@ -151,3 +120,3 @@ for (const name in styles) {

*/
getRule(name: string): Rule {
getRule(name) {
return this.rules.get(name)

@@ -160,3 +129,3 @@ }

*/
deleteRule(name: string | Rule): boolean {
deleteRule(name) {
const rule = typeof name === 'object' ? name : this.rules.get(name)

@@ -185,3 +154,3 @@

*/
indexOf(rule: Rule): number {
indexOf(rule) {
return this.rules.indexOf(rule)

@@ -193,3 +162,3 @@ }

*/
deploy(): this {
deploy() {
if (this.renderer) this.renderer.deploy()

@@ -203,3 +172,3 @@ this.deployed = true

*/
update(...args: UpdateArguments): this {
update(...args) {
this.rules.update(...args)

@@ -212,3 +181,3 @@ return this

*/
updateOne(rule: Rule, data: Object, options?: UpdateOptions): this {
updateOne(rule, data, options) {
this.rules.updateOne(rule, data, options)

@@ -221,5 +190,5 @@ return this

*/
toString(options?: ToCssOptions): string {
toString(options) {
return this.rules.toString(options)
}
}

4

src/utils/cloneStyle.js

@@ -1,6 +0,4 @@

import type {JssStyle} from '../types'
const plainObjectConstrurctor = {}.constructor
export default function cloneStyle(style: JssStyle): JssStyle {
export default function cloneStyle(style) {
if (style == null || typeof style !== 'object') return style

@@ -7,0 +5,0 @@ if (Array.isArray(style)) return style.map(cloneStyle)

14

src/utils/createGenerateId.js

@@ -1,5 +0,2 @@

// @flow
import warning from 'tiny-warning'
import type {Rule} from '../types'
import StyleSheet from '../StyleSheet'
import moduleId from './moduleId'

@@ -9,9 +6,2 @@

export type CreateGenerateIdOptions = {|
minify: boolean
|}
export type GenerateId = (rule: Rule, sheet?: StyleSheet) => string
export type CreateGenerateId = (options?: CreateGenerateIdOptions) => GenerateId
/**

@@ -22,6 +12,6 @@ * Returns a function which generates unique class names based on counters.

*/
const createGenerateId: CreateGenerateId = (options = {}) => {
const createGenerateId = (options = {}) => {
let ruleCounter = 0
const generateId: GenerateId = (rule, sheet) => {
const generateId = (rule, sheet) => {
ruleCounter += 1

@@ -28,0 +18,0 @@

8

src/utils/createRule.js

@@ -1,4 +0,2 @@

// @flow
import warning from 'tiny-warning'
import type {Rule, RuleOptions, JssStyle} from '../types'
import cloneStyle from './cloneStyle'

@@ -9,7 +7,3 @@

*/
export default function createRule(
name: string = 'unnamed',
decl: JssStyle,
options: RuleOptions
): Rule | null {
export default function createRule(name = 'unnamed', decl, options) {
const {jss} = options

@@ -16,0 +10,0 @@ const declCopy = cloneStyle(decl)

2

src/utils/escape.js
const escapeRegex = /([[\].#*$><+~=|^:(),"'`\s])/g
const nativeEscape = typeof CSS !== 'undefined' && CSS.escape
export default str => (nativeEscape ? nativeEscape(str) : str.replace(escapeRegex, '\\$1'))
export default (str) => (nativeEscape ? nativeEscape(str) : str.replace(escapeRegex, '\\$1'))

2

src/utils/getDynamicStyles.js
/**
* Extracts a styles object with only props that contain function values.
*/
export default function getDynamicStyles(styles: Object): Object | null {
export default function getDynamicStyles(styles) {
let to = null

@@ -6,0 +6,0 @@

10

src/utils/globalThis.js

@@ -13,8 +13,8 @@ /* eslint-disable */

*/
export default (typeof globalThis !== 'undefined'
export default typeof globalThis !== 'undefined'
? globalThis
: typeof window !== 'undefined' && window.Math === Math
? window
: typeof self !== 'undefined' && self.Math === Math
? self
: Function('return this')())
? window
: typeof self !== 'undefined' && self.Math === Math
? self
: Function('return this')()

32

src/utils/toCss.js

@@ -1,4 +0,3 @@

// @flow
import toCssValue from './toCssValue'
import type {ToCssOptions, JssStyle} from '../types'
import getWhitespaceSymbols from './getWhitespaceSymbols'

@@ -9,3 +8,3 @@ /**

*/
function indentStr(str: string, indent: number): string {
function indentStr(str, indent) {
let result = ''

@@ -19,7 +18,3 @@ for (let index = 0; index < indent; index++) result += ' '

*/
export default function toCss(
selector?: string,
style: JssStyle,
options: ToCssOptions = ({}: any)
): string {
export default function toCss(selector, style, options = {}) {
let result = ''

@@ -32,2 +27,7 @@

if (options.format === false) {
indent = -Infinity
}
const {linebreak, space} = getWhitespaceSymbols(options)
if (selector) indent++

@@ -44,4 +44,4 @@

if (value != null) {
if (result) result += '\n'
result += indentStr(`${prop}: ${toCssValue(value)};`, indent)
if (result) result += linebreak
result += indentStr(`${prop}:${space}${toCssValue(value)};`, indent)
}

@@ -55,4 +55,4 @@ }

if (value != null) {
if (result) result += '\n'
result += indentStr(`${prop}: ${toCssValue(value)};`, indent)
if (result) result += linebreak
result += indentStr(`${prop}:${space}${toCssValue(value)};`, indent)
}

@@ -66,4 +66,4 @@ }

if (value != null && prop !== 'fallbacks') {
if (result) result += '\n'
result += indentStr(`${prop}: ${toCssValue(value)};`, indent)
if (result) result += linebreak
result += indentStr(`${prop}:${space}${toCssValue(value)};`, indent)
}

@@ -80,5 +80,5 @@ }

if (result) result = `\n${result}\n`
if (result) result = `${linebreak}${result}${linebreak}`
return indentStr(`${selector} {${result}`, indent) + indentStr('}', indent)
return indentStr(`${selector}${space}{${result}`, indent) + indentStr('}', indent)
}

10

src/utils/toCssValue.js

@@ -1,5 +0,1 @@

// @flow
import type {FixMeAny} from '../types'
const join = (value, by) => {

@@ -16,6 +12,4 @@ let result = ''

type ToCssValue = (FixMeAny, boolean | void) => string
/**
* Converts array values to string.
* Converts JSS array value to a CSS string.
*

@@ -27,3 +21,3 @@ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`

*/
const toCssValue: ToCssValue = (value, ignoreImportant = false) => {
const toCssValue = (value, ignoreImportant = false) => {
if (!Array.isArray(value)) return value

@@ -30,0 +24,0 @@ 

src/types/cssom.js
src/types/dom.js
src/types/index.js
src/types/jss.js
dist/jss.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc