rn-css 1.8.2 → 1.8.4

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 (7) hide show
  1. package/dist/convertStyle.d.ts +2 -1
  2. package/dist/index.d.ts +46 -46
  3. package/dist/styleComponent.d.ts +1 -1
  4. package/package.json +1 -1
  5. package/src/convertStyle.tsx +2 -2
  6. package/src/index.tsx +1 -1
  7. package/src/styleComponent.tsx +4 -4
package/dist/convertStyle.d.ts CHANGED
@@ -1,4 +1,5 @@
1
+ import { /* StyleSheet, */ Animated, TextStyle } from 'react-native';
1
2
  import type { AnyStyle, PartialStyle, Units } from './types';
2
3
  /** Mix the calculated RN style within the object style */
3
- declare const convertStyle: <T extends AnyStyle = AnyStyle>(rnStyle: PartialStyle, units: Units) => T;
4
+ declare const convertStyle: <T extends AnyStyle | Animated.WithAnimatedObject<import("react-native").ViewStyle> | Animated.WithAnimatedObject<TextStyle> | Animated.WithAnimatedObject<import("react-native").ImageStyle> = AnyStyle>(rnStyle: PartialStyle, units: Units) => T;
4
5
  export default convertStyle;
package/dist/index.d.ts CHANGED
@@ -17,7 +17,7 @@ declare const styled: {
17
17
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
18
18
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
19
19
  children?: React.ReactNode;
20
- style?: RN.StyleProp<AnyStyle>;
20
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
21
21
  } & {
22
22
  ref?: React.Ref<any> | undefined;
23
23
  }>;
@@ -31,7 +31,7 @@ declare const styled: {
31
31
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
32
32
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
33
33
  children?: React.ReactNode;
34
- style?: RN.StyleProp<AnyStyle>;
34
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
35
35
  } & {
36
36
  ref?: React.Ref<any> | undefined;
37
37
  }>;
@@ -47,7 +47,7 @@ declare const styled: {
47
47
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
48
48
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
49
49
  children?: React.ReactNode;
50
- style?: RN.StyleProp<AnyStyle>;
50
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
51
51
  } & {
52
52
  ref?: React.Ref<any> | undefined;
53
53
  }>;
@@ -61,7 +61,7 @@ declare const styled: {
61
61
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
62
62
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
63
63
  children?: React.ReactNode;
64
- style?: RN.StyleProp<AnyStyle>;
64
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
65
65
  } & {
66
66
  ref?: React.Ref<any> | undefined;
67
67
  }>;
@@ -77,7 +77,7 @@ declare const styled: {
77
77
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
78
78
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
79
79
  children?: React.ReactNode;
80
- style?: RN.StyleProp<AnyStyle>;
80
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
81
81
  } & {
82
82
  ref?: React.Ref<any> | undefined;
83
83
  }>;
@@ -91,7 +91,7 @@ declare const styled: {
91
91
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
92
92
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
93
93
  children?: React.ReactNode;
94
- style?: RN.StyleProp<AnyStyle>;
94
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
95
95
  } & {
96
96
  ref?: React.Ref<any> | undefined;
97
97
  }>;
@@ -107,7 +107,7 @@ declare const styled: {
107
107
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
108
108
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
109
109
  children?: React.ReactNode;
110
- style?: RN.StyleProp<AnyStyle>;
110
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
111
111
  } & {
112
112
  ref?: React.Ref<any> | undefined;
113
113
  }>;
@@ -121,7 +121,7 @@ declare const styled: {
121
121
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
122
122
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
123
123
  children?: React.ReactNode;
124
- style?: RN.StyleProp<AnyStyle>;
124
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
125
125
  } & {
126
126
  ref?: React.Ref<any> | undefined;
127
127
  }>;
@@ -137,7 +137,7 @@ declare const styled: {
137
137
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
138
138
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
139
139
  children?: React.ReactNode;
140
- style?: RN.StyleProp<AnyStyle>;
140
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
141
141
  } & {
142
142
  ref?: React.Ref<any> | undefined;
143
143
  }>;
@@ -151,7 +151,7 @@ declare const styled: {
151
151
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
152
152
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
153
153
  children?: React.ReactNode;
154
- style?: RN.StyleProp<AnyStyle>;
154
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
155
155
  } & {
156
156
  ref?: React.Ref<any> | undefined;
157
157
  }>;
