@zohodesk/components 1.0.0-temp-199.18 → 1.0.0-temp-246

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 (107) hide show
  1. package/README.md +15 -1
  2. package/assets/Appearance/dark/mode/Component_DarkMode.module.css +2 -0
  3. package/assets/Appearance/light/mode/Component_LightMode.module.css +2 -0
  4. package/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css +2 -0
  5. package/es/CheckBox/CheckBox.js +21 -10
  6. package/es/CheckBox/CheckBox.module.css +21 -6
  7. package/es/CheckBox/__tests__/CheckBox.spec.js +9 -0
  8. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +162 -93
  9. package/es/CheckBox/props/propTypes.js +4 -1
  10. package/es/ColorSelect/ColorSingleSelect.js +0 -1
  11. package/es/ColorSelect/__tests__/ColorMultiSelect.spec.js +15 -3
  12. package/es/ColorSelect/__tests__/ColorSingleSelect.spec.js +15 -3
  13. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +2 -2
  14. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +8 -8
  15. package/es/ColorSelect/_shared/ColorIndicator/ColorIndicator.js +7 -3
  16. package/es/ColorSelect/_shared/ColorIndicator/__tests__/ColorIndicator.spec.js +17 -4
  17. package/es/ColorSelect/_shared/ColorIndicator/__tests__/__snapshots__/ColorIndicator.spec.js.snap +3 -3
  18. package/es/ColorSelect/_shared/ColorIndicator/props/propTypes.js +1 -1
  19. package/es/ColorSelect/_shared/ColoredTag/props/propTypes.js +1 -0
  20. package/es/ColorSelect/_shared/helpers/renderHelpers.js +14 -10
  21. package/es/ColorSelect/props/propTypes.js +1 -0
  22. package/es/Label/Label.js +19 -1
  23. package/es/Label/__tests__/Label.spec.js +58 -0
  24. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +66 -0
  25. package/es/Label/props/defaultProps.js +1 -0
  26. package/es/Label/props/propTypes.js +7 -1
  27. package/es/MultiSelect/AdvancedGroupMultiSelect.js +2 -6
  28. package/es/MultiSelect/MultiSelect.js +2 -2
  29. package/es/MultiSelect/Suggestions.js +2 -7
  30. package/es/MultiSelect/props/defaultProps.js +0 -2
  31. package/es/MultiSelect/props/propTypes.js +3 -11
  32. package/es/Radio/Radio.js +20 -9
  33. package/es/Radio/Radio.module.css +38 -5
  34. package/es/Radio/__tests__/Radio.spec.js +10 -0
  35. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +238 -81
  36. package/es/Radio/props/propTypes.js +4 -1
  37. package/es/Select/GroupSelect.js +1 -1
  38. package/es/Select/SelectWithAvatar.js +3 -3
  39. package/es/Select/SelectWithIcon.js +3 -10
  40. package/es/Select/props/defaultProps.js +2 -4
  41. package/es/Select/props/propTypes.js +3 -11
  42. package/es/Typography/Typography.js +9 -2
  43. package/es/Typography/__tests__/Typography.spec.js +427 -0
  44. package/es/Typography/__tests__/__snapshots__/Typography.spec.js.snap +506 -0
  45. package/es/Typography/props/defaultProps.js +2 -1
  46. package/es/Typography/props/propTypes.js +24 -5
  47. package/es/Typography/utils/textHighlighter.js +139 -0
  48. package/es/common/common.module.css +1 -1
  49. package/es/shared/ArrowIcon/ArrowIcon.js +6 -3
  50. package/es/shared/ArrowIcon/ArrowIcon.module.css +9 -0
  51. package/es/shared/ArrowIcon/__tests__/ArrowIcon.spec.js +24 -0
  52. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +70 -7
  53. package/es/shared/ArrowIcon/props/defaultProps.js +2 -0
  54. package/es/shared/ArrowIcon/props/propTypes.js +3 -1
  55. package/es/utils/dropDownUtils.js +3 -3
  56. package/lib/CheckBox/CheckBox.js +23 -9
  57. package/lib/CheckBox/CheckBox.module.css +21 -6
  58. package/lib/CheckBox/__tests__/CheckBox.spec.js +21 -12
  59. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +162 -93
  60. package/lib/CheckBox/props/propTypes.js +5 -1
  61. package/lib/ColorSelect/ColorSingleSelect.js +1 -2
  62. package/lib/ColorSelect/__tests__/ColorMultiSelect.spec.js +15 -3
  63. package/lib/ColorSelect/__tests__/ColorSingleSelect.spec.js +15 -3
  64. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +2 -2
  65. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +8 -8
  66. package/lib/ColorSelect/_shared/ColorIndicator/ColorIndicator.js +10 -4
  67. package/lib/ColorSelect/_shared/ColorIndicator/__tests__/ColorIndicator.spec.js +17 -4
  68. package/lib/ColorSelect/_shared/ColorIndicator/__tests__/__snapshots__/ColorIndicator.spec.js.snap +3 -3
  69. package/lib/ColorSelect/_shared/ColorIndicator/props/propTypes.js +1 -1
  70. package/lib/ColorSelect/_shared/ColoredTag/props/propTypes.js +1 -0
  71. package/lib/ColorSelect/_shared/helpers/renderHelpers.js +19 -13
  72. package/lib/ColorSelect/props/propTypes.js +1 -0
  73. package/lib/Label/Label.js +21 -1
  74. package/lib/Label/__tests__/Label.spec.js +58 -0
  75. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +66 -0
  76. package/lib/Label/props/defaultProps.js +1 -0
  77. package/lib/Label/props/propTypes.js +8 -1
  78. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +3 -8
  79. package/lib/MultiSelect/MultiSelect.js +2 -2
  80. package/lib/MultiSelect/Suggestions.js +2 -6
  81. package/lib/MultiSelect/props/defaultProps.js +0 -2
  82. package/lib/MultiSelect/props/propTypes.js +5 -13
  83. package/lib/Radio/Radio.js +22 -8
  84. package/lib/Radio/Radio.module.css +38 -5
  85. package/lib/Radio/__tests__/Radio.spec.js +10 -0
  86. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +238 -81
  87. package/lib/Radio/props/propTypes.js +5 -1
  88. package/lib/Select/GroupSelect.js +1 -2
  89. package/lib/Select/SelectWithAvatar.js +3 -4
  90. package/lib/Select/SelectWithIcon.js +3 -10
  91. package/lib/Select/props/defaultProps.js +3 -5
  92. package/lib/Select/props/propTypes.js +3 -11
  93. package/lib/Typography/Typography.js +9 -2
  94. package/lib/Typography/__tests__/Typography.spec.js +436 -0
  95. package/lib/Typography/__tests__/__snapshots__/Typography.spec.js.snap +506 -0
  96. package/lib/Typography/props/defaultProps.js +2 -1
  97. package/lib/Typography/props/propTypes.js +31 -6
  98. package/lib/Typography/utils/textHighlighter.js +160 -0
  99. package/lib/common/common.module.css +1 -1
  100. package/lib/shared/ArrowIcon/ArrowIcon.js +6 -3
  101. package/lib/shared/ArrowIcon/ArrowIcon.module.css +9 -0
  102. package/lib/shared/ArrowIcon/__tests__/ArrowIcon.spec.js +34 -10
  103. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +70 -7
  104. package/lib/shared/ArrowIcon/props/defaultProps.js +2 -0
  105. package/lib/shared/ArrowIcon/props/propTypes.js +3 -1
  106. package/lib/utils/dropDownUtils.js +3 -3
  107. package/package.json +2 -2
