@master/css 2.0.0-rc.5 → 2.0.0-rc.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -43
- package/dist/_virtual/_commonjsHelpers.cjs +10 -0
- package/dist/_virtual/_commonjsHelpers.mjs +7 -0
- package/dist/_virtual/css-escape.cjs +5 -0
- package/dist/_virtual/css-escape.mjs +3 -0
- package/dist/bin/index.cjs +11 -0
- package/dist/bin/index.d.ts +0 -1
- package/dist/bin/index.mjs +9 -0
- package/dist/common.cjs +159 -0
- package/dist/common.d.ts +26 -0
- package/dist/common.mjs +137 -0
- package/dist/config/animations.cjs +113 -0
- package/dist/config/animations.mjs +111 -0
- package/dist/config/at.cjs +14 -0
- package/dist/config/at.d.ts +11 -0
- package/dist/config/at.mjs +12 -0
- package/dist/config/functions.cjs +375 -0
- package/dist/config/functions.d.ts +1 -1
- package/dist/config/functions.mjs +373 -0
- package/dist/config/index.cjs +37 -0
- package/dist/config/index.d.ts +5 -62
- package/dist/config/index.mjs +27 -0
- package/dist/config/modes.cjs +8 -0
- package/dist/config/modes.d.ts +3 -0
- package/dist/config/modes.mjs +6 -0
- package/dist/config/rules.cjs +2327 -0
- package/dist/config/rules.d.ts +277 -274
- package/dist/config/rules.mjs +2325 -0
- package/dist/config/selectors.cjs +28 -0
- package/dist/config/selectors.d.ts +0 -1
- package/dist/config/selectors.mjs +26 -0
- package/dist/config/styles.cjs +2 -0
- package/dist/config/styles.d.ts +2 -2
- package/dist/config/styles.mjs +1 -0
- package/dist/config/utilities.cjs +204 -0
- package/dist/config/{semantics.d.ts → utilities.d.ts} +15 -5
- package/dist/config/utilities.mjs +202 -0
- package/dist/config/variables.cjs +484 -0
- package/dist/config/variables.d.ts +208 -312
- package/dist/config/variables.mjs +482 -0
- package/dist/core.cjs +664 -0
- package/dist/core.d.ts +44 -73
- package/dist/core.mjs +659 -0
- package/dist/index.cjs +81 -0
- package/dist/index.d.ts +20 -9
- package/dist/index.mjs +26 -0
- package/dist/layer.cjs +116 -0
- package/dist/layer.d.ts +13 -10
- package/dist/layer.mjs +114 -0
- package/dist/non-layer.cjs +65 -0
- package/dist/non-layer.d.ts +12 -0
- package/dist/non-layer.mjs +63 -0
- package/dist/polyfills/css-escape.cjs +9 -0
- package/dist/polyfills/css-escape.mjs +7 -0
- package/dist/polyfills/css-escape2.cjs +76 -0
- package/dist/polyfills/css-escape2.mjs +74 -0
- package/dist/rule.cjs +18 -0
- package/dist/rule.d.ts +6 -111
- package/dist/rule.mjs +16 -0
- package/dist/shared/utils/css-escape.cjs +56 -0
- package/dist/shared/utils/css-escape.mjs +54 -0
- package/dist/shared/utils/find-native-css-rule-index.cjs +12 -0
- package/dist/shared/utils/find-native-css-rule-index.mjs +10 -0
- package/dist/syntax-layer.cjs +291 -0
- package/dist/syntax-layer.d.ts +17 -0
- package/dist/syntax-layer.mjs +289 -0
- package/dist/syntax-rule-type.cjs +27 -0
- package/dist/syntax-rule-type.d.ts +28 -0
- package/dist/syntax-rule-type.mjs +25 -0
- package/dist/syntax-rule.cjs +717 -0
- package/dist/syntax-rule.d.ts +47 -0
- package/dist/syntax-rule.mjs +715 -0
- package/dist/types/config.cjs +2 -0
- package/dist/types/config.d.ts +70 -0
- package/dist/types/config.mjs +1 -0
- package/dist/types/global.cjs +2 -0
- package/dist/types/global.d.ts +3 -3
- package/dist/types/global.mjs +1 -0
- package/dist/types/syntax.cjs +2 -0
- package/dist/types/syntax.d.ts +106 -0
- package/dist/types/syntax.mjs +1 -0
- package/dist/utils/are-rule-at-equal.cjs +22 -0
- package/dist/utils/are-rule-at-equal.d.ts +2 -0
- package/dist/utils/are-rule-at-equal.mjs +20 -0
- package/dist/utils/are-rule-modes-equal.cjs +7 -0
- package/dist/utils/are-rule-modes-equal.d.ts +2 -0
- package/dist/utils/are-rule-modes-equal.mjs +5 -0
- package/dist/utils/are-rule-selectors-equal.cjs +29 -0
- package/dist/utils/are-rule-selectors-equal.d.ts +2 -0
- package/dist/utils/are-rule-selectors-equal.mjs +27 -0
- package/dist/utils/are-rule-states-equal.cjs +11 -0
- package/dist/utils/are-rule-states-equal.d.ts +2 -0
- package/dist/utils/are-rule-states-equal.mjs +9 -0
- package/dist/utils/are-rules-duplicated.cjs +17 -0
- package/dist/utils/are-rules-duplicated.d.ts +2 -0
- package/dist/utils/are-rules-duplicated.mjs +15 -0
- package/dist/utils/autofill-solid-style.cjs +31 -0
- package/dist/utils/autofill-solid-style.d.ts +3 -0
- package/dist/utils/autofill-solid-style.mjs +29 -0
- package/dist/utils/extend-config.cjs +73 -0
- package/dist/utils/extend-config.d.ts +2 -2
- package/dist/utils/extend-config.mjs +71 -0
- package/dist/utils/flatten-object.cjs +15 -0
- package/dist/utils/flatten-object.mjs +13 -0
- package/dist/utils/generate-css.cjs +13 -0
- package/dist/utils/generate-css.d.ts +2 -0
- package/dist/utils/generate-css.mjs +11 -0
- package/dist/utils/hex-to-rgb.cjs +30 -0
- package/dist/utils/hex-to-rgb.d.ts +1 -1
- package/dist/utils/hex-to-rgb.mjs +28 -0
- package/dist/utils/is-core-rule.cjs +9 -0
- package/dist/utils/is-core-rule.d.ts +1 -0
- package/dist/utils/is-core-rule.mjs +7 -0
- package/dist/utils/reorder-for-readable-classes.cjs +62 -0
- package/dist/{functions → utils}/reorder-for-readable-classes.d.ts +2 -6
- package/dist/utils/reorder-for-readable-classes.mjs +60 -0
- package/package.json +1 -1
- package/dist/bin/index.bundle.js +0 -36
- package/dist/config/media-queries.d.ts +0 -1
- package/dist/constants/base-unit-regex.d.ts +0 -1
- package/dist/constants/config-esm-text.d.ts +0 -1
- package/dist/constants/config-text.d.ts +0 -1
- package/dist/constants/config-ts-text.d.ts +0 -1
- package/dist/constants/start-symbol.d.ts +0 -6
- package/dist/functions/transform-color-with-opacity.d.ts +0 -1
- package/dist/index.bundle.js +0 -35
- package/dist/index.bundle.mjs +0 -35
- package/dist/tokens/screen-sizes.d.ts +0 -14
- package/dist/utils/concat-arrays.d.ts +0 -1
- package/dist/utils/get-type.d.ts +0 -7
- package/dist/utils/is-plain-object.d.ts +0 -8
- package/dist/utils/is-symbol.d.ts +0 -7
- package/dist/utils/rgb-to-hex.d.ts +0 -1
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var index = require('./config/index.cjs');
|
|
6
|
+
var common = require('./common.cjs');
|
|
7
|
+
var core = require('./core.cjs');
|
|
8
|
+
var syntaxRule = require('./syntax-rule.cjs');
|
|
9
|
+
var rule = require('./rule.cjs');
|
|
10
|
+
var layer = require('./layer.cjs');
|
|
11
|
+
var syntaxLayer = require('./syntax-layer.cjs');
|
|
12
|
+
var nonLayer = require('./non-layer.cjs');
|
|
13
|
+
var syntaxRuleType = require('./syntax-rule-type.cjs');
|
|
14
|
+
var extendConfig = require('./utils/extend-config.cjs');
|
|
15
|
+
var reorderForReadableClasses = require('./utils/reorder-for-readable-classes.cjs');
|
|
16
|
+
var areRuleModesEqual = require('./utils/are-rule-modes-equal.cjs');
|
|
17
|
+
var areRuleAtEqual = require('./utils/are-rule-at-equal.cjs');
|
|
18
|
+
var areRuleSelectorsEqual = require('./utils/are-rule-selectors-equal.cjs');
|
|
19
|
+
var areRuleStatesEqual = require('./utils/are-rule-states-equal.cjs');
|
|
20
|
+
var areRulesDuplicated = require('./utils/are-rules-duplicated.cjs');
|
|
21
|
+
var generateCss = require('./utils/generate-css.cjs');
|
|
22
|
+
var isCoreRule = require('./utils/is-core-rule.cjs');
|
|
23
|
+
var at = require('./config/at.cjs');
|
|
24
|
+
var selectors = require('./config/selectors.cjs');
|
|
25
|
+
var utilities = require('./config/utilities.cjs');
|
|
26
|
+
var functions = require('./config/functions.cjs');
|
|
27
|
+
var animations = require('./config/animations.cjs');
|
|
28
|
+
var variables = require('./config/variables.cjs');
|
|
29
|
+
var modes = require('./config/modes.cjs');
|
|
30
|
+
var rules = require('./config/rules.cjs');
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
exports.config = index.config;
|
|
35
|
+
exports.ANIMATION_SIGN = common.ANIMATION_SIGN;
|
|
36
|
+
exports.AT_SIGN = common.AT_SIGN;
|
|
37
|
+
exports.BASE_UNIT_REGEX = common.BASE_UNIT_REGEX;
|
|
38
|
+
exports.BORDER_STYLE_VALUES = common.BORDER_STYLE_VALUES;
|
|
39
|
+
exports.CLASS_ATTRIBUTES = common.CLASS_ATTRIBUTES;
|
|
40
|
+
exports.CLASS_DECLARATIONS = common.CLASS_DECLARATIONS;
|
|
41
|
+
exports.CLASS_FUNCTIONS = common.CLASS_FUNCTIONS;
|
|
42
|
+
exports.COLOR_VALUE_REGEX = common.COLOR_VALUE_REGEX;
|
|
43
|
+
exports.DELIMITER_SIGN = common.DELIMITER_SIGN;
|
|
44
|
+
exports.IMAGE_VALUE_REGEX = common.IMAGE_VALUE_REGEX;
|
|
45
|
+
exports.NUMBER_VALUE_REGEX = common.NUMBER_VALUE_REGEX;
|
|
46
|
+
exports.OFFICIAL_URL = common.OFFICIAL_URL;
|
|
47
|
+
exports.QUERY_COMPARISON_OPERATORS = common.QUERY_COMPARISON_OPERATORS;
|
|
48
|
+
exports.QUERY_LOGICAL_OPERATORS = common.QUERY_LOGICAL_OPERATORS;
|
|
49
|
+
exports.SELECTOR_SIGNS = common.SELECTOR_SIGNS;
|
|
50
|
+
exports.SEPARATOR_SIGN = common.SEPARATOR_SIGN;
|
|
51
|
+
exports.SEPARATOR_SIGNS = common.SEPARATOR_SIGNS;
|
|
52
|
+
exports.TRANSITION_SIGN = common.TRANSITION_SIGN;
|
|
53
|
+
exports.UNIT_REGEX = common.UNIT_REGEX;
|
|
54
|
+
exports.VALUE_DELIMITERS = common.VALUE_DELIMITERS;
|
|
55
|
+
exports.VALUE_UNITS = common.VALUE_UNITS;
|
|
56
|
+
exports.MasterCSS = core.default;
|
|
57
|
+
exports.default = core.default;
|
|
58
|
+
exports.masterCSSs = core.masterCSSs;
|
|
59
|
+
exports.SyntaxRule = syntaxRule.SyntaxRule;
|
|
60
|
+
exports.Rule = rule.Rule;
|
|
61
|
+
exports.Layer = layer;
|
|
62
|
+
exports.SyntaxLayer = syntaxLayer;
|
|
63
|
+
exports.NonLayer = nonLayer;
|
|
64
|
+
exports.SyntaxRuleType = syntaxRuleType;
|
|
65
|
+
exports.extendConfig = extendConfig;
|
|
66
|
+
exports.reorderForReadableClasses = reorderForReadableClasses;
|
|
67
|
+
exports.areRuleModesEqual = areRuleModesEqual;
|
|
68
|
+
exports.areRuleAtEqual = areRuleAtEqual;
|
|
69
|
+
exports.areRuleSelectorsEqual = areRuleSelectorsEqual;
|
|
70
|
+
exports.areRuleStatesEqual = areRuleStatesEqual;
|
|
71
|
+
exports.areRulesDuplicated = areRulesDuplicated;
|
|
72
|
+
exports.generateCSS = generateCss;
|
|
73
|
+
exports.isCoreRule = isCoreRule;
|
|
74
|
+
exports.at = at;
|
|
75
|
+
exports.selectors = selectors;
|
|
76
|
+
exports.utilities = utilities;
|
|
77
|
+
exports.functions = functions;
|
|
78
|
+
exports.animations = animations;
|
|
79
|
+
exports.variables = variables;
|
|
80
|
+
exports.modes = modes;
|
|
81
|
+
exports.rules = rules;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,10 +1,21 @@
|
|
|
1
|
-
export { MasterCSS, MasterCSS as default } from './core';
|
|
2
|
-
export { Rule } from './rule';
|
|
3
|
-
export type { NativeRule, MediaFeatureComponent, MediaQuery } from './rule';
|
|
4
|
-
export { CONFIG_TEXT } from './constants/config-text';
|
|
5
|
-
export { CONFIG_ESM_TEXT } from './constants/config-esm-text';
|
|
6
|
-
export { CONFIG_TS_TEXT } from './constants/config-ts-text';
|
|
7
|
-
export { Layer } from './layer';
|
|
8
|
-
export { default as extend } from '@techor/extend';
|
|
9
|
-
export { default as reorderForReadableClasses } from './functions/reorder-for-readable-classes';
|
|
10
1
|
export * from './config';
|
|
2
|
+
export * from './common';
|
|
3
|
+
export * from './core';
|
|
4
|
+
export * from './syntax-rule';
|
|
5
|
+
export * from './rule';
|
|
6
|
+
export { default as Layer } from './layer';
|
|
7
|
+
export { default as SyntaxLayer } from './syntax-layer';
|
|
8
|
+
export { default as NonLayer } from './non-layer';
|
|
9
|
+
export { default as SyntaxRuleType } from './syntax-rule-type';
|
|
10
|
+
export { default as MasterCSS, default } from './core';
|
|
11
|
+
export * from './types/config';
|
|
12
|
+
export * from './types/syntax';
|
|
13
|
+
export { default as extendConfig } from './utils/extend-config';
|
|
14
|
+
export { default as reorderForReadableClasses } from './utils/reorder-for-readable-classes';
|
|
15
|
+
export { default as areRuleModesEqual } from './utils/are-rule-modes-equal';
|
|
16
|
+
export { default as areRuleAtEqual } from './utils/are-rule-at-equal';
|
|
17
|
+
export { default as areRuleSelectorsEqual } from './utils/are-rule-selectors-equal';
|
|
18
|
+
export { default as areRuleStatesEqual } from './utils/are-rule-states-equal';
|
|
19
|
+
export { default as areRulesDuplicated } from './utils/are-rules-duplicated';
|
|
20
|
+
export { default as generateCSS } from './utils/generate-css';
|
|
21
|
+
export { default as isCoreRule } from './utils/is-core-rule';
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export { config } from './config/index.mjs';
|
|
2
|
+
export { ANIMATION_SIGN, AT_SIGN, BASE_UNIT_REGEX, BORDER_STYLE_VALUES, CLASS_ATTRIBUTES, CLASS_DECLARATIONS, CLASS_FUNCTIONS, COLOR_VALUE_REGEX, DELIMITER_SIGN, IMAGE_VALUE_REGEX, NUMBER_VALUE_REGEX, OFFICIAL_URL, QUERY_COMPARISON_OPERATORS, QUERY_LOGICAL_OPERATORS, SELECTOR_SIGNS, SEPARATOR_SIGN, SEPARATOR_SIGNS, TRANSITION_SIGN, UNIT_REGEX, VALUE_DELIMITERS, VALUE_UNITS } from './common.mjs';
|
|
3
|
+
export { default as MasterCSS, default, masterCSSs } from './core.mjs';
|
|
4
|
+
export { SyntaxRule } from './syntax-rule.mjs';
|
|
5
|
+
export { Rule } from './rule.mjs';
|
|
6
|
+
export { default as Layer } from './layer.mjs';
|
|
7
|
+
export { default as SyntaxLayer } from './syntax-layer.mjs';
|
|
8
|
+
export { default as NonLayer } from './non-layer.mjs';
|
|
9
|
+
export { default as SyntaxRuleType } from './syntax-rule-type.mjs';
|
|
10
|
+
export { default as extendConfig } from './utils/extend-config.mjs';
|
|
11
|
+
export { default as reorderForReadableClasses } from './utils/reorder-for-readable-classes.mjs';
|
|
12
|
+
export { default as areRuleModesEqual } from './utils/are-rule-modes-equal.mjs';
|
|
13
|
+
export { default as areRuleAtEqual } from './utils/are-rule-at-equal.mjs';
|
|
14
|
+
export { default as areRuleSelectorsEqual } from './utils/are-rule-selectors-equal.mjs';
|
|
15
|
+
export { default as areRuleStatesEqual } from './utils/are-rule-states-equal.mjs';
|
|
16
|
+
export { default as areRulesDuplicated } from './utils/are-rules-duplicated.mjs';
|
|
17
|
+
export { default as generateCSS } from './utils/generate-css.mjs';
|
|
18
|
+
export { default as isCoreRule } from './utils/is-core-rule.mjs';
|
|
19
|
+
export { default as at } from './config/at.mjs';
|
|
20
|
+
export { default as selectors } from './config/selectors.mjs';
|
|
21
|
+
export { default as utilities } from './config/utilities.mjs';
|
|
22
|
+
export { default as functions } from './config/functions.mjs';
|
|
23
|
+
export { default as animations } from './config/animations.mjs';
|
|
24
|
+
export { default as variables } from './config/variables.mjs';
|
|
25
|
+
export { default as modes } from './config/modes.mjs';
|
|
26
|
+
export { default as rules } from './config/rules.mjs';
|
package/dist/layer.cjs
ADDED
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var findNativeCssRuleIndex = require('./shared/utils/find-native-css-rule-index.cjs');
|
|
4
|
+
|
|
5
|
+
class Layer {
|
|
6
|
+
name;
|
|
7
|
+
css;
|
|
8
|
+
rules;
|
|
9
|
+
usages;
|
|
10
|
+
native;
|
|
11
|
+
constructor(name, css){
|
|
12
|
+
this.name = name;
|
|
13
|
+
this.css = css;
|
|
14
|
+
this.rules = [];
|
|
15
|
+
this.usages = {};
|
|
16
|
+
this.native = null;
|
|
17
|
+
}
|
|
18
|
+
insert(rule, index) {
|
|
19
|
+
if (this.rules.find(({ key })=>key === rule.key)) return;
|
|
20
|
+
if (!this.css.rules.includes(this)) {
|
|
21
|
+
this.css.rules.push(this);
|
|
22
|
+
const nativeSheet = this.css.style?.sheet;
|
|
23
|
+
if (nativeSheet && !this.native) {
|
|
24
|
+
const insertedIndex = nativeSheet.insertRule(this.text, nativeSheet.cssRules.length);
|
|
25
|
+
this.native = nativeSheet.cssRules.item(insertedIndex);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
if (index === undefined) {
|
|
29
|
+
index = this.rules.length;
|
|
30
|
+
}
|
|
31
|
+
if (this.native) {
|
|
32
|
+
let cssRuleIndex = 0;
|
|
33
|
+
const lastCssRule = function getLastCssRule(layer, index) {
|
|
34
|
+
let lastCssRule;
|
|
35
|
+
const previouRule = layer.rules[index];
|
|
36
|
+
if (previouRule && 'nodes' in previouRule) {
|
|
37
|
+
if (!previouRule.nodes.length) return getLastCssRule(layer, index - 1);
|
|
38
|
+
const lastNativeRule = previouRule.nodes[previouRule.nodes.length - 1];
|
|
39
|
+
lastCssRule = lastNativeRule.native;
|
|
40
|
+
}
|
|
41
|
+
return lastCssRule;
|
|
42
|
+
}(this, index - 1);
|
|
43
|
+
if (lastCssRule) {
|
|
44
|
+
for(let i = 0; i < this.native.cssRules.length; i++){
|
|
45
|
+
if (this.native.cssRules[i] === lastCssRule) {
|
|
46
|
+
cssRuleIndex = i + 1;
|
|
47
|
+
break;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
for(let i = 0; i < rule.nodes.length;){
|
|
52
|
+
try {
|
|
53
|
+
const nativeRule = rule.nodes[i];
|
|
54
|
+
this.native.insertRule(nativeRule.text, cssRuleIndex);
|
|
55
|
+
nativeRule.native = this.native.cssRules[cssRuleIndex++];
|
|
56
|
+
i++;
|
|
57
|
+
} catch (error) {
|
|
58
|
+
console.error(error);
|
|
59
|
+
rule.nodes.splice(i, 1);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
this.rules.splice(index, 0, rule);
|
|
64
|
+
return index;
|
|
65
|
+
}
|
|
66
|
+
delete(key) {
|
|
67
|
+
const rule = this.rules.find((rule)=>rule.key === key);
|
|
68
|
+
if (!rule) return;
|
|
69
|
+
if (this.rules.length === 1) {
|
|
70
|
+
const indexOfLayer = this.css.rules.indexOf(this);
|
|
71
|
+
this.css.rules.splice(indexOfLayer, 1);
|
|
72
|
+
const nativeSheet = this.css.style?.sheet;
|
|
73
|
+
if (nativeSheet && this.native) {
|
|
74
|
+
const foundIndex = findNativeCssRuleIndex(nativeSheet.cssRules, this.native);
|
|
75
|
+
if (foundIndex !== -1) {
|
|
76
|
+
nativeSheet.deleteRule(foundIndex);
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
if (this.native?.cssRules && 'nodes' in rule) {
|
|
81
|
+
for (const node of rule.nodes){
|
|
82
|
+
if (node.native) {
|
|
83
|
+
const foundIndex = findNativeCssRuleIndex(this.native.cssRules, node.native);
|
|
84
|
+
if (foundIndex !== -1) {
|
|
85
|
+
// todo: Firefox throw "Uncaught NS_ERROR_FAILURE". Reproduce: Add '@fade|1s @fade|2s' and remove '@fade|1s @fade|2s'
|
|
86
|
+
this.native.deleteRule(foundIndex);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
this.rules.splice(this.rules.indexOf(rule), 1);
|
|
92
|
+
return rule;
|
|
93
|
+
}
|
|
94
|
+
reset() {
|
|
95
|
+
this.rules.length = 0;
|
|
96
|
+
const indexOfLayer = this.css.rules.indexOf(this);
|
|
97
|
+
if (indexOfLayer !== -1) {
|
|
98
|
+
this.css.rules.splice(indexOfLayer, 1);
|
|
99
|
+
}
|
|
100
|
+
// @ts-expect-error
|
|
101
|
+
this.usages = {};
|
|
102
|
+
const nativeSheet = this.css.style?.sheet;
|
|
103
|
+
if (this.native && nativeSheet) {
|
|
104
|
+
const foundIndex = findNativeCssRuleIndex(nativeSheet.cssRules, this.native);
|
|
105
|
+
if (foundIndex !== -1) {
|
|
106
|
+
nativeSheet.deleteRule(foundIndex);
|
|
107
|
+
}
|
|
108
|
+
this.native = null;
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
get text() {
|
|
112
|
+
return '@layer ' + this.name + '{' + this.rules.map(({ text })=>text).join('') + '}';
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
module.exports = Layer;
|
package/dist/layer.d.ts
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
import { Rule } from './rule';
|
|
2
|
+
import MasterCSS from './core';
|
|
3
|
+
export default class Layer {
|
|
4
|
+
name: string;
|
|
5
|
+
css: MasterCSS;
|
|
6
|
+
readonly rules: Rule[];
|
|
7
|
+
readonly usages: Record<string, number>;
|
|
8
|
+
native: CSSLayerBlockRule | null;
|
|
9
|
+
constructor(name: string, css: MasterCSS);
|
|
10
|
+
insert(rule: Rule, index?: number): number | undefined;
|
|
11
|
+
delete(key: string): Rule | undefined;
|
|
12
|
+
reset(): void;
|
|
13
|
+
get text(): string;
|
|
11
14
|
}
|
package/dist/layer.mjs
ADDED
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
import findNativeCSSRuleIndex from './shared/utils/find-native-css-rule-index.mjs';
|
|
2
|
+
|
|
3
|
+
class Layer {
|
|
4
|
+
name;
|
|
5
|
+
css;
|
|
6
|
+
rules;
|
|
7
|
+
usages;
|
|
8
|
+
native;
|
|
9
|
+
constructor(name, css){
|
|
10
|
+
this.name = name;
|
|
11
|
+
this.css = css;
|
|
12
|
+
this.rules = [];
|
|
13
|
+
this.usages = {};
|
|
14
|
+
this.native = null;
|
|
15
|
+
}
|
|
16
|
+
insert(rule, index) {
|
|
17
|
+
if (this.rules.find(({ key })=>key === rule.key)) return;
|
|
18
|
+
if (!this.css.rules.includes(this)) {
|
|
19
|
+
this.css.rules.push(this);
|
|
20
|
+
const nativeSheet = this.css.style?.sheet;
|
|
21
|
+
if (nativeSheet && !this.native) {
|
|
22
|
+
const insertedIndex = nativeSheet.insertRule(this.text, nativeSheet.cssRules.length);
|
|
23
|
+
this.native = nativeSheet.cssRules.item(insertedIndex);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
if (index === undefined) {
|
|
27
|
+
index = this.rules.length;
|
|
28
|
+
}
|
|
29
|
+
if (this.native) {
|
|
30
|
+
let cssRuleIndex = 0;
|
|
31
|
+
const lastCssRule = function getLastCssRule(layer, index) {
|
|
32
|
+
let lastCssRule;
|
|
33
|
+
const previouRule = layer.rules[index];
|
|
34
|
+
if (previouRule && 'nodes' in previouRule) {
|
|
35
|
+
if (!previouRule.nodes.length) return getLastCssRule(layer, index - 1);
|
|
36
|
+
const lastNativeRule = previouRule.nodes[previouRule.nodes.length - 1];
|
|
37
|
+
lastCssRule = lastNativeRule.native;
|
|
38
|
+
}
|
|
39
|
+
return lastCssRule;
|
|
40
|
+
}(this, index - 1);
|
|
41
|
+
if (lastCssRule) {
|
|
42
|
+
for(let i = 0; i < this.native.cssRules.length; i++){
|
|
43
|
+
if (this.native.cssRules[i] === lastCssRule) {
|
|
44
|
+
cssRuleIndex = i + 1;
|
|
45
|
+
break;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
for(let i = 0; i < rule.nodes.length;){
|
|
50
|
+
try {
|
|
51
|
+
const nativeRule = rule.nodes[i];
|
|
52
|
+
this.native.insertRule(nativeRule.text, cssRuleIndex);
|
|
53
|
+
nativeRule.native = this.native.cssRules[cssRuleIndex++];
|
|
54
|
+
i++;
|
|
55
|
+
} catch (error) {
|
|
56
|
+
console.error(error);
|
|
57
|
+
rule.nodes.splice(i, 1);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
this.rules.splice(index, 0, rule);
|
|
62
|
+
return index;
|
|
63
|
+
}
|
|
64
|
+
delete(key) {
|
|
65
|
+
const rule = this.rules.find((rule)=>rule.key === key);
|
|
66
|
+
if (!rule) return;
|
|
67
|
+
if (this.rules.length === 1) {
|
|
68
|
+
const indexOfLayer = this.css.rules.indexOf(this);
|
|
69
|
+
this.css.rules.splice(indexOfLayer, 1);
|
|
70
|
+
const nativeSheet = this.css.style?.sheet;
|
|
71
|
+
if (nativeSheet && this.native) {
|
|
72
|
+
const foundIndex = findNativeCSSRuleIndex(nativeSheet.cssRules, this.native);
|
|
73
|
+
if (foundIndex !== -1) {
|
|
74
|
+
nativeSheet.deleteRule(foundIndex);
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
if (this.native?.cssRules && 'nodes' in rule) {
|
|
79
|
+
for (const node of rule.nodes){
|
|
80
|
+
if (node.native) {
|
|
81
|
+
const foundIndex = findNativeCSSRuleIndex(this.native.cssRules, node.native);
|
|
82
|
+
if (foundIndex !== -1) {
|
|
83
|
+
// todo: Firefox throw "Uncaught NS_ERROR_FAILURE". Reproduce: Add '@fade|1s @fade|2s' and remove '@fade|1s @fade|2s'
|
|
84
|
+
this.native.deleteRule(foundIndex);
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
this.rules.splice(this.rules.indexOf(rule), 1);
|
|
90
|
+
return rule;
|
|
91
|
+
}
|
|
92
|
+
reset() {
|
|
93
|
+
this.rules.length = 0;
|
|
94
|
+
const indexOfLayer = this.css.rules.indexOf(this);
|
|
95
|
+
if (indexOfLayer !== -1) {
|
|
96
|
+
this.css.rules.splice(indexOfLayer, 1);
|
|
97
|
+
}
|
|
98
|
+
// @ts-expect-error
|
|
99
|
+
this.usages = {};
|
|
100
|
+
const nativeSheet = this.css.style?.sheet;
|
|
101
|
+
if (this.native && nativeSheet) {
|
|
102
|
+
const foundIndex = findNativeCSSRuleIndex(nativeSheet.cssRules, this.native);
|
|
103
|
+
if (foundIndex !== -1) {
|
|
104
|
+
nativeSheet.deleteRule(foundIndex);
|
|
105
|
+
}
|
|
106
|
+
this.native = null;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
get text() {
|
|
110
|
+
return '@layer ' + this.name + '{' + this.rules.map(({ text })=>text).join('') + '}';
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
export { Layer as default };
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var findNativeCssRuleIndex = require('./shared/utils/find-native-css-rule-index.cjs');
|
|
4
|
+
|
|
5
|
+
class NonLayer {
|
|
6
|
+
css;
|
|
7
|
+
rules;
|
|
8
|
+
usages;
|
|
9
|
+
constructor(css){
|
|
10
|
+
this.css = css;
|
|
11
|
+
this.rules = [];
|
|
12
|
+
this.usages = {};
|
|
13
|
+
}
|
|
14
|
+
insert(rule) {
|
|
15
|
+
if (this.rules.includes(rule)) return;
|
|
16
|
+
const sheet = this.css.style?.sheet;
|
|
17
|
+
if (sheet) {
|
|
18
|
+
for(let i = 0; i < rule.nodes.length;){
|
|
19
|
+
try {
|
|
20
|
+
const nativeRule = rule.nodes[i];
|
|
21
|
+
const insertedIndex = sheet.insertRule(nativeRule.text, sheet.cssRules.length);
|
|
22
|
+
nativeRule.native = sheet.cssRules[insertedIndex];
|
|
23
|
+
i++;
|
|
24
|
+
} catch (error) {
|
|
25
|
+
console.error(error);
|
|
26
|
+
rule.nodes.splice(i, 1);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
this.rules.push(rule);
|
|
31
|
+
this.css.rules.push(rule);
|
|
32
|
+
}
|
|
33
|
+
delete(key) {
|
|
34
|
+
const rule = this.rules.find((rule)=>rule.key === key);
|
|
35
|
+
if (!rule) return;
|
|
36
|
+
const sheet = this.css.style?.sheet;
|
|
37
|
+
if (sheet) {
|
|
38
|
+
for (const node of rule.nodes){
|
|
39
|
+
const foundIndex = findNativeCssRuleIndex(sheet.cssRules, node.native);
|
|
40
|
+
if (foundIndex !== -1) {
|
|
41
|
+
sheet.deleteRule(foundIndex);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
this.rules.splice(this.rules.indexOf(rule), 1);
|
|
46
|
+
this.css.rules.splice(this.css.rules.indexOf(rule), 1);
|
|
47
|
+
return rule;
|
|
48
|
+
}
|
|
49
|
+
get text() {
|
|
50
|
+
return this.rules.map(({ text })=>text).join('');
|
|
51
|
+
}
|
|
52
|
+
reset() {
|
|
53
|
+
for (const rule of this.rules){
|
|
54
|
+
const foundIndex = this.css.rules.indexOf(rule);
|
|
55
|
+
if (foundIndex !== -1) {
|
|
56
|
+
this.css.rules.splice(foundIndex, 1);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
this.rules.length = 0;
|
|
60
|
+
// @ts-expect-error
|
|
61
|
+
this.usages = {};
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
module.exports = NonLayer;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import MasterCSS from './core';
|
|
2
|
+
import { Rule } from './rule';
|
|
3
|
+
export default class NonLayer {
|
|
4
|
+
css: MasterCSS;
|
|
5
|
+
readonly rules: Rule[];
|
|
6
|
+
readonly usages: Record<string, number>;
|
|
7
|
+
constructor(css: MasterCSS);
|
|
8
|
+
insert(rule: Rule): void;
|
|
9
|
+
delete(key: string): Rule | undefined;
|
|
10
|
+
get text(): string;
|
|
11
|
+
reset(): void;
|
|
12
|
+
}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import findNativeCSSRuleIndex from './shared/utils/find-native-css-rule-index.mjs';
|
|
2
|
+
|
|
3
|
+
class NonLayer {
|
|
4
|
+
css;
|
|
5
|
+
rules;
|
|
6
|
+
usages;
|
|
7
|
+
constructor(css){
|
|
8
|
+
this.css = css;
|
|
9
|
+
this.rules = [];
|
|
10
|
+
this.usages = {};
|
|
11
|
+
}
|
|
12
|
+
insert(rule) {
|
|
13
|
+
if (this.rules.includes(rule)) return;
|
|
14
|
+
const sheet = this.css.style?.sheet;
|
|
15
|
+
if (sheet) {
|
|
16
|
+
for(let i = 0; i < rule.nodes.length;){
|
|
17
|
+
try {
|
|
18
|
+
const nativeRule = rule.nodes[i];
|
|
19
|
+
const insertedIndex = sheet.insertRule(nativeRule.text, sheet.cssRules.length);
|
|
20
|
+
nativeRule.native = sheet.cssRules[insertedIndex];
|
|
21
|
+
i++;
|
|
22
|
+
} catch (error) {
|
|
23
|
+
console.error(error);
|
|
24
|
+
rule.nodes.splice(i, 1);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
this.rules.push(rule);
|
|
29
|
+
this.css.rules.push(rule);
|
|
30
|
+
}
|
|
31
|
+
delete(key) {
|
|
32
|
+
const rule = this.rules.find((rule)=>rule.key === key);
|
|
33
|
+
if (!rule) return;
|
|
34
|
+
const sheet = this.css.style?.sheet;
|
|
35
|
+
if (sheet) {
|
|
36
|
+
for (const node of rule.nodes){
|
|
37
|
+
const foundIndex = findNativeCSSRuleIndex(sheet.cssRules, node.native);
|
|
38
|
+
if (foundIndex !== -1) {
|
|
39
|
+
sheet.deleteRule(foundIndex);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
this.rules.splice(this.rules.indexOf(rule), 1);
|
|
44
|
+
this.css.rules.splice(this.css.rules.indexOf(rule), 1);
|
|
45
|
+
return rule;
|
|
46
|
+
}
|
|
47
|
+
get text() {
|
|
48
|
+
return this.rules.map(({ text })=>text).join('');
|
|
49
|
+
}
|
|
50
|
+
reset() {
|
|
51
|
+
for (const rule of this.rules){
|
|
52
|
+
const foundIndex = this.css.rules.indexOf(rule);
|
|
53
|
+
if (foundIndex !== -1) {
|
|
54
|
+
this.css.rules.splice(foundIndex, 1);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
this.rules.length = 0;
|
|
58
|
+
// @ts-expect-error
|
|
59
|
+
this.usages = {};
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
export { NonLayer as default };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _commonjsHelpers = require('../_virtual/_commonjsHelpers.cjs');
|
|
4
|
+
var cssEscape$1 = require('./css-escape2.cjs');
|
|
5
|
+
|
|
6
|
+
var cssEscapeExports = cssEscape$1.__require();
|
|
7
|
+
var cssEscape = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(cssEscapeExports);
|
|
8
|
+
|
|
9
|
+
module.exports = cssEscape;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { getDefaultExportFromCjs } from '../_virtual/_commonjsHelpers.mjs';
|
|
2
|
+
import { __require as requireCssEscape } from './css-escape2.mjs';
|
|
3
|
+
|
|
4
|
+
var cssEscapeExports = requireCssEscape();
|
|
5
|
+
var cssEscape = /*@__PURE__*/getDefaultExportFromCjs(cssEscapeExports);
|
|
6
|
+
|
|
7
|
+
export { cssEscape as default };
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _commonjsHelpers = require('../_virtual/_commonjsHelpers.cjs');
|
|
4
|
+
var cssEscape = require('../_virtual/css-escape.cjs');
|
|
5
|
+
|
|
6
|
+
var hasRequiredCssEscape;
|
|
7
|
+
|
|
8
|
+
function requireCssEscape () {
|
|
9
|
+
if (hasRequiredCssEscape) return cssEscape.__exports;
|
|
10
|
+
hasRequiredCssEscape = 1;
|
|
11
|
+
(()=>{
|
|
12
|
+
const root = typeof _commonjsHelpers.commonjsGlobal !== 'undefined' ? _commonjsHelpers.commonjsGlobal : window;
|
|
13
|
+
if (!root.CSS && !root.CSS?.escape) {
|
|
14
|
+
// https://drafts.csswg.org/cssom/#serialize-an-identifier
|
|
15
|
+
const cssEscape = function(value) {
|
|
16
|
+
if (arguments.length == 0) {
|
|
17
|
+
throw new TypeError('`CSS.escape` requires an argument.');
|
|
18
|
+
}
|
|
19
|
+
const string = String(value);
|
|
20
|
+
const length = string.length;
|
|
21
|
+
let index = -1;
|
|
22
|
+
let result = '';
|
|
23
|
+
let codeUnit;
|
|
24
|
+
const firstCodeUnit = string.charCodeAt(0);
|
|
25
|
+
if (// If the character is the first character and is a `-` (U+002D), and
|
|
26
|
+
// there is no second character, […]
|
|
27
|
+
length == 1 && firstCodeUnit == 0x002D) {
|
|
28
|
+
return '\\' + string;
|
|
29
|
+
}
|
|
30
|
+
while(++index < length){
|
|
31
|
+
codeUnit = string.charCodeAt(index);
|
|
32
|
+
// Note: there’s no need to special-case astral symbols, surrogate
|
|
33
|
+
// pairs, or lone surrogates.
|
|
34
|
+
// If the character is NULL (U+0000), then the REPLACEMENT CHARACTER
|
|
35
|
+
// (U+FFFD).
|
|
36
|
+
if (codeUnit == 0x0000) {
|
|
37
|
+
result += '\uFFFD';
|
|
38
|
+
continue;
|
|
39
|
+
}
|
|
40
|
+
if (// If the character is in the range [\1-\1F] (U+0001 to U+001F) or is
|
|
41
|
+
// U+007F, […]
|
|
42
|
+
codeUnit >= 0x0001 && codeUnit <= 0x001F || codeUnit == 0x007F || // If the character is the first character and is in the range [0-9]
|
|
43
|
+
// (U+0030 to U+0039), […]
|
|
44
|
+
index == 0 && codeUnit >= 0x0030 && codeUnit <= 0x0039 || // If the character is the second character and is in the range [0-9]
|
|
45
|
+
// (U+0030 to U+0039) and the first character is a `-` (U+002D), […]
|
|
46
|
+
index == 1 && codeUnit >= 0x0030 && codeUnit <= 0x0039 && firstCodeUnit == 0x002D) {
|
|
47
|
+
// https://drafts.csswg.org/cssom/#escape-a-character-as-code-point
|
|
48
|
+
result += '\\' + codeUnit.toString(16) + ' ';
|
|
49
|
+
continue;
|
|
50
|
+
}
|
|
51
|
+
// If the character is not handled by one of the above syntaxes and is
|
|
52
|
+
// greater than or equal to U+0080, is `-` (U+002D) or `_` (U+005F), or
|
|
53
|
+
// is in one of the ranges [0-9] (U+0030 to U+0039), [A-Z] (U+0041 to
|
|
54
|
+
// U+005A), or [a-z] (U+0061 to U+007A), […]
|
|
55
|
+
if (codeUnit >= 0x0080 || codeUnit == 0x002D || codeUnit == 0x005F || codeUnit >= 0x0030 && codeUnit <= 0x0039 || codeUnit >= 0x0041 && codeUnit <= 0x005A || codeUnit >= 0x0061 && codeUnit <= 0x007A) {
|
|
56
|
+
// the character itself
|
|
57
|
+
result += string.charAt(index);
|
|
58
|
+
continue;
|
|
59
|
+
}
|
|
60
|
+
// Otherwise, the escaped character.
|
|
61
|
+
// https://drafts.csswg.org/cssom/#escape-a-character
|
|
62
|
+
result += '\\' + string.charAt(index);
|
|
63
|
+
}
|
|
64
|
+
return result;
|
|
65
|
+
};
|
|
66
|
+
if (!root.CSS) {
|
|
67
|
+
root.CSS = {};
|
|
68
|
+
}
|
|
69
|
+
root.CSS.escape = cssEscape;
|
|
70
|
+
globalThis.CSS.escape = cssEscape;
|
|
71
|
+
}
|
|
72
|
+
})();
|
|
73
|
+
return cssEscape.__exports;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
exports.__require = requireCssEscape;
|