@@ -167,7 +167,7 @@ declare const styled: {
167
167
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
168
168
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
169
169
  children?: React.ReactNode;
170
- style?: RN.StyleProp<AnyStyle>;
170
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
171
171
  } & {
172
172
  ref?: React.Ref<any> | undefined;
173
173
  }>;
@@ -181,7 +181,7 @@ declare const styled: {
181
181
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
182
182
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
183
183
  children?: React.ReactNode;
184
- style?: RN.StyleProp<AnyStyle>;
184
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
185
185
  } & {
186
186
  ref?: React.Ref<any> | undefined;
187
187
  }>;
@@ -197,7 +197,7 @@ declare const styled: {
197
197
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
198
198
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
199
199
  children?: React.ReactNode;
200
- style?: RN.StyleProp<AnyStyle>;
200
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
201
201
  } & {
202
202
  ref?: React.Ref<any> | undefined;
203
203
  }>;
@@ -211,7 +211,7 @@ declare const styled: {
211
211
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
212
212
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
213
213
  children?: React.ReactNode;
214
- style?: RN.StyleProp<AnyStyle>;
214
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
215
215
  } & {
216
216
  ref?: React.Ref<any> | undefined;
217
217
  }>;
@@ -227,7 +227,7 @@ declare const styled: {
227
227
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
228
228
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
229
229
  children?: React.ReactNode;
230
- style?: RN.StyleProp<AnyStyle>;
230
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
231
231
  } & {
232
232
  ref?: React.Ref<any> | undefined;
233
233
  }>;
@@ -241,7 +241,7 @@ declare const styled: {
241
241
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
242
242
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
243
243
  children?: React.ReactNode;
244
- style?: RN.StyleProp<AnyStyle>;
244
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
245
245
  } & {
246
246
  ref?: React.Ref<any> | undefined;
247
247
  }>;
@@ -257,7 +257,7 @@ declare const styled: {
257
257
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
258
258
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
259
259
  children?: React.ReactNode;
260
- style?: RN.StyleProp<AnyStyle>;
260
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
261
261
  } & {
262
262
  ref?: React.Ref<any> | undefined;
263
263
  }>;
@@ -271,7 +271,7 @@ declare const styled: {
271
271
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
272
272
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
273
273
  children?: React.ReactNode;
274
- style?: RN.StyleProp<AnyStyle>;
274
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
275
275
  } & {
276
276
  ref?: React.Ref<any> | undefined;
277
277
  }>;
@@ -287,7 +287,7 @@ declare const styled: {
287
287
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
288
288
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
289
289
  children?: React.ReactNode;
290
- style?: RN.StyleProp<AnyStyle>;
290
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
291
291
  } & {
292
292
  ref?: React.Ref<any> | undefined;
293
293
  }>;
@@ -301,7 +301,7 @@ declare const styled: {
301
301
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
302
302
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
303
303
  children?: React.ReactNode;
304
- style?: RN.StyleProp<AnyStyle>;
304
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
305
305
  } & {
306
306
  ref?: React.Ref<any> | undefined;
307
307
  }>;
@@ -317,7 +317,7 @@ declare const styled: {
317
317
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
318
318
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
319
319
  children?: React.ReactNode;
320
- style?: RN.StyleProp<AnyStyle>;
320
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
321
321
  } & {
322
322
  ref?: React.Ref<any> | undefined;
323
323
  }>;
@@ -331,7 +331,7 @@ declare const styled: {
331
331
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
332
332
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
333
333
  children?: React.ReactNode;
334
- style?: RN.StyleProp<AnyStyle>;
334
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
335
335
  } & {
336
336
  ref?: React.Ref<any> | undefined;
337
337
  }>;
@@ -347,7 +347,7 @@ declare const styled: {
347
347
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
348
348
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
349
349
  children?: React.ReactNode;
350
- style?: RN.StyleProp<AnyStyle>;
350
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
351
351
  } & {
352
352
  ref?: React.Ref<any> | undefined;
353
353
  }>;
