@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.
@@ -7,9 +7,19 @@
7
7
  *
8
8
  */
9
9
 
10
- type ValueWithDefault<T> =
11
- | T
12
- | Readonly<{ default: T; [$$Key$$: string]: ValueWithDefault<T> }>;
10
+ type NestedWithNumbers =
11
+ | number
12
+ | string
13
+ | Readonly<{
14
+ default: NestedWithNumbers;
15
+ [$$Key$$: string]: NestedWithNumbers;
16
+ }>;
17
+ type ValueWithDefault =
18
+ | string
19
+ | Readonly<{
20
+ default: ValueWithDefault;
21
+ [$$Key$$: string]: ValueWithDefault;
22
+ }>;
13
23
  type CSSSyntax =
14
24
  | '*'
15
25
  | '<length>'
@@ -26,180 +36,205 @@ type CSSSyntax =
26
36
  | '<transform-function>'
27
37
  | '<custom-ident>'
28
38
  | '<transform-list>';
29
- type CSSSyntaxType = CSSSyntax | ReadonlyArray<CSSSyntax>;
30
- export declare class CSSType {}
31
- export interface ICSSType<T extends string | number> {
32
- readonly value: ValueWithDefault<T>;
39
+ type CSSSyntaxType = CSSSyntax;
40
+ declare class BaseCSSType {
41
+ readonly value: ValueWithDefault;
33
42
  readonly syntax: CSSSyntaxType;
43
+ constructor(value: ValueWithDefault);
34
44
  }
35
- type AnguleValue = string;
36
- export declare class Angle<T extends AnguleValue>
37
- extends CSSType
38
- implements ICSSType<T>
45
+ export interface CSSType<_T extends string | number = string | number> {
46
+ readonly value: ValueWithDefault;
47
+ readonly syntax: CSSSyntaxType;
48
+ }
49
+ export declare const isCSSType: (
50
+ value: unknown,
51
+ ) => value is CSSType<string | number>;
52
+ type AngleValue = string;
53
+ export declare class Angle<T extends AngleValue>
54
+ extends BaseCSSType
55
+ implements CSSType<T>
39
56
  {
40
- readonly value: ValueWithDefault<T>;
57
+ readonly value: ValueWithDefault;
41
58
  readonly syntax: CSSSyntaxType;
42
59
  static readonly syntax: CSSSyntaxType;
43
- constructor(value: ValueWithDefault<T>);
44
- static create<T extends AnguleValue = AnguleValue>(
45
- value: ValueWithDefault<T>,
60
+ static create<T extends AngleValue = AngleValue>(
61
+ value: ValueWithDefault,
46
62
  ): Angle<T>;
47
63
  }
48
- export declare const angle: any;
64
+ export declare const angle: <T extends AngleValue = AngleValue>(
65
+ value: ValueWithDefault,
66
+ ) => Angle<T>;
49
67
  type ColorValue = string;
50
68
  export declare class Color<T extends ColorValue>
51
- extends CSSType
52
- implements ICSSType<T>
69
+ extends BaseCSSType
70
+ implements CSSType<T>
53
71
  {
54
- readonly value: ValueWithDefault<T>;
72
+ readonly value: ValueWithDefault;
55
73
  readonly syntax: CSSSyntaxType;
56
- constructor(value: ValueWithDefault<T>);
57
74
  static create<T extends ColorValue = ColorValue>(
58
- value: ValueWithDefault<T>,
75
+ value: ValueWithDefault,
59
76
  ): Color<T>;
60
77
  }
61
- export declare const color: any;
78
+ export declare const color: <T extends ColorValue = ColorValue>(
79
+ value: ValueWithDefault,
80
+ ) => Color<T>;
62
81
  type URLValue = string;
63
82
  export declare class Url<T extends URLValue>
64
- extends CSSType
65
- implements ICSSType<T>
83
+ extends BaseCSSType
84
+ implements CSSType<T>
66
85
  {
67
- readonly value: ValueWithDefault<T>;
86
+ readonly value: ValueWithDefault;
68
87
  readonly syntax: CSSSyntaxType;
69
- constructor(value: ValueWithDefault<T>);
70
- static create<T extends URLValue = URLValue>(
71
- value: ValueWithDefault<T>,
72
- ): Url<T>;
88
+ static create<T extends URLValue = URLValue>(value: ValueWithDefault): Url<T>;
73
89
  }
74
- export declare const url: any;
90
+ export declare const url: <T extends URLValue = URLValue>(
91
+ value: ValueWithDefault,
92
+ ) => Url<T>;
75
93
  type ImageValue = string;
76
94
  export declare class Image<T extends ImageValue>
77
95
  extends Url<T>
78
- implements ICSSType<T>
96
+ implements CSSType<T>
79
97
  {
80
- readonly value: ValueWithDefault<T>;
98
+ readonly value: ValueWithDefault;
81
99
  readonly syntax: CSSSyntaxType;
82
- constructor(value: ValueWithDefault<T>);
100
+ constructor(value: ValueWithDefault);
83
101
  static create<T extends ImageValue = ImageValue>(
84
- value: ValueWithDefault<T>,
102
+ value: ValueWithDefault,
85
103
  ): Image<T>;
86
104
  }
87
- export declare const image: any;
105
+ export declare const image: <T extends ImageValue = ImageValue>(
106
+ value: ValueWithDefault,
107
+ ) => Image<T>;
88
108
  type IntegerValue = number;
89
109
  export declare class Integer<T extends IntegerValue>
90
- extends CSSType
91
- implements ICSSType<T>
110
+ extends BaseCSSType
111
+ implements CSSType<T>
92
112
  {
93
- readonly value: ValueWithDefault<T>;
113
+ readonly value: ValueWithDefault;
94
114
  readonly syntax: CSSSyntaxType;
95
- constructor(value: ValueWithDefault<T>);
96
115
  static create<T extends IntegerValue = IntegerValue>(value: T): Integer<T>;
97
116
  }
98
- export declare const integer: any;
117
+ export declare const integer: <T extends IntegerValue = IntegerValue>(
118
+ value: T,
119
+ ) => Integer<T>;
99
120
  type LengthPercentageValue = string;
100
- export declare class LengthPercentage<T extends LengthPercentageValue>
101
- extends CSSType
102
- implements ICSSType<string>
121
+ export declare class LengthPercentage<_T extends LengthPercentageValue>
122
+ extends BaseCSSType
123
+ implements CSSType<string>
103
124
  {
104
- readonly value: ValueWithDefault<T>;
125
+ readonly value: ValueWithDefault;
105
126
  readonly syntax: CSSSyntaxType;
106
- constructor(value: ValueWithDefault<T>);
107
- static createLength<T extends LengthPercentageValue | number>(
108
- value: ValueWithDefault<T>,
127
+ static createLength<_T extends LengthPercentageValue | number>(
128
+ value: ValueWithDefault,
109
129
  ): LengthPercentage<string>;
110
- static createPercentage<T extends LengthPercentageValue | number>(
111
- value: ValueWithDefault<T>,
130
+ static createPercentage<_T extends LengthPercentageValue | number>(
131
+ value: ValueWithDefault,
112
132
  ): LengthPercentage<string>;
113
133
  }
114
- export declare const lengthPercentage: any;
134
+ export declare const lengthPercentage: <
135
+ _T extends LengthPercentageValue | number,
136
+ >(
137
+ value: ValueWithDefault,
138
+ ) => LengthPercentage<string>;
115
139
  type LengthValue = number | string;
116
- export declare class Length<T extends LengthValue>
140
+ export declare class Length<_T extends LengthValue>
117
141
  extends LengthPercentage<string>
118
- implements ICSSType<string>
142
+ implements CSSType<string>
119
143
  {
120
- readonly value: ValueWithDefault<string>;
144
+ readonly value: ValueWithDefault;
121
145
  readonly syntax: CSSSyntaxType;
122
- constructor(value: ValueWithDefault<T>);
123
146
  static create<T extends LengthValue = LengthValue>(
124
- value: ValueWithDefault<T>,
147
+ value: NestedWithNumbers,
125
148
  ): Length<T>;
126
149
  }
127
- export declare const length: any;
150
+ export declare const length: <T extends LengthValue = LengthValue>(
151
+ value: NestedWithNumbers,
152
+ ) => Length<T>;
128
153
  type PercentageValue = string | number;
129
- export declare class Percentage<T extends PercentageValue>
154
+ export declare class Percentage<_T extends PercentageValue>
130
155
  extends LengthPercentage<string>
131
- implements ICSSType<string>
156
+ implements CSSType<string>
132
157
  {
133
- readonly value: ValueWithDefault<string>;
158
+ readonly value: ValueWithDefault;
134
159
  readonly syntax: CSSSyntaxType;
135
- constructor(value: ValueWithDefault<T>);
136
160
  static create<T extends PercentageValue = PercentageValue>(
137
- value: ValueWithDefault<T>,
161
+ value: NestedWithNumbers,
138
162
  ): Percentage<T>;
139
163
  }
140
- export declare const percentage: any;
164
+ export declare const percentage: <T extends PercentageValue = PercentageValue>(
165
+ value: NestedWithNumbers,
166
+ ) => Percentage<T>;
141
167
  type NumberValue = number;
142
168
  export declare class Num<T extends NumberValue>
143
- extends CSSType
144
- implements ICSSType<T>
169
+ extends BaseCSSType
170
+ implements CSSType<T>
145
171
  {
146
- readonly value: ValueWithDefault<T>;
172
+ readonly value: ValueWithDefault;
147
173
  readonly syntax: CSSSyntaxType;
148
- constructor(value: ValueWithDefault<T>);
149
174
  static create<T extends NumberValue = NumberValue>(
150
- value: ValueWithDefault<T>,
175
+ value: NestedWithNumbers,
151
176
  ): Num<T>;
152
177
  }
153
- export declare const number: any;
178
+ export declare const number: <T extends NumberValue = NumberValue>(
179
+ value: NestedWithNumbers,
180
+ ) => Num<T>;
154
181
  type ResolutionValue = string | 0;
155
182
  export declare class Resolution<T extends ResolutionValue>
156
- extends CSSType
157
- implements ICSSType<T>
183
+ extends BaseCSSType
184
+ implements CSSType<T>
158
185
  {
159
- readonly value: ValueWithDefault<T>;
186
+ readonly value: ValueWithDefault;
160
187
  readonly syntax: CSSSyntaxType;
161
- constructor(value: ValueWithDefault<T>);
162
188
  static create<T extends ResolutionValue = ResolutionValue>(
163
- value: ValueWithDefault<T>,
189
+ value: ValueWithDefault,
164
190
  ): Resolution<T>;
165
191
  }
166
- export declare const resolution: any;
192
+ export declare const resolution: <T extends ResolutionValue = ResolutionValue>(
193
+ value: ValueWithDefault,
194
+ ) => Resolution<T>;
167
195
  type TimeValue = string | 0;
168
196
  export declare class Time<T extends TimeValue>
169
- extends CSSType
170
- implements ICSSType<T>
197
+ extends BaseCSSType
198
+ implements CSSType<T>
171
199
  {
172
- readonly value: ValueWithDefault<T>;
200
+ readonly value: ValueWithDefault;
173
201
  readonly syntax: CSSSyntaxType;
174
- constructor(value: ValueWithDefault<T>);
175
202
  static create<T extends TimeValue = TimeValue>(
176
- value: ValueWithDefault<T>,
203
+ value: ValueWithDefault,
177
204
  ): Time<T>;
178
205
  }
179
- export declare const time: any;
206
+ export declare const time: <T extends TimeValue = TimeValue>(
207
+ value: ValueWithDefault,
208
+ ) => Time<T>;
180
209
  type TransformFunctionValue = string;
181
210
  export declare class TransformFunction<T extends TransformFunctionValue>
182
- extends CSSType
183
- implements ICSSType<T>
211
+ extends BaseCSSType
212
+ implements CSSType<T>
184
213
  {
185
- readonly value: ValueWithDefault<T>;
214
+ readonly value: ValueWithDefault;
186
215
  readonly syntax: CSSSyntaxType;
187
- constructor(value: ValueWithDefault<T>);
188
216
  static create<T extends TransformFunctionValue = TransformFunctionValue>(
189
- value: ValueWithDefault<T>,
217
+ value: ValueWithDefault,
190
218
  ): TransformFunction<T>;
191
219
  }
192
- export declare const transformFunction: any;
220
+ export declare const transformFunction: <
221
+ T extends TransformFunctionValue = TransformFunctionValue,
222
+ >(
223
+ value: ValueWithDefault,
224
+ ) => TransformFunction<T>;
193
225
  type TransformListValue = string;
194
226
  export declare class TransformList<T extends TransformListValue>
195
- extends CSSType
196
- implements ICSSType<T>
227
+ extends BaseCSSType
228
+ implements CSSType<T>
197
229
  {
198
- readonly value: ValueWithDefault<T>;
230
+ readonly value: ValueWithDefault;
199
231
  readonly syntax: CSSSyntaxType;
200
- constructor(value: ValueWithDefault<T>);
201
232
  static create<T extends TransformListValue = TransformListValue>(
202
- value: ValueWithDefault<T>,
233
+ value: ValueWithDefault,
203
234
  ): TransformList<T>;
204
235
  }
205
- export declare const transformList: any;
236
+ export declare const transformList: <
237
+ T extends TransformListValue = TransformListValue,
238
+ >(
239
+ value: ValueWithDefault,
240
+ ) => TransformList<T>;
@@ -3,40 +3,35 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.url = exports.transformList = exports.transformFunction = exports.time = exports.resolution = exports.percentage = exports.number = exports.lengthPercentage = exports.length = exports.integer = exports.image = exports.color = exports.angle = exports.Url = exports.TransformList = exports.TransformFunction = exports.Time = exports.Resolution = exports.Percentage = exports.Num = exports.LengthPercentage = exports.Length = exports.Integer = exports.Image = exports.Color = exports.CSSType = exports.Angle = void 0;
7
- class CSSType {}
8
- exports.CSSType = CSSType;
9
- class Angle extends CSSType {
10
- syntax = '<angle>';
11
- static syntax = '<angle>';
6
+ exports.url = exports.transformList = exports.transformFunction = exports.time = exports.resolution = exports.percentage = exports.number = exports.lengthPercentage = exports.length = exports.isCSSType = exports.integer = exports.image = exports.color = exports.angle = exports.Url = exports.TransformList = exports.TransformFunction = exports.Time = exports.Resolution = exports.Percentage = exports.Num = exports.LengthPercentage = exports.Length = exports.Integer = exports.Image = exports.Color = exports.Angle = void 0;
7
+ class BaseCSSType {
12
8
  constructor(value) {
13
- super();
14
9
  this.value = value;
15
10
  }
11
+ }
12
+ const isCSSType = value => {
13
+ return value instanceof BaseCSSType && value.value != null && typeof value.syntax === 'string';
14
+ };
15
+ exports.isCSSType = isCSSType;
16
+ class Angle extends BaseCSSType {
17
+ syntax = '<angle>';
18
+ static syntax = '<angle>';
16
19
  static create(value) {
17
20
  return new Angle(value);
18
21
  }
19
22
  }
20
23
  exports.Angle = Angle;
21
24
  const angle = exports.angle = Angle.create;
22
- class Color extends CSSType {
25
+ class Color extends BaseCSSType {
23
26
  syntax = '<color>';
24
- constructor(value) {
25
- super();
26
- this.value = value;
27
- }
28
27
  static create(value) {
29
28
  return new Color(value);
30
29
  }
31
30
  }
32
31
  exports.Color = Color;
33
32
  const color = exports.color = Color.create;
34
- class Url extends CSSType {
33
+ class Url extends BaseCSSType {
35
34
  syntax = '<url>';
36
- constructor(value) {
37
- super();
38
- this.value = value;
39
- }
40
35
  static create(value) {
41
36
  return new Url(value);
42
37
  }
@@ -55,24 +50,16 @@ class Image extends Url {
55
50
  }
56
51
  exports.Image = Image;
57
52
  const image = exports.image = Image.create;
58
- class Integer extends CSSType {
53
+ class Integer extends BaseCSSType {
59
54
  syntax = '<integer>';
60
- constructor(value) {
61
- super();
62
- this.value = value;
63
- }
64
55
  static create(value) {
65
- return new Integer(value);
56
+ return new Integer(convertNumberToStringUsing(String, '0')(value));
66
57
  }
67
58
  }
68
59
  exports.Integer = Integer;
69
60
  const integer = exports.integer = Integer.create;
70
- class LengthPercentage extends CSSType {
61
+ class LengthPercentage extends BaseCSSType {
71
62
  syntax = '<length-percentage>';
72
- constructor(value) {
73
- super();
74
- this.value = value;
75
- }
76
63
  static createLength(value) {
77
64
  return new LengthPercentage(convertNumberToLength(value));
78
65
  }
@@ -84,80 +71,54 @@ exports.LengthPercentage = LengthPercentage;
84
71
  const lengthPercentage = exports.lengthPercentage = LengthPercentage.createLength;
85
72
  class Length extends LengthPercentage {
86
73
  syntax = '<length>';
87
- constructor(value) {
88
- super(convertNumberToLength(value));
89
- }
90
74
  static create(value) {
91
- return new Length(value);
75
+ return new Length(convertNumberToLength(value));
92
76
  }
93
77
  }
94
78
  exports.Length = Length;
95
79
  const length = exports.length = Length.create;
96
80
  class Percentage extends LengthPercentage {
97
81
  syntax = '<percentage>';
98
- constructor(value) {
99
- super(convertNumberToPercentage(value));
100
- }
101
82
  static create(value) {
102
- return new Percentage(value);
83
+ return new Percentage(convertNumberToPercentage(value));
103
84
  }
104
85
  }
105
86
  exports.Percentage = Percentage;
106
87
  const percentage = exports.percentage = Percentage.create;
107
- class Num extends CSSType {
88
+ class Num extends BaseCSSType {
108
89
  syntax = '<number>';
109
- constructor(value) {
110
- super();
111
- this.value = value;
112
- }
113
90
  static create(value) {
114
- return new Num(value);
91
+ return new Num(convertNumberToBareString(value));
115
92
  }
116
93
  }
117
94
  exports.Num = Num;
118
95
  const number = exports.number = Num.create;
119
- class Resolution extends CSSType {
96
+ class Resolution extends BaseCSSType {
120
97
  syntax = '<resolution>';
121
- constructor(value) {
122
- super();
123
- this.value = value;
124
- }
125
98
  static create(value) {
126
99
  return new Resolution(value);
127
100
  }
128
101
  }
129
102
  exports.Resolution = Resolution;
130
103
  const resolution = exports.resolution = Resolution.create;
131
- class Time extends CSSType {
104
+ class Time extends BaseCSSType {
132
105
  syntax = '<time>';
133
- constructor(value) {
134
- super();
135
- this.value = value;
136
- }
137
106
  static create(value) {
138
107
  return new Time(value);
139
108
  }
140
109
  }
141
110
  exports.Time = Time;
142
111
  const time = exports.time = Time.create;
143
- class TransformFunction extends CSSType {
112
+ class TransformFunction extends BaseCSSType {
144
113
  syntax = '<transform-function>';
145
- constructor(value) {
146
- super();
147
- this.value = value;
148
- }
149
114
  static create(value) {
150
115
  return new TransformFunction(value);
151
116
  }
152
117
  }
153
118
  exports.TransformFunction = TransformFunction;
154
119
  const transformFunction = exports.transformFunction = TransformFunction.create;
155
- class TransformList extends CSSType {
120
+ class TransformList extends BaseCSSType {
156
121
  syntax = '<transform-list>';
157
- constructor(value) {
158
- super();
159
- this.value = value;
160
- }
161
122
  static create(value) {
162
123
  return new TransformList(value);
163
124
  }
@@ -172,20 +133,15 @@ const convertNumberToStringUsing = (transformNumber, defaultStr) => value => {
172
133
  return value;
173
134
  }
174
135
  if (typeof value === 'object') {
175
- const {
176
- default: defaultValue,
177
- ...rest
178
- } = value;
179
- const defaultResult = convertNumberToLength(defaultValue);
180
- const result = {
181
- default: typeof defaultResult === 'string' ? defaultResult : defaultStr
182
- };
183
- for (const [key, value] of Object.entries(rest)) {
184
- result[key] = convertNumberToLength(value);
136
+ const val = value;
137
+ const result = {};
138
+ for (const key of Object.keys(val)) {
139
+ result[key] = convertNumberToStringUsing(transformNumber, defaultStr)(val[key]);
185
140
  }
186
141
  return result;
187
142
  }
188
143
  return value;
189
144
  };
145
+ const convertNumberToBareString = convertNumberToStringUsing(value => String(value), '0');
190
146
  const convertNumberToLength = convertNumberToStringUsing(value => value === 0 ? '0' : `${value}px`, '0px');
191
147
  const convertNumberToPercentage = convertNumberToStringUsing(value => value === 0 ? '0' : `${value * 100}%`, '0');