@@ -14,7 +14,7 @@ exports[`Radio rendering ally ariaChecked true 1`] = `
14
14
  >
15
15
  <div
16
16
  class="radio rdBoxprimary
17
- hoverprimary medium filled centerPathprimary shrinkOff"
17
+ hoverprimary medium filled centerPathprimary shrinkOff"
18
18
  data-id="boxComponent"
19
19
  data-selector-id="box"
20
20
  data-test-id="boxComponent"
@@ -45,6 +45,12 @@ exports[`Radio rendering ally ariaChecked true 1`] = `
45
45
  </svg>
46
46
  </label>
47
47
  </div>
48
+ <div
49
+ class="labelContainer grow basis shrinkOff"
50
+ data-id="boxComponent"
51
+ data-selector-id="box"
52
+ data-test-id="boxComponent"
53
+ />
48
54
  </div>
49
55
  </DocumentFragment>
50
56
  `;
@@ -64,7 +70,7 @@ exports[`Radio rendering ally ariaHidden , ariaChecked, ariaReadonly fasle true
64
70
  >
65
71
  <div
66
72
  class="radio rdBoxprimary
67
- medium filled centerPathprimary disabled shrinkOff"
73
+ medium filled centerPathprimary disabled shrinkOff"
68
74
  data-id="boxComponent"
69
75
  data-selector-id="box"
70
76
  data-test-id="boxComponent"