@@ -361,7 +361,7 @@ declare const styled: {
361
361
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
362
362
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
363
363
  children?: React.ReactNode;
364
- style?: RN.StyleProp<AnyStyle>;
364
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
365
365
  } & {
366
366
  ref?: React.Ref<any> | undefined;
367
367
  }>;
@@ -377,7 +377,7 @@ declare const styled: {
377
377
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
378
378
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
379
379
  children?: React.ReactNode;
380
- style?: RN.StyleProp<AnyStyle>;
380
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
381
381
  } & {
382
382
  ref?: React.Ref<any> | undefined;
383
383
  }>;
@@ -391,7 +391,7 @@ declare const styled: {
391
391
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
392
392
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
393
393
  children?: React.ReactNode;
394
- style?: RN.StyleProp<AnyStyle>;
394
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
395
395
  } & {
396
396
  ref?: React.Ref<any> | undefined;
397
397
  }>;
@@ -407,7 +407,7 @@ declare const styled: {
407
407
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
408
408
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
409
409
  children?: React.ReactNode;
410
- style?: RN.StyleProp<AnyStyle>;
410
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
411
411
  } & {
412
412
  ref?: React.Ref<any> | undefined;
413
413
  }>;
@@ -421,7 +421,7 @@ declare const styled: {
421
421
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
422
422
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
423
423
  children?: React.ReactNode;
424
- style?: RN.StyleProp<AnyStyle>;
424
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
425
425
  } & {
426
426
  ref?: React.Ref<any> | undefined;
427
427
  }>;
@@ -437,7 +437,7 @@ declare const styled: {
437
437
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
438
438
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
439
439
  children?: React.ReactNode;
440
- style?: RN.StyleProp<AnyStyle>;
440
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
441
441
  } & {
442
442
  ref?: React.Ref<any> | undefined;
443
443
  }>;
@@ -451,7 +451,7 @@ declare const styled: {
451
451
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
452
452
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
453
453
  children?: React.ReactNode;
454
- style?: RN.StyleProp<AnyStyle>;
454
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
455
455
  } & {
456
456
  ref?: React.Ref<any> | undefined;
457
457
  }>;
@@ -467,7 +467,7 @@ declare const styled: {
467
467
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
468
468
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
469
469
  children?: React.ReactNode;
470
- style?: RN.StyleProp<AnyStyle>;
470
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
471
471
  } & {
472
472
  ref?: React.Ref<any> | undefined;
473
473
  }>;
@@ -481,7 +481,7 @@ declare const styled: {
481
481
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
482
482
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
483
483
  children?: React.ReactNode;
484
- style?: RN.StyleProp<AnyStyle>;
484
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
485
485
  } & {
486
486
  ref?: React.Ref<any> | undefined;
487
487
  }>;
@@ -497,7 +497,7 @@ declare const styled: {
497
497
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
498
498
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
499
499
  children?: React.ReactNode;
500
- style?: RN.StyleProp<AnyStyle>;
500
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
501
501
  } & {
502
502
  ref?: React.Ref<any> | undefined;
503
503
  }>;
@@ -511,7 +511,7 @@ declare const styled: {
511
511
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
512
512
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
513
513
  children?: React.ReactNode;
514
- style?: RN.StyleProp<AnyStyle>;
514
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
515
515
  } & {
516
516
  ref?: React.Ref<any> | undefined;
517
517
  }>;
@@ -527,7 +527,7 @@ declare const styled: {
527
527
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
528
528
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
529
529
  children?: React.ReactNode;
530
- style?: RN.StyleProp<AnyStyle>;
530
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
531
531
  } & {
532
532
  ref?: React.Ref<any> | undefined;
533
533
  }>;
@@ -541,7 +541,7 @@ declare const styled: {
541
541
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
542
542
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
543
543
  children?: React.ReactNode;
544
- style?: RN.StyleProp<AnyStyle>;
544
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
545
545
  } & {
546
546
  ref?: React.Ref<any> | undefined;
547
547
  }>;
@@ -557,7 +557,7 @@ declare const styled: {
557
557
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
558
558
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
559
559
  children?: React.ReactNode;
560
- style?: RN.StyleProp<AnyStyle>;
560
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
561
561
  } & {
562
562
  ref?: React.Ref<any> | undefined;
563
563
  }>;
