@hero-design/rn 8.100.2 → 8.101.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 (36) hide show
  1. package/.turbo/turbo-build.log +3 -3
  2. package/CHANGELOG.md +6 -0
  3. package/es/index.js +109 -25
  4. package/lib/index.js +109 -25
  5. package/package.json +1 -1
  6. package/src/components/Chart/ColumnChart/ColumnChartContent.tsx +19 -3
  7. package/src/components/Chart/ColumnChart/Segment.tsx +1 -1
  8. package/src/components/Chart/ColumnChart/StackedSegment.tsx +10 -6
  9. package/src/components/Chart/ColumnChart/__tests__/Segment.spec.tsx +1 -1
  10. package/src/components/Chart/ColumnChart/__tests__/__snapshots__/StackedSegment.spec.tsx.snap +6 -21
  11. package/src/components/Chart/ColumnChart/__tests__/__snapshots__/index.spec.tsx.snap +999 -6
  12. package/src/components/Chart/ColumnChart/__tests__/index.spec.tsx +107 -0
  13. package/src/components/Chart/ColumnChart/index.tsx +15 -0
  14. package/src/components/Chart/Line/Line.tsx +5 -2
  15. package/src/components/Chart/Line/__tests__/Line.spec.tsx +13 -6
  16. package/src/components/Chart/Line/__tests__/__snapshots__/Line.spec.tsx.snap +1 -1
  17. package/src/components/Chart/Line/__tests__/__snapshots__/index.spec.tsx.snap +1464 -4
  18. package/src/components/Chart/Line/__tests__/index.spec.tsx +95 -1
  19. package/src/components/Chart/Line/index.tsx +14 -2
  20. package/src/components/Chart/shared/__tests__/utils.spec.ts +16 -0
  21. package/src/components/Chart/shared/constants.ts +4 -0
  22. package/src/components/Chart/shared/hooks/useCustomColor.ts +84 -0
  23. package/src/components/Chart/shared/utils.ts +14 -0
  24. package/src/components/Chart/types.ts +32 -0
  25. package/stats/8.100.2/rn-stats.html +1 -3
  26. package/stats/8.101.0/rn-stats.html +4844 -0
  27. package/types/components/Chart/ColumnChart/ColumnChartContent.d.ts +5 -1
  28. package/types/components/Chart/ColumnChart/StackedSegment.d.ts +4 -0
  29. package/types/components/Chart/ColumnChart/index.d.ts +8 -2
  30. package/types/components/Chart/Line/Line.d.ts +3 -1
  31. package/types/components/Chart/Line/index.d.ts +8 -2
  32. package/types/components/Chart/index.d.ts +2 -2
  33. package/types/components/Chart/shared/constants.d.ts +2 -0
  34. package/types/components/Chart/shared/hooks/useCustomColor.d.ts +22 -0
  35. package/types/components/Chart/shared/utils.d.ts +11 -0
  36. package/types/components/Chart/types.d.ts +14 -1
