@hero-design/rn 7.22.1 → 7.22.3

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 (128) hide show
  1. package/.turbo/turbo-build.log +2 -2
  2. package/es/index.js +309 -284
  3. package/lib/index.js +309 -284
  4. package/package.json +4 -4
  5. package/src/components/Accordion/AccordionItem.tsx +1 -1
  6. package/src/components/Accordion/__tests__/__snapshots__/AccordionItem.spec.tsx.snap +8 -8
  7. package/src/components/Accordion/__tests__/__snapshots__/index.spec.tsx.snap +12 -12
  8. package/src/components/Avatar/__tests__/__snapshots__/StyledAvatar.spec.tsx.snap +3 -3
  9. package/src/components/Avatar/__tests__/__snapshots__/index.spec.tsx.snap +2 -2
  10. package/src/components/BottomNavigation/__tests__/__snapshots__/index.spec.tsx.snap +2 -2
  11. package/src/components/Button/LoadingIndicator/__tests__/__snapshots__/StyledLoadingIndicator.spec.tsx.snap +2 -2
  12. package/src/components/Button/LoadingIndicator/__tests__/__snapshots__/index.spec.tsx.snap +6 -6
  13. package/src/components/Button/__tests__/__snapshots__/StyledButton.spec.tsx.snap +24 -24
  14. package/src/components/Calendar/__tests__/__snapshots__/CalendarRowItem.spec.tsx.snap +6 -6
  15. package/src/components/Card/DataCard/__tests__/__snapshots__/StyledDataCard.spec.tsx.snap +3 -3
  16. package/src/components/Card/DataCard/__tests__/__snapshots__/index.spec.tsx.snap +2 -2
  17. package/src/components/Card/__tests__/__snapshots__/StyledCard.spec.tsx.snap +1 -1
  18. package/src/components/Card/__tests__/__snapshots__/index.spec.tsx.snap +1 -1
  19. package/src/components/Checkbox/__tests__/__snapshots__/StyledCheckbox.spec.tsx.snap +2 -2
  20. package/src/components/Checkbox/__tests__/__snapshots__/index.spec.tsx.snap +5 -5
  21. package/src/components/ContentNavigator/__tests__/__snapshots__/index.spec.tsx.snap +2 -2
  22. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerAndroid.spec.tsx.snap +4 -18
  23. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap +5 -19
  24. package/src/components/Drawer/__tests__/__snapshots__/index.spec.tsx.snap +3 -3
  25. package/src/components/FAB/ActionGroup/__tests__/__snapshots__/index.spec.tsx.snap +10 -10
  26. package/src/components/Icon/HeroIcon/index.tsx +2 -0
  27. package/src/components/Icon/__tests__/__snapshots__/index.spec.tsx.snap +1 -1
  28. package/src/components/Icon/index.tsx +1 -0
  29. package/src/components/List/StyledBasicListItem.tsx +1 -0
  30. package/src/components/List/__tests__/BasicListItem.spec.tsx +37 -13
  31. package/src/components/List/__tests__/__snapshots__/BasicListItem.spec.tsx.snap +163 -2
  32. package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap +12 -12
  33. package/src/components/List/__tests__/__snapshots__/StyledBasicListItem.spec.tsx.snap +6 -2
  34. package/src/components/List/__tests__/__snapshots__/StyledListItem.spec.tsx.snap +4 -4
  35. package/src/components/PinInput/__tests__/__snapshots__/PinCell.spec.tsx.snap +6 -6
  36. package/src/components/PinInput/__tests__/__snapshots__/index.spec.tsx.snap +21 -21
  37. package/src/components/Progress/__tests__/__snapshots__/index.spec.js.snap +5 -5
  38. package/src/components/Radio/__tests__/__snapshots__/Radio.spec.tsx.snap +3 -1
  39. package/src/components/Radio/__tests__/__snapshots__/RadioGroup.spec.tsx.snap +4 -1
  40. package/src/components/RichTextEditor/RichTextEditor.tsx +1 -3
  41. package/src/components/RichTextEditor/__tests__/EditorToolbar.spec.tsx +1 -1
  42. package/src/components/RichTextEditor/__tests__/__snapshots__/RichTextEditor.spec.tsx.snap +10 -38
  43. package/src/components/SectionHeading/__tests__/__snapshots__/index.spec.tsx.snap +1 -1
  44. package/src/components/Select/MultiSelect/__tests__/__snapshots__/Option.spec.tsx.snap +2 -1
  45. package/src/components/Select/MultiSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap +25 -9
  46. package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +66 -108
  47. package/src/components/Select/SingleSelect/__tests__/__snapshots__/Option.spec.tsx.snap +2 -1
  48. package/src/components/Select/SingleSelect/__tests__/__snapshots__/OptionList.spec.tsx.snap +24 -8
  49. package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +57 -99
  50. package/src/components/Select/__tests__/__snapshots__/StyledSelect.spec.tsx.snap +1 -1
  51. package/src/components/Slider/__tests__/__snapshots__/index.spec.tsx.snap +3 -3
  52. package/src/components/Spinner/StyledSpinner.tsx +8 -4
  53. package/src/components/Spinner/__tests__/__snapshots__/AnimatedSpinner.spec.tsx.snap +8 -4
  54. package/src/components/Spinner/__tests__/__snapshots__/StyledSpinner.spec.tsx.snap +32 -16
  55. package/src/components/Spinner/__tests__/__snapshots__/index.spec.tsx.snap +8 -4
  56. package/src/components/Switch/__tests__/__snapshots__/StyledSwitch.spec.tsx.snap +3 -3
  57. package/src/components/Tabs/ScrollableTabs.tsx +2 -5
  58. package/src/components/Tabs/__tests__/__snapshots__/ScrollableTabs.spec.tsx.snap +1 -1
  59. package/src/components/Tag/__tests__/__snapshots__/Tag.spec.tsx.snap +1 -1
  60. package/src/components/TextInput/StyledTextInput.tsx +11 -16
  61. package/src/components/TextInput/__tests__/StyledTextInput.spec.tsx +3 -3
  62. package/src/components/TextInput/__tests__/__snapshots__/StyledTextInput.spec.tsx.snap +28 -46
  63. package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap +67 -249
  64. package/src/components/TextInput/index.tsx +27 -27
  65. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerAndroid.spec.tsx.snap +4 -18
  66. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap +5 -19
  67. package/src/components/Toast/ToastProvider.tsx +2 -4
  68. package/src/components/Toast/__tests__/index.spec.tsx +138 -0
  69. package/src/components/Toolbar/ToolbarItem.tsx +1 -1
  70. package/src/components/Toolbar/__tests__/__snapshots__/ToolbarGroup.spec.tsx.snap +12 -12
  71. package/src/components/Toolbar/__tests__/__snapshots__/ToolbarItem.spec.tsx.snap +6 -6
  72. package/src/components/Typography/Text/StyledText.tsx +1 -0
  73. package/src/components/Typography/Text/__tests__/__snapshots__/StyledText.spec.tsx.snap +3 -3
  74. package/src/components/Typography/Text/index.tsx +1 -0
  75. package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +93 -84
  76. package/src/theme/components/accordion.ts +1 -1
  77. package/src/theme/components/alert.ts +4 -4
  78. package/src/theme/components/avatar.ts +2 -2
  79. package/src/theme/components/badge.ts +6 -6
  80. package/src/theme/components/bottomNavigation.ts +2 -2
  81. package/src/theme/components/bottomSheet.ts +3 -3
  82. package/src/theme/components/button.ts +20 -20
  83. package/src/theme/components/calendar.ts +4 -4
  84. package/src/theme/components/card.ts +5 -5
  85. package/src/theme/components/checkbox.ts +1 -1
  86. package/src/theme/components/divider.ts +1 -1
  87. package/src/theme/components/drawer.ts +4 -4
  88. package/src/theme/components/empty.ts +3 -4
  89. package/src/theme/components/fab.ts +7 -7
  90. package/src/theme/components/icon.ts +4 -3
  91. package/src/theme/components/list.ts +8 -6
  92. package/src/theme/components/pinInput.ts +4 -4
  93. package/src/theme/components/progress.ts +3 -3
  94. package/src/theme/components/richTextEditor.ts +3 -3
  95. package/src/theme/components/sectionHeading.ts +1 -1
  96. package/src/theme/components/select.ts +1 -1
  97. package/src/theme/components/slider.ts +3 -3
  98. package/src/theme/components/spinner.ts +1 -4
  99. package/src/theme/components/switch.ts +7 -7
  100. package/src/theme/components/tabs.ts +5 -5
  101. package/src/theme/components/tag.ts +12 -12
  102. package/src/theme/components/textInput.ts +38 -38
  103. package/src/theme/components/toast.ts +6 -6
  104. package/src/theme/components/toolbar.ts +3 -2
  105. package/src/theme/components/typography.ts +4 -3
  106. package/src/theme/global/colors/global.ts +32 -0
  107. package/src/theme/global/colors/legacySystemPalette.ts +53 -0
  108. package/src/theme/global/colors/swag.ts +21 -34
  109. package/src/theme/global/colors/types.ts +46 -26
  110. package/src/theme/global/colors/work.ts +10 -9
  111. package/types/components/Icon/HeroIcon/index.d.ts +1 -1
  112. package/types/components/Icon/index.d.ts +1 -1
  113. package/types/components/TextInput/StyledTextInput.d.ts +3 -9
  114. package/types/components/TextInput/index.d.ts +4 -4
  115. package/types/components/Toast/__tests__/index.spec.d.ts +1 -0
  116. package/types/components/Toolbar/ToolbarItem.d.ts +1 -1
  117. package/types/components/Typography/Text/StyledText.d.ts +1 -1
  118. package/types/components/Typography/Text/index.d.ts +1 -1
  119. package/types/theme/components/empty.d.ts +0 -1
  120. package/types/theme/components/icon.d.ts +1 -0
  121. package/types/theme/components/list.d.ts +1 -0
  122. package/types/theme/components/spinner.d.ts +1 -4
  123. package/types/theme/components/toolbar.d.ts +1 -0
  124. package/types/theme/components/typography.d.ts +1 -0
  125. package/types/theme/global/colors/global.d.ts +3 -0
  126. package/types/theme/global/colors/legacySystemPalette.d.ts +3 -0
  127. package/types/theme/global/colors/types.d.ts +41 -20
  128. package/types/theme/global/index.d.ts +28 -19