@@ -571,7 +571,7 @@ declare const styled: {
571
571
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
572
572
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
573
573
  children?: React.ReactNode;
574
- style?: RN.StyleProp<AnyStyle>;
574
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
575
575
  } & {
576
576
  ref?: React.Ref<any> | undefined;
577
577
  }>;
@@ -587,7 +587,7 @@ declare const styled: {
587
587
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
588
588
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
589
589
  children?: React.ReactNode;
590
- style?: RN.StyleProp<AnyStyle>;
590
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
591
591
  } & {
592
592
  ref?: React.Ref<any> | undefined;
593
593
  }>;
@@ -601,7 +601,7 @@ declare const styled: {
601
601
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
602
602
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
603
603
  children?: React.ReactNode;
604
- style?: RN.StyleProp<AnyStyle>;
604
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
605
605
  } & {
606
606
  ref?: React.Ref<any> | undefined;
607
607
  }>;
@@ -617,7 +617,7 @@ declare const styled: {
617
617
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
618
618
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
619
619
  children?: React.ReactNode;
620
- style?: RN.StyleProp<AnyStyle>;
620
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
621
621
  } & {
622
622
  ref?: React.Ref<any> | undefined;
623
623
  }>;
@@ -631,7 +631,7 @@ declare const styled: {
631
631
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
632
632
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
633
633
  children?: React.ReactNode;
634
- style?: RN.StyleProp<AnyStyle>;
634
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
635
635
  } & {
636
636
  ref?: React.Ref<any> | undefined;
637
637
  }>;
@@ -647,7 +647,7 @@ declare const styled: {
647
647
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
648
648
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
649
649
  children?: React.ReactNode;
650
- style?: RN.StyleProp<AnyStyle>;
650
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
651
651
  } & {
652
652
  ref?: React.Ref<any> | undefined;
653
653
  }>;
@@ -661,7 +661,7 @@ declare const styled: {
661
661
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
662
662
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
663
663
  children?: React.ReactNode;
664
- style?: RN.StyleProp<AnyStyle>;
664
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
665
665
  } & {
666
666
  ref?: React.Ref<any> | undefined;
667
667
  }>;
@@ -677,7 +677,7 @@ declare const styled: {
677
677
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
678
678
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
679
679
  children?: React.ReactNode;
680
- style?: RN.StyleProp<AnyStyle>;
680
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
681
681
  } & {
682
682
  ref?: React.Ref<any> | undefined;
683
683
  }>;
@@ -691,7 +691,7 @@ declare const styled: {
691
691
  onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
692
692
  onLayout?: ((event: RN.LayoutChangeEvent) => void) | undefined;
693
693
  children?: React.ReactNode;
694
- style?: RN.StyleProp<AnyStyle>;
694
+ style?: RN.StyleProp<AnyStyle | RN.Animated.WithAnimatedObject<RN.ViewStyle> | RN.Animated.WithAnimatedObject<RN.TextStyle> | RN.Animated.WithAnimatedObject<RN.ImageStyle>>;
695
695
  } & {
696
696
  ref?: React.Ref<any> | undefined;
697
697
  }>;
package/dist/styleComponent.d.ts CHANGED
@@ -21,7 +21,7 @@ declare type OptionalProps<T extends AnyStyle | Animated.WithAnimatedValue<AnySt
21
21
  children?: React.ReactNode;
22
22
  style?: StyleProp<T>;
23
23
  };
