@stylexjs/shared 0.5.1 → 0.6.1

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.
@@ -15,15 +15,23 @@
15
15
  // We want on type that defines CSS Types
16
16
  // Option 2: Do a union type and make
17
17
 
18
- // interface ICSSType {
18
+ // interface CSSType {
19
19
  // toString(): string;
20
20
  // }
21
21
 
22
- type ValueWithDefault<+T> =
23
- | T
22
+ type NestedWithNumbers =
23
+ | number
24
+ | string
24
25
  | $ReadOnly<{
25
- default: T,
26
- [string]: ValueWithDefault<T>,
26
+ default: NestedWithNumbers,
27
+ [string]: NestedWithNumbers,
28
+ }>;
29
+
30
+ type ValueWithDefault =
31
+ | string
32
+ | $ReadOnly<{
33
+ default: ValueWithDefault,
34
+ [string]: ValueWithDefault,
27
35
  }>;
28
36
 
29
37
  type CSSSyntax =
@@ -43,199 +51,230 @@ type CSSSyntax =
43
51
  | '<custom-ident>'
44
52
  | '<transform-list>';
45
53
 
46
- type CSSSyntaxType = CSSSyntax | $ReadOnlyArray<CSSSyntax>;
47
-
48
- declare export class CSSType {}
54
+ type CSSSyntaxType = CSSSyntax;
49
55
 
