react-native-unistyles 3.0.0-alpha.5 → 3.0.0-alpha.7

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 (53) hide show
  1. package/cxx/common/Helpers.h +24 -0
  2. package/cxx/core/HostStyle.cpp +4 -5
  3. package/cxx/core/HostStyle.h +4 -0
  4. package/cxx/core/StyleSheet.h +0 -1
  5. package/cxx/core/StyleSheetRegistry.cpp +9 -17
  6. package/cxx/core/StyleSheetRegistry.h +3 -4
  7. package/cxx/core/UnistyleData.h +22 -0
  8. package/cxx/core/UnistylesCommitHook.cpp +4 -1
  9. package/cxx/core/UnistylesRegistry.cpp +33 -49
  10. package/cxx/core/UnistylesRegistry.h +8 -8
  11. package/cxx/hybridObjects/HybridShadowRegistry.cpp +4 -3
  12. package/cxx/hybridObjects/HybridStyleSheet.cpp +8 -11
  13. package/cxx/parser/Parser.cpp +42 -68
  14. package/cxx/parser/Parser.h +8 -13
  15. package/lib/commonjs/specs/NavigtionBar/index.js +1 -1
  16. package/lib/commonjs/specs/NavigtionBar/index.js.map +1 -1
  17. package/lib/commonjs/specs/ShadowRegistry/index.js +2 -2
  18. package/lib/commonjs/specs/ShadowRegistry/index.js.map +1 -1
  19. package/lib/commonjs/specs/StatusBar/index.js +1 -1
  20. package/lib/commonjs/specs/StatusBar/index.js.map +1 -1
  21. package/lib/commonjs/specs/StyleSheet/index.js.map +1 -1
  22. package/lib/commonjs/specs/UnistylesRuntime/index.js +1 -1
  23. package/lib/commonjs/specs/UnistylesRuntime/index.js.map +1 -1
  24. package/lib/module/specs/NavigtionBar/index.js +1 -1
  25. package/lib/module/specs/NavigtionBar/index.js.map +1 -1
  26. package/lib/module/specs/ShadowRegistry/index.js +2 -2
  27. package/lib/module/specs/ShadowRegistry/index.js.map +1 -1
  28. package/lib/module/specs/StatusBar/index.js +1 -1
  29. package/lib/module/specs/StatusBar/index.js.map +1 -1
  30. package/lib/module/specs/StyleSheet/index.js.map +1 -1
  31. package/lib/module/specs/UnistylesRuntime/index.js +1 -1
  32. package/lib/module/specs/UnistylesRuntime/index.js.map +1 -1
  33. package/lib/typescript/example/App.d.ts.map +1 -1
  34. package/lib/typescript/example/Typography.d.ts +11 -0
  35. package/lib/typescript/example/Typography.d.ts.map +1 -0
  36. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts +2 -2
  37. package/lib/typescript/src/specs/ShadowRegistry/index.d.ts.map +1 -1
  38. package/lib/typescript/src/specs/StyleSheet/index.d.ts +2 -1
  39. package/lib/typescript/src/specs/StyleSheet/index.d.ts.map +1 -1
  40. package/package.json +1 -1
  41. package/plugin/__tests__/dependencies.spec.js +181 -103
  42. package/plugin/__tests__/ref.spec.js +222 -158
  43. package/plugin/__tests__/stylesheet.spec.js +148 -55
  44. package/plugin/index.js +22 -11
  45. package/plugin/ref.js +35 -7
  46. package/plugin/style.js +5 -22
  47. package/plugin/stylesheet.js +44 -1
  48. package/plugin/variants.js +33 -0
  49. package/src/specs/NavigtionBar/index.ts +1 -1
  50. package/src/specs/ShadowRegistry/index.ts +4 -4
  51. package/src/specs/StatusBar/index.ts +1 -1
  52. package/src/specs/StyleSheet/index.ts +3 -1
  53. package/src/specs/UnistylesRuntime/index.ts +1 -1
