@stylexjs/shared 0.2.0-beta.21 → 0.2.0-beta.23

Sign up to get free protection for your applications and to get access to all the features.
Files changed (106) hide show
  1. package/lib/convert-to-className.js +6 -6
  2. package/lib/generate-css-rule.js +3 -3
  3. package/lib/hash.js +10 -11
  4. package/lib/index.d.ts +4 -4
  5. package/lib/index.js +12 -21
  6. package/lib/index.js.flow +4 -4
  7. package/lib/messages.d.ts +2 -1
  8. package/lib/messages.js +29 -54
  9. package/lib/messages.js.flow +2 -1
  10. package/lib/physical-rtl/generate-ltr.js +39 -39
  11. package/lib/physical-rtl/generate-rtl.js +57 -57
  12. package/lib/preprocess-rules/PreRule.js +2 -2
  13. package/lib/preprocess-rules/application-order.d.ts +36 -8
  14. package/lib/preprocess-rules/application-order.js +149 -164
  15. package/lib/preprocess-rules/application-order.js.flow +35 -7
  16. package/lib/preprocess-rules/basic-validation.js +6 -6
  17. package/lib/preprocess-rules/flatten-raw-style-obj.js +10 -10
  18. package/lib/preprocess-rules/index.js +6 -6
  19. package/lib/preprocess-rules/legacy-expand-shorthands.d.ts +22 -2
  20. package/lib/preprocess-rules/legacy-expand-shorthands.js +81 -65
  21. package/lib/preprocess-rules/legacy-expand-shorthands.js.flow +22 -2
  22. package/lib/preprocess-rules/property-specificity.d.ts +29 -25
  23. package/lib/preprocess-rules/property-specificity.js +63 -75
  24. package/lib/preprocess-rules/property-specificity.js.flow +28 -24
  25. package/lib/properties/CSS Animations.json +445 -0
  26. package/lib/properties/CSS Backgrounds and Borders.json +1085 -0
  27. package/lib/properties/CSS Basic User Interface.json +365 -0
  28. package/lib/properties/CSS Box Alignment.json +245 -0
  29. package/lib/properties/CSS Box Model.json +501 -0
  30. package/lib/properties/CSS Color.json +100 -0
  31. package/lib/properties/CSS Columns.json +185 -0
  32. package/lib/properties/CSS Containment.json +203 -0
  33. package/lib/properties/CSS Counter Styles.json +56 -0
  34. package/lib/properties/CSS Display.json +20 -0
  35. package/lib/properties/CSS Flexible Box Layout.json +167 -0
  36. package/lib/properties/CSS Fonts.json +684 -0
  37. package/lib/properties/CSS Fragmentation.json +110 -0
  38. package/lib/properties/CSS Generated Content.json +38 -0
  39. package/lib/properties/CSS Grid Layout.json +500 -0
  40. package/lib/properties/CSS Images.json +91 -0
  41. package/lib/properties/CSS Inline.json +38 -0
  42. package/lib/properties/CSS Lists and Counters.json +86 -0
  43. package/lib/properties/CSS Logical Properties.json +1086 -0
  44. package/lib/properties/CSS Masking.json +399 -0
  45. package/lib/properties/CSS Miscellaneous.json +38 -0
  46. package/lib/properties/CSS Motion Path.json +132 -0
  47. package/lib/properties/CSS Overflow.json +216 -0
  48. package/lib/properties/CSS Pages.json +83 -0
  49. package/lib/properties/CSS Positioning.json +166 -0
  50. package/lib/properties/CSS Ruby.json +55 -0
  51. package/lib/properties/CSS Scroll Anchoring.json +19 -0
  52. package/lib/properties/CSS Scroll Snap.json +604 -0
  53. package/lib/properties/CSS Scrollbars.json +38 -0
  54. package/lib/properties/CSS Shapes.json +56 -0
  55. package/lib/properties/CSS Speech.json +20 -0
  56. package/lib/properties/CSS Table.json +115 -0
  57. package/lib/properties/CSS Text Decoration.json +312 -0
  58. package/lib/properties/CSS Text.json +415 -0
  59. package/lib/properties/CSS Transforms.json +188 -0
  60. package/lib/properties/CSS Transitions.json +122 -0
  61. package/lib/properties/CSS Variables.json +20 -0
  62. package/lib/properties/CSS View Transitions.json +20 -0
  63. package/lib/properties/CSS Will Change.json +20 -0
  64. package/lib/properties/CSS Writing Modes.json +92 -0
  65. package/lib/properties/Compositing and Blending.json +62 -0
  66. package/lib/properties/Filter Effects.json +38 -0
  67. package/lib/properties/MathML.json +56 -0
  68. package/lib/properties/Microsoft Extensions.json +885 -0
  69. package/lib/properties/Mozilla Extensions.json +607 -0
  70. package/lib/properties/Pointer Events.json +20 -0
  71. package/lib/properties/WebKit Extensions.json +707 -0
  72. package/lib/properties.json +10122 -0
  73. package/lib/{stylex-override-vars.d.ts → stylex-create-theme.d.ts} +2 -2
  74. package/lib/{stylex-override-vars.js → stylex-create-theme.js} +13 -13
  75. package/lib/{stylex-override-vars.js.flow → stylex-create-theme.js.flow} +1 -1
  76. package/lib/stylex-create.js +1 -1
  77. package/lib/{stylex-create-vars.d.ts → stylex-define-vars.d.ts} +2 -2
  78. package/lib/{stylex-create-vars.js → stylex-define-vars.js} +9 -9
  79. package/lib/{stylex-create-vars.js.flow → stylex-define-vars.js.flow} +1 -1
  80. package/lib/stylex-keyframes.js +6 -6
  81. package/lib/transform-value.js +13 -15
  82. package/lib/types/index.js +33 -46
  83. package/lib/utils/dashify.js +1 -1
  84. package/lib/utils/default-options.js +4 -5
  85. package/lib/utils/file-based-identifier.js +1 -1
  86. package/lib/utils/genCSSRule.js +6 -6
  87. package/lib/utils/normalize-value.js +3 -2
  88. package/lib/utils/normalizers/convert-camel-case-transition-props.d.ts +14 -0
  89. package/lib/utils/normalizers/convert-camel-case-transition-props.js +23 -0
  90. package/lib/utils/normalizers/convert-camel-case-transition-props.js.flow +13 -0
  91. package/lib/utils/normalizers/convert-camel-case-values.d.ts +14 -0
  92. package/lib/utils/normalizers/convert-camel-case-values.js +23 -0
  93. package/lib/utils/normalizers/convert-camel-case-values.js.flow +13 -0
  94. package/lib/utils/normalizers/detect-unclosed-fns.js +2 -2
  95. package/lib/utils/normalizers/font-size-px-to-rem.js +4 -4
  96. package/lib/utils/normalizers/leading-zero.js +3 -3
  97. package/lib/utils/normalizers/quotes.js +4 -4
  98. package/lib/utils/normalizers/timings.js +4 -4
  99. package/lib/utils/normalizers/whitespace.js +12 -12
  100. package/lib/utils/normalizers/zero-dimensions.js +8 -8
  101. package/lib/utils/object-utils.d.ts +3 -6
  102. package/lib/utils/object-utils.js +2 -2
  103. package/lib/utils/property-priorities.js +527 -88
  104. package/lib/utils/split-css-value.js +8 -8
  105. package/lib/validate.js +2 -2
  106. package/package.json +2 -2