24
- declare const styled: <Props, StyleType extends AnyStyle = AnyStyle>(Component: React.ComponentType<Props>) => {
24
+ declare const styled: <Props, StyleType extends AnyStyle | Animated.WithAnimatedObject<import("react-native").ViewStyle> | Animated.WithAnimatedObject<import("react-native").TextStyle> | Animated.WithAnimatedObject<import("react-native").ImageStyle> = AnyStyle>(Component: React.ComponentType<Props>) => {
25
25
  <S>(chunks: TemplateStringsArray, ...functs: (Primitive | Functs<S & Props>)[]): React.ForwardRefExoticComponent<Props & S & OptionalProps<StyleType> & {
26
26
  ref?: React.Ref<any> | undefined;
27
27
  }>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rn-css",
3
- "version": "1.8.2",
3
+ "version": "1.8.4",
4
4
  "scripts": {
5
5
  "test": "jest",
6
6
  "prepare": "tsc",
package/src/convertStyle.tsx CHANGED
@@ -1,10 +1,10 @@
1
1
  /* eslint-disable react/display-name */
2
- import { /* StyleSheet, */ TextStyle } from 'react-native'
2
+ import { /* StyleSheet, */ Animated, TextStyle } from 'react-native'
3
3
  import { convertValue } from './convertUnits'
4
4
  import type { AnyStyle, CompleteStyle, PartialStyle, Units } from './types'
5
5
 
6
6
  /** Mix the calculated RN style within the object style */
7
- const convertStyle = <T extends AnyStyle = AnyStyle>(rnStyle: PartialStyle, units: Units) => {
7
+ const convertStyle = <T extends AnyStyle | Animated.WithAnimatedValue<AnyStyle> = AnyStyle>(rnStyle: PartialStyle, units: Units) => {
8
8
  /** This is the result of the convertions from css style into RN style */
9
9
  const convertedStyle: CompleteStyle = {};
10
10
  // If width and height are specified, we can use those values for the first render
package/src/index.tsx CHANGED
@@ -7,7 +7,7 @@ export { cssToRNStyle } from './cssToRN'
7
7
  export { SharedValue, FontSizeContext, RemContext, DefaultTheme } from './styleComponent'
8
8
  export * from './useTheme'
9
9
 
10
- const styled = <T, >(Component: React.ComponentType<T>) => styledComponent<T, AnyStyle>(Component)
10
+ const styled = <T, >(Component: React.ComponentType<T>) => styledComponent<T, AnyStyle | RN.Animated.WithAnimatedValue<AnyStyle>>(Component)
11
11
 
12
12
  styled.ActivityIndicator = styled(RN.ActivityIndicator)
13
13
  styled.Button = styled(RN.Button)
package/src/styleComponent.tsx CHANGED
@@ -59,7 +59,7 @@ function removeStyle (hash: string) {
59
59
  styleMap[hash].usage--
60
60
  if (styleMap[hash].usage <= 0) delete styleMap[hash]
61
61
  }
62
- const styled = <Props, StyleType extends AnyStyle = AnyStyle>(Component: React.ComponentType<Props>) => {
62
+ const styled = <Props, StyleType extends AnyStyle | Animated.WithAnimatedValue<AnyStyle> = AnyStyle>(Component: React.ComponentType<Props>) => {
63
63
  const styledComponent = <S, >(chunks: TemplateStringsArray, ...functs: (Primitive | Functs<S & Props>)[]) => {
64
64
  const ForwardRefComponent = React.forwardRef<React.ComponentType<S & Props & OptionalProps<StyleType>>, S & Props & OptionalProps<StyleType>>((props: S & Props & OptionalProps<StyleType>, ref) => {
65
65
  const rem = React.useContext(RemContext)
@@ -120,13 +120,13 @@ const styled = <Props, StyleType extends AnyStyle = AnyStyle>(Component: React.C
120
120
  const units = React.useMemo<Units>(() => ({ ...baseUnits, em }), [baseUnits, em])
121
121
 
122
122
  const { style: styleConvertedFromCSS, hash } = React.useMemo(() => {
123
- const style = convertStyle<StyleType>(finalStyle, units)
123
+ const style = convertStyle<CompleteStyle>(finalStyle, units)
124
124
  delete (style as Style).textOverflow
125
125
  const hash = generateHash(JSON.stringify(style))
126
- return { style: getStyle<StyleType>(hash, style), hash }
126
+ return { style: getStyle<CompleteStyle>(hash, style), hash }
127
127
  }, [finalStyle, units])
128
128
  const newProps = React.useMemo(() => {
129
- const newProps: OptionalProps<StyleType> = { style: [styleConvertedFromCSS, props.style], onMouseEnter, onMouseLeave, onLayout }
129
+ const newProps: OptionalProps<StyleType> = { style: [styleConvertedFromCSS as StyleType, props.style], onMouseEnter, onMouseLeave, onLayout }
130
130
  if (finalStyle.textOverflow === 'ellipsis') {
131
131
  Object.assign(newProps, { numberOfLines: 1 })
132
132
  }