@teamturing/react-kit 1.1.0
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/LICENSE +21 -0
- package/README.md +5 -0
- package/dist/core/Chip/index.d.ts +25 -0
- package/dist/core/GradientText/index.d.ts +287 -0
- package/dist/core/Grid/index.d.ts +25 -0
- package/dist/core/IconButton/index.d.ts +53 -0
- package/dist/core/IconToggleButton/index.d.ts +28 -0
- package/dist/core/ItemList/index.d.ts +10 -0
- package/dist/core/Space/index.d.ts +8 -0
- package/dist/core/Spinner/index.d.ts +487 -0
- package/dist/core/Stack/index.d.ts +19 -0
- package/dist/core/StyledIcon/index.d.ts +10 -0
- package/dist/core/Text/index.d.ts +10 -0
- package/dist/core/View/index.d.ts +8 -0
- package/dist/core/_UnstyledButton.d.ts +6 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.js +4010 -0
- package/dist/utils/forcePixelValue.d.ts +6 -0
- package/dist/utils/index.d.ts +3 -0
- package/dist/utils/isArray.d.ts +1 -0
- package/dist/utils/isNullable.d.ts +1 -0
- package/dist/utils/styled-system/index.d.ts +31 -0
- package/esm/_virtual/_commonjsHelpers.js +5 -0
- package/esm/_virtual/_rollupPluginBabelHelpers.js +16 -0
- package/esm/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js +12 -0
- package/esm/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js +9 -0
- package/esm/node_modules/@emotion/unitless/dist/emotion-unitless.esm.js +51 -0
- package/esm/node_modules/@styled-system/background/dist/index.esm.js +16 -0
- package/esm/node_modules/@styled-system/border/dist/index.esm.js +131 -0
- package/esm/node_modules/@styled-system/color/dist/index.esm.js +17 -0
- package/esm/node_modules/@styled-system/core/dist/index.esm.js +178 -0
- package/esm/node_modules/@styled-system/css/dist/index.esm.js +209 -0
- package/esm/node_modules/@styled-system/flexbox/dist/index.esm.js +21 -0
- package/esm/node_modules/@styled-system/grid/dist/index.esm.js +34 -0
- package/esm/node_modules/@styled-system/layout/dist/index.esm.js +47 -0
- package/esm/node_modules/@styled-system/position/dist/index.esm.js +35 -0
- package/esm/node_modules/@styled-system/shadow/dist/index.esm.js +14 -0
- package/esm/node_modules/@styled-system/space/dist/index.esm.js +121 -0
- package/esm/node_modules/@styled-system/typography/dist/index.esm.js +33 -0
- package/esm/node_modules/@styled-system/variant/dist/index.esm.js +40 -0
- package/esm/node_modules/object-assign/index.js +83 -0
- package/esm/node_modules/styled-components/dist/styled-components.esm.js +657 -0
- package/esm/node_modules/styled-system/dist/index.esm.js +77 -0
- package/esm/node_modules/stylis/src/Enum.js +11 -0
- package/esm/node_modules/stylis/src/Middleware.js +85 -0
- package/esm/node_modules/stylis/src/Parser.js +187 -0
- package/esm/node_modules/stylis/src/Prefixer.js +197 -0
- package/esm/node_modules/stylis/src/Serializer.js +39 -0
- package/esm/node_modules/stylis/src/Tokenizer.js +242 -0
- package/esm/node_modules/stylis/src/Utility.js +128 -0
- package/esm/node_modules/tslib/tslib.es6.js +44 -0
- package/esm/packages/icons/src/ProgressGradient.js +41 -0
- package/esm/packages/react-kit/src/core/Chip/index.js +179 -0
- package/esm/packages/react-kit/src/core/GradientText/index.js +13 -0
- package/esm/packages/react-kit/src/core/Grid/index.js +106 -0
- package/esm/packages/react-kit/src/core/IconButton/index.js +212 -0
- package/esm/packages/react-kit/src/core/IconToggleButton/index.js +105 -0
- package/esm/packages/react-kit/src/core/ItemList/index.js +11 -0
- package/esm/packages/react-kit/src/core/Space/index.js +12 -0
- package/esm/packages/react-kit/src/core/Spinner/index.js +23 -0
- package/esm/packages/react-kit/src/core/Stack/index.js +57 -0
- package/esm/packages/react-kit/src/core/StyledIcon/index.js +20 -0
- package/esm/packages/react-kit/src/core/Text/index.js +49 -0
- package/esm/packages/react-kit/src/core/View/index.js +18 -0
- package/esm/packages/react-kit/src/core/_UnstyledButton.js +14 -0
- package/esm/packages/react-kit/src/index.js +12 -0
- package/esm/packages/react-kit/src/utils/forcePixelValue.js +8 -0
- package/esm/packages/react-kit/src/utils/isArray.js +3 -0
- package/esm/packages/react-kit/src/utils/isNullable.js +3 -0
- package/esm/packages/react-kit/src/utils/styled-system/index.js +27 -0
- package/esm/packages/token-studio/src/foundation/palette/index.js +90 -0
- package/esm/packages/token-studio/src/foundation/rounding/index.js +13 -0
- package/esm/packages/token-studio/src/foundation/spacing/index.js +56 -0
- package/esm/packages/token-studio/src/foundation/typography/fontSize/index.js +18 -0
- package/esm/packages/token-studio/src/foundation/typography/fontWeight/index.js +13 -0
- package/esm/packages/token-studio/src/foundation/typography/lineHeight/index.js +6 -0
- package/esm/packages/token-studio/src/token/color/index.js +140 -0
- package/esm/packages/token-studio/src/token/radii/index.js +15 -0
- package/esm/packages/token-studio/src/token/space/index.js +55 -0
- package/esm/packages/token-studio/src/token/typography/fontSizes.js +17 -0
- package/esm/packages/token-studio/src/token/typography/fontWeights.js +9 -0
- package/esm/packages/token-studio/src/token/typography/index.js +133 -0
- package/esm/packages/token-studio/src/token/typography/lineHeights.js +8 -0
- package/package.json +59 -0
- package/src/index.ts +12 -0
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import '../../object-assign/index.js';
|
|
2
|
+
import { layout } from '../../@styled-system/layout/dist/index.esm.js';
|
|
3
|
+
import { color } from '../../@styled-system/color/dist/index.esm.js';
|
|
4
|
+
import { typography } from '../../@styled-system/typography/dist/index.esm.js';
|
|
5
|
+
import { flexbox } from '../../@styled-system/flexbox/dist/index.esm.js';
|
|
6
|
+
import { grid } from '../../@styled-system/grid/dist/index.esm.js';
|
|
7
|
+
import { border } from '../../@styled-system/border/dist/index.esm.js';
|
|
8
|
+
import { background } from '../../@styled-system/background/dist/index.esm.js';
|
|
9
|
+
import { position } from '../../@styled-system/position/dist/index.esm.js';
|
|
10
|
+
export { margin, padding, space } from '../../@styled-system/space/dist/index.esm.js';
|
|
11
|
+
export { shadow as boxShadow, shadow, shadow as textShadow } from '../../@styled-system/shadow/dist/index.esm.js';
|
|
12
|
+
export { variant } from '../../@styled-system/variant/dist/index.esm.js';
|
|
13
|
+
|
|
14
|
+
layout.width;
|
|
15
|
+
layout.height;
|
|
16
|
+
layout.minWidth;
|
|
17
|
+
layout.minHeight;
|
|
18
|
+
layout.maxWidth;
|
|
19
|
+
layout.maxHeight;
|
|
20
|
+
layout.size;
|
|
21
|
+
layout.verticalAlign;
|
|
22
|
+
layout.display;
|
|
23
|
+
layout.overflow;
|
|
24
|
+
layout.overflowX;
|
|
25
|
+
layout.overflowY;
|
|
26
|
+
color.opacity;
|
|
27
|
+
var fontSize = typography.fontSize;
|
|
28
|
+
typography.fontFamily;
|
|
29
|
+
var fontWeight = typography.fontWeight,
|
|
30
|
+
lineHeight = typography.lineHeight,
|
|
31
|
+
textAlign = typography.textAlign;
|
|
32
|
+
typography.fontStyle;
|
|
33
|
+
typography.letterSpacing;
|
|
34
|
+
flexbox.alignItems;
|
|
35
|
+
flexbox.alignContent;
|
|
36
|
+
flexbox.justifyItems;
|
|
37
|
+
flexbox.justifyContent;
|
|
38
|
+
flexbox.flexWrap;
|
|
39
|
+
flexbox.flexDirection;
|
|
40
|
+
flexbox.flex;
|
|
41
|
+
flexbox.flexGrow;
|
|
42
|
+
flexbox.flexShrink;
|
|
43
|
+
flexbox.flexBasis;
|
|
44
|
+
flexbox.justifySelf;
|
|
45
|
+
flexbox.alignSelf;
|
|
46
|
+
flexbox.order;
|
|
47
|
+
grid.gridGap;
|
|
48
|
+
grid.gridColumnGap;
|
|
49
|
+
grid.gridRowGap;
|
|
50
|
+
grid.gridColumn;
|
|
51
|
+
grid.gridRow;
|
|
52
|
+
grid.gridAutoFlow;
|
|
53
|
+
grid.gridAutoColumns;
|
|
54
|
+
grid.gridAutoRows;
|
|
55
|
+
grid.gridTemplateColumns;
|
|
56
|
+
grid.gridTemplateRows;
|
|
57
|
+
grid.gridTemplateAreas;
|
|
58
|
+
grid.gridArea;
|
|
59
|
+
border.borderWidth;
|
|
60
|
+
border.borderStyle;
|
|
61
|
+
border.borderColor;
|
|
62
|
+
border.borderTop;
|
|
63
|
+
border.borderRight;
|
|
64
|
+
border.borderBottom;
|
|
65
|
+
border.borderLeft;
|
|
66
|
+
border.borderRadius;
|
|
67
|
+
background.backgroundImage;
|
|
68
|
+
background.backgroundSize;
|
|
69
|
+
background.backgroundPosition;
|
|
70
|
+
background.backgroundRepeat;
|
|
71
|
+
position.zIndex;
|
|
72
|
+
position.top;
|
|
73
|
+
position.right;
|
|
74
|
+
position.bottom;
|
|
75
|
+
position.left;
|
|
76
|
+
|
|
77
|
+
export { background, border, border as borders, color, flexbox, fontSize, fontWeight, grid, layout, lineHeight, position, textAlign, typography };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
var MS = '-ms-';
|
|
2
|
+
var MOZ = '-moz-';
|
|
3
|
+
var WEBKIT = '-webkit-';
|
|
4
|
+
var COMMENT = 'comm';
|
|
5
|
+
var RULESET = 'rule';
|
|
6
|
+
var DECLARATION = 'decl';
|
|
7
|
+
var IMPORT = '@import';
|
|
8
|
+
var KEYFRAMES = '@keyframes';
|
|
9
|
+
var LAYER = '@layer';
|
|
10
|
+
|
|
11
|
+
export { COMMENT, DECLARATION, IMPORT, KEYFRAMES, LAYER, MOZ, MS, RULESET, WEBKIT };
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import { RULESET, KEYFRAMES, DECLARATION, WEBKIT, MOZ, MS } from './Enum.js';
|
|
2
|
+
import { combine, replace, sizeof, match, assign, filter } from './Utility.js';
|
|
3
|
+
import { copy, lift } from './Tokenizer.js';
|
|
4
|
+
import { serialize } from './Serializer.js';
|
|
5
|
+
import { prefix } from './Prefixer.js';
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* @param {function[]} collection
|
|
9
|
+
* @return {function}
|
|
10
|
+
*/
|
|
11
|
+
function middleware(collection) {
|
|
12
|
+
var length = sizeof(collection);
|
|
13
|
+
return function (element, index, children, callback) {
|
|
14
|
+
var output = '';
|
|
15
|
+
for (var i = 0; i < length; i++) output += collection[i](element, index, children, callback) || '';
|
|
16
|
+
return output;
|
|
17
|
+
};
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* @param {function} callback
|
|
22
|
+
* @return {function}
|
|
23
|
+
*/
|
|
24
|
+
function rulesheet(callback) {
|
|
25
|
+
return function (element) {
|
|
26
|
+
if (!element.root) if (element = element.return) callback(element);
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* @param {object} element
|
|
32
|
+
* @param {number} index
|
|
33
|
+
* @param {object[]} children
|
|
34
|
+
* @param {function} callback
|
|
35
|
+
*/
|
|
36
|
+
function prefixer(element, index, children, callback) {
|
|
37
|
+
if (element.length > -1) if (!element.return) switch (element.type) {
|
|
38
|
+
case DECLARATION:
|
|
39
|
+
element.return = prefix(element.value, element.length, children);
|
|
40
|
+
return;
|
|
41
|
+
case KEYFRAMES:
|
|
42
|
+
return serialize([copy(element, {
|
|
43
|
+
value: replace(element.value, '@', '@' + WEBKIT)
|
|
44
|
+
})], callback);
|
|
45
|
+
case RULESET:
|
|
46
|
+
if (element.length) return combine(children = element.props, function (value) {
|
|
47
|
+
switch (match(value, callback = /(::plac\w+|:read-\w+)/)) {
|
|
48
|
+
// :read-(only|write)
|
|
49
|
+
case ':read-only':
|
|
50
|
+
case ':read-write':
|
|
51
|
+
lift(copy(element, {
|
|
52
|
+
props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]
|
|
53
|
+
}));
|
|
54
|
+
lift(copy(element, {
|
|
55
|
+
props: [value]
|
|
56
|
+
}));
|
|
57
|
+
assign(element, {
|
|
58
|
+
props: filter(children, callback)
|
|
59
|
+
});
|
|
60
|
+
break;
|
|
61
|
+
// :placeholder
|
|
62
|
+
case '::placeholder':
|
|
63
|
+
lift(copy(element, {
|
|
64
|
+
props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]
|
|
65
|
+
}));
|
|
66
|
+
lift(copy(element, {
|
|
67
|
+
props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]
|
|
68
|
+
}));
|
|
69
|
+
lift(copy(element, {
|
|
70
|
+
props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]
|
|
71
|
+
}));
|
|
72
|
+
lift(copy(element, {
|
|
73
|
+
props: [value]
|
|
74
|
+
}));
|
|
75
|
+
assign(element, {
|
|
76
|
+
props: filter(children, callback)
|
|
77
|
+
});
|
|
78
|
+
break;
|
|
79
|
+
}
|
|
80
|
+
return '';
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
export { middleware, prefixer, rulesheet };
|
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
import { COMMENT, DECLARATION, RULESET } from './Enum.js';
|
|
2
|
+
import { strlen, append, charat, replace, indexof, sizeof, substr, abs, trim, from } from './Utility.js';
|
|
3
|
+
import { dealloc, alloc, next, peek, delimit, identifier, commenter, escaping, whitespace, node, char, prev, caret } from './Tokenizer.js';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* @param {string} value
|
|
7
|
+
* @return {object[]}
|
|
8
|
+
*/
|
|
9
|
+
function compile(value) {
|
|
10
|
+
return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value));
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* @param {string} value
|
|
15
|
+
* @param {object} root
|
|
16
|
+
* @param {object?} parent
|
|
17
|
+
* @param {string[]} rule
|
|
18
|
+
* @param {string[]} rules
|
|
19
|
+
* @param {string[]} rulesets
|
|
20
|
+
* @param {number[]} pseudo
|
|
21
|
+
* @param {number[]} points
|
|
22
|
+
* @param {string[]} declarations
|
|
23
|
+
* @return {object}
|
|
24
|
+
*/
|
|
25
|
+
function parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
|
|
26
|
+
var index = 0;
|
|
27
|
+
var offset = 0;
|
|
28
|
+
var length = pseudo;
|
|
29
|
+
var atrule = 0;
|
|
30
|
+
var property = 0;
|
|
31
|
+
var previous = 0;
|
|
32
|
+
var variable = 1;
|
|
33
|
+
var scanning = 1;
|
|
34
|
+
var ampersand = 1;
|
|
35
|
+
var character = 0;
|
|
36
|
+
var type = '';
|
|
37
|
+
var props = rules;
|
|
38
|
+
var children = rulesets;
|
|
39
|
+
var reference = rule;
|
|
40
|
+
var characters = type;
|
|
41
|
+
while (scanning) switch (previous = character, character = next()) {
|
|
42
|
+
// (
|
|
43
|
+
case 40:
|
|
44
|
+
if (previous != 108 && charat(characters, length - 1) == 58) {
|
|
45
|
+
if (indexof(characters += replace(delimit(character), '&', '&\f'), '&\f') != -1) ampersand = -1;
|
|
46
|
+
break;
|
|
47
|
+
}
|
|
48
|
+
// " ' [
|
|
49
|
+
case 34:
|
|
50
|
+
case 39:
|
|
51
|
+
case 91:
|
|
52
|
+
characters += delimit(character);
|
|
53
|
+
break;
|
|
54
|
+
// \t \n \r \s
|
|
55
|
+
case 9:
|
|
56
|
+
case 10:
|
|
57
|
+
case 13:
|
|
58
|
+
case 32:
|
|
59
|
+
characters += whitespace(previous);
|
|
60
|
+
break;
|
|
61
|
+
// \
|
|
62
|
+
case 92:
|
|
63
|
+
characters += escaping(caret() - 1, 7);
|
|
64
|
+
continue;
|
|
65
|
+
// /
|
|
66
|
+
case 47:
|
|
67
|
+
switch (peek()) {
|
|
68
|
+
case 42:
|
|
69
|
+
case 47:
|
|
70
|
+
append(comment(commenter(next(), caret()), root, parent, declarations), declarations);
|
|
71
|
+
break;
|
|
72
|
+
default:
|
|
73
|
+
characters += '/';
|
|
74
|
+
}
|
|
75
|
+
break;
|
|
76
|
+
// {
|
|
77
|
+
case 123 * variable:
|
|
78
|
+
points[index++] = strlen(characters) * ampersand;
|
|
79
|
+
// } ; \0
|
|
80
|
+
case 125 * variable:
|
|
81
|
+
case 59:
|
|
82
|
+
case 0:
|
|
83
|
+
switch (character) {
|
|
84
|
+
// \0 }
|
|
85
|
+
case 0:
|
|
86
|
+
case 125:
|
|
87
|
+
scanning = 0;
|
|
88
|
+
// ;
|
|
89
|
+
case 59 + offset:
|
|
90
|
+
if (ampersand == -1) characters = replace(characters, /\f/g, '');
|
|
91
|
+
if (property > 0 && strlen(characters) - length) append(property > 32 ? declaration(characters + ';', rule, parent, length - 1, declarations) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2, declarations), declarations);
|
|
92
|
+
break;
|
|
93
|
+
// @ ;
|
|
94
|
+
case 59:
|
|
95
|
+
characters += ';';
|
|
96
|
+
// { rule/at-rule
|
|
97
|
+
default:
|
|
98
|
+
append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length, rulesets), rulesets);
|
|
99
|
+
if (character === 123) if (offset === 0) parse(characters, root, reference, reference, props, rulesets, length, points, children);else switch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {
|
|
100
|
+
// d l m s
|
|
101
|
+
case 100:
|
|
102
|
+
case 108:
|
|
103
|
+
case 109:
|
|
104
|
+
case 115:
|
|
105
|
+
parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length, children), children), rules, children, length, points, rule ? props : children);
|
|
106
|
+
break;
|
|
107
|
+
default:
|
|
108
|
+
parse(characters, reference, reference, reference, [''], children, 0, points, children);
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo;
|
|
112
|
+
break;
|
|
113
|
+
// :
|
|
114
|
+
case 58:
|
|
115
|
+
length = 1 + strlen(characters), property = previous;
|
|
116
|
+
default:
|
|
117
|
+
if (variable < 1) if (character == 123) --variable;else if (character == 125 && variable++ == 0 && prev() == 125) continue;
|
|
118
|
+
switch (characters += from(character), character * variable) {
|
|
119
|
+
// &
|
|
120
|
+
case 38:
|
|
121
|
+
ampersand = offset > 0 ? 1 : (characters += '\f', -1);
|
|
122
|
+
break;
|
|
123
|
+
// ,
|
|
124
|
+
case 44:
|
|
125
|
+
points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1;
|
|
126
|
+
break;
|
|
127
|
+
// @
|
|
128
|
+
case 64:
|
|
129
|
+
// -
|
|
130
|
+
if (peek() === 45) characters += delimit(next());
|
|
131
|
+
atrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++;
|
|
132
|
+
break;
|
|
133
|
+
// -
|
|
134
|
+
case 45:
|
|
135
|
+
if (previous === 45 && strlen(characters) == 2) variable = 0;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
return rulesets;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
/**
|
|
142
|
+
* @param {string} value
|
|
143
|
+
* @param {object} root
|
|
144
|
+
* @param {object?} parent
|
|
145
|
+
* @param {number} index
|
|
146
|
+
* @param {number} offset
|
|
147
|
+
* @param {string[]} rules
|
|
148
|
+
* @param {number[]} points
|
|
149
|
+
* @param {string} type
|
|
150
|
+
* @param {string[]} props
|
|
151
|
+
* @param {string[]} children
|
|
152
|
+
* @param {number} length
|
|
153
|
+
* @param {object[]} siblings
|
|
154
|
+
* @return {object}
|
|
155
|
+
*/
|
|
156
|
+
function ruleset(value, root, parent, index, offset, rules, points, type, props, children, length, siblings) {
|
|
157
|
+
var post = offset - 1;
|
|
158
|
+
var rule = offset === 0 ? rules : [''];
|
|
159
|
+
var size = sizeof(rule);
|
|
160
|
+
for (var i = 0, j = 0, k = 0; i < index; ++i) for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x) if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\f/g, rule[x]))) props[k++] = z;
|
|
161
|
+
return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length, siblings);
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
/**
|
|
165
|
+
* @param {number} value
|
|
166
|
+
* @param {object} root
|
|
167
|
+
* @param {object?} parent
|
|
168
|
+
* @param {object[]} siblings
|
|
169
|
+
* @return {object}
|
|
170
|
+
*/
|
|
171
|
+
function comment(value, root, parent, siblings) {
|
|
172
|
+
return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0, siblings);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
/**
|
|
176
|
+
* @param {string} value
|
|
177
|
+
* @param {object} root
|
|
178
|
+
* @param {object?} parent
|
|
179
|
+
* @param {number} length
|
|
180
|
+
* @param {object[]} siblings
|
|
181
|
+
* @return {object}
|
|
182
|
+
*/
|
|
183
|
+
function declaration(value, root, parent, length, siblings) {
|
|
184
|
+
return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length, siblings);
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
export { comment, compile, declaration, parse, ruleset };
|
|
@@ -0,0 +1,197 @@
|
|
|
1
|
+
import { MS, WEBKIT, MOZ } from './Enum.js';
|
|
2
|
+
import { hash, replace, charat, strlen, indexof, match, substr } from './Utility.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* @param {string} value
|
|
6
|
+
* @param {number} length
|
|
7
|
+
* @param {object[]} children
|
|
8
|
+
* @return {string}
|
|
9
|
+
*/
|
|
10
|
+
function prefix(value, length, children) {
|
|
11
|
+
switch (hash(value, length)) {
|
|
12
|
+
// color-adjust
|
|
13
|
+
case 5103:
|
|
14
|
+
return WEBKIT + 'print-' + value + value;
|
|
15
|
+
// animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
|
|
16
|
+
case 5737:
|
|
17
|
+
case 4201:
|
|
18
|
+
case 3177:
|
|
19
|
+
case 3433:
|
|
20
|
+
case 1641:
|
|
21
|
+
case 4457:
|
|
22
|
+
case 2921:
|
|
23
|
+
// text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
|
|
24
|
+
case 5572:
|
|
25
|
+
case 6356:
|
|
26
|
+
case 5844:
|
|
27
|
+
case 3191:
|
|
28
|
+
case 6645:
|
|
29
|
+
case 3005:
|
|
30
|
+
// mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
|
|
31
|
+
case 6391:
|
|
32
|
+
case 5879:
|
|
33
|
+
case 5623:
|
|
34
|
+
case 6135:
|
|
35
|
+
case 4599:
|
|
36
|
+
case 4855:
|
|
37
|
+
// background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
|
|
38
|
+
case 4215:
|
|
39
|
+
case 6389:
|
|
40
|
+
case 5109:
|
|
41
|
+
case 5365:
|
|
42
|
+
case 5621:
|
|
43
|
+
case 3829:
|
|
44
|
+
return WEBKIT + value + value;
|
|
45
|
+
// tab-size
|
|
46
|
+
case 4789:
|
|
47
|
+
return MOZ + value + value;
|
|
48
|
+
// appearance, user-select, transform, hyphens, text-size-adjust
|
|
49
|
+
case 5349:
|
|
50
|
+
case 4246:
|
|
51
|
+
case 4810:
|
|
52
|
+
case 6968:
|
|
53
|
+
case 2756:
|
|
54
|
+
return WEBKIT + value + MOZ + value + MS + value + value;
|
|
55
|
+
// writing-mode
|
|
56
|
+
case 5936:
|
|
57
|
+
switch (charat(value, length + 11)) {
|
|
58
|
+
// vertical-l(r)
|
|
59
|
+
case 114:
|
|
60
|
+
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
|
|
61
|
+
// vertical-r(l)
|
|
62
|
+
case 108:
|
|
63
|
+
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
|
|
64
|
+
// horizontal(-)tb
|
|
65
|
+
case 45:
|
|
66
|
+
return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
|
|
67
|
+
// default: fallthrough to below
|
|
68
|
+
}
|
|
69
|
+
// flex, flex-direction, scroll-snap-type, writing-mode
|
|
70
|
+
case 6828:
|
|
71
|
+
case 4268:
|
|
72
|
+
case 2903:
|
|
73
|
+
return WEBKIT + value + MS + value + value;
|
|
74
|
+
// order
|
|
75
|
+
case 6165:
|
|
76
|
+
return WEBKIT + value + MS + 'flex-' + value + value;
|
|
77
|
+
// align-items
|
|
78
|
+
case 5187:
|
|
79
|
+
return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;
|
|
80
|
+
// align-self
|
|
81
|
+
case 5443:
|
|
82
|
+
return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/g, '') + (!match(value, /flex-|baseline/) ? MS + 'grid-row-' + replace(value, /flex-|-self/g, '') : '') + value;
|
|
83
|
+
// align-content
|
|
84
|
+
case 4675:
|
|
85
|
+
return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/g, '') + value;
|
|
86
|
+
// flex-shrink
|
|
87
|
+
case 5548:
|
|
88
|
+
return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;
|
|
89
|
+
// flex-basis
|
|
90
|
+
case 5292:
|
|
91
|
+
return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;
|
|
92
|
+
// flex-grow
|
|
93
|
+
case 6060:
|
|
94
|
+
return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;
|
|
95
|
+
// transition
|
|
96
|
+
case 4554:
|
|
97
|
+
return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;
|
|
98
|
+
// cursor
|
|
99
|
+
case 6187:
|
|
100
|
+
return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;
|
|
101
|
+
// background, background-image
|
|
102
|
+
case 5495:
|
|
103
|
+
case 3959:
|
|
104
|
+
return replace(value, /(image-set\([^]*)/, WEBKIT + '$1' + '$`$1');
|
|
105
|
+
// justify-content
|
|
106
|
+
case 4968:
|
|
107
|
+
return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;
|
|
108
|
+
// justify-self
|
|
109
|
+
case 4200:
|
|
110
|
+
if (!match(value, /flex-|baseline/)) return MS + 'grid-column-align' + substr(value, length) + value;
|
|
111
|
+
break;
|
|
112
|
+
// grid-template-(columns|rows)
|
|
113
|
+
case 2592:
|
|
114
|
+
case 3360:
|
|
115
|
+
return MS + replace(value, 'template-', '') + value;
|
|
116
|
+
// grid-(row|column)-start
|
|
117
|
+
case 4384:
|
|
118
|
+
case 3616:
|
|
119
|
+
if (children && children.some(function (element, index) {
|
|
120
|
+
return length = index, match(element.props, /grid-\w+-end/);
|
|
121
|
+
})) {
|
|
122
|
+
return ~indexof(value + (children = children[length].value), 'span') ? value : MS + replace(value, '-start', '') + value + MS + 'grid-row-span:' + (~indexof(children, 'span') ? match(children, /\d+/) : +match(children, /\d+/) - +match(value, /\d+/)) + ';';
|
|
123
|
+
}
|
|
124
|
+
return MS + replace(value, '-start', '') + value;
|
|
125
|
+
// grid-(row|column)-end
|
|
126
|
+
case 4896:
|
|
127
|
+
case 4128:
|
|
128
|
+
return children && children.some(function (element) {
|
|
129
|
+
return match(element.props, /grid-\w+-start/);
|
|
130
|
+
}) ? value : MS + replace(replace(value, '-end', '-span'), 'span ', '') + value;
|
|
131
|
+
// (margin|padding)-inline-(start|end)
|
|
132
|
+
case 4095:
|
|
133
|
+
case 3583:
|
|
134
|
+
case 4068:
|
|
135
|
+
case 2532:
|
|
136
|
+
return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;
|
|
137
|
+
// (min|max)?(width|height|inline-size|block-size)
|
|
138
|
+
case 8116:
|
|
139
|
+
case 7059:
|
|
140
|
+
case 5753:
|
|
141
|
+
case 5535:
|
|
142
|
+
case 5445:
|
|
143
|
+
case 5701:
|
|
144
|
+
case 4933:
|
|
145
|
+
case 4677:
|
|
146
|
+
case 5533:
|
|
147
|
+
case 5789:
|
|
148
|
+
case 5021:
|
|
149
|
+
case 4765:
|
|
150
|
+
// stretch, max-content, min-content, fill-available
|
|
151
|
+
if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {
|
|
152
|
+
// (m)ax-content, (m)in-content
|
|
153
|
+
case 109:
|
|
154
|
+
// -
|
|
155
|
+
if (charat(value, length + 4) !== 45) break;
|
|
156
|
+
// (f)ill-available, (f)it-content
|
|
157
|
+
case 102:
|
|
158
|
+
return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
|
|
159
|
+
// (s)tretch
|
|
160
|
+
case 115:
|
|
161
|
+
return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length, children) + value : value;
|
|
162
|
+
}
|
|
163
|
+
break;
|
|
164
|
+
// grid-(column|row)
|
|
165
|
+
case 5152:
|
|
166
|
+
case 5920:
|
|
167
|
+
return replace(value, /(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/, function (_, a, b, c, d, e, f) {
|
|
168
|
+
return MS + a + ':' + b + f + (c ? MS + a + '-span:' + (d ? e : +e - +b) + f : '') + value;
|
|
169
|
+
});
|
|
170
|
+
// position: sticky
|
|
171
|
+
case 4949:
|
|
172
|
+
// stick(y)?
|
|
173
|
+
if (charat(value, length + 6) === 121) return replace(value, ':', ':' + WEBKIT) + value;
|
|
174
|
+
break;
|
|
175
|
+
// display: (flex|inline-flex|grid|inline-grid)
|
|
176
|
+
case 6444:
|
|
177
|
+
switch (charat(value, charat(value, 14) === 45 ? 18 : 11)) {
|
|
178
|
+
// (inline-)?fle(x)
|
|
179
|
+
case 120:
|
|
180
|
+
return replace(value, /(.+:)([^;\s!]+)(;|(\s+)?!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;
|
|
181
|
+
// (inline-)?gri(d)
|
|
182
|
+
case 100:
|
|
183
|
+
return replace(value, ':', ':' + MS) + value;
|
|
184
|
+
}
|
|
185
|
+
break;
|
|
186
|
+
// scroll-margin, scroll-margin-(top|right|bottom|left)
|
|
187
|
+
case 5719:
|
|
188
|
+
case 2647:
|
|
189
|
+
case 2135:
|
|
190
|
+
case 3927:
|
|
191
|
+
case 2391:
|
|
192
|
+
return replace(value, 'scroll-', 'scroll-snap-') + value;
|
|
193
|
+
}
|
|
194
|
+
return value;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
export { prefix };
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { RULESET, KEYFRAMES, COMMENT, DECLARATION, IMPORT, LAYER } from './Enum.js';
|
|
2
|
+
import { strlen } from './Utility.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* @param {object[]} children
|
|
6
|
+
* @param {function} callback
|
|
7
|
+
* @return {string}
|
|
8
|
+
*/
|
|
9
|
+
function serialize(children, callback) {
|
|
10
|
+
var output = '';
|
|
11
|
+
for (var i = 0; i < children.length; i++) output += callback(children[i], i, children, callback) || '';
|
|
12
|
+
return output;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* @param {object} element
|
|
17
|
+
* @param {number} index
|
|
18
|
+
* @param {object[]} children
|
|
19
|
+
* @param {function} callback
|
|
20
|
+
* @return {string}
|
|
21
|
+
*/
|
|
22
|
+
function stringify(element, index, children, callback) {
|
|
23
|
+
switch (element.type) {
|
|
24
|
+
case LAYER:
|
|
25
|
+
if (element.children.length) break;
|
|
26
|
+
case IMPORT:
|
|
27
|
+
case DECLARATION:
|
|
28
|
+
return element.return = element.return || element.value;
|
|
29
|
+
case COMMENT:
|
|
30
|
+
return '';
|
|
31
|
+
case KEYFRAMES:
|
|
32
|
+
return element.return = element.value + '{' + serialize(element.children, callback) + '}';
|
|
33
|
+
case RULESET:
|
|
34
|
+
if (!strlen(element.value = element.props.join(','))) return '';
|
|
35
|
+
}
|
|
36
|
+
return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : '';
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
export { serialize, stringify };
|