@@ -95,6 +101,12 @@ exports[`Radio rendering ally ariaHidden , ariaChecked, ariaReadonly fasle true
95
101
  </svg>
96
102
  </label>
97
103
  </div>
104
+ <div
105
+ class="labelContainer grow basis shrinkOff"
106
+ data-id="boxComponent"
107
+ data-selector-id="box"
108
+ data-test-id="boxComponent"
109
+ />
98
110
  </div>
99
111
  </DocumentFragment>
100
112
  `;
@@ -114,7 +126,7 @@ exports[`Radio rendering ally ariaHidden , ariaChecked, ariaReadonly is false 1`
114
126
  >
115
127
  <div
116
128
  class="radio
117
- hoverprimary medium filled centerPathprimary shrinkOff"
129
+ hoverprimary medium filled centerPathprimary shrinkOff"
118
130
  data-id="boxComponent"
119
131
  data-selector-id="box"
120
132
  data-test-id="boxComponent"
@@ -139,6 +151,12 @@ exports[`Radio rendering ally ariaHidden , ariaChecked, ariaReadonly is false 1`
139
151
  </svg>
140
152
  </label>
141
153
  </div>
154
+ <div
155
+ class="labelContainer grow basis shrinkOff"
156
+ data-id="boxComponent"
157
+ data-selector-id="box"
158
+ data-test-id="boxComponent"
159
+ />
142
160
  </div>
143
161
  </DocumentFragment>
144
162
  `;
@@ -157,7 +175,7 @@ exports[`Radio rendering labelPalette - danger 1`] = `
157
175
  >
158
176
  <div
159
177
  class="radio
160
- hoverprimary medium filled centerPathprimary shrinkOff"
178
+ hoverprimary medium filled centerPathprimary shrinkOff"
161
179
  data-id="boxComponent"
162
180
  data-selector-id="box"
163
181
  data-test-id="boxComponent"
@@ -183,7 +201,7 @@ exports[`Radio rendering labelPalette - danger 1`] = `
183
201
  </label>
184
202
  </div>
185
203
  <div
186
- class="text grow basis shrinkOff"
204
+ class="labelContainer grow basis shrinkOff"
187
205
  data-id="boxComponent"
188
206
  data-selector-id="box"
189
207
  data-test-id="boxComponent"
@@ -191,7 +209,7 @@ exports[`Radio rendering labelPalette - danger 1`] = `
191
209
  <label
192
210
  class="label title medium danger font_default
193
211
  dotted cursor
194
- primaryLabel pointer "
212
+ primaryLabel pointer "
195
213
  data-id="RadioText_label"
196
214
  data-selector-id="label"
197
215
  data-test-id="RadioText_label"
@@ -218,7 +236,7 @@ exports[`Radio rendering labelPalette - default 1`] = `
218
236
  >
219
237
  <div
220
238
  class="radio
221
- hoverprimary medium filled centerPathprimary shrinkOff"
239
+ hoverprimary medium filled centerPathprimary shrinkOff"
222
240
  data-id="boxComponent"
223
241
  data-selector-id="box"
224
242
  data-test-id="boxComponent"
@@ -244,7 +262,7 @@ exports[`Radio rendering labelPalette - default 1`] = `
244
262
  </label>
245
263
  </div>
246
264
  <div
247
- class="text grow basis shrinkOff"
265
+ class="labelContainer grow basis shrinkOff"
248
266
  data-id="boxComponent"
249
267
  data-selector-id="box"
250
268
  data-test-id="boxComponent"
@@ -252,7 +270,7 @@ exports[`Radio rendering labelPalette - default 1`] = `
252
270
  <label
253
271
  class="label title medium default font_default
254
272
  dotted cursor
255
- primaryLabel pointer "
273
+ primaryLabel pointer "
256
274
  data-id="RadioText_label"
257
275
  data-selector-id="label"
258
276
  data-test-id="RadioText_label"
@@ -279,7 +297,7 @@ exports[`Radio rendering labelPalette - mandatory 1`] = `
279
297
  >
280
298
  <div
281
299
  class="radio
282
- hoverprimary medium filled centerPathprimary shrinkOff"
300
+ hoverprimary medium filled centerPathprimary shrinkOff"
283
301
  data-id="boxComponent"
284
302
  data-selector-id="box"
285
303
  data-test-id="boxComponent"
@@ -305,7 +323,7 @@ exports[`Radio rendering labelPalette - mandatory 1`] = `
305
323
  </label>
306
324
  </div>
307
325
  <div
308
- class="text grow basis shrinkOff"
326
+ class="labelContainer grow basis shrinkOff"
309
327
  data-id="boxComponent"
310
328
  data-selector-id="box"
311
329
  data-test-id="boxComponent"
@@ -313,7 +331,7 @@ exports[`Radio rendering labelPalette - mandatory 1`] = `
313
331
  <label
314
332
  class="label title medium mandatory font_default
315
333
  dotted cursor
316
- primaryLabel pointer "
334
+ primaryLabel pointer "
317
335
  data-id="RadioText_label"
318
336
  data-selector-id="label"
319
337
  data-test-id="RadioText_label"
@@ -340,7 +358,7 @@ exports[`Radio rendering labelPalette - primary 1`] = `
340
358
  >
341
359
  <div
342
360
  class="radio
343
- hoverprimary medium filled centerPathprimary shrinkOff"
361
+ hoverprimary medium filled centerPathprimary shrinkOff"
344
362
  data-id="boxComponent"
345
363
  data-selector-id="box"
346
364
  data-test-id="boxComponent"
@@ -366,7 +384,7 @@ exports[`Radio rendering labelPalette - primary 1`] = `
366
384
  </label>
367
385
  </div>
368
386
  <div
369
- class="text grow basis shrinkOff"
387
+ class="labelContainer grow basis shrinkOff"
370
388
  data-id="boxComponent"
371
389
  data-selector-id="box"
372
390
  data-test-id="boxComponent"
@@ -374,7 +392,7 @@ exports[`Radio rendering labelPalette - primary 1`] = `
374
392
  <label
375
393
  class="label title medium primary font_default
376
394
  dotted cursor
377
- primaryLabel pointer "
395
+ primaryLabel pointer "
378
396
  data-id="RadioText_label"
379
397
  data-selector-id="label"
380
398
  data-test-id="RadioText_label"
@@ -401,7 +419,7 @@ exports[`Radio rendering labelSize - default 1`] = `
401
419
  >
402
420
  <div
403
421
  class="radio
404
- hoverprimary medium filled centerPathprimary shrinkOff"
422
+ hoverprimary medium filled centerPathprimary shrinkOff"
405
423
  data-id="boxComponent"
406
424
  data-selector-id="box"
407
425
  data-test-id="boxComponent"
@@ -427,7 +445,7 @@ exports[`Radio rendering labelSize - default 1`] = `
427
445
  </label>
428
446
  </div>
429
447
  <div
430
- class="text grow basis shrinkOff"
448
+ class="labelContainer grow basis shrinkOff"
431
449
  data-id="boxComponent"
432
450
  data-selector-id="box"
433
451
  data-test-id="boxComponent"
@@ -435,7 +453,7 @@ exports[`Radio rendering labelSize - default 1`] = `
435
453
  <label
436
454
  class="label title medium default font_default
437
455
  dotted cursor
438
- primaryLabel pointer "
456
+ primaryLabel pointer "
439
457
  data-id="RadioText_label"
440
458
  data-selector-id="label"
441
459
  data-test-id="RadioText_label"
@@ -462,7 +480,7 @@ exports[`Radio rendering labelSize - large 1`] = `
462
480
  >
463
481
  <div
464
482
  class="radio
465
- hoverprimary medium filled centerPathprimary shrinkOff"
483
+ hoverprimary medium filled centerPathprimary shrinkOff"
466
484
  data-id="boxComponent"
467
485
  data-selector-id="box"
468
486
  data-test-id="boxComponent"
@@ -488,7 +506,7 @@ exports[`Radio rendering labelSize - large 1`] = `
488
506
  </label>
489
507
  </div>
490
508
  <div
491
- class="text grow basis shrinkOff"
509
+ class="labelContainer grow basis shrinkOff"
492
510
  data-id="boxComponent"
493
511
  data-selector-id="box"
494
512
  data-test-id="boxComponent"
@@ -496,7 +514,7 @@ exports[`Radio rendering labelSize - large 1`] = `
496
514
  <label
497
515
  class="label title large default font_default
498
516
  dotted cursor
499
- primaryLabel pointer "
517
+ primaryLabel pointer "
500
518
  data-id="RadioText_label"
501
519
  data-selector-id="label"
502
520
  data-test-id="RadioText_label"
@@ -523,7 +541,7 @@ exports[`Radio rendering labelSize - medium 1`] = `
523
541
  >
524
542
  <div
525
543
  class="radio
526
- hoverprimary medium filled centerPathprimary shrinkOff"
544
+ hoverprimary medium filled centerPathprimary shrinkOff"
527
545
  data-id="boxComponent"
528
546
  data-selector-id="box"
529
547
  data-test-id="boxComponent"
@@ -549,7 +567,7 @@ exports[`Radio rendering labelSize - medium 1`] = `
549
567
  </label>
550
568
  </div>
551
569
  <div
552
- class="text grow basis shrinkOff"
570
+ class="labelContainer grow basis shrinkOff"
553
571
  data-id="boxComponent"
554
572
  data-selector-id="box"
555
573
  data-test-id="boxComponent"
@@ -557,7 +575,7 @@ exports[`Radio rendering labelSize - medium 1`] = `
557
575
  <label
558
576
  class="label title medium default font_default
559
577
  dotted cursor
560
- primaryLabel pointer "
578
+ primaryLabel pointer "
561
579
  data-id="RadioText_label"
562
580
  data-selector-id="label"
563
581
  data-test-id="RadioText_label"
@@ -584,7 +602,7 @@ exports[`Radio rendering labelSize - primary 1`] = `
584
602
  >
585
603
  <div
586
604
  class="radio
587
- hoverprimary medium filled centerPathprimary shrinkOff"
605
+ hoverprimary medium filled centerPathprimary shrinkOff"
588
606
  data-id="boxComponent"
589
607
  data-selector-id="box"
590
608
  data-test-id="boxComponent"
@@ -610,7 +628,7 @@ exports[`Radio rendering labelSize - primary 1`] = `
610
628
  </label>
611
629
  </div>
612
630
  <div
613
- class="text grow basis shrinkOff"
631
+ class="labelContainer grow basis shrinkOff"
614
632
  data-id="boxComponent"
615
633
  data-selector-id="box"
616
634
  data-test-id="boxComponent"
@@ -618,7 +636,7 @@ exports[`Radio rendering labelSize - primary 1`] = `
618
636
  <label
619
637
  class="label title medium default font_primary
620
638
  dotted cursor
621
- primaryLabel pointer "
639
+ primaryLabel pointer "
622
640
  data-id="RadioText_label"
623
641
  data-selector-id="label"
624
642
  data-test-id="RadioText_label"
@@ -645,7 +663,7 @@ exports[`Radio rendering labelSize - small 1`] = `
645
663
  >
646
664
  <div
647
665
  class="radio
648
- hoverprimary medium filled centerPathprimary shrinkOff"
666
+ hoverprimary medium filled centerPathprimary shrinkOff"
649
667
  data-id="boxComponent"
650
668
  data-selector-id="box"
651
669
  data-test-id="boxComponent"
@@ -671,7 +689,7 @@ exports[`Radio rendering labelSize - small 1`] = `
671
689
  </label>
672
690
  </div>
673
691
  <div
674
- class="text grow basis shrinkOff"
692
+ class="labelContainer grow basis shrinkOff"
675
693
  data-id="boxComponent"
676
694
  data-selector-id="box"
677
695
  data-test-id="boxComponent"
@@ -679,7 +697,7 @@ exports[`Radio rendering labelSize - small 1`] = `
679
697
  <label
680
698
  class="label title small default font_default
681
699
  dotted cursor
682
- primaryLabel pointer "
700
+ primaryLabel pointer "
683
701
  data-id="RadioText_label"
684
702
  data-selector-id="label"
685
703
  data-test-id="RadioText_label"
@@ -706,7 +724,7 @@ exports[`Radio rendering palette - danger 1`] = `
706
724
  >
707
725
  <div
708
726
  class="radio
709
- hoverdanger medium filled centerPathdanger shrinkOff"
727
+ hoverdanger medium filled centerPathdanger shrinkOff"
710
728
  data-id="boxComponent"
711
729
  data-selector-id="box"
712
730
  data-test-id="boxComponent"
@@ -731,6 +749,12 @@ exports[`Radio rendering palette - danger 1`] = `
731
749
  </svg>
732
750
  </label>
733
751
  </div>
752
+ <div
753
+ class="labelContainer grow basis shrinkOff"
754
+ data-id="boxComponent"
755
+ data-selector-id="box"
756
+ data-test-id="boxComponent"
757
+ />
734
758
  </div>
735
759
  </DocumentFragment>
736
760
  `;
@@ -749,7 +773,7 @@ exports[`Radio rendering palette - primary 1`] = `
749
773
  >
750
774
  <div
751
775
  class="radio
752
- hoverprimary medium filled centerPathprimary shrinkOff"
776
+ hoverprimary medium filled centerPathprimary shrinkOff"
753
777
  data-id="boxComponent"
754
778
  data-selector-id="box"
755
779
  data-test-id="boxComponent"
@@ -774,6 +798,85 @@ exports[`Radio rendering palette - primary 1`] = `
774
798
  </svg>
775
799
  </label>
776
800
  </div>
801
+ <div
802
+ class="labelContainer grow basis shrinkOff"
803
+ data-id="boxComponent"
804
+ data-selector-id="box"
805
+ data-test-id="boxComponent"
806
+ />
807
+ </div>
808
+ </DocumentFragment>
809
+ `;
810
+
811
+ exports[`Radio rendering secondaryText with checked state 1`] = `
812
+ <DocumentFragment>
813
+ <div
814
+ aria-checked="true"
815
+ aria-readonly="false"
816
+ class="container pointer hoverEfffect checked flex rowdir both"
817
+ data-id="RadioComp"
818
+ data-selector-id="container"
819
+ data-test-id="RadioComp"
820
+ role="radio"
821
+ tabindex="0"
822
+ >
823
+ <div
824
+ class="radio rdBoxprimary
825
+ hoverprimary medium filled centerPathprimary withSecondaryText shrinkOff selfStart"
826
+ data-id="boxComponent"
827
+ data-selector-id="box"
828
+ data-test-id="boxComponent"
829
+ >
830
+ <input
831
+ type="hidden"
832
+ value=""
833
+ />
834
+ <label
835
+ class="radioLabel pointer"
836
+ >
837
+ <svg
838
+ viewBox="0 0 40 40"
839
+ xmlns="http://www.w3.org/2000/svg"
840
+ >
841
+ <circle
842
+ class="rdBox"
843
+ cx="20"
844
+ cy="20"
845
+ r="19"
846
+ />
847
+ <circle
848
+ class="centerPath"
849
+ cx="20"
850
+ cy="20"
851
+ r="11.03"
852
+ />
853
+ </svg>
854
+ </label>
855
+ </div>
856
+ <div
857
+ class="labelContainer grow basis shrinkOff"
858
+ data-id="boxComponent"
859
+ data-selector-id="box"
860
+ data-test-id="boxComponent"
861
+ >
862
+ <label
863
+ class="label title medium default font_default
864
+ dotted cursor
865
+ primaryLabel pointer "
866
+ data-id="Radio Text_label"
867
+ data-selector-id="label"
868
+ data-test-id="Radio Text_label"
869
+ data-title="Radio Text"
870
+ >
871
+ Radio Text
872
+ </label>
873
+ <div
874
+ class="size12 lineheight_1_2 secondaryText "
875
+ data-title="Secondary text"
876
+ >
877
+ Secondary text
878
+ </div>
879
+ </div>
777
880
  </div>
778
881
  </DocumentFragment>
779
882
  `;
@@ -792,7 +895,7 @@ exports[`Radio rendering size - medium 1`] = `
792
895
  >
793
896
  <div
794
897
  class="radio
795
- hoverprimary medium filled centerPathprimary shrinkOff"
898
+ hoverprimary medium filled centerPathprimary shrinkOff"
796
899
  data-id="boxComponent"
797
900
  data-selector-id="box"
798
901
  data-test-id="boxComponent"
@@ -817,6 +920,12 @@ exports[`Radio rendering size - medium 1`] = `
817
920
  </svg>
818
921
  </label>
819
922
  </div>
923
+ <div
924
+ class="labelContainer grow basis shrinkOff"
925
+ data-id="boxComponent"
926
+ data-selector-id="box"
927
+ data-test-id="boxComponent"
928
+ />
820
929
  </div>
821
930
  </DocumentFragment>
822
931
  `;
@@ -835,7 +944,7 @@ exports[`Radio rendering size - small 1`] = `
835
944
  >
836
945
  <div
837
946
  class="radio
838
- hoverprimary small filled centerPathprimary shrinkOff"
947
+ hoverprimary small filled centerPathprimary shrinkOff"
839
948
  data-id="boxComponent"
840
949
  data-selector-id="box"
841
950
  data-test-id="boxComponent"
@@ -860,6 +969,12 @@ exports[`Radio rendering size - small 1`] = `
860
969
  </svg>
861
970
  </label>
862
971
  </div>
972
+ <div
973
+ class="labelContainer grow basis shrinkOff"
974
+ data-id="boxComponent"
975
+ data-selector-id="box"
976
+ data-test-id="boxComponent"
977
+ />
863
978
  </div>
864
979
  </DocumentFragment>
865
980
  `;
@@ -878,7 +993,7 @@ exports[`Radio rendering the Checked is true for palette - danger 1`] = `
878
993
  >
879
994
  <div
880
995
  class="radio
881
- hoverdanger medium filled centerPathdanger shrinkOff"
996
+ hoverdanger medium filled centerPathdanger shrinkOff"
882
997
  data-id="boxComponent"
883
998
  data-selector-id="box"
884
999
  data-test-id="boxComponent"
@@ -904,7 +1019,7 @@ exports[`Radio rendering the Checked is true for palette - danger 1`] = `
904
1019
  </label>
905
1020
  </div>
906
1021
  <div
907
- class="text grow basis shrinkOff"
1022
+ class="labelContainer grow basis shrinkOff"
908
1023
  data-id="boxComponent"
909
1024
  data-selector-id="box"
910
1025
  data-test-id="boxComponent"
@@ -912,7 +1027,7 @@ exports[`Radio rendering the Checked is true for palette - danger 1`] = `
912
1027
  <label
913
1028
  class="label title medium default font_default
914
1029
  dotted cursor
915
- dangerLabel pointer "
1030
+ dangerLabel pointer "
916
1031
  data-id="RadioText_label"
917
1032
  data-selector-id="label"
918
1033
  data-test-id="RadioText_label"
@@ -939,7 +1054,7 @@ exports[`Radio rendering the Checked is true for palette - primary 1`] = `
939
1054
  >
940
1055
  <div
941
1056
  class="radio
942
- hoverprimary medium filled centerPathprimary shrinkOff"
1057
+ hoverprimary medium filled centerPathprimary shrinkOff"
943
1058
  data-id="boxComponent"
944
1059
  data-selector-id="box"
945
1060
  data-test-id="boxComponent"
@@ -965,7 +1080,7 @@ exports[`Radio rendering the Checked is true for palette - primary 1`] = `
965
1080
  </label>
966
1081
  </div>
967
1082
  <div
968
- class="text grow basis shrinkOff"
1083
+ class="labelContainer grow basis shrinkOff"
969
1084
  data-id="boxComponent"
970
1085
  data-selector-id="box"
971
1086
  data-test-id="boxComponent"
@@ -973,7 +1088,7 @@ exports[`Radio rendering the Checked is true for palette - primary 1`] = `
973
1088
  <label
974
1089
  class="label title medium default font_default
975
1090
  dotted cursor
976
- primaryLabel pointer "
1091
+ primaryLabel pointer "
977
1092
  data-id="RadioText_label"
978
1093
  data-selector-id="label"
979
1094
  data-test-id="RadioText_label"
@@ -1000,7 +1115,7 @@ exports[`Radio rendering the ID 1`] = `
1000
1115
  >
1001
1116
  <div
1002
1117
  class="radio
1003
- hoverprimary medium filled centerPathprimary shrinkOff"
1118
+ hoverprimary medium filled centerPathprimary shrinkOff"
1004
1119
  data-id="boxComponent"
1005
1120
  data-selector-id="box"
1006
1121
  data-test-id="boxComponent"
@@ -1026,6 +1141,12 @@ exports[`Radio rendering the ID 1`] = `
1026
1141
  </svg>
1027
1142
  </label>
1028
1143
  </div>
1144
+ <div
1145
+ class="labelContainer grow basis shrinkOff"
1146
+ data-id="boxComponent"
1147
+ data-selector-id="box"
1148
+ data-test-id="boxComponent"
1149
+ />
1029
1150
  </div>
1030
1151
  </DocumentFragment>
1031
1152
  `;
@@ -1044,7 +1165,7 @@ exports[`Radio rendering the Name 1`] = `
1044
1165
  >
1045
1166
  <div
1046
1167
  class="radio
1047
- hoverprimary medium filled centerPathprimary shrinkOff"
1168
+ hoverprimary medium filled centerPathprimary shrinkOff"
1048
1169
  data-id="boxComponent"
1049
1170
  data-selector-id="box"
1050
1171
  data-test-id="boxComponent"
@@ -1070,6 +1191,12 @@ exports[`Radio rendering the Name 1`] = `
1070
1191
  </svg>
1071
1192
  </label>
1072
1193
  </div>
1194
+ <div
1195
+ class="labelContainer grow basis shrinkOff"
1196
+ data-id="boxComponent"
1197
+ data-selector-id="box"
1198
+ data-test-id="boxComponent"
1199
+ />
1073
1200
  </div>
1074
1201
  </DocumentFragment>
1075
1202
  `;
@@ -1088,7 +1215,7 @@ exports[`Radio rendering the Value 1`] = `
1088
1215
  >
1089
1216
  <div
1090
1217
  class="radio
1091
- hoverprimary medium filled centerPathprimary shrinkOff"
1218
+ hoverprimary medium filled centerPathprimary shrinkOff"
1092
1219
  data-id="boxComponent"
1093
1220
  data-selector-id="box"
1094
1221
  data-test-id="boxComponent"
@@ -1113,6 +1240,12 @@ exports[`Radio rendering the Value 1`] = `
1113
1240
  </svg>
1114
1241
  </label>
1115
1242
  </div>
1243
+ <div
1244
+ class="labelContainer grow basis shrinkOff"
1245
+ data-id="boxComponent"
1246
+ data-selector-id="box"
1247
+ data-test-id="boxComponent"
1248
+ />
1116
1249
  </div>
1117
1250
  </DocumentFragment>
1118
1251
  `;
@@ -1131,7 +1264,7 @@ exports[`Radio rendering the accessMode when disabled 1`] = `
1131
1264
  >
1132
1265
  <div
1133
1266
  class="radio
1134
- medium filled centerPathprimary disabled shrinkOff"
1267
+ medium filled centerPathprimary disabled shrinkOff"
1135
1268
  data-id="boxComponent"
1136
1269
  data-selector-id="box"
1137
1270
  data-test-id="boxComponent"
@@ -1157,15 +1290,15 @@ exports[`Radio rendering the accessMode when disabled 1`] = `
1157
1290
  </label>
1158
1291
  </div>
1159
1292
  <div
1160
- class="text disabled grow basis shrinkOff"
1293
+ class="labelContainer grow basis shrinkOff"
1161
1294
  data-id="boxComponent"
1162
1295
  data-selector-id="box"
1163
1296
  data-test-id="boxComponent"
1164
1297
  >
1165
1298
  <label
1166
1299
  class="label title medium default font_default
1167
- dotted cursor
1168
- primaryLabel "
1300
+ dotted cursor disabled
1301
+ primaryLabel "
1169
1302
  data-id="RadioText_label"
1170
1303
  data-selector-id="label"
1171
1304
  data-test-id="RadioText_label"
@@ -1192,7 +1325,7 @@ exports[`Radio rendering the accessMode when isReadOnly 1`] = `
1192
1325
  >
1193
1326
  <div
1194
1327
  class="radio
1195
- medium filled centerPathprimary disabled shrinkOff"
1328
+ medium filled centerPathprimary disabled shrinkOff"
1196
1329
  data-id="boxComponent"
1197
1330
  data-selector-id="box"
1198
1331
  data-test-id="boxComponent"
@@ -1218,7 +1351,7 @@ exports[`Radio rendering the accessMode when isReadOnly 1`] = `
1218
1351
  </label>
1219
1352
  </div>
1220
1353
  <div
1221
- class="text grow basis shrinkOff"
1354
+ class="labelContainer grow basis shrinkOff"
1222
1355
  data-id="boxComponent"
1223
1356
  data-selector-id="box"
1224
1357
  data-test-id="boxComponent"
@@ -1226,7 +1359,7 @@ exports[`Radio rendering the accessMode when isReadOnly 1`] = `
1226
1359
  <label
1227
1360
  class="label title medium default font_default
1228
1361
  dotted cursor
1229
- primaryLabel readonly "
1362
+ primaryLabel readonly "
1230
1363
  data-id="RadioText_label"
1231
1364
  data-selector-id="label"
1232
1365
  data-test-id="RadioText_label"
@@ -1253,7 +1386,7 @@ exports[`Radio rendering the active is true - danger 1`] = `
1253
1386
  >
1254
1387
  <div
1255
1388
  class="radio rdBoxdanger
1256
- hoverdanger medium filled centerPathdanger shrinkOff"
1389
+ hoverdanger medium filled centerPathdanger shrinkOff"
1257
1390
  data-id="boxComponent"
1258
1391
  data-selector-id="box"
1259
1392
  data-test-id="boxComponent"
@@ -1285,7 +1418,7 @@ exports[`Radio rendering the active is true - danger 1`] = `
1285
1418
  </label>
1286
1419
  </div>
1287
1420
  <div
1288
- class="text grow basis shrinkOff"
1421
+ class="labelContainer grow basis shrinkOff"
1289
1422
  data-id="boxComponent"
1290
1423
  data-selector-id="box"
1291
1424
  data-test-id="boxComponent"
@@ -1293,7 +1426,7 @@ exports[`Radio rendering the active is true - danger 1`] = `
1293
1426
  <label
1294
1427
  class="label title medium default font_default
1295
1428
  dotted cursor dangercheckedActive
1296
- dangerLabel pointer "
1429
+ dangerLabel pointer "
1297
1430
  data-id="RadioText_label"
1298
1431
  data-selector-id="label"
1299
1432
  data-test-id="RadioText_label"
@@ -1320,7 +1453,7 @@ exports[`Radio rendering the active is true - primary 1`] = `
1320
1453
  >
1321
1454
  <div
1322
1455
  class="radio rdBoxprimary
1323
- hoverprimary medium filled centerPathprimary shrinkOff"
1456
+ hoverprimary medium filled centerPathprimary shrinkOff"
1324
1457
  data-id="boxComponent"
1325
1458
  data-selector-id="box"
1326
1459
  data-test-id="boxComponent"
@@ -1352,7 +1485,7 @@ exports[`Radio rendering the active is true - primary 1`] = `
1352
1485
  </label>
1353
1486
  </div>
1354
1487
  <div
1355
- class="text grow basis shrinkOff"
1488
+ class="labelContainer grow basis shrinkOff"
1356
1489
  data-id="boxComponent"
1357
1490
  data-selector-id="box"
1358
1491
  data-test-id="boxComponent"
@@ -1360,7 +1493,7 @@ exports[`Radio rendering the active is true - primary 1`] = `
1360
1493
  <label
1361
1494
  class="label title medium default font_default
1362
1495
  dotted cursor primarycheckedActive
1363
- primaryLabel pointer "
1496
+ primaryLabel pointer "
1364
1497
  data-id="RadioText_label"
1365
1498
  data-selector-id="label"
1366
1499
  data-test-id="RadioText_label"
@@ -1387,7 +1520,7 @@ exports[`Radio rendering the customClass of customRadioWrap,customRadio,customLa
1387
1520
  >
1388
1521
  <div
1389
1522
  class="radio
1390
- hoverprimary medium filled centerPathprimary CustomClassCustomRadio shrinkOff"
1523
+ hoverprimary medium filled centerPathprimary CustomClassCustomRadio shrinkOff"
1391
1524
  data-id="boxComponent"
1392
1525
  data-selector-id="box"
1393
1526
  data-test-id="boxComponent"
@@ -1413,7 +1546,7 @@ exports[`Radio rendering the customClass of customRadioWrap,customRadio,customLa
1413
1546
  </label>
1414
1547
  </div>
1415
1548
  <div
1416
- class="text grow basis shrinkOff"
1549
+ class="labelContainer grow basis shrinkOff"
1417
1550
  data-id="boxComponent"
1418
1551
  data-selector-id="box"
1419
1552
  data-test-id="boxComponent"
@@ -1421,7 +1554,7 @@ exports[`Radio rendering the customClass of customRadioWrap,customRadio,customLa
1421
1554
  <label
1422
1555
  class="label title medium default font_default
1423
1556
  dotted cursor
1424
- primaryLabel pointer CustomClassCustomLabel "
1557
+ primaryLabel pointer CustomClassCustomLabel "
1425
1558
  data-id="RadioText_label"
1426
1559
  data-selector-id="label"
1427
1560
  data-test-id="RadioText_label"
@@ -1448,7 +1581,7 @@ exports[`Radio rendering the defult props 1`] = `
1448
1581
  >
1449
1582
  <div
1450
1583
  class="radio
1451
- hoverprimary medium filled centerPathprimary shrinkOff"
1584
+ hoverprimary medium filled centerPathprimary shrinkOff"
1452
1585
  data-id="boxComponent"
1453
1586
  data-selector-id="box"
1454
1587
  data-test-id="boxComponent"
@@ -1473,6 +1606,12 @@ exports[`Radio rendering the defult props 1`] = `
1473
1606
  </svg>
1474
1607
  </label>
1475
1608
  </div>
1609
+ <div
1610
+ class="labelContainer grow basis shrinkOff"
1611
+ data-id="boxComponent"
1612
+ data-selector-id="box"
1613
+ data-test-id="boxComponent"
1614
+ />
1476
1615
  </div>
1477
1616
  </DocumentFragment>
1478
1617
  `;
@@ -1491,7 +1630,7 @@ exports[`Radio rendering the disabled is true for palette - danger 1`] = `
1491
1630
  >
1492
1631
  <div
1493
1632
  class="radio
1494
- medium filled centerPathdanger disabled shrinkOff"
1633
+ medium filled centerPathdanger disabled shrinkOff"
1495
1634
  data-id="boxComponent"
1496
1635
  data-selector-id="box"
1497
1636
  data-test-id="boxComponent"
@@ -1517,15 +1656,15 @@ exports[`Radio rendering the disabled is true for palette - danger 1`] = `
1517
1656
  </label>
1518
1657
  </div>
1519
1658
  <div
1520
- class="text disabled grow basis shrinkOff"
1659
+ class="labelContainer grow basis shrinkOff"
1521
1660
  data-id="boxComponent"
1522
1661
  data-selector-id="box"
1523
1662
  data-test-id="boxComponent"
1524
1663
  >
1525
1664
  <label
1526
1665
  class="label title medium default font_default
1527
- dotted cursor
1528
- dangerLabel "
1666
+ dotted cursor disabled
1667
+ dangerLabel "
1529
1668
  data-id="RadioText_label"
1530
1669
  data-selector-id="label"
1531
1670
  data-test-id="RadioText_label"
@@ -1552,7 +1691,7 @@ exports[`Radio rendering the disabled is true for palette - primary 1`] = `
1552
1691
  >
1553
1692
  <div
1554
1693
  class="radio
1555
- medium filled centerPathprimary disabled shrinkOff"
1694
+ medium filled centerPathprimary disabled shrinkOff"
1556
1695
  data-id="boxComponent"
1557
1696
  data-selector-id="box"
1558
1697
  data-test-id="boxComponent"
@@ -1578,15 +1717,15 @@ exports[`Radio rendering the disabled is true for palette - primary 1`] = `
1578
1717
  </label>
1579
1718
  </div>
1580
1719
  <div
1581
- class="text disabled grow basis shrinkOff"
1720
+ class="labelContainer grow basis shrinkOff"
1582
1721
  data-id="boxComponent"
1583
1722
  data-selector-id="box"
1584
1723
  data-test-id="boxComponent"
1585
1724
  >
1586
1725
  <label
1587
1726
  class="label title medium default font_default
1588
- dotted cursor
1589
- primaryLabel "
1727
+ dotted cursor disabled
1728
+ primaryLabel "
1590
1729
  data-id="RadioText_label"
1591
1730
  data-selector-id="label"
1592
1731
  data-test-id="RadioText_label"
@@ -1614,7 +1753,7 @@ exports[`Radio rendering the disabledTitle 1`] = `
1614
1753
  >
1615
1754
  <div
1616
1755
  class="radio
1617
- medium filled centerPathprimary disabled shrinkOff"
1756
+ medium filled centerPathprimary disabled shrinkOff"
1618
1757
  data-id="boxComponent"
1619
1758
  data-selector-id="box"
1620
1759
  data-test-id="boxComponent"
@@ -1640,15 +1779,15 @@ exports[`Radio rendering the disabledTitle 1`] = `
1640
1779
  </label>
1641
1780
  </div>
1642
1781
  <div
1643
- class="text disabled grow basis shrinkOff"
1782
+ class="labelContainer grow basis shrinkOff"
1644
1783
  data-id="boxComponent"
1645
1784
  data-selector-id="box"
1646
1785
  data-test-id="boxComponent"
1647
1786
  >
1648
1787
  <label
1649
1788
  class="label title medium default font_default
1650
- dotted cursor
1651
- primaryLabel "
1789
+ dotted cursor disabled
1790
+ primaryLabel "
1652
1791
  data-id="RadioText_label"
1653
1792
  data-selector-id="label"
1654
1793
  data-test-id="RadioText_label"
@@ -1675,7 +1814,7 @@ exports[`Radio rendering the isFilled is false 1`] = `
1675
1814
  >
1676
1815
  <div
1677
1816
  class="radio
1678
- hoverprimary medium centerPathprimary shrinkOff"
1817
+ hoverprimary medium centerPathprimary shrinkOff"
1679
1818
  data-id="boxComponent"
1680
1819
  data-selector-id="box"
1681
1820
  data-test-id="boxComponent"
@@ -1700,6 +1839,12 @@ exports[`Radio rendering the isFilled is false 1`] = `
1700
1839
  </svg>
1701
1840
  </label>
1702
1841
  </div>
1842
+ <div
1843
+ class="labelContainer grow basis shrinkOff"
1844
+ data-id="boxComponent"
1845
+ data-selector-id="box"
1846
+ data-test-id="boxComponent"
1847
+ />
1703
1848
  </div>
1704
1849
  </DocumentFragment>
1705
1850
  `;
@@ -1718,7 +1863,7 @@ exports[`Radio rendering the isReadOnly is true 1`] = `
1718
1863
  >
1719
1864
  <div
1720
1865
  class="radio
1721
- medium filled centerPathprimary disabled shrinkOff"
1866
+ medium filled centerPathprimary disabled shrinkOff"
1722
1867
  data-id="boxComponent"
1723
1868
  data-selector-id="box"
1724
1869
  data-test-id="boxComponent"
@@ -1743,6 +1888,12 @@ exports[`Radio rendering the isReadOnly is true 1`] = `
1743
1888
  </svg>
1744
1889
  </label>
1745
1890
  </div>
1891
+ <div
1892
+ class="labelContainer grow basis shrinkOff"
1893
+ data-id="boxComponent"
1894
+ data-selector-id="box"
1895
+ data-test-id="boxComponent"
1896
+ />
1746
1897
  </div>
1747
1898
  </DocumentFragment>
1748
1899
  `;
@@ -1761,7 +1912,7 @@ exports[`Radio rendering the text 1`] = `
1761
1912
  >
1762
1913
  <div
1763
1914
  class="radio
1764
- hoverprimary medium filled centerPathprimary shrinkOff"
1915
+ hoverprimary medium filled centerPathprimary shrinkOff"
1765
1916
  data-id="boxComponent"
1766
1917
  data-selector-id="box"
1767
1918
  data-test-id="boxComponent"
@@ -1787,7 +1938,7 @@ exports[`Radio rendering the text 1`] = `
1787
1938
  </label>
1788
1939
  </div>
1789
1940
  <div
1790
- class="text grow basis shrinkOff"
1941
+ class="labelContainer grow basis shrinkOff"
1791
1942
  data-id="boxComponent"
1792
1943
  data-selector-id="box"
1793
1944
  data-test-id="boxComponent"
@@ -1795,7 +1946,7 @@ exports[`Radio rendering the text 1`] = `
1795
1946
  <label
1796
1947
  class="label title medium default font_default
1797
1948
  dotted cursor
1798
- primaryLabel pointer "
1949
+ primaryLabel pointer "
1799
1950
  data-id="RadioText_label"
1800
1951
  data-selector-id="label"
1801
1952
  data-test-id="RadioText_label"
@@ -1823,7 +1974,7 @@ exports[`Radio rendering the title 1`] = `
1823
1974
  >
1824
1975
  <div
1825
1976
  class="radio
1826
- hoverprimary medium filled centerPathprimary shrinkOff"
1977
+ hoverprimary medium filled centerPathprimary shrinkOff"
1827
1978
  data-id="boxComponent"
1828
1979
  data-selector-id="box"
1829
1980
  data-test-id="boxComponent"
@@ -1849,7 +2000,7 @@ exports[`Radio rendering the title 1`] = `
1849
2000
  </label>
1850
2001
  </div>
1851
2002
  <div
1852
- class="text grow basis shrinkOff"
2003
+ class="labelContainer grow basis shrinkOff"
1853
2004
  data-id="boxComponent"
1854
2005
  data-selector-id="box"
1855
2006
  data-test-id="boxComponent"
@@ -1857,7 +2008,7 @@ exports[`Radio rendering the title 1`] = `
1857
2008
  <label
1858
2009
  class="label title medium default font_default
1859
2010
  dotted cursor
1860
- primaryLabel pointer "
2011
+ primaryLabel pointer "
1861
2012
  data-id="RadioText_label"
1862
2013
  data-selector-id="label"
1863
2014
  data-test-id="RadioText_label"
@@ -1885,7 +2036,7 @@ exports[`Radio renders with different onClick props 1`] = `
1885
2036
  >
1886
2037
  <div
1887
2038
  class="radio
1888
- hoverprimary medium filled centerPathprimary shrinkOff"
2039
+ hoverprimary medium filled centerPathprimary shrinkOff"
1889
2040
  data-id="boxComponent"
1890
2041
  data-selector-id="box"
1891
2042
  data-test-id="boxComponent"
@@ -1910,6 +2061,12 @@ exports[`Radio renders with different onClick props 1`] = `
1910
2061
  </svg>
1911
2062
  </label>
1912
2063
  </div>
2064
+ <div
2065
+ class="labelContainer grow basis shrinkOff"
2066
+ data-id="boxComponent"
2067
+ data-selector-id="box"
2068
+ data-test-id="boxComponent"
2069
+ />
1913
2070
  </div>
1914
2071
  </div>
1915
2072
  </DocumentFragment>