@@ -1,5 +1,998 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
+ exports[`ColumnChart renders chart with custom colors 1`] = `
4
+ <View
5
+ style={
6
+ {
7
+ "flex": 1,
8
+ }
9
+ }
10
+ >
11
+ <View
12
+ onLayout={[Function]}
13
+ style={
14
+ [
15
+ {
16
+ "height": "100%",
17
+ "width": "100%",
18
+ },
19
+ undefined,
20
+ ]
21
+ }
22
+ testID="column-chart"
23
+ >
24
+ <View
25
+ style={
26
+ [
27
+ {},
28
+ {
29
+ "height": 200,
30
+ "width": 100,
31
+ },
32
+ ]
33
+ }
34
+ >
35
+ <View
36
+ style={
37
+ [
38
+ {},
39
+ {
40
+ "paddingTop": 8,
41
+ },
42
+ ]
43
+ }
44
+ >
45
+ <RNSVGSvgView
46
+ bbHeight={200}
47
+ bbWidth={100}
48
+ focusable={false}
49
+ style={
50
+ [
51
+ {
52
+ "backgroundColor": "transparent",
53
+ "borderWidth": 0,
54
+ },
55
+ {
56
+ "height": 200,
57
+ "overflow": "visible",
58
+ "width": 100,
59
+ },
60
+ {
61
+ "flex": 0,
62
+ "height": 200,
63
+ "width": 100,
64
+ },
65
+ ]
66
+ }
67
+ >
68
+ <RNSVGGroup
69
+ fill={
70
+ {
71
+ "payload": 4278190080,
72
+ "type": 0,
73
+ }
74
+ }
75
+ >
76
+ <RNSVGGroup
77
+ fill={
78
+ {
79
+ "payload": 4278190080,
80
+ "type": 0,
81
+ }
82
+ }
83
+ >
84
+ <RNSVGGroup
85
+ fill={
86
+ {
87
+ "payload": 4278190080,
88
+ "type": 0,
89
+ }
90
+ }
91
+ >
92
+ <View
93
+ alignItems="center"
94
+ style={
95
+ [
96
+ {
97
+ "alignItems": "center",
98
+ },
99
+ {
100
+ "left": 51.25,
101
+ "maxHeight": 32,
102
+ "position": "absolute",
103
+ "top": 168,
104
+ "width": 13,
105
+ },
106
+ ]
107
+ }
108
+ testID="x-axis-label-A-container"
109
+ >
110
+ <Text
111
+ adjustsFontSizeToFit={true}
112
+ allowFontScaling={false}
113
+ ellipsizeMode="tail"
114
+ minimumFontScale={0.6}
115
+ numberOfLines={2}
116
+ style={
117
+ [
118
+ {
119
+ "color": "#4d6265",
120
+ "fontSize": 10,
121
+ "letterSpacing": 0,
122
+ "lineHeight": 14,
123
+ },
124
+ {
125
+ "textAlign": "center",
126
+ },
127
+ ]
128
+ }
129
+ themeIntent="subdued"
130
+ >
131
+ A
132
+ </Text>
133
+ </View>
134
+ </RNSVGGroup>
135
+ <RNSVGGroup
136
+ fill={
137
+ {
138
+ "payload": 4278190080,
139
+ "type": 0,
140
+ }
141
+ }
142
+ >
143
+ <View
144
+ alignItems="center"
145
+ style={
146
+ [
147
+ {
148
+ "alignItems": "center",
149
+ },
150
+ {
151
+ "left": 67.5,
152
+ "maxHeight": 32,
153
+ "position": "absolute",
154
+ "top": 168,
155
+ "width": 13,
156
+ },
157
+ ]
158
+ }
159
+ testID="x-axis-label-B-container"
160
+ >
161
+ <Text
162
+ adjustsFontSizeToFit={true}
163
+ allowFontScaling={false}
164
+ ellipsizeMode="tail"
165
+ minimumFontScale={0.6}
166
+ numberOfLines={2}
167
+ style={
168
+ [
169
+ {
170
+ "color": "#4d6265",
171
+ "fontSize": 10,
172
+ "letterSpacing": 0,
173
+ "lineHeight": 14,
174
+ },
175
+ {
176
+ "textAlign": "center",
177
+ },
178
+ ]
179
+ }
180
+ themeIntent="subdued"
181
+ >
182
+ B
183
+ </Text>
184
+ </View>
185
+ </RNSVGGroup>
186
+ <RNSVGGroup
187
+ fill={
188
+ {
189
+ "payload": 4278190080,
190
+ "type": 0,
191
+ }
192
+ }
193
+ >
194
+ <View
195
+ alignItems="center"
196
+ style={
197
+ [
198
+ {
199
+ "alignItems": "center",
200
+ },
201
+ {
202
+ "left": 83.75,
203
+ "maxHeight": 32,
204
+ "position": "absolute",
205
+ "top": 168,
206
+ "width": 13,
207
+ },
208
+ ]
209
+ }
210
+ testID="x-axis-label-C-container"
211
+ >
212
+ <Text
213
+ adjustsFontSizeToFit={true}
214
+ allowFontScaling={false}
215
+ ellipsizeMode="tail"
216
+ minimumFontScale={0.6}
217
+ numberOfLines={2}
218
+ style={
219
+ [
220
+ {
221
+ "color": "#4d6265",
222
+ "fontSize": 10,
223
+ "letterSpacing": 0,
224
+ "lineHeight": 14,
225
+ },
226
+ {
227
+ "textAlign": "center",
228
+ },
229
+ ]
230
+ }
231
+ themeIntent="subdued"
232
+ >
233
+ C
234
+ </Text>
235
+ </View>
236
+ </RNSVGGroup>
237
+ </RNSVGGroup>
238
+ <RNSVGGroup
239
+ fill={
240
+ {
241
+ "payload": 4278190080,
242
+ "type": 0,
243
+ }
244
+ }
245
+ >
246
+ <RNSVGGroup
247
+ fill={
248
+ {
249
+ "payload": 4278190080,
250
+ "type": 0,
251
+ }
252
+ }
253
+ >
254
+ <View
255
+ style={
256
+ [
257
+ {},
258
+ {
259
+ "maxWidth": 32,
260
+ "position": "absolute",
261
+ "right": 68,
262
+ "top": 156,
263
+ "transform": [
264
+ {
265
+ "translateY": -7,
266
+ },
267
+ ],
268
+ },
269
+ ]
270
+ }
271
+ testID="y-axis-label-0-container"
272
+ >
273
+ <Text
274
+ adjustsFontSizeToFit={true}
275
+ allowFontScaling={false}
276
+ ellipsizeMode="tail"
277
+ minimumFontScale={0.6}
278
+ numberOfLines={1}
279
+ style={
280
+ [
281
+ {
282
+ "color": "#4d6265",
283
+ "fontSize": 10,
284
+ "letterSpacing": 0,
285
+ "lineHeight": 14,
286
+ },
287
+ {
288
+ "textAlign": "right",
289
+ },
290
+ ]
291
+ }
292
+ themeIntent="subdued"
293
+ >
294
+ 0
295
+ </Text>
296
+ </View>
297
+ </RNSVGGroup>
298
+ <RNSVGGroup
299
+ fill={
300
+ {
301
+ "payload": 4278190080,
302
+ "type": 0,
303
+ }
304
+ }
305
+ >
306
+ <View
307
+ style={
308
+ [
309
+ {},
310
+ {
311
+ "maxWidth": 32,
312
+ "position": "absolute",
313
+ "right": 68,
314
+ "top": 130,
315
+ "transform": [
316
+ {
317
+ "translateY": -7,
318
+ },
319
+ ],
320
+ },
321
+ ]
322
+ }
323
+ testID="y-axis-label-10-container"
324
+ >
325
+ <Text
326
+ adjustsFontSizeToFit={true}
327
+ allowFontScaling={false}
328
+ ellipsizeMode="tail"
329
+ minimumFontScale={0.6}
330
+ numberOfLines={1}
331
+ style={
332
+ [
333
+ {
334
+ "color": "#4d6265",
335
+ "fontSize": 10,
336
+ "letterSpacing": 0,
337
+ "lineHeight": 14,
338
+ },
339
+ {
340
+ "textAlign": "right",
341
+ },
342
+ ]
343
+ }
344
+ themeIntent="subdued"
345
+ >
346
+ 10
347
+ </Text>
348
+ </View>
349
+ </RNSVGGroup>
350
+ <RNSVGGroup
351
+ fill={
352
+ {
353
+ "payload": 4278190080,
354
+ "type": 0,
355
+ }
356
+ }
357
+ >
358
+ <View
359
+ style={
360
+ [
361
+ {},
362
+ {
363
+ "maxWidth": 32,
364
+ "position": "absolute",
365
+ "right": 68,
366
+ "top": 104.00000000000001,
367
+ "transform": [
368
+ {
369
+ "translateY": -7,
370
+ },
371
+ ],
372
+ },
373
+ ]
374
+ }
375
+ testID="y-axis-label-20-container"
376
+ >
377
+ <Text
378
+ adjustsFontSizeToFit={true}
379
+ allowFontScaling={false}
380
+ ellipsizeMode="tail"
381
+ minimumFontScale={0.6}
382
+ numberOfLines={1}
383
+ style={
384
+ [
385
+ {
386
+ "color": "#4d6265",
387
+ "fontSize": 10,
388
+ "letterSpacing": 0,
389
+ "lineHeight": 14,
390
+ },
391
+ {
392
+ "textAlign": "right",
393
+ },
394
+ ]
395
+ }
396
+ themeIntent="subdued"
397
+ >
398
+ 20
399
+ </Text>
400
+ </View>
401
+ </RNSVGGroup>
402
+ <RNSVGGroup
403
+ fill={
404
+ {
405
+ "payload": 4278190080,
406
+ "type": 0,
407
+ }
408
+ }
409
+ >
410
+ <View
411
+ style={
412
+ [
413
+ {},
414
+ {
415
+ "maxWidth": 32,
416
+ "position": "absolute",
417
+ "right": 68,
418
+ "top": 78,
419
+ "transform": [
420
+ {
421
+ "translateY": -7,
422
+ },
423
+ ],
424
+ },
425
+ ]
426
+ }
427
+ testID="y-axis-label-30-container"
428
+ >
429
+ <Text
430
+ adjustsFontSizeToFit={true}
431
+ allowFontScaling={false}
432
+ ellipsizeMode="tail"
433
+ minimumFontScale={0.6}
434
+ numberOfLines={1}
435
+ style={
436
+ [
437
+ {
438
+ "color": "#4d6265",
439
+ "fontSize": 10,
440
+ "letterSpacing": 0,
441
+ "lineHeight": 14,
442
+ },
443
+ {
444
+ "textAlign": "right",
445
+ },
446
+ ]
447
+ }
448
+ themeIntent="subdued"
449
+ >
450
+ 30
451
+ </Text>
452
+ </View>
453
+ </RNSVGGroup>
454
+ <RNSVGGroup
455
+ fill={
456
+ {
457
+ "payload": 4278190080,
458
+ "type": 0,
459
+ }
460
+ }
461
+ >
462
+ <View
463
+ style={
464
+ [
465
+ {},
466
+ {
467
+ "maxWidth": 32,
468
+ "position": "absolute",
469
+ "right": 68,
470
+ "top": 52.00000000000001,
471
+ "transform": [
472
+ {
473
+ "translateY": -7,
474
+ },
475
+ ],
476
+ },
477
+ ]
478
+ }
479
+ testID="y-axis-label-40-container"
480
+ >
481
+ <Text
482
+ adjustsFontSizeToFit={true}
483
+ allowFontScaling={false}
484
+ ellipsizeMode="tail"
485
+ minimumFontScale={0.6}
486
+ numberOfLines={1}
487
+ style={
488
+ [
489
+ {
490
+ "color": "#4d6265",
491
+ "fontSize": 10,
492
+ "letterSpacing": 0,
493
+ "lineHeight": 14,
494
+ },
495
+ {
496
+ "textAlign": "right",
497
+ },
498
+ ]
499
+ }
500
+ themeIntent="subdued"
501
+ >
502
+ 40
503
+ </Text>
504
+ </View>
505
+ </RNSVGGroup>
506
+ <RNSVGGroup
507
+ fill={
508
+ {
509
+ "payload": 4278190080,
510
+ "type": 0,
511
+ }
512
+ }
513
+ >
514
+ <View
515
+ style={
516
+ [
517
+ {},
518
+ {
519
+ "maxWidth": 32,
520
+ "position": "absolute",
521
+ "right": 68,
522
+ "top": 25.999999999999993,
523
+ "transform": [
524
+ {
525
+ "translateY": -7,
526
+ },
527
+ ],
528
+ },
529
+ ]
530
+ }
531
+ testID="y-axis-label-50-container"
532
+ >
533
+ <Text
534
+ adjustsFontSizeToFit={true}
535
+ allowFontScaling={false}
536
+ ellipsizeMode="tail"
537
+ minimumFontScale={0.6}
538
+ numberOfLines={1}
539
+ style={
540
+ [
541
+ {
542
+ "color": "#4d6265",
543
+ "fontSize": 10,
544
+ "letterSpacing": 0,
545
+ "lineHeight": 14,
546
+ },
547
+ {
548
+ "textAlign": "right",
549
+ },
550
+ ]
551
+ }
552
+ themeIntent="subdued"
553
+ >
554
+ 50
555
+ </Text>
556
+ </View>
557
+ </RNSVGGroup>
558
+ <RNSVGGroup
559
+ fill={
560
+ {
561
+ "payload": 4278190080,
562
+ "type": 0,
563
+ }
564
+ }
565
+ >
566
+ <View
567
+ style={
568
+ [
569
+ {},
570
+ {
571
+ "maxWidth": 32,
572
+ "position": "absolute",
573
+ "right": 68,
574
+ "top": 0,
575
+ "transform": [
576
+ {
577
+ "translateY": -7,
578
+ },
579
+ ],
580
+ },
581
+ ]
582
+ }
583
+ testID="y-axis-label-60-container"
584
+ >
585
+ <Text
586
+ adjustsFontSizeToFit={true}
587
+ allowFontScaling={false}
588
+ ellipsizeMode="tail"
589
+ minimumFontScale={0.6}
590
+ numberOfLines={1}
591
+ style={
592
+ [
593
+ {
594
+ "color": "#4d6265",
595
+ "fontSize": 10,
596
+ "letterSpacing": 0,
597
+ "lineHeight": 14,
598
+ },
599
+ {
600
+ "textAlign": "right",
601
+ },
602
+ ]
603
+ }
604
+ themeIntent="subdued"
605
+ >
606
+ 60
607
+ </Text>
608
+ </View>
609
+ </RNSVGGroup>
610
+ </RNSVGGroup>
611
+ <RNSVGGroup
612
+ fill={
613
+ {
614
+ "payload": 4278190080,
615
+ "type": 0,
616
+ }
617
+ }
618
+ testID="y-axis-grid"
619
+ >
620
+ <RNSVGLine
621
+ fill={
622
+ {
623
+ "payload": 4278190080,
624
+ "type": 0,
625
+ }
626
+ }
627
+ propList={
628
+ [
629
+ "stroke",
630
+ "strokeDasharray",
631
+ ]
632
+ }
633
+ stroke={
634
+ {
635
+ "payload": 4293454314,
636
+ "type": 0,
637
+ }
638
+ }
639
+ strokeDasharray={
640
+ [
641
+ 4,
642
+ 4,
643
+ ]
644
+ }
645
+ testID="y-axis-grid-0"
646
+ x1={48}
647
+ x2={100}
648
+ y1={156}
649
+ y2={156}
650
+ />
651
+ <RNSVGLine
652
+ fill={
653
+ {
654
+ "payload": 4278190080,
655
+ "type": 0,
656
+ }
657
+ }
658
+ propList={
659
+ [
660
+ "stroke",
661
+ "strokeDasharray",
662
+ ]
663
+ }
664
+ stroke={
665
+ {
666
+ "payload": 4293454314,
667
+ "type": 0,
668
+ }
669
+ }
670
+ strokeDasharray={
671
+ [
672
+ 4,
673
+ 4,
674
+ ]
675
+ }
676
+ testID="y-axis-grid-10"
677
+ x1={48}
678
+ x2={100}
679
+ y1={130}
680
+ y2={130}
681
+ />
682
+ <RNSVGLine
683
+ fill={
684
+ {
685
+ "payload": 4278190080,
686
+ "type": 0,
687
+ }
688
+ }
689
+ propList={
690
+ [
691
+ "stroke",
692
+ "strokeDasharray",
693
+ ]
694
+ }
695
+ stroke={
696
+ {
697
+ "payload": 4293454314,
698
+ "type": 0,
699
+ }
700
+ }
701
+ strokeDasharray={
702
+ [
703
+ 4,
704
+ 4,
705
+ ]
706
+ }
707
+ testID="y-axis-grid-20"
708
+ x1={48}
709
+ x2={100}
710
+ y1={104.00000000000001}
711
+ y2={104.00000000000001}
712
+ />
713
+ <RNSVGLine
714
+ fill={
715
+ {
716
+ "payload": 4278190080,
717
+ "type": 0,
718
+ }
719
+ }
720
+ propList={
721
+ [
722
+ "stroke",
723
+ "strokeDasharray",
724
+ ]
725
+ }
726
+ stroke={
727
+ {
728
+ "payload": 4293454314,
729
+ "type": 0,
730
+ }
731
+ }
732
+ strokeDasharray={
733
+ [
734
+ 4,
735
+ 4,
736
+ ]
737
+ }
738
+ testID="y-axis-grid-30"
739
+ x1={48}
740
+ x2={100}
741
+ y1={78}
742
+ y2={78}
743
+ />
744
+ <RNSVGLine
745
+ fill={
746
+ {
747
+ "payload": 4278190080,
748
+ "type": 0,
749
+ }
750
+ }
751
+ propList={
752
+ [
753
+ "stroke",
754
+ "strokeDasharray",
755
+ ]
756
+ }
757
+ stroke={
758
+ {
759
+ "payload": 4293454314,
760
+ "type": 0,
761
+ }
762
+ }
763
+ strokeDasharray={
764
+ [
765
+ 4,
766
+ 4,
767
+ ]
768
+ }
769
+ testID="y-axis-grid-40"
770
+ x1={48}
771
+ x2={100}
772
+ y1={52.00000000000001}
773
+ y2={52.00000000000001}
774
+ />
775
+ <RNSVGLine
776
+ fill={
777
+ {
778
+ "payload": 4278190080,
779
+ "type": 0,
780
+ }
781
+ }
782
+ propList={
783
+ [
784
+ "stroke",
785
+ "strokeDasharray",
786
+ ]
787
+ }
788
+ stroke={
789
+ {
790
+ "payload": 4293454314,
791
+ "type": 0,
792
+ }
793
+ }
794
+ strokeDasharray={
795
+ [
796
+ 4,
797
+ 4,
798
+ ]
799
+ }
800
+ testID="y-axis-grid-50"
801
+ x1={48}
802
+ x2={100}
803
+ y1={25.999999999999993}
804
+ y2={25.999999999999993}
805
+ />
806
+ <RNSVGLine
807
+ fill={
808
+ {
809
+ "payload": 4278190080,
810
+ "type": 0,
811
+ }
812
+ }
813
+ propList={
814
+ [
815
+ "stroke",
816
+ "strokeDasharray",
817
+ ]
818
+ }
819
+ stroke={
820
+ {
821
+ "payload": 4293454314,
822
+ "type": 0,
823
+ }
824
+ }
825
+ strokeDasharray={
826
+ [
827
+ 4,
828
+ 4,
829
+ ]
830
+ }
831
+ testID="y-axis-grid-60"
832
+ x1={48}
833
+ x2={100}
834
+ y1={0}
835
+ y2={0}
836
+ />
837
+ </RNSVGGroup>
838
+ <RNSVGGroup
839
+ fill={
840
+ {
841
+ "payload": 4278190080,
842
+ "type": 0,
843
+ }
844
+ }
845
+ testID="column-chart-content"
846
+ >
847
+ <RNSVGRect
848
+ accessibilityLabel="Column segment: value 10, x-label A, series Series 1, color #5fda84"
849
+ fill={
850
+ {
851
+ "payload": 4284471940,
852
+ "type": 0,
853
+ }
854
+ }
855
+ height={24}
856
+ propList={
857
+ [
858
+ "fill",
859
+ ]
860
+ }
861
+ rx={8}
862
+ testID="column-segment-A-Series 1"
863
+ width={16}
864
+ x={49.75}
865
+ y={131}
866
+ />
867
+ <RNSVGRect
868
+ accessibilityLabel="Column segment: value 5, x-label A, series Series 2, color #1dbeee"
869
+ fill={
870
+ {
871
+ "payload": 4280139502,
872
+ "type": 0,
873
+ }
874
+ }
875
+ height={11}
876
+ propList={
877
+ [
878
+ "fill",
879
+ ]
880
+ }
881
+ rx={8}
882
+ testID="column-segment-A-Series 2"
883
+ width={16}
884
+ x={49.75}
885
+ y={118}
886
+ />
887
+ <RNSVGRect
888
+ accessibilityLabel="Column segment: value 20, x-label B, series Series 1, color #5fda84"
889
+ fill={
890
+ {
891
+ "payload": 4284471940,
892
+ "type": 0,
893
+ }
894
+ }
895
+ height={49.999999999999986}
896
+ propList={
897
+ [
898
+ "fill",
899
+ ]
900
+ }
901
+ rx={8}
902
+ testID="column-segment-B-Series 1"
903
+ width={16}
904
+ x={66}
905
+ y={105.00000000000001}
906
+ />
907
+ <RNSVGRect
908
+ accessibilityLabel="Column segment: value 15, x-label B, series Series 2, color #1dbeee"
909
+ fill={
910
+ {
911
+ "payload": 4280139502,
912
+ "type": 0,
913
+ }
914
+ }
915
+ height={37.000000000000014}
916
+ propList={
917
+ [
918
+ "fill",
919
+ ]
920
+ }
921
+ rx={8}
922
+ testID="column-segment-B-Series 2"
923
+ width={16}
924
+ x={66}
925
+ y={66}
926
+ />
927
+ <RNSVGRect
928
+ accessibilityLabel="Column segment: value 30, x-label C, series Series 1, color #5fda84"
929
+ fill={
930
+ {
931
+ "payload": 4284471940,
932
+ "type": 0,
933
+ }
934
+ }
935
+ height={76}
936
+ propList={
937
+ [
938
+ "fill",
939
+ ]
940
+ }
941
+ rx={8}
942
+ testID="column-segment-C-Series 1"
943
+ width={16}
944
+ x={82.25}
945
+ y={79}
946
+ />
947
+ <RNSVGRect
948
+ accessibilityLabel="Column segment: value 25, x-label C, series Series 2, color #1dbeee"
949
+ fill={
950
+ {
951
+ "payload": 4280139502,
952
+ "type": 0,
953
+ }
954
+ }
955
+ height={63}
956
+ propList={
957
+ [
958
+ "fill",
959
+ ]
960
+ }
961
+ rx={8}
962
+ testID="column-segment-C-Series 2"
963
+ width={16}
964
+ x={82.25}
965
+ y={14.000000000000005}
966
+ />
967
+ </RNSVGGroup>
968
+ </RNSVGGroup>
969
+ </RNSVGSvgView>
970
+ </View>
971
+ </View>
972
+ </View>
973
+ <View
974
+ pointerEvents="box-none"
975
+ position="bottom"
976
+ style={
977
+ [
978
+ {
979
+ "bottom": 0,
980
+ "elevation": 9999,
981
+ "flexDirection": "column-reverse",
982
+ "left": 0,
983
+ "paddingHorizontal": 24,
984
+ "paddingVertical": 16,
985
+ "position": "absolute",
986
+ "right": 0,
987
+ "top": 0,
988
+ },
989
+ undefined,
990
+ ]
991
+ }
992
+ />
993
+ </View>
994
+ `;
995
+
3
996
  exports[`ColumnChart renders emptyText when data is empty 1`] = `
4
997
  <View
5
998
  style={
@@ -1256,7 +2249,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1256
2249
  testID="column-chart-content"
1257
2250
  >
1258
2251
  <RNSVGRect
1259
- accessibilityLabel="Column segment: value 10, x-label A, series Series 1"
2252
+ accessibilityLabel="Column segment: value 10, x-label A, series Series 1, color #c38cee"
1260
2253
  fill={
1261
2254
  {
1262
2255
  "payload": 4291005678,
@@ -1276,7 +2269,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1276
2269
  y={131}
1277
2270
  />
1278
2271
  <RNSVGRect
1279
- accessibilityLabel="Column segment: value 5, x-label A, series Series 2"
2272
+ accessibilityLabel="Column segment: value 5, x-label A, series Series 2, color #1dbeee"
1280
2273
  fill={
1281
2274
  {
1282
2275
  "payload": 4280139502,
@@ -1296,7 +2289,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1296
2289
  y={118}
1297
2290
  />
1298
2291
  <RNSVGRect
1299
- accessibilityLabel="Column segment: value 20, x-label B, series Series 1"
2292
+ accessibilityLabel="Column segment: value 20, x-label B, series Series 1, color #c38cee"
1300
2293
  fill={
1301
2294
  {
1302
2295
  "payload": 4291005678,
@@ -1316,7 +2309,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1316
2309
  y={105.00000000000001}
1317
2310
  />
1318
2311
  <RNSVGRect
1319
- accessibilityLabel="Column segment: value 15, x-label B, series Series 2"
2312
+ accessibilityLabel="Column segment: value 15, x-label B, series Series 2, color #1dbeee"
1320
2313
  fill={
1321
2314
  {
1322
2315
  "payload": 4280139502,
@@ -1336,7 +2329,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1336
2329
  y={66}
1337
2330
  />
1338
2331
  <RNSVGRect
1339
- accessibilityLabel="Column segment: value 30, x-label C, series Series 1"
2332
+ accessibilityLabel="Column segment: value 30, x-label C, series Series 1, color #c38cee"
1340
2333
  fill={
1341
2334
  {
1342
2335
  "payload": 4291005678,
@@ -1356,7 +2349,7 @@ exports[`ColumnChart renders without crashing 1`] = `
1356
2349
  y={79}
1357
2350
  />
1358
2351
  <RNSVGRect
1359
- accessibilityLabel="Column segment: value 25, x-label C, series Series 2"
2352
+ accessibilityLabel="Column segment: value 25, x-label C, series Series 2, color #1dbeee"
1360
2353
  fill={
1361
2354
  {
1362
2355
  "payload": 4280139502,