50
- export interface ICSSType<+T: string | number> {
51
- +value: ValueWithDefault<T>;
56
+ declare class BaseCSSType {
57
+ +value: ValueWithDefault;
58
+ +syntax: CSSSyntaxType;
59
+ constructor(value: ValueWithDefault): void;
60
+ }
61
+ export interface CSSType<+_T: string | number = string | number> {
62
+ +value: ValueWithDefault;
52
63
  +syntax: CSSSyntaxType;
53
64
  }
54
65
 
55
- type AnguleValue = string;
56
- declare export class Angle<+T: AnguleValue>
57
- extends CSSType
58
- implements ICSSType<T>
66
+ declare export const isCSSType: (
67
+ value: mixed,
68
+ ) => value is CSSType<string | number>;
69
+
70
+ type AngleValue = string;
71
+ declare export class Angle<+T: AngleValue>
72
+ extends BaseCSSType
73
+ implements CSSType<T>
59
74
  {
60
- +value: ValueWithDefault<T>;
75
+ +value: ValueWithDefault;
61
76
  +syntax: CSSSyntaxType;
62
77
  static +syntax: CSSSyntaxType;
63
- constructor(value: ValueWithDefault<T>): void;
64
- static create<T: AnguleValue = AnguleValue>(
65
- value: ValueWithDefault<T>,
66
- ): Angle<T>;
78
+ static create<T: AngleValue = AngleValue>(value: ValueWithDefault): Angle<T>;
67
79
  }
68
- declare export const angle: $FlowFixMe;
80
+ declare export const angle: <T: AngleValue = AngleValue>(
81
+ value: ValueWithDefault,
82
+ // $FlowIgnore[method-unbinding]
83
+ ) => Angle<T>;
69
84
 
70
85
  type ColorValue = string;
71
86
  declare export class Color<+T: ColorValue>
72
- extends CSSType
73
- implements ICSSType<T>
87
+ extends BaseCSSType
88
+ implements CSSType<T>
74
89
  {
75
- +value: ValueWithDefault<T>;
90
+ +value: ValueWithDefault;
76
91
  +syntax: CSSSyntaxType;
77
- constructor(value: ValueWithDefault<T>): void;
78
- static create<T: ColorValue = ColorValue>(
79
- value: ValueWithDefault<T>,
80
- ): Color<T>;
92
+ static create<T: ColorValue = ColorValue>(value: ValueWithDefault): Color<T>;
81
93
  }
82
- declare export const color: $FlowFixMe;
94
+ declare export const color: <T: ColorValue = ColorValue>(
95
+ value: ValueWithDefault,
96
+ // $FlowIgnore[method-unbinding]
97
+ ) => Color<T>;
83
98
 
84
99
  type URLValue = string;
85
100
 
86
- declare export class Url<+T: URLValue> extends CSSType implements ICSSType<T> {
87
- +value: ValueWithDefault<T>;
101
+ declare export class Url<+T: URLValue>
102
+ extends BaseCSSType
103
+ implements CSSType<T>
104
+ {
105
+ +value: ValueWithDefault;
88
106
  +syntax: CSSSyntaxType;
89
- constructor(value: ValueWithDefault<T>): void;
90
- static create<T: URLValue = URLValue>(value: ValueWithDefault<T>): Url<T>;
107
+ static create<T: URLValue = URLValue>(value: ValueWithDefault): Url<T>;
91
108
  }
92
- declare export const url: $FlowFixMe;
109
+ declare export const url: <T: URLValue = URLValue>(
110
+ value: ValueWithDefault,
111
+ ) => Url<T>;
93
112
 
94
113
  type ImageValue = string;
95
114
 
96
115
  declare export class Image<+T: ImageValue>
97
116
  extends Url<T>
98
- implements ICSSType<T>
117
+ implements CSSType<T>
99
118
  {
100
- +value: ValueWithDefault<T>;
119
+ +value: ValueWithDefault;
101
120
  +syntax: CSSSyntaxType;
102
- constructor(value: ValueWithDefault<T>): void;
103
- static create<T: ImageValue = ImageValue>(
104
- value: ValueWithDefault<T>,
105
- ): Image<T>;
121
+ constructor(value: ValueWithDefault): void;
122
+ static create<T: ImageValue = ImageValue>(value: ValueWithDefault): Image<T>;
106
123
  }
107
- declare export const image: $FlowFixMe;
124
+ declare export const image: <T: ImageValue = ImageValue>(
125
+ value: ValueWithDefault,
126
+ // $FlowIgnore[method-unbinding]
127
+ ) => Image<T>;
108
128
 
109
129
  type IntegerValue = number;
110
130
 
111
131
  declare export class Integer<+T: IntegerValue>
112
- extends CSSType
113
- implements ICSSType<T>
132
+ extends BaseCSSType
133
+ implements CSSType<T>
114
134
  {
115
- +value: ValueWithDefault<T>;
135
+ +value: ValueWithDefault;
116
136
  +syntax: CSSSyntaxType;
117
- constructor(value: ValueWithDefault<T>): void;
118
137
  static create<T: IntegerValue = IntegerValue>(value: T): Integer<T>;
119
138
  }
120
- declare export const integer: $FlowFixMe;
139
+ declare export const integer: <T: IntegerValue = IntegerValue>(
140
+ value: T,
141
+ ) => Integer<T>;
121
142
 
122
143
  type LengthPercentageValue = string;
123
144
 
124
- declare export class LengthPercentage<+T: LengthPercentageValue>
125
- extends CSSType
126
- implements ICSSType<string>
145
+ declare export class LengthPercentage<+_T: LengthPercentageValue>
146
+ extends BaseCSSType
147
+ implements CSSType<string>
127
148
  {
128
- +value: ValueWithDefault<T>;
149
+ +value: ValueWithDefault;
129
150
  +syntax: CSSSyntaxType;
130
- constructor(value: ValueWithDefault<T>): void;
131
- static createLength<T: LengthPercentageValue | number>(
132
- value: ValueWithDefault<T>,
151
+ static createLength<_T: LengthPercentageValue | number>(
152
+ value: ValueWithDefault,
133
153
  ): LengthPercentage<string>;
134
- static createPercentage<T: LengthPercentageValue | number>(
135
- value: ValueWithDefault<T>,
154
+ static createPercentage<_T: LengthPercentageValue | number>(
155
+ value: ValueWithDefault,
136
156
  ): LengthPercentage<string>;
137
157
  }
138
- declare export const lengthPercentage: $FlowFixMe;
158
+ declare export const lengthPercentage: <_T: LengthPercentageValue | number>(
159
+ value: ValueWithDefault,
160
+ // $FlowIgnore[method-unbinding]
161
+ ) => LengthPercentage<string>;
139
162
 
140
163
  type LengthValue = number | string;
141
164
 
142
- declare export class Length<+T: LengthValue>
165
+ declare export class Length<+_T: LengthValue>
143
166
  extends LengthPercentage<string>
144
- implements ICSSType<string>
167
+ implements CSSType<string>
145
168
  {
146
- +value: ValueWithDefault<string>;
169
+ +value: ValueWithDefault;
147
170
  +syntax: CSSSyntaxType;
148
- constructor(value: ValueWithDefault<T>): void;
149
171
  static create<T: LengthValue = LengthValue>(
150
- value: ValueWithDefault<T>,
172
+ value: NestedWithNumbers,
151
173
  ): Length<T>;
152
174
  }
153
- declare export const length: $FlowFixMe;
175
+ declare export const length: <T: LengthValue = LengthValue>(
176
+ value: NestedWithNumbers,
177
+ // $FlowIgnore[method-unbinding]
178
+ ) => Length<T>;
154
179
 
155
180
  type PercentageValue = string | number;
156
181
 
157
- declare export class Percentage<+T: PercentageValue>
182
+ declare export class Percentage<+_T: PercentageValue>
158
183
  extends LengthPercentage<string>
159
- implements ICSSType<string>
184
+ implements CSSType<string>
160
185
  {
161
- +value: ValueWithDefault<string>;
186
+ +value: ValueWithDefault;
162
187
  +syntax: CSSSyntaxType;
163
- constructor(value: ValueWithDefault<T>): void;
164
188
  static create<T: PercentageValue = PercentageValue>(
165
- value: ValueWithDefault<T>,
189
+ value: NestedWithNumbers,
166
190
  ): Percentage<T>;
167
191
  }
168
- declare export const percentage: $FlowFixMe;
192
+ declare export const percentage: <T: PercentageValue = PercentageValue>(
193
+ value: NestedWithNumbers,
194
+ // $FlowIgnore[method-unbinding]
195
+ ) => Percentage<T>;
169
196
 
170
197
  type NumberValue = number;
171
198
 
172
199
  declare export class Num<+T: NumberValue>
173
- extends CSSType
174
- implements ICSSType<T>
200
+ extends BaseCSSType
201
+ implements CSSType<T>
175
202
  {
176
- +value: ValueWithDefault<T>;
203
+ +value: ValueWithDefault;
177
204
  +syntax: CSSSyntaxType;
178
- constructor(value: ValueWithDefault<T>): void;
179
- static create<T: NumberValue = NumberValue>(
180
- value: ValueWithDefault<T>,
181
- ): Num<T>;
205
+ static create<T: NumberValue = NumberValue>(value: NestedWithNumbers): Num<T>;
182
206
  }
183
- declare export const number: $FlowFixMe;
207
+ declare export const number: <T: NumberValue = NumberValue>(
208
+ value: NestedWithNumbers,
209
+ // $FlowIgnore[method-unbinding]
210
+ ) => Num<T>;
184
211
 
185
212
  type ResolutionValue = string | 0;
186
213
 
187
214
  declare export class Resolution<+T: ResolutionValue>
188
- extends CSSType
189
- implements ICSSType<T>
215
+ extends BaseCSSType
216
+ implements CSSType<T>
190
217
  {
191
- +value: ValueWithDefault<T>;
218
+ +value: ValueWithDefault;
192
219
  +syntax: CSSSyntaxType;
193
- constructor(value: ValueWithDefault<T>): void;
194
220
  static create<T: ResolutionValue = ResolutionValue>(
195
- value: ValueWithDefault<T>,
221
+ value: ValueWithDefault,
196
222
  ): Resolution<T>;
197
223
  }
198
- declare export const resolution: $FlowFixMe;
224
+ declare export const resolution: <T: ResolutionValue = ResolutionValue>(
225
+ value: ValueWithDefault,
226
+ // $FlowIgnore[method-unbinding]
227
+ ) => Resolution<T>;
199
228
 
200
229
  type TimeValue = string | 0;
201
230
 
202
231
  declare export class Time<+T: TimeValue>
203
- extends CSSType
204
- implements ICSSType<T>
232
+ extends BaseCSSType
233
+ implements CSSType<T>
205
234
  {
206
- +value: ValueWithDefault<T>;
235
+ +value: ValueWithDefault;
207
236
  +syntax: CSSSyntaxType;
208
- constructor(value: ValueWithDefault<T>): void;
209
- static create<T: TimeValue = TimeValue>(value: ValueWithDefault<T>): Time<T>;
237
+ static create<T: TimeValue = TimeValue>(value: ValueWithDefault): Time<T>;
210
238
  }
211
- declare export const time: $FlowFixMe;
239
+ declare export const time: <T: TimeValue = TimeValue>(
240
+ value: ValueWithDefault,
241
+ // $FlowIgnore[method-unbinding]
242
+ ) => Time<T>;
212
243
 
213
244
  type TransformFunctionValue = string;
214
245
 
215
246
  declare export class TransformFunction<+T: TransformFunctionValue>
216
- extends CSSType
217
- implements ICSSType<T>
247
+ extends BaseCSSType
248
+ implements CSSType<T>
218
249
  {
219
- +value: ValueWithDefault<T>;
250
+ +value: ValueWithDefault;
220
251
  +syntax: CSSSyntaxType;
221
- constructor(value: ValueWithDefault<T>): void;
222
252
  static create<T: TransformFunctionValue = TransformFunctionValue>(
223
- value: ValueWithDefault<T>,
253
+ value: ValueWithDefault,
224
254
  ): TransformFunction<T>;
225
255
  }
226
- declare export const transformFunction: $FlowFixMe;
256
+ declare export const transformFunction: <
257
+ T: TransformFunctionValue = TransformFunctionValue,
258
+ >(
259
+ value: ValueWithDefault,
260
+ // $FlowIgnore[method-unbinding]
261
+ ) => TransformFunction<T>;
227
262
 
228
263
  type TransformListValue = string;
229
264
 
230
265
  declare export class TransformList<T: TransformListValue>
231
- extends CSSType
232
- implements ICSSType<T>
266
+ extends BaseCSSType
267
+ implements CSSType<T>
233
268
  {
234
- +value: ValueWithDefault<T>;
269
+ +value: ValueWithDefault;
235
270
  +syntax: CSSSyntaxType;
236
- constructor(value: ValueWithDefault<T>): void;
237
271
  static create<T: TransformListValue = TransformListValue>(
238
- value: ValueWithDefault<T>,
272
+ value: ValueWithDefault,
239
273
  ): TransformList<T>;
240
274
  }
241
- declare export const transformList: $FlowFixMe;
275
+ declare export const transformList: <
276
+ T: TransformListValue = TransformListValue,
277
+ >(
278
+ value: ValueWithDefault,
279
+ // $FlowIgnore[method-unbinding]
280
+ ) => TransformList<T>;
@@ -9,12 +9,11 @@ var _leadingZero = _interopRequireDefault(require("./normalizers/leading-zero"))
9
9
  var _quotes = _interopRequireDefault(require("./normalizers/quotes"));
10
10
  var _timings = _interopRequireDefault(require("./normalizers/timings"));
11
11
  var _whitespace = _interopRequireDefault(require("./normalizers/whitespace"));
12
- var _zeroDimensions = _interopRequireDefault(require("./normalizers/zero-dimensions"));
13
12
  var _detectUnclosedFns = _interopRequireDefault(require("./normalizers/detect-unclosed-fns"));
14
13
  var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
15
14
  var _convertCamelCaseValues = _interopRequireDefault(require("./normalizers/convert-camel-case-values"));
16
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
- const normalizers = [_detectUnclosedFns.default, _whitespace.default, _timings.default, _zeroDimensions.default, _leadingZero.default, _quotes.default, _convertCamelCaseValues.default];
16
+ const normalizers = [_detectUnclosedFns.default, _whitespace.default, _timings.default, _leadingZero.default, _quotes.default, _convertCamelCaseValues.default];
18
17
  function normalizeValue(value, key, _ref) {
19
18
  let {
20
19
  useRemForFontSize
@@ -8,8 +8,8 @@
8
8
  */
9
9
 
10
10
  /**
11
- * Remove units in zero values, except when required: in angles and timings,
12
- * in which case make them consistent 0deg and 0s.
11
+ * Remove units in zero values, except when required: in angles, timings, fractions, and percentages,
12
+ * in which case make them consistent 0deg, 0s, 0fr, and 0%.
13
13
  */
14
14
 
15
15
  declare function normalizeZeroDimensions(
@@ -8,6 +8,8 @@ var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser")
8
8
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
9
  const angles = ['deg', 'grad', 'turn', 'rad'];
10
10
  const timings = ['ms', 's'];
11
+ const fraction = 'fr';
12
+ const percentage = '%';
11
13
  function normalizeZeroDimensions(ast, _) {
12
14
  let endFunction = 0;
13
15
  ast.walk(node => {
@@ -28,6 +30,10 @@ function normalizeZeroDimensions(ast, _) {
28
30
  node.value = '0deg';
29
31
  } else if (timings.indexOf(dimension.unit) !== -1) {
30
32
  node.value = '0s';
33
+ } else if (dimension.unit === fraction) {
34
+ node.value = '0fr';
35
+ } else if (dimension.unit === percentage) {
36
+ node.value = '0%';
31
37
  } else if (!endFunction) {
32
38
  node.value = '0';
33
39
  }
@@ -8,8 +8,8 @@
8
8
  */
9
9
 
10
10
  /**
11
- * Remove units in zero values, except when required: in angles and timings,
12
- * in which case make them consistent 0deg and 0s.
11
+ * Remove units in zero values, except when required: in angles, timings, fractions, and percentages,
12
+ * in which case make them consistent 0deg, 0s, 0fr, and 0%.
13
13
  */
14
14
 
15
15
  declare export default function normalizeZeroDimensions(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stylexjs/shared",
3
- "version": "0.5.1",
3
+ "version": "0.6.1",
4
4
  "main": "lib/index.js",
5
5
  "repository": "https://www.github.com/facebook/stylex",
6
6
  "license": "MIT",
@@ -13,7 +13,7 @@
13
13
  "postcss-value-parser": "^4.1.0"
14
14
  },
15
15
  "devDependencies": {
16
- "@stylexjs/scripts": "0.5.1"
16
+ "@stylexjs/scripts": "0.6.1"
17
17
  },
18
18
  "jest": {
19
19
  "snapshotFormat": {