@react-native-styled-system/core 1.3.0 → 1.4.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.
Files changed (20) hide show
  1. package/lib/commonjs/@types/SxProps.js.map +1 -1
  2. package/lib/commonjs/internal/util/mutateShortcutPropToOriginalKeys.js.map +1 -1
  3. package/lib/commonjs/util/createSxComponent.js +18 -5
  4. package/lib/commonjs/util/createSxComponent.js.map +1 -1
  5. package/lib/module/@types/SxProps.js.map +1 -1
  6. package/lib/module/internal/util/mutateShortcutPropToOriginalKeys.js.map +1 -1
  7. package/lib/module/util/createSxComponent.js +18 -5
  8. package/lib/module/util/createSxComponent.js.map +1 -1
  9. package/lib/typescript/src/@types/SxProps.d.ts +18 -18
  10. package/lib/typescript/src/@types/SxProps.d.ts.map +1 -1
  11. package/lib/typescript/src/hook/useSx.d.ts +1 -287
  12. package/lib/typescript/src/hook/useSx.d.ts.map +1 -1
  13. package/lib/typescript/src/internal/util/mutateShortcutPropToOriginalKeys.d.ts +1 -620
  14. package/lib/typescript/src/internal/util/mutateShortcutPropToOriginalKeys.d.ts.map +1 -1
  15. package/lib/typescript/src/util/createSxComponent.d.ts +10 -1202
  16. package/lib/typescript/src/util/createSxComponent.d.ts.map +1 -1
  17. package/package.json +2 -2
  18. package/src/@types/SxProps.ts +20 -16
  19. package/src/internal/util/mutateShortcutPropToOriginalKeys.ts +3 -1
  20. package/src/util/createSxComponent.tsx +17 -4
package/lib/typescript/src/util/createSxComponent.d.ts CHANGED
@@ -1,1205 +1,13 @@
1
1
  import type { ComponentType } from 'react';
2
2
  import React from 'react';