package/plugin/__tests__/ref.spec.js CHANGED
@@ -78,7 +78,7 @@ pluginTester({
78
78
  <View
79
79
  style={styles.container}
80
80
  ref={ref => {
81
- UnistylesShadowRegistry.add(ref, styles.container)
81
+ UnistylesShadowRegistry.add(ref, styles.container, undefined)
82
82
  return () => UnistylesShadowRegistry.remove(ref, styles.container)
83
83
  }}
84
84
  >
@@ -130,8 +130,8 @@ pluginTester({
130
130
  return (
131
131
  <View
132
132
  ref={_ref => {
133
- ref = _ref
134
- UnistylesShadowRegistry.add(_ref, styles.container)
133
+ ref.current = _ref
134
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
135
135
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
136
136
  }}
137
137
  style={styles.container}
@@ -141,11 +141,14 @@ pluginTester({
141
141
  )
142
142
  }
143
143
 
144
- const styles = StyleSheet.create({
145
- container: {
146
- backgroundColor: 'red'
147
- }
148
- })
144
+ const styles = StyleSheet.create(
145
+ {
146
+ container: {
147
+ backgroundColor: 'red'
148
+ }
149
+ },
150
+ 921918562
151
+ )
149
152
  `
150
153
  },
151
154
  {
@@ -155,13 +158,13 @@ pluginTester({
155
158
  import { StyleSheet } from 'react-native-unistyles'
156
159
 
157
160
  export const Example = () => {
158
- let myRef = useRef()
161
+ const myRef = useRef()
159
162
 
160
163
  return (
161
164
  <View
162
165
  ref={ref => {
163
166
  doSomething(ref)
164
- myRef = ref
167
+ myRef.current = ref
165
168
  }}
166
169
  style={styles.container}
167
170
  >
@@ -182,14 +185,14 @@ pluginTester({
182
185
  import { StyleSheet } from 'react-native-unistyles'
183
186
 
184
187
  export const Example = () => {
185
- let myRef = useRef()
188
+ const myRef = useRef()
186
189
 
187
190
  return (
188
191
  <View
189
192
  ref={ref => {
190
193
  doSomething(ref)
191
- myRef = ref
192
- UnistylesShadowRegistry.add(ref, styles.container)
194
+ myRef.current = ref
195
+ UnistylesShadowRegistry.add(ref, styles.container, undefined)
193
196
  return () => {
194
197
  UnistylesShadowRegistry.remove(ref, styles.container)
195
198
  }
@@ -201,11 +204,14 @@ pluginTester({
201
204
  )
202
205
  }
203
206
 
204
- const styles = StyleSheet.create({
205
- container: {
206
- backgroundColor: 'red'
207
- }
208
- })
207
+ const styles = StyleSheet.create(
208
+ {
209
+ container: {
210
+ backgroundColor: 'red'
211
+ }
212
+ },
213
+ 921918562
214
+ )
209
215
  `
210
216
  },
211
217
  {
@@ -215,13 +221,13 @@ pluginTester({
215
221
  import { StyleSheet } from 'react-native-unistyles'
216
222
 
217
223
  export const Example = () => {
218
- let myRef = React.useRef()
224
+ const myRef = React.useRef()
219
225
 
220
226
  return (
221
227
  <View
222
228
  ref={ref => {
223
229
  doSomething(ref)
224
- myRef = ref
230
+ myRef.current = ref
225
231
 
226
232
  return () => {
227
233
  customCleanup()
@@ -246,14 +252,14 @@ pluginTester({
246
252
  import { StyleSheet } from 'react-native-unistyles'
247
253
 
248
254
  export const Example = () => {
249
- let myRef = React.useRef()
255
+ const myRef = React.useRef()
250
256
 
251
257
  return (
252
258
  <View
253
259
  ref={ref => {
254
260
  doSomething(ref)
255
- myRef = ref
256
- UnistylesShadowRegistry.add(ref, styles.container)
261
+ myRef.current = ref
262
+ UnistylesShadowRegistry.add(ref, styles.container, undefined)
257
263
  return () => {
258
264
  ;(() => {
259
265
  customCleanup()
@@ -268,11 +274,14 @@ pluginTester({
268
274
  )
269
275
  }
270
276
 
271
- const styles = StyleSheet.create({
272
- container: {
273
- backgroundColor: 'red'
274
- }
275
- })
277
+ const styles = StyleSheet.create(
278
+ {
279
+ container: {
280
+ backgroundColor: 'red'
281
+ }
282
+ },
283
+ 921918562
284
+ )
276
285
  `
277
286
  },
278
287
  {
@@ -282,10 +291,10 @@ pluginTester({
282
291
  import { StyleSheet } from 'react-native-unistyles'
283
292
 
284
293
  export const Example = () => {
285
- let myRef = React.useRef()
294
+ const myRef = React.useRef()
286
295
  const fn = ref => {
287
296
  doSomething(ref)
288
- myRef = ref
297
+ myRef.current = ref
289
298
 
290
299
  return () => {
291
300
  customCleanup2()
@@ -314,17 +323,17 @@ pluginTester({
314
323
  import { StyleSheet } from 'react-native-unistyles'
315
324
 
316
325
  export const Example = () => {
317
- let myRef = React.useRef()
326
+ const myRef = React.useRef()
318
327
  const fn = ref => {
319
328
  doSomething(ref)
320
- myRef = ref
329
+ myRef.current = ref
321
330
  }
322
331
 
323
332
  return (
324
333
  <View
325
334
  ref={_ref => {
326
335
  fn(_ref)
327
- UnistylesShadowRegistry.add(_ref, styles.container)
336
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
328
337
  return () => {
329
338
  ;(() => {
330
339
  customCleanup2()
@@ -339,11 +348,14 @@ pluginTester({
339
348
  )
340
349
  }
341
350
 
342
- const styles = StyleSheet.create({
343
- container: {
344
- backgroundColor: 'red'
345
- }
346
- })
351
+ const styles = StyleSheet.create(
352
+ {
353
+ container: {
354
+ backgroundColor: 'red'
355
+ }
356
+ },
357
+ 921918562
358
+ )
347
359
  `
348
360
  },
349
361
  {
@@ -353,10 +365,10 @@ pluginTester({
353
365
  import { StyleSheet } from 'react-native-unistyles'
354
366
 
355
367
  export const Example = () => {
356
- let myRef = React.useRef()
368
+ const myRef = React.useRef()
357
369
  function fn(ref) {
358
370
  doSomething(ref)
359
- myRef = ref
371
+ myRef.current = ref
360
372
 
361
373
  return () => {
362
374
  customCleanup2()
@@ -385,17 +397,17 @@ pluginTester({
385
397
  import { StyleSheet } from 'react-native-unistyles'
386
398
 
387
399
  export const Example = () => {
388
- let myRef = React.useRef()
400
+ const myRef = React.useRef()
389
401
  function fn(ref) {
390
402
  doSomething(ref)
391
- myRef = ref
403
+ myRef.current = ref
392
404
  }
393
405
 
394
406
  return (
395
407
  <View
396
408
  ref={_ref => {
397
409
  fn(_ref)
398
- UnistylesShadowRegistry.add(_ref, styles.container)
410
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
399
411
  return () => {
400
412
  ;(() => {
401
413
  customCleanup2()
@@ -410,11 +422,14 @@ pluginTester({
410
422
  )
411
423
  }
412
424
 
413
- const styles = StyleSheet.create({
414
- container: {
415
- backgroundColor: 'red'
416
- }
417
- })
425
+ const styles = StyleSheet.create(
426
+ {
427
+ container: {
428
+ backgroundColor: 'red'
429
+ }
430
+ },
431
+ 921918562
432
+ )
418
433
  `
419
434
  },
420
435
  {
@@ -424,7 +439,7 @@ pluginTester({
424
439
  import { StyleSheet } from 'react-native-unistyles'
425
440
 
426
441
  export const Example = () => {
427
- let myRef = useRef()
442
+ const myRef = useRef()
428
443
 
429
444
  return (
430
445
  <View
@@ -449,7 +464,7 @@ pluginTester({
449
464
  import { StyleSheet } from 'react-native-unistyles'
450
465
 
451
466
  export const Example = () => {
452
- let myRef = useRef()
467
+ const myRef = useRef()
453
468
 
454
469
  return (
455
470
  <View
@@ -463,11 +478,14 @@ pluginTester({
463
478
  )
464
479
  }
465
480
 
466
- const styles = StyleSheet.create({
467
- container: {
468
- backgroundColor: 'red'
469
- }
470
- })
481
+ const styles = StyleSheet.create(
482
+ {
483
+ container: {
484
+ backgroundColor: 'red'
485
+ }
486
+ },
487
+ 921918562
488
+ )
471
489
  `
472
490
  },
473
491
  {
@@ -477,7 +495,7 @@ pluginTester({
477
495
  import { StyleSheet } from 'react-native-unistyles'
478
496
 
479
497
  export const Example = () => {
480
- let myRef = useRef()
498
+ const myRef = useRef()
481
499
 
482
500
  return (
483
501
  <View
@@ -503,7 +521,7 @@ pluginTester({
503
521
  import { StyleSheet } from 'react-native-unistyles'
504
522
 
505
523
  export const Example = () => {
506
- let myRef = useRef()
524
+ const myRef = useRef()
507
525
 
508
526
  return (
509
527
  <View
@@ -518,11 +536,14 @@ pluginTester({
518
536
  )
519
537
  }
520
538
 
521
- const styles = StyleSheet.create({
522
- container: {
523
- backgroundColor: 'red'
524
- }
525
- })
539
+ const styles = StyleSheet.create(
540
+ {
541
+ container: {
542
+ backgroundColor: 'red'
543
+ }
544
+ },
545
+ 921918562
546
+ )
526
547
  `
527
548
  },
528
549
  {
@@ -532,7 +553,7 @@ pluginTester({
532
553
  import { StyleSheet } from 'react-native-unistyles'
533
554
 
534
555
  export const Example = () => {
535
- let myRef = useRef()
556
+ const myRef = useRef()
536
557
 
537
558
  return (
538
559
  <View
@@ -555,7 +576,7 @@ pluginTester({
555
576
  import { StyleSheet } from 'react-native-unistyles'
556
577
 
557
578
  export const Example = () => {
558
- let myRef = useRef()
579
+ const myRef = useRef()
559
580
 
560
581
  return (
561
582
  <View ref={myRef} style={[obj1, obj2]}>
@@ -564,11 +585,14 @@ pluginTester({
564
585
  )
565
586
  }
566
587
 
567
- const styles = StyleSheet.create({
568
- container: {
569
- backgroundColor: 'red'
570
- }
571
- })
588
+ const styles = StyleSheet.create(
589
+ {
590
+ container: {
591
+ backgroundColor: 'red'
592
+ }
593
+ },
594
+ 921918562
595
+ )
572
596
  `
573
597
  },
574
598
  {
@@ -578,7 +602,7 @@ pluginTester({
578
602
  import { StyleSheet } from 'react-native-unistyles'
579
603
 
580
604
  export const Example = () => {
581
- let myRef = useRef()
605
+ const myRef = useRef()
582
606
 
583
607
  return (
584
608
  <View
@@ -607,13 +631,13 @@ pluginTester({
607
631
  import { StyleSheet } from 'react-native-unistyles'
608
632
 
609
633
  export const Example = () => {
610
- let myRef = useRef()
634
+ const myRef = useRef()
611
635
 
612
636
  return (
613
637
  <View
614
638
  ref={_ref => {
615
- myRef = _ref
616
- UnistylesShadowRegistry.add(_ref, styles.container)
639
+ myRef.current = _ref
640
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
617
641
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
618
642
  }}
619
643
  style={{
@@ -628,11 +652,14 @@ pluginTester({
628
652
  )
629
653
  }
630
654
 
631
- const styles = StyleSheet.create({
632
- container: {
633
- backgroundColor: 'red'
634
- }
635
- })
655
+ const styles = StyleSheet.create(
656
+ {
657
+ container: {
658
+ backgroundColor: 'red'
659
+ }
660
+ },
661
+ 921918562
662
+ )
636
663
  `
637
664
  },
638
665
  {
@@ -642,7 +669,7 @@ pluginTester({
642
669
  import { StyleSheet } from 'react-native-unistyles'
643
670
 
644
671
  export const Example = () => {
645
- let myRef = useRef()
672
+ const myRef = useRef()
646
673
 
647
674
  return (
648
675
  <View
@@ -671,13 +698,13 @@ pluginTester({
671
698
  import { StyleSheet } from 'react-native-unistyles'
672
699
 
673
700
  export const Example = () => {
674
- let myRef = useRef()
701
+ const myRef = useRef()
675
702
 
676
703
  return (
677
704
  <View
678
705
  ref={_ref => {
679
- myRef = _ref
680
- UnistylesShadowRegistry.add(_ref, styles.container)
706
+ myRef.current = _ref
707
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
681
708
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
682
709
  }}
683
710
  style={[
@@ -692,11 +719,14 @@ pluginTester({
692
719
  )
693
720
  }
694
721
 
695
- const styles = StyleSheet.create({
696
- container: {
697
- backgroundColor: 'red'
698
- }
699
- })
722
+ const styles = StyleSheet.create(
723
+ {
724
+ container: {
725
+ backgroundColor: 'red'
726
+ }
727
+ },
728
+ 921918562
729
+ )
700
730
  `
701
731
  },
702
732
  {
@@ -706,7 +736,7 @@ pluginTester({
706
736
  import { StyleSheet } from 'react-native-unistyles'
707
737
 
708
738
  export const Example = () => {
709
- let myRef = useRef()
739
+ const myRef = useRef()
710
740
 
711
741
  return (
712
742
  <View
@@ -730,13 +760,13 @@ pluginTester({
730
760
  import { StyleSheet } from 'react-native-unistyles'
731
761
 
732
762
  export const Example = () => {
733
- let myRef = useRef()
763
+ const myRef = useRef()
734
764
 
735
765
  return (
736
766
  <View
737
767
  ref={_ref => {
738
- myRef = _ref
739
- UnistylesShadowRegistry.add(_ref, styles.container)
768
+ myRef.current = _ref
769
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
740
770
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
741
771
  }}
742
772
  style={[styles.container]}
@@ -746,11 +776,14 @@ pluginTester({
746
776
  )
747
777
  }
748
778
 
749
- const styles = StyleSheet.create({
750
- container: {
751
- backgroundColor: 'red'
752
- }
753
- })
779
+ const styles = StyleSheet.create(
780
+ {
781
+ container: {
782
+ backgroundColor: 'red'
783
+ }
784
+ },
785
+ 921918562
786
+ )
754
787
  `
755
788
  },
756
789
  {
@@ -760,7 +793,7 @@ pluginTester({
760
793
  import { StyleSheet } from 'react-native-unistyles'
761
794
 
762
795
  export const Example = () => {
763
- let myRef = useRef()
796
+ const myRef = useRef()
764
797
 
765
798
  return (
766
799
  <View
@@ -786,27 +819,30 @@ pluginTester({
786
819
  import { StyleSheet } from 'react-native-unistyles'
787
820
 
788
821
  export const Example = () => {
789
- let myRef = useRef()
822
+ const myRef = useRef()
790
823
 
791
824
  return (
792
825
  <View
793
826
  ref={_ref => {
794
- myRef = _ref
795
- UnistylesShadowRegistry.add(_ref, styles.container)
827
+ myRef.current = _ref
828
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
796
829
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
797
830
  }}
798
- style={[styles.container(1, 2, 1)]}
831
+ style={[styles.container(1, 2)]}
799
832
  >
800
833
  <Text>Hello world</Text>
801
834
  </View>
802
835
  )
803
836
  }
804
837
 
805
- const styles = StyleSheet.create({
806
- container: () => ({
807
- backgroundColor: 'red'
808
- })
809
- })
838
+ const styles = StyleSheet.create(
839
+ {
840
+ container: () => ({
841
+ backgroundColor: 'red'
842
+ })
843
+ },
844
+ 921918562
845
+ )
810
846
  `
811
847
  },
812
848
  {
@@ -816,7 +852,7 @@ pluginTester({
816
852
  import { StyleSheet } from 'react-native-unistyles'
817
853
 
818
854
  export const Example = () => {
819
- let myRef = useRef()
855
+ const myRef = useRef()
820
856
 
821
857
  return (
822
858
  <View
@@ -832,9 +868,9 @@ pluginTester({
832
868
  }
833
869
 
834
870
  const styles = StyleSheet.create({
835
- container: () => ({
871
+ container: {
836
872
  backgroundColor: 'red'
837
- })
873
+ }
838
874
  })
839
875
  `,
840
876
  output: `
@@ -843,18 +879,18 @@ pluginTester({
843
879
  import { StyleSheet } from 'react-native-unistyles'
844
880
 
845
881
  export const Example = () => {
846
- let myRef = useRef()
882
+ const myRef = useRef()
847
883
 
848
884
  return (
849
885
  <View
850
886
  ref={_ref => {
851
- myRef = _ref
852
- UnistylesShadowRegistry.add(_ref, styles.container)
887
+ myRef.current = _ref
888
+ UnistylesShadowRegistry.add(_ref, styles.container, undefined)
853
889
  return () => UnistylesShadowRegistry.remove(_ref, styles.container)
854
890
  }}
855
891
  style={{
856
892
  backgroundColor: 'red',
857
- ...styles.container(1, 2, 1)
893
+ ...styles.container(1, 2)
858
894
  }}
859
895
  >
860
896
  <Text>Hello world</Text>
@@ -862,21 +898,28 @@ pluginTester({
862
898
  )
863
899
  }
864
900
 
865
- const styles = StyleSheet.create({
866
- container: () => ({
867
- backgroundColor: 'red'
868
- })
869
- })
901
+ const styles = StyleSheet.create(
902
+ {
903
+ container: {
904
+ backgroundColor: 'red'
905
+ }
906
+ },
907
+ 921918562
908
+ )
870
909
  `
871
910
  },
872
911
  {
873
- title: 'Should modify registry names if user changes name of member expression',
912
+ title: 'It should extract variants and pass them to ShadowReigstry',
874
913
  code: `
875
914
  import { useRef } from 'react'
876
915
  import { StyleSheet } from 'react-native-unistyles'
877
916
 
878
917
  export const Example = () => {
879
- let myRef = useRef()
918
+ const myRef = useRef()
919
+
920
+ styles.useVariants({
921
+ size: 'default'
922
+ })
880
923
 
881
924
  return (
882
925
  <View
@@ -890,7 +933,17 @@ pluginTester({
890
933
 
891
934
  const uhh = StyleSheet.create({
892
935
  dkk: () => ({
893
- backgroundColor: 'red'
936
+ backgroundColor: 'red',
937
+ variants: {
938
+ size: {
939
+ small: {
940
+ backgroundColor: 'blue'
941
+ },
942
+ default: {
943
+ backgroundColor: 'green'
944
+ }
945
+ }
946
+ }
894
947
  })
895
948
  })
896
949
  `,
@@ -900,52 +953,68 @@ pluginTester({
900
953
  import { StyleSheet } from 'react-native-unistyles'
901
954
 
902
955
  export const Example = () => {
903
- let myRef = useRef()
956
+ const myRef = useRef()
957
+ const __uni__variants = {
958
+ size: 'default'
959
+ }
960
+ styles.useVariants(__uni__variants)
904
961
 
905
962
  return (
906
963
  <View
907
964
  ref={_ref => {
908
- myRef = _ref
909
- UnistylesShadowRegistry.add(_ref, uhh.dkk)
965
+ myRef.current = _ref
966
+ UnistylesShadowRegistry.add(_ref, uhh.dkk, __uni__variants)
910
967
  return () => UnistylesShadowRegistry.remove(_ref, uhh.dkk)
911
968
  }}
912
- style={uhh.dkk(1)}
969
+ style={uhh.dkk()}
913
970
  >
914
971
  <Text>Hello world</Text>
915
972
  </View>
916
973
  )
917
974
  }
918
975
 
919
- const uhh = StyleSheet.create({
920
- dkk: () => ({
921
- backgroundColor: 'red'
922
- })
923
- })
976
+ const uhh = StyleSheet.create(
977
+ {
978
+ dkk: () => ({
979
+ backgroundColor: 'red',
980
+ variants: {
981
+ size: {
982
+ small: {
983
+ backgroundColor: 'blue'
984
+ },
985
+ default: {
986
+ backgroundColor: 'green'
987
+ }
988
+ }
989
+ },
990
+ uni__dependencies: [4]
991
+ })
992
+ },
993
+ 921918562
994
+ )
924
995
  `
925
996
  },
926
997
  {
927
- title: 'Should increment counter for web dynamic functions',
998
+ title: 'Should modify registry names if user changes name of member expression',
928
999
  code: `
929
1000
  import { useRef } from 'react'
930
1001
  import { StyleSheet } from 'react-native-unistyles'
931
1002
 
932
1003
  export const Example = () => {
933
- let myRef = useRef()
1004
+ const myRef = useRef()
934
1005
 
935
1006
  return (
936
1007
  <View
937
1008
  ref={myRef}
938
- style={styles.container()}
1009
+ style={uhh.dkk()}
939
1010
  >
940
- <Text style={styles.container()}>
941
- Hello world
942
- </Text>
1011
+ <Text>Hello world</Text>
943
1012
  </View>
944
1013
  )
945
1014
  }
946
1015
 
947
- const styles = StyleSheet.create({
948
- container: () => ({
1016
+ const uhh = StyleSheet.create({
1017
+ dkk: () => ({
949
1018
  backgroundColor: 'red'
950
1019
  })
951
1020
  })
@@ -956,36 +1025,31 @@ pluginTester({
956
1025
  import { StyleSheet } from 'react-native-unistyles'
957
1026
 
958
1027
  export const Example = () => {
959
- let myRef = useRef()
1028
+ const myRef = useRef()
960
1029
 
961
1030
  return (
962
1031
  <View
963
1032
  ref={_ref => {
964
- myRef = _ref
965
- UnistylesShadowRegistry.add(_ref, styles.container)
966
- return () => UnistylesShadowRegistry.remove(_ref, styles.container)
1033
+ myRef.current = _ref
1034
+ UnistylesShadowRegistry.add(_ref, uhh.dkk, undefined)
1035
+ return () => UnistylesShadowRegistry.remove(_ref, uhh.dkk)
967
1036
  }}
968
- style={styles.container(1)}
1037
+ style={uhh.dkk()}
969
1038
  >
970
- <Text
971
- style={styles.container(2)}
972
- ref={ref => {
973
- UnistylesShadowRegistry.add(ref, styles.container)
974
- return () => UnistylesShadowRegistry.remove(ref, styles.container)
975
- }}
976
- >
977
- Hello world
978
- </Text>
1039
+ <Text>Hello world</Text>
979
1040
  </View>
980
1041
  )
981
1042
  }
982
1043
 
983
- const styles = StyleSheet.create({
984
- container: () => ({
985
- backgroundColor: 'red'
986
- })
987
- })
1044
+ const uhh = StyleSheet.create(
1045
+ {
1046
+ dkk: () => ({
1047
+ backgroundColor: 'red'
1048
+ })
1049
+ },
1050
+ 921918562
1051
+ )
988
1052
  `
989
- },
1053
+ }
990
1054
  ]
991
1055
  })