package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap CHANGED
@@ -61,7 +61,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
61
61
  style={
62
62
  Array [
63
63
  Object {
64
- "borderColor": "#8505a2",
64
+ "borderColor": "#001f23",
65
65
  "borderRadius": 999,
66
66
  "borderWidth": 1,
67
67
  "height": 32,
@@ -92,7 +92,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
92
92
  style={
93
93
  Array [
94
94
  Object {
95
- "color": "#8505a2",
95
+ "color": "#001f23",
96
96
  "fontSize": 16,
97
97
  "overflow": "hidden",
98
98
  },
@@ -140,7 +140,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
140
140
  style={
141
141
  Array [
142
142
  Object {
143
- "color": "#808f91",
143
+ "color": "#4d6265",
144
144
  "fontFamily": "BeVietnamPro-Regular",
145
145
  "fontSize": 12,
146
146
  "letterSpacing": 0.36,
@@ -171,7 +171,7 @@ exports[`ListItem renders correctly ListItem with children 1`] = `
171
171
  style={
172
172
  Array [
173
173
  Object {
174
- "color": "#8505a2",
174
+ "color": "#001f23",
175
175
  "fontSize": 20,
176
176
  },
177
177
  undefined,
@@ -376,7 +376,7 @@ exports[`ListItem renders correctly ListItem with icon 1`] = `
376
376
  style={
377
377
  Array [
378
378
  Object {
379
- "color": "#808f91",
379
+ "color": "#4d6265",
380
380
  "fontFamily": "BeVietnamPro-Regular",
381
381
  "fontSize": 12,
382
382
  "letterSpacing": 0.36,
@@ -407,7 +407,7 @@ exports[`ListItem renders correctly ListItem with icon 1`] = `
407
407
  style={
408
408
  Array [
409
409
  Object {
410
- "color": "#8505a2",
410
+ "color": "#001f23",
411
411
  "fontSize": 20,
412
412
  },
413
413
  undefined,
@@ -453,7 +453,7 @@ exports[`ListItem renders correctly ListItem with leading status 1`] = `
453
453
  style={
454
454
  Array [
455
455
  Object {
456
- "backgroundColor": "#bfc1c5",
456
+ "backgroundColor": "#ccced1",
457
457
  "borderRadius": 999,
458
458
  "marginRight": 8,
459
459
  "width": 8,
@@ -529,7 +529,7 @@ exports[`ListItem renders correctly ListItem with leading status 1`] = `
529
529
  style={
530
530
  Array [
531
531
  Object {
532
- "color": "#8505a2",
532
+ "color": "#001f23",
533
533
  "fontSize": 20,
534
534
  },
535
535
  undefined,
@@ -606,7 +606,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
606
606
  style={
607
607
  Array [
608
608
  Object {
609
- "borderColor": "#8505a2",
609
+ "borderColor": "#001f23",
610
610
  "borderRadius": 999,
611
611
  "borderWidth": 1,
612
612
  "height": 32,
@@ -637,7 +637,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
637
637
  style={
638
638
  Array [
639
639
  Object {
640
- "color": "#8505a2",
640
+ "color": "#001f23",
641
641
  "fontSize": 16,
642
642
  "overflow": "hidden",
643
643
  },
@@ -685,7 +685,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
685
685
  style={
686
686
  Array [
687
687
  Object {
688
- "color": "#808f91",
688
+ "color": "#4d6265",
689
689
  "fontFamily": "BeVietnamPro-Regular",
690
690
  "fontSize": 12,
691
691
  "letterSpacing": 0.36,
@@ -729,7 +729,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
729
729
  style={
730
730
  Array [
731
731
  Object {
732
- "backgroundColor": "#8505a2",
732
+ "backgroundColor": "#401960",
733
733
  "borderRadius": 999,
734
734
  "display": "flex",
735
735
  "height": 32,
package/src/components/List/__tests__/__snapshots__/StyledBasicListItem.spec.tsx.snap CHANGED
@@ -16,6 +16,7 @@ exports[`StyledListItemContainer renders correctly themeSelected false themeDisa
16
16
  Object {
17
17
  "alignItems": "center",
18
18
  "backgroundColor": "#ffffff",
19
+ "borderRadius": 4,
19
20
  "flexDirection": "row",
20
21
  "opacity": 1,
21
22
  "padding": 16,
@@ -62,6 +63,7 @@ exports[`StyledListItemContainer renders correctly themeSelected false themeDisa
62
63
  Object {
63
64
  "alignItems": "center",
64
65
  "backgroundColor": "#ffffff",
66
+ "borderRadius": 4,
65
67
  "flexDirection": "row",
66
68
  "opacity": 0.38,
67
69
  "padding": 16,
@@ -107,7 +109,8 @@ exports[`StyledListItemContainer renders correctly themeSelected true themeDisab
107
109
  Array [
108
110
  Object {
109
111
  "alignItems": "center",
110
- "backgroundColor": "#f3e6f6",
112
+ "backgroundColor": "#d9d1df",
113
+ "borderRadius": 4,
111
114
  "flexDirection": "row",
112
115
  "opacity": 1,
113
116
  "padding": 16,
@@ -153,7 +156,8 @@ exports[`StyledListItemContainer renders correctly themeSelected true themeDisab
153
156
  Array [
154
157
  Object {
155
158
  "alignItems": "center",
156
- "backgroundColor": "#f3e6f6",
159
+ "backgroundColor": "#d9d1df",
160
+ "borderRadius": 4,
157
161
  "flexDirection": "row",
158
162
  "opacity": 0.38,
159
163
  "padding": 16,
package/src/components/List/__tests__/__snapshots__/StyledListItem.spec.tsx.snap CHANGED
@@ -5,7 +5,7 @@ exports[`LeadingStatus renders correctly themeLeadingStausIntent archived 1`] =
5
5
  style={
6
6
  Array [
7
7
  Object {
8
- "backgroundColor": "#bfc1c5",
8
+ "backgroundColor": "#ccced1",
9
9
  "borderRadius": 999,
10
10
  "marginRight": 8,
11
11
  "width": 8,
@@ -22,7 +22,7 @@ exports[`LeadingStatus renders correctly themeLeadingStausIntent danger 1`] = `
22
22
  style={
23
23
  Array [
24
24
  Object {
25
- "backgroundColor": "#e3602a",
25
+ "backgroundColor": "#f46363",
26
26
  "borderRadius": 999,
27
27
  "marginRight": 8,
28
28
  "width": 8,
@@ -198,7 +198,7 @@ exports[`ListItemContainer renders correctly themeSelected true themeVariant car
198
198
  Array [
199
199
  Object {
200
200
  "alignItems": "center",
201
- "backgroundColor": "#f3e6f6",
201
+ "backgroundColor": "#d9d1df",
202
202
  "borderRadius": 8,
203
203
  "elevation": 10,
204
204
  "flexDirection": "row",
@@ -251,7 +251,7 @@ exports[`ListItemContainer renders correctly themeSelected true themeVariant ful
251
251
  style={
252
252
  Array [
253
253
  Object {
254
- "backgroundColor": "#f3e6f6",
254
+ "backgroundColor": "#d9d1df",
255
255
  "flexDirection": "row",
256
256
  "padding": 16,
257
257
  },
package/src/components/PinInput/__tests__/__snapshots__/PinCell.spec.tsx.snap CHANGED
@@ -43,7 +43,7 @@ exports[`PinCell renders correctly when focused is false, state is disabled 1`]
43
43
  Array [
44
44
  Object {
45
45
  "alignItems": "center",
46
- "borderColor": "#bfc1c5",
46
+ "borderColor": "#4d6265",
47
47
  "borderRadius": 8,
48
48
  "borderWidth": 1,
49
49
  "height": 48,
@@ -60,7 +60,7 @@ exports[`PinCell renders correctly when focused is false, state is disabled 1`]
60
60
  style={
61
61
  Array [
62
62
  Object {
63
- "color": "#bfc1c5",
63
+ "color": "#4d6265",
64
64
  "fontFamily": "BeVietnamPro-SemiBold",
65
65
  "fontSize": 28,
66
66
  },
@@ -80,7 +80,7 @@ exports[`PinCell renders correctly when focused is false, state is error 1`] = `
80
80
  Array [
81
81
  Object {
82
82
  "alignItems": "center",
83
- "borderColor": "#de350b",
83
+ "borderColor": "#f46363",
84
84
  "borderRadius": 8,
85
85
  "borderWidth": 1,
86
86
  "height": 48,
@@ -97,7 +97,7 @@ exports[`PinCell renders correctly when focused is false, state is error 1`] = `
97
97
  style={
98
98
  Array [
99
99
  Object {
100
- "color": "#de350b",
100
+ "color": "#f46363",
101
101
  "fontFamily": "BeVietnamPro-SemiBold",
102
102
  "fontSize": 28,
103
103
  },
@@ -154,7 +154,7 @@ exports[`PinCell renders correctly when focused is true, state is error 1`] = `
154
154
  Array [
155
155
  Object {
156
156
  "alignItems": "center",
157
- "borderColor": "#de350b",
157
+ "borderColor": "#f46363",
158
158
  "borderRadius": 8,
159
159
  "borderWidth": 2,
160
160
  "height": 48,
@@ -171,7 +171,7 @@ exports[`PinCell renders correctly when focused is true, state is error 1`] = `
171
171
  style={
172
172
  Array [
173
173
  Object {
174
- "color": "#de350b",
174
+ "color": "#f46363",
175
175
  "fontFamily": "BeVietnamPro-SemiBold",
176
176
  "fontSize": 28,
177
177
  },
package/src/components/PinInput/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -251,7 +251,7 @@ exports[`rendering renders correctly when disabled 1`] = `
251
251
  Array [
252
252
  Object {
253
253
  "alignItems": "center",
254
- "borderColor": "#bfc1c5",
254
+ "borderColor": "#4d6265",
255
255
  "borderRadius": 8,
256
256
  "borderWidth": 1,
257
257
  "height": 48,
@@ -268,8 +268,8 @@ exports[`rendering renders correctly when disabled 1`] = `
268
268
  style={
269
269
  Array [
270
270
  Object {
271
- "backgroundColor": "#bfc1c5",
272
- "borderColor": "#bfc1c5",
271
+ "backgroundColor": "#4d6265",
272
+ "borderColor": "#4d6265",
273
273
  "borderRadius": 999,
274
274
  "borderWidth": 1,
275
275
  "height": 16,
@@ -297,7 +297,7 @@ exports[`rendering renders correctly when disabled 1`] = `
297
297
  Array [
298
298
  Object {
299
299
  "alignItems": "center",
300
- "borderColor": "#bfc1c5",
300
+ "borderColor": "#4d6265",
301
301
  "borderRadius": 8,
302
302
  "borderWidth": 1,
303
303
  "height": 48,
@@ -314,8 +314,8 @@ exports[`rendering renders correctly when disabled 1`] = `
314
314
  style={
315
315
  Array [
316
316
  Object {
317
- "backgroundColor": "#bfc1c5",
318
- "borderColor": "#bfc1c5",
317
+ "backgroundColor": "#4d6265",
318
+ "borderColor": "#4d6265",
319
319
  "borderRadius": 999,
320
320
  "borderWidth": 1,
321
321
  "height": 16,
@@ -343,7 +343,7 @@ exports[`rendering renders correctly when disabled 1`] = `
343
343
  Array [
344
344
  Object {
345
345
  "alignItems": "center",
346
- "borderColor": "#bfc1c5",
346
+ "borderColor": "#4d6265",
347
347
  "borderRadius": 8,
348
348
  "borderWidth": 1,
349
349
  "height": 48,
@@ -360,7 +360,7 @@ exports[`rendering renders correctly when disabled 1`] = `
360
360
  style={
361
361
  Array [
362
362
  Object {
363
- "borderColor": "#bfc1c5",
363
+ "borderColor": "#4d6265",
364
364
  "borderRadius": 999,
365
365
  "borderWidth": 1,
366
366
  "height": 16,
@@ -388,7 +388,7 @@ exports[`rendering renders correctly when disabled 1`] = `
388
388
  Array [
389
389
  Object {
390
390
  "alignItems": "center",
391
- "borderColor": "#bfc1c5",
391
+ "borderColor": "#4d6265",
392
392
  "borderRadius": 8,
393
393
  "borderWidth": 1,
394
394
  "height": 48,
@@ -405,7 +405,7 @@ exports[`rendering renders correctly when disabled 1`] = `
405
405
  style={
406
406
  Array [
407
407
  Object {
408
- "borderColor": "#bfc1c5",
408
+ "borderColor": "#4d6265",
409
409
  "borderRadius": 999,
410
410
  "borderWidth": 1,
411
411
  "height": 16,
@@ -786,7 +786,7 @@ exports[`rendering renders correctly when there is error 1`] = `
786
786
  Array [
787
787
  Object {
788
788
  "alignItems": "center",
789
- "borderColor": "#de350b",
789
+ "borderColor": "#f46363",
790
790
  "borderRadius": 8,
791
791
  "borderWidth": 1,
792
792
  "height": 48,
@@ -803,8 +803,8 @@ exports[`rendering renders correctly when there is error 1`] = `
803
803
  style={
804
804
  Array [
805
805
  Object {
806
- "backgroundColor": "#de350b",
807
- "borderColor": "#de350b",
806
+ "backgroundColor": "#f46363",
807
+ "borderColor": "#f46363",
808
808
  "borderRadius": 999,
809
809
  "borderWidth": 1,
810
810
  "height": 16,
@@ -832,7 +832,7 @@ exports[`rendering renders correctly when there is error 1`] = `
832
832
  Array [
833
833
  Object {
834
834
  "alignItems": "center",
835
- "borderColor": "#de350b",
835
+ "borderColor": "#f46363",
836
836
  "borderRadius": 8,
837
837
  "borderWidth": 1,
838
838
  "height": 48,
@@ -849,8 +849,8 @@ exports[`rendering renders correctly when there is error 1`] = `
849
849
  style={
850
850
  Array [
851
851
  Object {
852
- "backgroundColor": "#de350b",
853
- "borderColor": "#de350b",
852
+ "backgroundColor": "#f46363",
853
+ "borderColor": "#f46363",
854
854
  "borderRadius": 999,
855
855
  "borderWidth": 1,
856
856
  "height": 16,
@@ -878,7 +878,7 @@ exports[`rendering renders correctly when there is error 1`] = `
878
878
  Array [
879
879
  Object {
880
880
  "alignItems": "center",
881
- "borderColor": "#de350b",
881
+ "borderColor": "#f46363",
882
882
  "borderRadius": 8,
883
883
  "borderWidth": 1,
884
884
  "height": 48,
@@ -895,7 +895,7 @@ exports[`rendering renders correctly when there is error 1`] = `
895
895
  style={
896
896
  Array [
897
897
  Object {
898
- "borderColor": "#de350b",
898
+ "borderColor": "#f46363",
899
899
  "borderRadius": 999,
900
900
  "borderWidth": 1,
901
901
  "height": 16,
@@ -923,7 +923,7 @@ exports[`rendering renders correctly when there is error 1`] = `
923
923
  Array [
924
924
  Object {
925
925
  "alignItems": "center",
926
- "borderColor": "#de350b",
926
+ "borderColor": "#f46363",
927
927
  "borderRadius": 8,
928
928
  "borderWidth": 1,
929
929
  "height": 48,
@@ -940,7 +940,7 @@ exports[`rendering renders correctly when there is error 1`] = `
940
940
  style={
941
941
  Array [
942
942
  Object {
943
- "borderColor": "#de350b",
943
+ "borderColor": "#f46363",
944
944
  "borderRadius": 999,
945
945
  "borderWidth": 1,
946
946
  "height": 16,
@@ -984,7 +984,7 @@ exports[`rendering renders correctly when there is error 1`] = `
984
984
  style={
985
985
  Array [
986
986
  Object {
987
- "color": "#de350b",
987
+ "color": "#f46363",
988
988
  "fontFamily": "BeVietnamPro-Regular",
989
989
  "fontSize": 12,
990
990
  "paddingLeft": 4,
package/src/components/Progress/__tests__/__snapshots__/index.spec.js.snap CHANGED
@@ -22,7 +22,7 @@ exports[`Progress.Bar renders correctly 1`] = `
22
22
  style={
23
23
  Object {
24
24
  "alignSelf": "stretch",
25
- "backgroundColor": "#8505a2",
25
+ "backgroundColor": "#001f23",
26
26
  "borderBottomRightRadius": 999,
27
27
  "borderTopRightRadius": 999,
28
28
  "flex": 1,
@@ -108,7 +108,7 @@ exports[`Progress.Circle renders correctly 1`] = `
108
108
  style={
109
109
  Array [
110
110
  Object {
111
- "backgroundColor": "#8505a2",
111
+ "backgroundColor": "#001f23",
112
112
  "borderRadius": 999,
113
113
  "height": 72,
114
114
  "width": 72,
@@ -200,7 +200,7 @@ exports[`Progress.Circle renders correctly 1`] = `
200
200
  style={
201
201
  Array [
202
202
  Object {
203
- "backgroundColor": "#8505a2",
203
+ "backgroundColor": "#001f23",
204
204
  "borderRadius": 999,
205
205
  "height": 72,
206
206
  "width": 72,
@@ -268,7 +268,7 @@ exports[`Progress.Circle renders correctly 1`] = `
268
268
  style={
269
269
  Array [
270
270
  Object {
271
- "backgroundColor": "#8505a2",
271
+ "backgroundColor": "#001f23",
272
272
  "borderRadius": 999,
273
273
  "height": 5.3999999999999995,
274
274
  "left": 33.3,
@@ -305,7 +305,7 @@ exports[`Progress.Circle renders correctly 1`] = `
305
305
  style={
306
306
  Array [
307
307
  Object {
308
- "backgroundColor": "#8505a2",
308
+ "backgroundColor": "#001f23",
309
309
  "borderRadius": 999,
310
310
  "height": 5.3999999999999995,
311
311
  "left": 33.3,
package/src/components/Radio/__tests__/__snapshots__/Radio.spec.tsx.snap CHANGED
@@ -20,7 +20,8 @@ exports[`rendering renders correctly when checked 1`] = `
20
20
  Array [
21
21
  Object {
22
22
  "alignItems": "center",
23
- "backgroundColor": "#f3e6f6",
23
+ "backgroundColor": "#d9d1df",
24
+ "borderRadius": 4,
24
25
  "flexDirection": "row",
25
26
  "opacity": 1,
26
27
  "padding": 16,
@@ -125,6 +126,7 @@ exports[`rendering renders correctly when not checked 1`] = `
125
126
  Object {
126
127
  "alignItems": "center",
127
128
  "backgroundColor": "#ffffff",
129
+ "borderRadius": 4,
128
130
  "flexDirection": "row",
129
131
  "opacity": 1,
130
132
  "padding": 16,
package/src/components/Radio/__tests__/__snapshots__/RadioGroup.spec.tsx.snap CHANGED
@@ -22,6 +22,7 @@ exports[`rendering renders correctly 1`] = `
22
22
  Object {
23
23
  "alignItems": "center",
24
24
  "backgroundColor": "#ffffff",
25
+ "borderRadius": 4,
25
26
  "flexDirection": "row",
26
27
  "opacity": 1,
27
28
  "padding": 16,
@@ -118,6 +119,7 @@ exports[`rendering renders correctly 1`] = `
118
119
  Object {
119
120
  "alignItems": "center",
120
121
  "backgroundColor": "#ffffff",
122
+ "borderRadius": 4,
121
123
  "flexDirection": "row",
122
124
  "opacity": 1,
123
125
  "padding": 16,
@@ -213,7 +215,8 @@ exports[`rendering renders correctly 1`] = `
213
215
  Array [
214
216
  Object {
215
217
  "alignItems": "center",
216
- "backgroundColor": "#f3e6f6",
218
+ "backgroundColor": "#d9d1df",
219
+ "borderRadius": 4,
217
220
  "flexDirection": "row",
218
221
  "opacity": 1,
219
222
  "padding": 16,
package/src/components/RichTextEditor/RichTextEditor.tsx CHANGED
@@ -20,7 +20,6 @@ import Icon from '../Icon';
20
20
  import {
21
21
  StyledAsteriskLabel,
22
22
  StyledAsteriskLabelInsideTextInput,
23
- StyledBorderBackDrop,
24
23
  StyledContainer,
25
24
  StyledError,
26
25
  StyledErrorAndHelpTextContainer,
@@ -310,9 +309,8 @@ const RichTextEditor: ComponentType<RichTextEditorProps> = ({
310
309
  );
311
310
 
312
311
  return (
313
- <StyledContainer testID={testID}>
312
+ <StyledContainer testID={testID} themeVariant={variant}>
314
313
  <StyledTextInputContainer>
315
- <StyledBorderBackDrop themeVariant={variant} />
316
314
  {(isFocused || (label && !isEmptyValue)) && (
317
315
  <StyledLabelContainer pointerEvents="none">
318
316
  {required && (
package/src/components/RichTextEditor/__tests__/EditorToolbar.spec.tsx CHANGED
@@ -96,7 +96,7 @@ describe('EditorToolbar', () => {
96
96
 
97
97
  fireEvent(wrapper.getByTestId(testID), 'press');
98
98
  expect(wrapper.getByTestId(testID)).toHaveStyle({
99
- backgroundColor: theme.colors.outline,
99
+ backgroundColor: theme.colors.lightHighlightedSurface,
100
100
  });
101
101
  });
102
102
 
package/src/components/RichTextEditor/__tests__/__snapshots__/RichTextEditor.spec.tsx.snap CHANGED
@@ -5,12 +5,16 @@ exports[`RichTextEditor onMessage recevied event editor-layout should update hei
5
5
  style={
6
6
  Array [
7
7
  Object {
8
+ "borderColor": "#f46363",
9
+ "borderRadius": 8,
10
+ "borderWidth": 1,
8
11
  "marginVertical": 8,
9
12
  "width": "100%",
10
13
  },
11
14
  undefined,
12
15
  ]
13
16
  }
17
+ themeVariant="error"
14
18
  >
15
19
  <View
16
20
  style={
@@ -24,24 +28,6 @@ exports[`RichTextEditor onMessage recevied event editor-layout should update hei
24
28
  ]
25
29
  }
26
30
  >
27
- <View
28
- style={
29
- Array [
30
- Object {
31
- "borderColor": "#de350b",
32
- "borderRadius": 8,
33
- "borderWidth": 1,
34
- "bottom": 0,
35
- "left": 0,
36
- "position": "absolute",
37
- "right": 0,
38
- "top": 0,
39
- },
40
- undefined,
41
- ]
42
- }
43
- themeVariant="error"
44
- />
45
31
  <View
46
32
  style={
47
33
  Array [
@@ -239,7 +225,7 @@ exports[`RichTextEditor onMessage recevied event editor-layout should update hei
239
225
  },
240
226
  Array [
241
227
  Object {
242
- "color": "#de350b",
228
+ "color": "#f46363",
243
229
  "fontSize": 12,
244
230
  "marginLeft": 4,
245
231
  },
@@ -265,12 +251,16 @@ exports[`RichTextEditor should render correctly 1`] = `
265
251
  style={
266
252
  Array [
267
253
  Object {
254
+ "borderColor": "#f46363",
255
+ "borderRadius": 8,
256
+ "borderWidth": 1,
268
257
  "marginVertical": 8,
269
258
  "width": "100%",
270
259
  },
271
260
  undefined,
272
261
  ]
273
262
  }
263
+ themeVariant="error"
274
264
  >
275
265
  <View
276
266
  style={
@@ -284,24 +274,6 @@ exports[`RichTextEditor should render correctly 1`] = `
284
274
  ]
285
275
  }
286
276
  >
287
- <View
288
- style={
289
- Array [
290
- Object {
291
- "borderColor": "#de350b",
292
- "borderRadius": 8,
293
- "borderWidth": 1,
294
- "bottom": 0,
295
- "left": 0,
296
- "position": "absolute",
297
- "right": 0,
298
- "top": 0,
299
- },
300
- undefined,
301
- ]
302
- }
303
- themeVariant="error"
304
- />
305
277
  <View
306
278
  style={
307
279
  Array [
@@ -498,7 +470,7 @@ exports[`RichTextEditor should render correctly 1`] = `
498
470
  },
499
471
  Array [
500
472
  Object {
501
- "color": "#de350b",
473
+ "color": "#f46363",
502
474
  "fontSize": 12,
503
475
  "marginLeft": 4,
504
476
  },
package/src/components/SectionHeading/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -58,7 +58,7 @@ exports[`SectionHeading allows to customise the icon 1`] = `
58
58
  style={
59
59
  Array [
60
60
  Object {
61
- "color": "#8505a2",
61
+ "color": "#001f23",
62
62
  "fontFamily": "BeVietnamPro-Regular",
63
63
  "fontSize": 16,
64
64
  "letterSpacing": 0.48,
package/src/components/Select/MultiSelect/__tests__/__snapshots__/Option.spec.tsx.snap CHANGED
@@ -20,7 +20,8 @@ exports[`Option renders correctly 1`] = `
20
20
  Array [
21
21
  Object {
22
22
  "alignItems": "center",
23
- "backgroundColor": "#f3e6f6",
23
+ "backgroundColor": "#d9d1df",
24
+ "borderRadius": 4,
24
25
  "flexDirection": "row",
25
26
  "opacity": 1,
26
27
  "padding": 16,