3
- export declare function createSxComponent<Props extends object, Ref>(Base: ComponentType<Props>): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & Partial<{
4
- flex: number | undefined;
5
- alignItems: import("react-native").FlexAlignType | undefined;
6
- alignContent: "center" | "flex-start" | "flex-end" | "stretch" | "space-between" | "space-around" | undefined;
7
- justifyContent: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
8
- flexWrap: "wrap" | "nowrap" | "wrap-reverse" | undefined;
9
- flexDirection: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
10
- flexGrow: number | undefined;
11
- flexShrink: number | undefined;
12
- flexBasis: import("react-native").DimensionValue | undefined;
13
- alignSelf: "auto" | import("react-native").FlexAlignType | undefined;
14
- position: "absolute" | "relative" | undefined;
15
- pos: "absolute" | "relative" | undefined;
16
- borderWidth: number | undefined;
17
- borderTopWidth: number | undefined;
18
- borderRightWidth: number | undefined;
19
- borderBottomWidth: number | undefined;
20
- borderLeftWidth: number | undefined;
21
- opacity: import("react-native").AnimatableNumericValue | undefined;
22
- overflow: "visible" | "hidden" | "scroll" | undefined;
23
- transform: string | (({
24
- perspective: import("react-native").AnimatableNumericValue;
25
- } & {
26
- rotate?: undefined;
27
- rotateX?: undefined;
28
- rotateY?: undefined;
29
- rotateZ?: undefined;
30
- scale?: undefined;
31
- scaleX?: undefined;
32
- scaleY?: undefined;
33
- translateX?: undefined;
34
- translateY?: undefined;
35
- skewX?: undefined;
36
- skewY?: undefined;
37
- matrix?: undefined;
38
- }) | ({
39
- rotate: import("react-native").AnimatableStringValue;
40
- } & {
41
- perspective?: undefined;
42
- rotateX?: undefined;
43
- rotateY?: undefined;
44
- rotateZ?: undefined;
45
- scale?: undefined;
46
- scaleX?: undefined;
47
- scaleY?: undefined;
48
- translateX?: undefined;
49
- translateY?: undefined;
50
- skewX?: undefined;
51
- skewY?: undefined;
52
- matrix?: undefined;
53
- }) | ({
54
- rotateX: import("react-native").AnimatableStringValue;
55
- } & {
56
- perspective?: undefined;
57
- rotate?: undefined;
58
- rotateY?: undefined;
59
- rotateZ?: undefined;
60
- scale?: undefined;
61
- scaleX?: undefined;
62
- scaleY?: undefined;
63
- translateX?: undefined;
64
- translateY?: undefined;
65
- skewX?: undefined;
66
- skewY?: undefined;
67
- matrix?: undefined;
68
- }) | ({
69
- rotateY: import("react-native").AnimatableStringValue;
70
- } & {
71
- perspective?: undefined;
72
- rotate?: undefined;
73
- rotateX?: undefined;
74
- rotateZ?: undefined;
75
- scale?: undefined;
76
- scaleX?: undefined;
77
- scaleY?: undefined;
78
- translateX?: undefined;
79
- translateY?: undefined;
80
- skewX?: undefined;
81
- skewY?: undefined;
82
- matrix?: undefined;
83
- }) | ({
84
- rotateZ: import("react-native").AnimatableStringValue;
85
- } & {
86
- perspective?: undefined;
87
- rotate?: undefined;
88
- rotateX?: undefined;
89
- rotateY?: undefined;
90
- scale?: undefined;
91
- scaleX?: undefined;
92
- scaleY?: undefined;
93
- translateX?: undefined;
94
- translateY?: undefined;
95
- skewX?: undefined;
96
- skewY?: undefined;
97
- matrix?: undefined;
98
- }) | ({
99
- scale: import("react-native").AnimatableNumericValue;
100
- } & {
101
- perspective?: undefined;
102
- rotate?: undefined;
103
- rotateX?: undefined;
104
- rotateY?: undefined;
105
- rotateZ?: undefined;
106
- scaleX?: undefined;
107
- scaleY?: undefined;
108
- translateX?: undefined;
109
- translateY?: undefined;
110
- skewX?: undefined;
111
- skewY?: undefined;
112
- matrix?: undefined;
113
- }) | ({
114
- scaleX: import("react-native").AnimatableNumericValue;
115
- } & {
116
- perspective?: undefined;
117
- rotate?: undefined;
118
- rotateX?: undefined;
119
- rotateY?: undefined;
120
- rotateZ?: undefined;
121
- scale?: undefined;
122
- scaleY?: undefined;
123
- translateX?: undefined;
124
- translateY?: undefined;
125
- skewX?: undefined;
126
- skewY?: undefined;
127
- matrix?: undefined;
128
- }) | ({
129
- scaleY: import("react-native").AnimatableNumericValue;
130
- } & {
131
- perspective?: undefined;
132
- rotate?: undefined;
133
- rotateX?: undefined;
134
- rotateY?: undefined;
135
- rotateZ?: undefined;
136
- scale?: undefined;
137
- scaleX?: undefined;
138
- translateX?: undefined;
139
- translateY?: undefined;
140
- skewX?: undefined;
141
- skewY?: undefined;
142
- matrix?: undefined;
143
- }) | ({
144
- translateX: import("react-native").AnimatableNumericValue;
145
- } & {
146
- perspective?: undefined;
147
- rotate?: undefined;
148
- rotateX?: undefined;
149
- rotateY?: undefined;
150
- rotateZ?: undefined;
151
- scale?: undefined;
152
- scaleX?: undefined;
153
- scaleY?: undefined;
154
- translateY?: undefined;
155
- skewX?: undefined;
156
- skewY?: undefined;
157
- matrix?: undefined;
158
- }) | ({
159
- translateY: import("react-native").AnimatableNumericValue;
160
- } & {
161
- perspective?: undefined;
162
- rotate?: undefined;
163
- rotateX?: undefined;
164
- rotateY?: undefined;
165
- rotateZ?: undefined;
166
- scale?: undefined;
167
- scaleX?: undefined;
168
- scaleY?: undefined;
169
- translateX?: undefined;
170
- skewX?: undefined;
171
- skewY?: undefined;
172
- matrix?: undefined;
173
- }) | ({
174
- skewX: import("react-native").AnimatableStringValue;
175
- } & {
176
- perspective?: undefined;
177
- rotate?: undefined;
178
- rotateX?: undefined;
179
- rotateY?: undefined;
180
- rotateZ?: undefined;
181
- scale?: undefined;
182
- scaleX?: undefined;
183
- scaleY?: undefined;
184
- translateX?: undefined;
185
- translateY?: undefined;
186
- skewY?: undefined;
187
- matrix?: undefined;
188
- }) | ({
189
- skewY: import("react-native").AnimatableStringValue;
190
- } & {
191
- perspective?: undefined;
192
- rotate?: undefined;
193
- rotateX?: undefined;
194
- rotateY?: undefined;
195
- rotateZ?: undefined;
196
- scale?: undefined;
197
- scaleX?: undefined;
198
- scaleY?: undefined;
199
- translateX?: undefined;
200
- translateY?: undefined;
201
- skewX?: undefined;
202
- matrix?: undefined;
203
- }) | ({
204
- matrix: import("react-native").AnimatableNumericValue[];
205
- } & {
206
- perspective?: undefined;
207
- rotate?: undefined;
208
- rotateX?: undefined;
209
- rotateY?: undefined;
210
- rotateZ?: undefined;
211
- scale?: undefined;
212
- scaleX?: undefined;
213
- scaleY?: undefined;
214
- translateX?: undefined;
215
- translateY?: undefined;
216
- skewX?: undefined;
217
- skewY?: undefined;
218
- }))[] | undefined;
219
- aspectRatio: string | number | undefined;
220
- display: "flex" | "none" | undefined;
221
- elevation: number | undefined;
222
- zIndex: number | undefined;
223
- absoluteFill?: boolean | undefined;
224
- center?: boolean | undefined;
225
- } & {
226
- margin: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
227
- m: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
228
- marginTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
229
- mt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
230
- marginRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
231
- mr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
232
- marginBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
233
- mb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
234
- marginLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
235
- ml: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
236
- marginX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
237
- mx: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
238
- marginY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
239
- my: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
240
- padding: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
241
- p: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
242
- paddingTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
243
- pt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
244
- paddingRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
245
- pr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
246
- paddingBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
247
- pb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
248
- paddingLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
249
- pl: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
250
- paddingX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
251
- px: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
252
- paddingY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
253
- py: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
254
- top: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
255
- right: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
256
- bottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
257
- left: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
258
- gap: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
259
- gapX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
260
- gapY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
261
- } & {
262
- width: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
263
- w: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
264
- minWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
265
- minW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
266
- maxWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
267
- maxW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
268
- height: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
269
- h: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
270
- minHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
271
- minH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
272
- maxHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
273
- maxH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
274
- } & {
275
- backgroundColor: string;
276
- bg: string;
277
- borderColor: string;
278
- } & {
279
- borderRadius: number | `${number}` | `${number}px` | `${any}px`;
280
- radius: number | `${number}` | `${number}px` | `${any}px`;
281
- borderTopLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
282
- topLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
283
- borderTopRightRadius: number | `${number}` | `${number}px` | `${any}px`;
284
- topRightRadius: number | `${number}` | `${number}px` | `${any}px`;
285
- borderBottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
286
- bottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
287
- borderBottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
288
- bottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
289
- }> & {
290
- sx?: Partial<{
291
- flex: number | undefined;
292
- alignItems: import("react-native").FlexAlignType | undefined;
293
- alignContent: "center" | "flex-start" | "flex-end" | "stretch" | "space-between" | "space-around" | undefined;
294
- justifyContent: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
295
- flexWrap: "wrap" | "nowrap" | "wrap-reverse" | undefined;
296
- flexDirection: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
297
- flexGrow: number | undefined;
298
- flexShrink: number | undefined;
299
- flexBasis: import("react-native").DimensionValue | undefined;
300
- alignSelf: "auto" | import("react-native").FlexAlignType | undefined;
301
- position: "absolute" | "relative" | undefined;
302
- pos: "absolute" | "relative" | undefined;
303
- borderWidth: number | undefined;
304
- borderTopWidth: number | undefined;
305
- borderRightWidth: number | undefined;
306
- borderBottomWidth: number | undefined;
307
- borderLeftWidth: number | undefined;
308
- opacity: import("react-native").AnimatableNumericValue | undefined;
309
- overflow: "visible" | "hidden" | "scroll" | undefined;
310
- transform: string | (({
311
- perspective: import("react-native").AnimatableNumericValue;
312
- } & {
313
- rotate?: undefined;
314
- rotateX?: undefined;
315
- rotateY?: undefined;
316
- rotateZ?: undefined;
317
- scale?: undefined;
318
- scaleX?: undefined;
319
- scaleY?: undefined;
320
- translateX?: undefined;
321
- translateY?: undefined;
322
- skewX?: undefined;
323
- skewY?: undefined;
324
- matrix?: undefined;
325
- }) | ({
326
- rotate: import("react-native").AnimatableStringValue;
327
- } & {
328
- perspective?: undefined;
329
- rotateX?: undefined;
330
- rotateY?: undefined;
331
- rotateZ?: undefined;
332
- scale?: undefined;
333
- scaleX?: undefined;
334
- scaleY?: undefined;
335
- translateX?: undefined;
336
- translateY?: undefined;
337
- skewX?: undefined;
338
- skewY?: undefined;
339
- matrix?: undefined;
340
- }) | ({
341
- rotateX: import("react-native").AnimatableStringValue;
342
- } & {
343
- perspective?: undefined;
344
- rotate?: undefined;
345
- rotateY?: undefined;
346
- rotateZ?: undefined;
347
- scale?: undefined;
348
- scaleX?: undefined;
349
- scaleY?: undefined;
350
- translateX?: undefined;
351
- translateY?: undefined;
352
- skewX?: undefined;
353
- skewY?: undefined;
354
- matrix?: undefined;
355
- }) | ({
356
- rotateY: import("react-native").AnimatableStringValue;
357
- } & {
358
- perspective?: undefined;
359
- rotate?: undefined;
360
- rotateX?: undefined;
361
- rotateZ?: undefined;
362
- scale?: undefined;
363
- scaleX?: undefined;
364
- scaleY?: undefined;
365
- translateX?: undefined;
366
- translateY?: undefined;
367
- skewX?: undefined;
368
- skewY?: undefined;
369
- matrix?: undefined;
370
- }) | ({
371
- rotateZ: import("react-native").AnimatableStringValue;
372
- } & {
373
- perspective?: undefined;
374
- rotate?: undefined;
375
- rotateX?: undefined;
376
- rotateY?: undefined;
377
- scale?: undefined;
378
- scaleX?: undefined;
379
- scaleY?: undefined;
380
- translateX?: undefined;
381
- translateY?: undefined;
382
- skewX?: undefined;
383
- skewY?: undefined;
384
- matrix?: undefined;
385
- }) | ({
386
- scale: import("react-native").AnimatableNumericValue;
387
- } & {
388
- perspective?: undefined;
389
- rotate?: undefined;
390
- rotateX?: undefined;
391
- rotateY?: undefined;
392
- rotateZ?: undefined;
393
- scaleX?: undefined;
394
- scaleY?: undefined;
395
- translateX?: undefined;
396
- translateY?: undefined;
397
- skewX?: undefined;
398
- skewY?: undefined;
399
- matrix?: undefined;
400
- }) | ({
401
- scaleX: import("react-native").AnimatableNumericValue;
402
- } & {
403
- perspective?: undefined;
404
- rotate?: undefined;
405
- rotateX?: undefined;
406
- rotateY?: undefined;
407
- rotateZ?: undefined;
408
- scale?: undefined;
409
- scaleY?: undefined;
410
- translateX?: undefined;
411
- translateY?: undefined;
412
- skewX?: undefined;
413
- skewY?: undefined;
414
- matrix?: undefined;
415
- }) | ({
416
- scaleY: import("react-native").AnimatableNumericValue;
417
- } & {
418
- perspective?: undefined;
419
- rotate?: undefined;
420
- rotateX?: undefined;
421
- rotateY?: undefined;
422
- rotateZ?: undefined;
423
- scale?: undefined;
424
- scaleX?: undefined;
425
- translateX?: undefined;
426
- translateY?: undefined;
427
- skewX?: undefined;
428
- skewY?: undefined;
429
- matrix?: undefined;
430
- }) | ({
431
- translateX: import("react-native").AnimatableNumericValue;
432
- } & {
433
- perspective?: undefined;
434
- rotate?: undefined;
435
- rotateX?: undefined;
436
- rotateY?: undefined;
437
- rotateZ?: undefined;
438
- scale?: undefined;
439
- scaleX?: undefined;
440
- scaleY?: undefined;
441
- translateY?: undefined;
442
- skewX?: undefined;
443
- skewY?: undefined;
444
- matrix?: undefined;
445
- }) | ({
446
- translateY: import("react-native").AnimatableNumericValue;
447
- } & {
448
- perspective?: undefined;
449
- rotate?: undefined;
450
- rotateX?: undefined;
451
- rotateY?: undefined;
452
- rotateZ?: undefined;
453
- scale?: undefined;
454
- scaleX?: undefined;
455
- scaleY?: undefined;
456
- translateX?: undefined;
457
- skewX?: undefined;
458
- skewY?: undefined;
459
- matrix?: undefined;
460
- }) | ({
461
- skewX: import("react-native").AnimatableStringValue;
462
- } & {
463
- perspective?: undefined;
464
- rotate?: undefined;
465
- rotateX?: undefined;
466
- rotateY?: undefined;
467
- rotateZ?: undefined;
468
- scale?: undefined;
469
- scaleX?: undefined;
470
- scaleY?: undefined;
471
- translateX?: undefined;
472
- translateY?: undefined;
473
- skewY?: undefined;
474
- matrix?: undefined;
475
- }) | ({
476
- skewY: import("react-native").AnimatableStringValue;
477
- } & {
478
- perspective?: undefined;
479
- rotate?: undefined;
480
- rotateX?: undefined;
481
- rotateY?: undefined;
482
- rotateZ?: undefined;
483
- scale?: undefined;
484
- scaleX?: undefined;
485
- scaleY?: undefined;
486
- translateX?: undefined;
487
- translateY?: undefined;
488
- skewX?: undefined;
489
- matrix?: undefined;
490
- }) | ({
491
- matrix: import("react-native").AnimatableNumericValue[];
492
- } & {
493
- perspective?: undefined;
494
- rotate?: undefined;
495
- rotateX?: undefined;
496
- rotateY?: undefined;
497
- rotateZ?: undefined;
498
- scale?: undefined;
499
- scaleX?: undefined;
500
- scaleY?: undefined;
501
- translateX?: undefined;
502
- translateY?: undefined;
503
- skewX?: undefined;
504
- skewY?: undefined;
505
- }))[] | undefined;
506
- aspectRatio: string | number | undefined;
507
- display: "flex" | "none" | undefined;
508
- elevation: number | undefined;
509
- zIndex: number | undefined;
510
- absoluteFill?: boolean | undefined;
511
- center?: boolean | undefined;
512
- } & {
513
- margin: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
514
- m: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
515
- marginTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
516
- mt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
517
- marginRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
518
- mr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
519
- marginBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
520
- mb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
521
- marginLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
522
- ml: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
523
- marginX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
524
- mx: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
525
- marginY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
526
- my: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
527
- padding: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
528
- p: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
529
- paddingTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
530
- pt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
531
- paddingRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
532
- pr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
533
- paddingBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
534
- pb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
535
- paddingLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
536
- pl: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
537
- paddingX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
538
- px: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
539
- paddingY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
540
- py: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
541
- top: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
542
- right: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
543
- bottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
544
- left: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
545
- gap: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
546
- gapX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
547
- gapY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
548
- } & {
549
- width: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
550
- w: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
551
- minWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
552
- minW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
553
- maxWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
554
- maxW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
555
- height: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
556
- h: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
557
- minHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
558
- minH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
559
- maxHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
560
- maxH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
561
- } & {
562
- backgroundColor: string;
563
- bg: string;
564
- borderColor: string;
565
- } & {
566
- borderRadius: number | `${number}` | `${number}px` | `${any}px`;
567
- radius: number | `${number}` | `${number}px` | `${any}px`;
568
- borderTopLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
569
- topLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
570
- borderTopRightRadius: number | `${number}` | `${number}px` | `${any}px`;
571
- topRightRadius: number | `${number}` | `${number}px` | `${any}px`;
572
- borderBottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
573
- bottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
574
- borderBottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
575
- bottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
576
- }> | undefined;
577
- }> & React.RefAttributes<Ref>>;
578
- export declare function createSxTextComponent<Props extends object, Ref>(Base: ComponentType<Props>): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & Partial<{
579
- flex: number | undefined;
580
- alignItems: import("react-native").FlexAlignType | undefined;
581
- alignContent: "center" | "flex-start" | "flex-end" | "stretch" | "space-between" | "space-around" | undefined;
582
- justifyContent: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
583
- flexWrap: "wrap" | "nowrap" | "wrap-reverse" | undefined;
584
- flexDirection: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
585
- flexGrow: number | undefined;
586
- flexShrink: number | undefined;
587
- flexBasis: import("react-native").DimensionValue | undefined;
588
- alignSelf: "auto" | import("react-native").FlexAlignType | undefined;
589
- position: "absolute" | "relative" | undefined;
590
- pos: "absolute" | "relative" | undefined;
591
- borderWidth: number | undefined;
592
- borderTopWidth: number | undefined;
593
- borderRightWidth: number | undefined;
594
- borderBottomWidth: number | undefined;
595
- borderLeftWidth: number | undefined;
596
- opacity: import("react-native").AnimatableNumericValue | undefined;
597
- overflow: "visible" | "hidden" | "scroll" | undefined;
598
- transform: string | (({
599
- perspective: import("react-native").AnimatableNumericValue;
600
- } & {
601
- rotate?: undefined;
602
- rotateX?: undefined;
603
- rotateY?: undefined;
604
- rotateZ?: undefined;
605
- scale?: undefined;
606
- scaleX?: undefined;
607
- scaleY?: undefined;
608
- translateX?: undefined;
609
- translateY?: undefined;
610
- skewX?: undefined;
611
- skewY?: undefined;
612
- matrix?: undefined;
613
- }) | ({
614
- rotate: import("react-native").AnimatableStringValue;
615
- } & {
616
- perspective?: undefined;
617
- rotateX?: undefined;
618
- rotateY?: undefined;
619
- rotateZ?: undefined;
620
- scale?: undefined;
621
- scaleX?: undefined;
622
- scaleY?: undefined;
623
- translateX?: undefined;
624
- translateY?: undefined;
625
- skewX?: undefined;
626
- skewY?: undefined;
627
- matrix?: undefined;
628
- }) | ({
629
- rotateX: import("react-native").AnimatableStringValue;
630
- } & {
631
- perspective?: undefined;
632
- rotate?: undefined;
633
- rotateY?: undefined;
634
- rotateZ?: undefined;
635
- scale?: undefined;
636
- scaleX?: undefined;
637
- scaleY?: undefined;
638
- translateX?: undefined;
639
- translateY?: undefined;
640
- skewX?: undefined;
641
- skewY?: undefined;
642
- matrix?: undefined;
643
- }) | ({
644
- rotateY: import("react-native").AnimatableStringValue;
645
- } & {
646
- perspective?: undefined;
647
- rotate?: undefined;
648
- rotateX?: undefined;
649
- rotateZ?: undefined;
650
- scale?: undefined;
651
- scaleX?: undefined;
652
- scaleY?: undefined;
653
- translateX?: undefined;
654
- translateY?: undefined;
655
- skewX?: undefined;
656
- skewY?: undefined;
657
- matrix?: undefined;
658
- }) | ({
659
- rotateZ: import("react-native").AnimatableStringValue;
660
- } & {
661
- perspective?: undefined;
662
- rotate?: undefined;
663
- rotateX?: undefined;
664
- rotateY?: undefined;
665
- scale?: undefined;
666
- scaleX?: undefined;
667
- scaleY?: undefined;
668
- translateX?: undefined;
669
- translateY?: undefined;
670
- skewX?: undefined;
671
- skewY?: undefined;
672
- matrix?: undefined;
673
- }) | ({
674
- scale: import("react-native").AnimatableNumericValue;
675
- } & {
676
- perspective?: undefined;
677
- rotate?: undefined;
678
- rotateX?: undefined;
679
- rotateY?: undefined;
680
- rotateZ?: undefined;
681
- scaleX?: undefined;
682
- scaleY?: undefined;
683
- translateX?: undefined;
684
- translateY?: undefined;
685
- skewX?: undefined;
686
- skewY?: undefined;
687
- matrix?: undefined;
688
- }) | ({
689
- scaleX: import("react-native").AnimatableNumericValue;
690
- } & {
691
- perspective?: undefined;
692
- rotate?: undefined;
693
- rotateX?: undefined;
694
- rotateY?: undefined;
695
- rotateZ?: undefined;
696
- scale?: undefined;
697
- scaleY?: undefined;
698
- translateX?: undefined;
699
- translateY?: undefined;
700
- skewX?: undefined;
701
- skewY?: undefined;
702
- matrix?: undefined;
703
- }) | ({
704
- scaleY: import("react-native").AnimatableNumericValue;
705
- } & {
706
- perspective?: undefined;
707
- rotate?: undefined;
708
- rotateX?: undefined;
709
- rotateY?: undefined;
710
- rotateZ?: undefined;
711
- scale?: undefined;
712
- scaleX?: undefined;
713
- translateX?: undefined;
714
- translateY?: undefined;
715
- skewX?: undefined;
716
- skewY?: undefined;
717
- matrix?: undefined;
718
- }) | ({
719
- translateX: import("react-native").AnimatableNumericValue;
720
- } & {
721
- perspective?: undefined;
722
- rotate?: undefined;
723
- rotateX?: undefined;
724
- rotateY?: undefined;
725
- rotateZ?: undefined;
726
- scale?: undefined;
727
- scaleX?: undefined;
728
- scaleY?: undefined;
729
- translateY?: undefined;
730
- skewX?: undefined;
731
- skewY?: undefined;
732
- matrix?: undefined;
733
- }) | ({
734
- translateY: import("react-native").AnimatableNumericValue;
735
- } & {
736
- perspective?: undefined;
737
- rotate?: undefined;
738
- rotateX?: undefined;
739
- rotateY?: undefined;
740
- rotateZ?: undefined;
741
- scale?: undefined;
742
- scaleX?: undefined;
743
- scaleY?: undefined;
744
- translateX?: undefined;
745
- skewX?: undefined;
746
- skewY?: undefined;
747
- matrix?: undefined;
748
- }) | ({
749
- skewX: import("react-native").AnimatableStringValue;
750
- } & {
751
- perspective?: undefined;
752
- rotate?: undefined;
753
- rotateX?: undefined;
754
- rotateY?: undefined;
755
- rotateZ?: undefined;
756
- scale?: undefined;
757
- scaleX?: undefined;
758
- scaleY?: undefined;
759
- translateX?: undefined;
760
- translateY?: undefined;
761
- skewY?: undefined;
762
- matrix?: undefined;
763
- }) | ({
764
- skewY: import("react-native").AnimatableStringValue;
765
- } & {
766
- perspective?: undefined;
767
- rotate?: undefined;
768
- rotateX?: undefined;
769
- rotateY?: undefined;
770
- rotateZ?: undefined;
771
- scale?: undefined;
772
- scaleX?: undefined;
773
- scaleY?: undefined;
774
- translateX?: undefined;
775
- translateY?: undefined;
776
- skewX?: undefined;
777
- matrix?: undefined;
778
- }) | ({
779
- matrix: import("react-native").AnimatableNumericValue[];
780
- } & {
781
- perspective?: undefined;
782
- rotate?: undefined;
783
- rotateX?: undefined;
784
- rotateY?: undefined;
785
- rotateZ?: undefined;
786
- scale?: undefined;
787
- scaleX?: undefined;
788
- scaleY?: undefined;
789
- translateX?: undefined;
790
- translateY?: undefined;
791
- skewX?: undefined;
792
- skewY?: undefined;
793
- }))[] | undefined;
794
- aspectRatio: string | number | undefined;
795
- display: "flex" | "none" | undefined;
796
- elevation: number | undefined;
797
- zIndex: number | undefined;
798
- absoluteFill?: boolean | undefined;
799
- center?: boolean | undefined;
800
- } & {
801
- margin: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
802
- m: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
803
- marginTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
804
- mt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
805
- marginRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
806
- mr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
807
- marginBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
808
- mb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
809
- marginLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
810
- ml: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
811
- marginX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
812
- mx: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
813
- marginY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
814
- my: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
815
- padding: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
816
- p: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
817
- paddingTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
818
- pt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
819
- paddingRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
820
- pr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
821
- paddingBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
822
- pb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
823
- paddingLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
824
- pl: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
825
- paddingX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
826
- px: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
827
- paddingY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
828
- py: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
829
- top: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
830
- right: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
831
- bottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
832
- left: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
833
- gap: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
834
- gapX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
835
- gapY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
836
- } & {
837
- width: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
838
- w: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
839
- minWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
840
- minW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
841
- maxWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
842
- maxW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
843
- height: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
844
- h: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
845
- minHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
846
- minH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
847
- maxHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
848
- maxH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
849
- } & {
850
- backgroundColor: string;
851
- bg: string;
852
- borderColor: string;
853
- } & {
854
- borderRadius: number | `${number}` | `${number}px` | `${any}px`;
855
- radius: number | `${number}` | `${number}px` | `${any}px`;
856
- borderTopLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
857
- topLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
858
- borderTopRightRadius: number | `${number}` | `${number}px` | `${any}px`;
859
- topRightRadius: number | `${number}` | `${number}px` | `${any}px`;
860
- borderBottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
861
- bottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
862
- borderBottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
863
- bottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
864
- }> & Partial<{
865
- color: string;
866
- textDecorationColor: string;
867
- textShadowColor: string;
868
- } & {
869
- fontFamily: string | undefined;
870
- fontSize: number | undefined;
871
- fontStyle: "normal" | "italic" | undefined;
872
- fontWeight: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
873
- weight: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
874
- letterSpacing: number | undefined;
875
- lineHeight: number | undefined;
876
- textAlign: "auto" | "left" | "right" | "center" | "justify" | undefined;
877
- align: "auto" | "left" | "right" | "center" | "justify" | undefined;
878
- textDecorationLine: "none" | "underline" | "line-through" | "underline line-through" | undefined;
879
- textDecorationStyle: "solid" | "double" | "dotted" | "dashed" | undefined;
880
- textShadowOffset: {
881
- width: number;
882
- height: number;
883
- } | undefined;
884
- textShadowRadius: number | undefined;
885
- textTransform: "none" | "capitalize" | "uppercase" | "lowercase" | undefined;
886
- userSelect: "auto" | "none" | "text" | "contain" | "all" | undefined;
887
- includeFontPadding: boolean | undefined;
888
- typography: string;
889
- t: string;
890
- }> & {
891
- sx?: (Partial<{
892
- flex: number | undefined;
893
- alignItems: import("react-native").FlexAlignType | undefined;
894
- alignContent: "center" | "flex-start" | "flex-end" | "stretch" | "space-between" | "space-around" | undefined;
895
- justifyContent: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
896
- flexWrap: "wrap" | "nowrap" | "wrap-reverse" | undefined;
897
- flexDirection: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
898
- flexGrow: number | undefined;
899
- flexShrink: number | undefined;
900
- flexBasis: import("react-native").DimensionValue | undefined;
901
- alignSelf: "auto" | import("react-native").FlexAlignType | undefined;
902
- position: "absolute" | "relative" | undefined;
903
- pos: "absolute" | "relative" | undefined;
904
- borderWidth: number | undefined;
905
- borderTopWidth: number | undefined;
906
- borderRightWidth: number | undefined;
907
- borderBottomWidth: number | undefined;
908
- borderLeftWidth: number | undefined;
909
- opacity: import("react-native").AnimatableNumericValue | undefined;
910
- overflow: "visible" | "hidden" | "scroll" | undefined;
911
- transform: string | (({
912
- perspective: import("react-native").AnimatableNumericValue;
913
- } & {
914
- rotate?: undefined;
915
- rotateX?: undefined;
916
- rotateY?: undefined;
917
- rotateZ?: undefined;
918
- scale?: undefined;
919
- scaleX?: undefined;
920
- scaleY?: undefined;
921
- translateX?: undefined;
922
- translateY?: undefined;
923
- skewX?: undefined;
924
- skewY?: undefined;
925
- matrix?: undefined;
926
- }) | ({
927
- rotate: import("react-native").AnimatableStringValue;
928
- } & {
929
- perspective?: undefined;
930
- rotateX?: undefined;
931
- rotateY?: undefined;
932
- rotateZ?: undefined;
933
- scale?: undefined;
934
- scaleX?: undefined;
935
- scaleY?: undefined;
936
- translateX?: undefined;
937
- translateY?: undefined;
938
- skewX?: undefined;
939
- skewY?: undefined;
940
- matrix?: undefined;
941
- }) | ({
942
- rotateX: import("react-native").AnimatableStringValue;
943
- } & {
944
- perspective?: undefined;
945
- rotate?: undefined;
946
- rotateY?: undefined;
947
- rotateZ?: undefined;
948
- scale?: undefined;
949
- scaleX?: undefined;
950
- scaleY?: undefined;
951
- translateX?: undefined;
952
- translateY?: undefined;
953
- skewX?: undefined;
954
- skewY?: undefined;
955
- matrix?: undefined;
956
- }) | ({
957
- rotateY: import("react-native").AnimatableStringValue;
958
- } & {
959
- perspective?: undefined;
960
- rotate?: undefined;
961
- rotateX?: undefined;
962
- rotateZ?: undefined;
963
- scale?: undefined;
964
- scaleX?: undefined;
965
- scaleY?: undefined;
966
- translateX?: undefined;
967
- translateY?: undefined;
968
- skewX?: undefined;
969
- skewY?: undefined;
970
- matrix?: undefined;
971
- }) | ({
972
- rotateZ: import("react-native").AnimatableStringValue;
973
- } & {
974
- perspective?: undefined;
975
- rotate?: undefined;
976
- rotateX?: undefined;
977
- rotateY?: undefined;
978
- scale?: undefined;
979
- scaleX?: undefined;
980
- scaleY?: undefined;
981
- translateX?: undefined;
982
- translateY?: undefined;
983
- skewX?: undefined;
984
- skewY?: undefined;
985
- matrix?: undefined;
986
- }) | ({
987
- scale: import("react-native").AnimatableNumericValue;
988
- } & {
989
- perspective?: undefined;
990
- rotate?: undefined;
991
- rotateX?: undefined;
992
- rotateY?: undefined;
993
- rotateZ?: undefined;
994
- scaleX?: undefined;
995
- scaleY?: undefined;
996
- translateX?: undefined;
997
- translateY?: undefined;
998
- skewX?: undefined;
999
- skewY?: undefined;
1000
- matrix?: undefined;
1001
- }) | ({
1002
- scaleX: import("react-native").AnimatableNumericValue;
1003
- } & {
1004
- perspective?: undefined;
1005
- rotate?: undefined;
1006
- rotateX?: undefined;
1007
- rotateY?: undefined;
1008
- rotateZ?: undefined;
1009
- scale?: undefined;
1010
- scaleY?: undefined;
1011
- translateX?: undefined;
1012
- translateY?: undefined;
1013
- skewX?: undefined;
1014
- skewY?: undefined;
1015
- matrix?: undefined;
1016
- }) | ({
1017
- scaleY: import("react-native").AnimatableNumericValue;
1018
- } & {
1019
- perspective?: undefined;
1020
- rotate?: undefined;
1021
- rotateX?: undefined;
1022
- rotateY?: undefined;
1023
- rotateZ?: undefined;
1024
- scale?: undefined;
1025
- scaleX?: undefined;
1026
- translateX?: undefined;
1027
- translateY?: undefined;
1028
- skewX?: undefined;
1029
- skewY?: undefined;
1030
- matrix?: undefined;
1031
- }) | ({
1032
- translateX: import("react-native").AnimatableNumericValue;
1033
- } & {
1034
- perspective?: undefined;
1035
- rotate?: undefined;
1036
- rotateX?: undefined;
1037
- rotateY?: undefined;
1038
- rotateZ?: undefined;
1039
- scale?: undefined;
1040
- scaleX?: undefined;
1041
- scaleY?: undefined;
1042
- translateY?: undefined;
1043
- skewX?: undefined;
1044
- skewY?: undefined;
1045
- matrix?: undefined;
1046
- }) | ({
1047
- translateY: import("react-native").AnimatableNumericValue;
1048
- } & {
1049
- perspective?: undefined;
1050
- rotate?: undefined;
1051
- rotateX?: undefined;
1052
- rotateY?: undefined;
1053
- rotateZ?: undefined;
1054
- scale?: undefined;
1055
- scaleX?: undefined;
1056
- scaleY?: undefined;
1057
- translateX?: undefined;
1058
- skewX?: undefined;
1059
- skewY?: undefined;
1060
- matrix?: undefined;
1061
- }) | ({
1062
- skewX: import("react-native").AnimatableStringValue;
1063
- } & {
1064
- perspective?: undefined;
1065
- rotate?: undefined;
1066
- rotateX?: undefined;
1067
- rotateY?: undefined;
1068
- rotateZ?: undefined;
1069
- scale?: undefined;
1070
- scaleX?: undefined;
1071
- scaleY?: undefined;
1072
- translateX?: undefined;
1073
- translateY?: undefined;
1074
- skewY?: undefined;
1075
- matrix?: undefined;
1076
- }) | ({
1077
- skewY: import("react-native").AnimatableStringValue;
1078
- } & {
1079
- perspective?: undefined;
1080
- rotate?: undefined;
1081
- rotateX?: undefined;
1082
- rotateY?: undefined;
1083
- rotateZ?: undefined;
1084
- scale?: undefined;
1085
- scaleX?: undefined;
1086
- scaleY?: undefined;
1087
- translateX?: undefined;
1088
- translateY?: undefined;
1089
- skewX?: undefined;
1090
- matrix?: undefined;
1091
- }) | ({
1092
- matrix: import("react-native").AnimatableNumericValue[];
1093
- } & {
1094
- perspective?: undefined;
1095
- rotate?: undefined;
1096
- rotateX?: undefined;
1097
- rotateY?: undefined;
1098
- rotateZ?: undefined;
1099
- scale?: undefined;
1100
- scaleX?: undefined;
1101
- scaleY?: undefined;
1102
- translateX?: undefined;
1103
- translateY?: undefined;
1104
- skewX?: undefined;
1105
- skewY?: undefined;
1106
- }))[] | undefined;
1107
- aspectRatio: string | number | undefined;
1108
- display: "flex" | "none" | undefined;
1109
- elevation: number | undefined;
1110
- zIndex: number | undefined;
1111
- absoluteFill?: boolean | undefined;
1112
- center?: boolean | undefined;
1113
- } & {
1114
- margin: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1115
- m: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1116
- marginTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1117
- mt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1118
- marginRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1119
- mr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1120
- marginBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1121
- mb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1122
- marginLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1123
- ml: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1124
- marginX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1125
- mx: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1126
- marginY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1127
- my: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1128
- padding: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1129
- p: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1130
- paddingTop: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1131
- pt: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1132
- paddingRight: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1133
- pr: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1134
- paddingBottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1135
- pb: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1136
- paddingLeft: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1137
- pl: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1138
- paddingX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1139
- px: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1140
- paddingY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1141
- py: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1142
- top: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1143
- right: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1144
- bottom: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1145
- left: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1146
- gap: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1147
- gapX: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1148
- gapY: `${number}` | import("../@types/Token").SpaceValue | `${number}px` | `${any}px`;
1149
- } & {
1150
- width: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1151
- w: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1152
- minWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1153
- minW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1154
- maxWidth: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1155
- maxW: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1156
- height: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1157
- h: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1158
- minHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1159
- minH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1160
- maxHeight: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1161
- maxH: `${number}` | `${number}px` | `${any}px` | import("../@types/Token").SizesValue;
1162
- } & {
1163
- backgroundColor: string;
1164
- bg: string;
1165
- borderColor: string;
1166
- } & {
1167
- borderRadius: number | `${number}` | `${number}px` | `${any}px`;
1168
- radius: number | `${number}` | `${number}px` | `${any}px`;
1169
- borderTopLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
1170
- topLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
1171
- borderTopRightRadius: number | `${number}` | `${number}px` | `${any}px`;
1172
- topRightRadius: number | `${number}` | `${number}px` | `${any}px`;
1173
- borderBottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
1174
- bottomLeftRadius: number | `${number}` | `${number}px` | `${any}px`;
1175
- borderBottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
1176
- bottomRightRadius: number | `${number}` | `${number}px` | `${any}px`;
1177
- }> & Partial<{
1178
- color: string;
1179
- textDecorationColor: string;
1180
- textShadowColor: string;
1181
- } & {
1182
- fontFamily: string | undefined;
1183
- fontSize: number | undefined;
1184
- fontStyle: "normal" | "italic" | undefined;
1185
- fontWeight: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
1186
- weight: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
1187
- letterSpacing: number | undefined;
1188
- lineHeight: number | undefined;
1189
- textAlign: "auto" | "left" | "right" | "center" | "justify" | undefined;
1190
- align: "auto" | "left" | "right" | "center" | "justify" | undefined;
1191
- textDecorationLine: "none" | "underline" | "line-through" | "underline line-through" | undefined;
1192
- textDecorationStyle: "solid" | "double" | "dotted" | "dashed" | undefined;
1193
- textShadowOffset: {
1194
- width: number;
1195
- height: number;
1196
- } | undefined;
1197
- textShadowRadius: number | undefined;
1198
- textTransform: "none" | "capitalize" | "uppercase" | "lowercase" | undefined;
1199
- userSelect: "auto" | "none" | "text" | "contain" | "all" | undefined;
1200
- includeFontPadding: boolean | undefined;
1201
- typography: string;
1202
- t: string;
1203
- }>) | undefined;
1204
- }> & React.RefAttributes<Ref>>;
3
+ import type { SxProps, TextSxProps } from '../@types/SxProps';
4
+ import type { UseSxOptions } from '../hook/useSx';
5
+ export declare function createSxComponent<Props extends object, Ref>(Base: ComponentType<Props>, { defaultProps, sxOptions }?: {
6
+ defaultProps?: Props & SxProps;
7
+ sxOptions?: UseSxOptions;
8
+ }): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & SxProps> & React.RefAttributes<Ref>>;
9
+ export declare function createSxTextComponent<Props extends object, Ref>(Base: ComponentType<Props>, { defaultProps, sxOptions, }?: {
10
+ defaultProps?: Props & TextSxProps;
11
+ sxOptions?: UseSxOptions;
12
+ }): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & TextSxProps> & React.RefAttributes<Ref>>;
1205
13
  //# sourceMappingURL=createSxComponent.d.ts.map