@@ -7,14 +7,14 @@ exports.default = generateRTL;
7
7
  var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
8
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
9
  const cursorFlip = {
10
- "e-resize": "w-resize",
11
- "w-resize": "e-resize",
12
- "ne-resize": "nw-resize",
13
- "nesw-resize": "nwse-resize",
14
- "nw-resize": "ne-resize",
15
- "nwse-resize": "nesw-resize",
16
- "se-resize": "sw-resize",
17
- "sw-resize": "se-resize"
10
+ 'e-resize': 'w-resize',
11
+ 'w-resize': 'e-resize',
12
+ 'ne-resize': 'nw-resize',
13
+ 'nesw-resize': 'nwse-resize',
14
+ 'nw-resize': 'ne-resize',
15
+ 'nwse-resize': 'nesw-resize',
16
+ 'se-resize': 'sw-resize',
17
+ 'sw-resize': 'se-resize'
18
18
  };
19
19
  function splitByDivisor(value) {
20
20
  const ast = (0, _postcssValueParser.default)(value);
@@ -28,7 +28,7 @@ function splitByDivisor(value) {
28
28
  currGroup = [];
29
29
  }
30
30
  for (const node of ast.nodes) {
31
- if (node.type === "div") {
31
+ if (node.type === 'div') {
32
32
  push();
33
33
  } else {
34
34
  currGroup.push(node);
@@ -38,110 +38,110 @@ function splitByDivisor(value) {
38
38
  return groups;
39
39
  }
40
40
  function flipSign(value) {
41
- if (value === "0") {
41
+ if (value === '0') {
42
42
  return value;
43
43
  } else {
44
- return value[0] === "-" ? value.slice(1) : "-" + value;
44
+ return value[0] === '-' ? value.slice(1) : '-' + value;
45
45
  }
46
46
  }
47
47
  function flipShadow(value) {
48
48
  const defs = splitByDivisor(value);
49
49
  const builtDefs = [];
50
50
  for (const def of defs) {
51
- const parts = def.split(" ");
51
+ const parts = def.split(' ');
52
52
  const index = _postcssValueParser.default.unit(parts[0]) === false ? 1 : 0;
53
53
  if (index < parts.length) {
54
54
  parts[index] = flipSign(parts[index]);
55
55
  }
56
- builtDefs.push(parts.join(" "));
56
+ builtDefs.push(parts.join(' '));
57
57
  }
58
- const rtl = builtDefs.join(", ");
58
+ const rtl = builtDefs.join(', ');
59
59
  if (rtl !== value) {
60
60
  return rtl;
61
61
  }
62
62
  }
63
63
  const shadowsFlip = {
64
- "box-shadow": _ref => {
64
+ 'box-shadow': _ref => {
65
65
  let [key, val] = _ref;
66
66
  const rtlVal = flipShadow(val);
67
67
  return rtlVal ? [key, rtlVal] : null;
68
68
  },
69
- "text-shadow": _ref2 => {
69
+ 'text-shadow': _ref2 => {
70
70
  let [key, val] = _ref2;
71
71
  const rtlVal = flipShadow(val);
72
72
  return rtlVal ? [key, rtlVal] : null;
73
73
  }
74
74
  };
75
75
  const logicalToPhysical = {
76
- start: "right",
77
- end: "left"
76
+ start: 'right',
77
+ end: 'left'
78
78
  };
79
79
  const propertyToRTL = {
80
- "margin-start": _ref3 => {
80
+ 'margin-start': _ref3 => {
81
81
  let [_key, val] = _ref3;
82
- return ["margin-right", val];
82
+ return ['margin-right', val];
83
83
  },
84
- "margin-end": _ref4 => {
84
+ 'margin-end': _ref4 => {
85
85
  let [_key, val] = _ref4;
86
- return ["margin-left", val];
86
+ return ['margin-left', val];
87
87
  },
88
- "padding-start": _ref5 => {
88
+ 'padding-start': _ref5 => {
89
89
  let [_key, val] = _ref5;
90
- return ["padding-right", val];
90
+ return ['padding-right', val];
91
91
  },
92
- "padding-end": _ref6 => {
92
+ 'padding-end': _ref6 => {
93
93
  let [_key, val] = _ref6;
94
- return ["padding-left", val];
94
+ return ['padding-left', val];
95
95
  },
96
- "border-start": _ref7 => {
96
+ 'border-start': _ref7 => {
97
97
  let [_key, val] = _ref7;
98
- return ["border-right", val];
98
+ return ['border-right', val];
99
99
  },
100
- "border-end": _ref8 => {
100
+ 'border-end': _ref8 => {
101
101
  let [_key, val] = _ref8;
102
- return ["border-left", val];
102
+ return ['border-left', val];
103
103
  },
104
- "border-start-width": _ref9 => {
104
+ 'border-start-width': _ref9 => {
105
105
  let [_key, val] = _ref9;
106
- return ["border-right-width", val];
106
+ return ['border-right-width', val];
107
107
  },
108
- "border-end-width": _ref10 => {
108
+ 'border-end-width': _ref10 => {
109
109
  let [_key, val] = _ref10;
110
- return ["border-left-width", val];
110
+ return ['border-left-width', val];
111
111
  },
112
- "border-start-color": _ref11 => {
112
+ 'border-start-color': _ref11 => {
113
113
  let [_key, val] = _ref11;
114
- return ["border-right-color", val];
114
+ return ['border-right-color', val];
115
115
  },
116
- "border-end-color": _ref12 => {
116
+ 'border-end-color': _ref12 => {
117
117
  let [_key, val] = _ref12;
118
- return ["border-left-color", val];
118
+ return ['border-left-color', val];
119
119
  },
120
- "border-start-style": _ref13 => {
120
+ 'border-start-style': _ref13 => {
121
121
  let [_key, val] = _ref13;
122
- return ["border-right-style", val];
122
+ return ['border-right-style', val];
123
123
  },
124
- "border-end-style": _ref14 => {
124
+ 'border-end-style': _ref14 => {
125
125
  let [_key, val] = _ref14;
126
- return ["border-left-style", val];
126
+ return ['border-left-style', val];
127
127
  },
128
- "border-top-start-radius": _ref15 => {
128
+ 'border-top-start-radius': _ref15 => {
129
129
  let [_key, val] = _ref15;
130
- return ["border-top-right-radius", val];
130
+ return ['border-top-right-radius', val];
131
131
  },
132
- "border-bottom-start-radius": _ref16 => {
132
+ 'border-bottom-start-radius': _ref16 => {
133
133
  let [_key, val] = _ref16;
134
- return ["border-bottom-right-radius", val];
134
+ return ['border-bottom-right-radius', val];
135
135
  },
136
- "border-top-end-radius": _ref17 => {
136
+ 'border-top-end-radius': _ref17 => {
137
137
  let [_key, val] = _ref17;
138
- return ["border-top-left-radius", val];
138
+ return ['border-top-left-radius', val];
139
139
  },
140
- "border-bottom-end-radius": _ref18 => {
140
+ 'border-bottom-end-radius': _ref18 => {
141
141
  let [_key, val] = _ref18;
142
- return ["border-bottom-left-radius", val];
142
+ return ['border-bottom-left-radius', val];
143
143
  },
144
- "text-align": _ref19 => {
144
+ 'text-align': _ref19 => {
145
145
  let [key, val] = _ref19;
146
146
  return logicalToPhysical[val] != null ? [key, logicalToPhysical[val]] : null;
147
147
  },
@@ -155,19 +155,19 @@ const propertyToRTL = {
155
155
  },
156
156
  start: _ref22 => {
157
157
  let [_key, val] = _ref22;
158
- return ["right", val];
158
+ return ['right', val];
159
159
  },
160
160
  end: _ref23 => {
161
161
  let [_key, val] = _ref23;
162
- return ["left", val];
162
+ return ['left', val];
163
163
  },
164
- "background-position": _ref24 => {
164
+ 'background-position': _ref24 => {
165
165
  let [key, val] = _ref24;
166
- const words = val.split(" ");
167
- if (!words.includes("start") && !words.includes("end")) {
166
+ const words = val.split(' ');
167
+ if (!words.includes('start') && !words.includes('end')) {
168
168
  return null;
169
169
  }
170
- return [key, words.map(word => word === "start" ? "right" : word === "end" ? "left" : word).join(" ")];
170
+ return [key, words.map(word => word === 'start' ? 'right' : word === 'end' ? 'left' : word).join(' ')];
171
171
  },
172
172
  cursor: _ref25 => {
173
173
  let [key, val] = _ref25;
@@ -28,10 +28,10 @@ class PreIncludedStylesRule {
28
28
  }
29
29
  exports.PreIncludedStylesRule = PreIncludedStylesRule;
30
30
  const stringComparator = (a, b) => {
31
- if (a === "default") {
31
+ if (a === 'default') {
32
32
  return -1;
33
33
  }
34
- if (b === "default") {
34
+ if (b === 'default') {
35
35
  return 1;
36
36
  }
37
37
  return a.localeCompare(b);
@@ -114,15 +114,17 @@ type TReturn = ReadonlyArray<[string, TStyleValue]>;
114
114
  declare const shorthands: {
115
115
  all: (_: TStyleValue) => TReturn;
116
116
  animation: (value: TStyleValue) => Array<[string, TStyleValue]>;
117
+ animationRange: (value: TStyleValue) => TReturn;
117
118
  background: (value: TStyleValue) => TReturn;
118
- border: (rawValue: TStyleValue) => TReturn;
119
- borderInline: (rawValue: TStyleValue) => TReturn;
120
- borderBlock: (rawValue: TStyleValue) => TReturn;
121
- borderTop: (rawValue: TStyleValue) => TReturn;
122
- borderInlineEnd: (rawValue: TStyleValue) => TReturn;
119
+ backgroundPosition: (value: TStyleValue) => TReturn;
120
+ border: (_rawValue: TStyleValue) => TReturn;
121
+ borderInline: (_rawValue: TStyleValue) => TReturn;
122
+ borderBlock: (_rawValue: TStyleValue) => TReturn;
123
+ borderTop: (_rawValue: TStyleValue) => TReturn;
124
+ borderInlineEnd: (_rawValue: TStyleValue) => TReturn;
123
125
  borderRight: (_rawValue: TStyleValue) => TReturn;
124
- borderBottom: (rawValue: TStyleValue) => TReturn;
125
- borderInlineStart: (rawValue: TStyleValue) => TReturn;
126
+ borderBottom: (_rawValue: TStyleValue) => TReturn;
127
+ borderInlineStart: (_rawValue: TStyleValue) => TReturn;
126
128
  borderLeft: (_rawValue: TStyleValue) => TReturn;
127
129
  borderInlineWidth: (rawValue: TStyleValue) => TReturn;
128
130
  borderInlineStyle: (rawValue: TStyleValue) => TReturn;
@@ -154,12 +156,15 @@ declare const shorthands: {
154
156
  borderTopRightRadius: (value: TStyleValue) => TReturn;
155
157
  borderBottomLeftRadius: (value: TStyleValue) => TReturn;
156
158
  borderBottomRightRadius: (value: TStyleValue) => TReturn;
159
+ borderImage: (value: TStyleValue) => TReturn;
157
160
  columnRule: (value: TStyleValue) => TReturn;
158
161
  columns: (value: TStyleValue) => TReturn;
159
162
  container: (value: TStyleValue) => TReturn;
163
+ containIntrinsicSize: (value: TStyleValue) => TReturn;
160
164
  flex: (value: TStyleValue) => TReturn;
161
165
  flexFlow: (value: TStyleValue) => TReturn;
162
166
  font: (value: TStyleValue) => TReturn;
167
+ fontVariant: (value: TStyleValue) => TReturn;
163
168
  gap: (value: TStyleValue) => TReturn;
164
169
  grid: (value: TStyleValue) => TReturn;
165
170
  gridArea: (value: TStyleValue) => TReturn;
@@ -182,6 +187,7 @@ declare const shorthands: {
182
187
  marginLeft: (value: TStyleValue) => TReturn;
183
188
  marginRight: (value: TStyleValue) => TReturn;
184
189
  mask: (value: TStyleValue) => TReturn;
190
+ maskBorder: (value: TStyleValue) => TReturn;
185
191
  offset: (value: TStyleValue) => TReturn;
186
192
  outline: (value: TStyleValue) => TReturn;
187
193
  overflow: (value: TStyleValue) => TReturn;
@@ -196,7 +202,20 @@ declare const shorthands: {
196
202
  placeItems: (value: TStyleValue) => TReturn;
197
203
  placeSelf: (value: TStyleValue) => TReturn;
198
204
  scrollMargin: (value: TStyleValue) => TReturn;
205
+ scrollMarginBlock: (value: TStyleValue) => TReturn;
206
+ scrollMarginInline: (value: TStyleValue) => TReturn;
207
+ scrollMarginInlineStart: (value: TStyleValue) => TReturn;
208
+ scrollMarginInlineEnd: (value: TStyleValue) => TReturn;
209
+ scrollMarginLeft: (value: TStyleValue) => TReturn;
210
+ scrollMarginRight: (value: TStyleValue) => TReturn;
199
211
  scrollPadding: (value: TStyleValue) => TReturn;
212
+ scrollPaddingBlock: (value: TStyleValue) => TReturn;
213
+ scrollPaddingInline: (value: TStyleValue) => TReturn;
214
+ scrollPaddingInlineStart: (value: TStyleValue) => TReturn;
215
+ scrollPaddingInlineEnd: (value: TStyleValue) => TReturn;
216
+ scrollPaddingLeft: (value: TStyleValue) => TReturn;
217
+ scrollPaddingRight: (value: TStyleValue) => TReturn;
218
+ scrollSnapType: (value: TStyleValue) => TReturn;
200
219
  scrollTimeline: (value: TStyleValue) => TReturn;
201
220
  textDecoration: (value: TStyleValue) => TReturn;
202
221
  textEmphasis: (value: TStyleValue) => TReturn;
@@ -237,25 +256,34 @@ declare const aliases: {
237
256
  borderTopEndRadius: (value: TStyleValue) => TReturn;
238
257
  borderBottomStartRadius: (value: TStyleValue) => TReturn;
239
258
  borderBottomEndRadius: (value: TStyleValue) => TReturn;
259
+ containIntrinsicBlockSize: (value: TStyleValue) => TReturn;
260
+ containIntrinsicInlineSize: (value: TStyleValue) => TReturn;
261
+ gridGap: any;
262
+ gridRowGap: (value: TStyleValue) => TReturn;
263
+ gridColumnGap: (value: TStyleValue) => TReturn;
240
264
  marginBlockStart: (value: TStyleValue) => TReturn;
241
265
  marginBlockEnd: (value: TStyleValue) => TReturn;
242
266
  marginStart: any;
243
267
  marginEnd: any;
244
268
  marginHorizontal: any;
245
269
  marginVertical: any;
270
+ overflowBlock: (value: TStyleValue) => TReturn;
271
+ overflowInline: (value: TStyleValue) => TReturn;
246
272
  paddingBlockStart: (rawValue: TStyleValue) => TReturn;
247
273
  paddingBlockEnd: (rawValue: TStyleValue) => TReturn;
248
274
  paddingStart: any;
249
275
  paddingEnd: any;
250
276
  paddingHorizontal: any;
251
277
  paddingVertical: any;
278
+ scrollMarginBlockStart: (value: TStyleValue) => TReturn;
279
+ scrollMarginBlockEnd: (value: TStyleValue) => TReturn;
252
280
  insetBlockStart: (value: TStyleValue) => TReturn;
253
281
  insetBlockEnd: (value: TStyleValue) => TReturn;
254
282
  start: any;
255
283
  end: any;
256
284
  };
257
285
  declare const $$EXPORT_DEFAULT_DECLARATION$$: Readonly</**
258
- * > 211 | ...typeof shorthands,
286
+ * > 239 | ...typeof shorthands,
259
287
  * | ^^^^^^^^^^^^^^^^^^^^ Unsupported feature: Translating "object types with complex spreads" is currently not supported.
260
288
  **/
261
289
  any>;