@hero-design/rn 8.87.1 → 8.88.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 (32) hide show
  1. package/.turbo/turbo-build.log +2 -2
  2. package/CHANGELOG.md +18 -0
  3. package/es/index.js +119 -59
  4. package/lib/index.js +119 -59
  5. package/package.json +2 -2
  6. package/src/components/AppCue/StyledAppCue.tsx +27 -1
  7. package/src/components/AppCue/__tests__/StyledAppCue.tsx +4 -0
  8. package/src/components/AppCue/__tests__/__snapshots__/StyledAppCue.tsx.snap +194 -0
  9. package/src/components/AppCue/__tests__/__snapshots__/index.spec.tsx.snap +260 -0
  10. package/src/components/AppCue/__tests__/index.spec.tsx +4 -0
  11. package/src/components/AppCue/__tests__/utils.spec.ts +57 -4
  12. package/src/components/AppCue/index.tsx +7 -4
  13. package/src/components/AppCue/utils.ts +60 -9
  14. package/src/components/DatePicker/__tests__/__snapshots__/DatePicker.spec.tsx.snap +18 -15
  15. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerAndroid.spec.tsx.snap +6 -5
  16. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerCalendar.spec.tsx.snap +6 -5
  17. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap +12 -10
  18. package/src/components/Empty/__tests__/__snapshots__/index.spec.tsx.snap +12 -12
  19. package/src/components/Empty/index.tsx +1 -1
  20. package/src/components/RichTextEditor/__tests__/__snapshots__/RichTextEditor.spec.tsx.snap +8 -0
  21. package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +42 -35
  22. package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +36 -30
  23. package/src/components/TextInput/StyledTextInput.tsx +4 -0
  24. package/src/components/TextInput/__tests__/__snapshots__/StyledTextInput.spec.tsx.snap +20 -0
  25. package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap +446 -432
  26. package/src/components/TextInput/index.tsx +13 -32
  27. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerAndroid.spec.tsx.snap +12 -10
  28. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap +12 -10
  29. package/stats/8.87.2/rn-stats.html +4844 -0
  30. package/stats/8.88.0/rn-stats.html +4844 -0
  31. package/types/components/AppCue/StyledAppCue.d.ts +1 -1
  32. package/types/components/AppCue/utils.d.ts +6 -3
package/src/components/DatePicker/__tests__/__snapshots__/DatePickerCalendar.spec.tsx.snap CHANGED
@@ -98,9 +98,7 @@ exports[`DatePickerCalendar renders correctly 1`] = `
98
98
  themeFocused={false}
99
99
  themeState="filled"
100
100
  />
101
- <View
102
- onLayout={[Function]}
103
- />
101
+ <View />
104
102
  <View
105
103
  collapsable={false}
106
104
  pointerEvents="none"
@@ -118,7 +116,7 @@ exports[`DatePickerCalendar renders correctly 1`] = `
118
116
  "translateY": 0,
119
117
  },
120
118
  {
121
- "translateX": 24,
119
+ "translateX": 16,
122
120
  },
123
121
  {
124
122
  "scale": 1,
@@ -131,7 +129,6 @@ exports[`DatePickerCalendar renders correctly 1`] = `
131
129
  >
132
130
  <Text
133
131
  allowFontScaling={false}
134
- onLayout={[Function]}
135
132
  style={
136
133
  [
137
134
  {
@@ -146,8 +143,12 @@ exports[`DatePickerCalendar renders correctly 1`] = `
146
143
  "alignContent": "center",
147
144
  "alignItems": "center",
148
145
  "color": "#001f23",
146
+ "left": 0,
149
147
  "marginTop": -2,
148
+ "position": "absolute",
150
149
  "textAlignVertical": "center",
150
+ "top": "50%",
151
+ "zIndex": 1,
151
152
  },
152
153
  {
153
154
  "backgroundColor": "#ffffff",
package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap CHANGED
@@ -98,9 +98,7 @@ exports[`DatePickerIOS renders correctly 1`] = `
98
98
  themeFocused={false}
99
99
  themeState="filled"
100
100
  />
101
- <View
102
- onLayout={[Function]}
103
- />
101
+ <View />
104
102
  <View
105
103
  collapsable={false}
106
104
  pointerEvents="none"
@@ -118,7 +116,7 @@ exports[`DatePickerIOS renders correctly 1`] = `
118
116
  "translateY": 0,
119
117
  },
120
118
  {
121
- "translateX": 24,
119
+ "translateX": 16,
122
120
  },
123
121
  {
124
122
  "scale": 1,
@@ -131,7 +129,6 @@ exports[`DatePickerIOS renders correctly 1`] = `
131
129
  >
132
130
  <Text
133
131
  allowFontScaling={false}
134
- onLayout={[Function]}
135
132
  style={
136
133
  [
137
134
  {
@@ -146,8 +143,12 @@ exports[`DatePickerIOS renders correctly 1`] = `
146
143
  "alignContent": "center",
147
144
  "alignItems": "center",
148
145
  "color": "#001f23",
146
+ "left": 0,
149
147
  "marginTop": -2,
148
+ "position": "absolute",
150
149
  "textAlignVertical": "center",
150
+ "top": "50%",
151
+ "zIndex": 1,
151
152
  },
152
153
  {
153
154
  "backgroundColor": "#ffffff",
@@ -766,9 +767,7 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
766
767
  themeFocused={false}
767
768
  themeState="filled"
768
769
  />
769
- <View
770
- onLayout={[Function]}
771
- />
770
+ <View />
772
771
  <View
773
772
  collapsable={false}
774
773
  pointerEvents="none"
@@ -786,7 +785,7 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
786
785
  "translateY": 0,
787
786
  },
788
787
  {
789
- "translateX": 24,
788
+ "translateX": 16,
790
789
  },
791
790
  {
792
791
  "scale": 1,
@@ -799,7 +798,6 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
799
798
  >
800
799
  <Text
801
800
  allowFontScaling={false}
802
- onLayout={[Function]}
803
801
  style={
804
802
  [
805
803
  {
@@ -814,8 +812,12 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
814
812
  "alignContent": "center",
815
813
  "alignItems": "center",
816
814
  "color": "#001f23",
815
+ "left": 0,
817
816
  "marginTop": -2,
817
+ "position": "absolute",
818
818
  "textAlignVertical": "center",
819
+ "top": "50%",
820
+ "zIndex": 1,
819
821
  },
820
822
  {
821
823
  "backgroundColor": "#ffffff",
package/src/components/Empty/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -57,10 +57,10 @@ exports[`Empty renders empty state content correctly 1`] = `
57
57
  [
58
58
  {
59
59
  "color": "#001f23",
60
- "fontFamily": "Saiga-Regular",
61
- "fontSize": 18,
62
- "letterSpacing": 0.54,
63
- "lineHeight": 26,
60
+ "fontFamily": "BeVietnamPro-Regular",
61
+ "fontSize": 14,
62
+ "letterSpacing": 0.48,
63
+ "lineHeight": 22,
64
64
  },
65
65
  [
66
66
  {
@@ -72,8 +72,8 @@ exports[`Empty renders empty state content correctly 1`] = `
72
72
  ]
73
73
  }
74
74
  themeIntent="body"
75
- themeTypeface="playful"
76
- themeVariant="regular"
75
+ themeTypeface="neutral"
76
+ themeVariant="small"
77
77
  >
78
78
  We'll notify you later.
79
79
  </Text>
@@ -173,10 +173,10 @@ exports[`Empty renders empty state with image correctly 1`] = `
173
173
  [
174
174
  {
175
175
  "color": "#001f23",
176
- "fontFamily": "Saiga-Regular",
177
- "fontSize": 18,
178
- "letterSpacing": 0.54,
179
- "lineHeight": 26,
176
+ "fontFamily": "BeVietnamPro-Regular",
177
+ "fontSize": 14,
178
+ "letterSpacing": 0.48,
179
+ "lineHeight": 22,
180
180
  },
181
181
  [
182
182
  {
@@ -188,8 +188,8 @@ exports[`Empty renders empty state with image correctly 1`] = `
188
188
  ]
189
189
  }
190
190
  themeIntent="body"
191
- themeTypeface="playful"
192
- themeVariant="regular"
191
+ themeTypeface="neutral"
192
+ themeVariant="small"
193
193
  >
194
194
  We'll notify you later.
195
195
  </Text>
package/src/components/Empty/index.tsx CHANGED
@@ -62,7 +62,7 @@ const Empty = ({
62
62
  {title}
63
63
  </StyledTitle>
64
64
  {!!description && (
65
- <StyledDescription themeVariant={variant} typeface="playful">
65
+ <StyledDescription variant="small" themeVariant={variant}>
66
66
  {description}
67
67
  </StyledDescription>
68
68
  )}
package/src/components/RichTextEditor/__tests__/__snapshots__/RichTextEditor.spec.tsx.snap CHANGED
@@ -65,8 +65,12 @@ exports[`RichTextEditor onMessage recevied event editor-layout should update hei
65
65
  "alignContent": "center",
66
66
  "alignItems": "center",
67
67
  "color": "#001f23",
68
+ "left": 0,
68
69
  "marginTop": -2,
70
+ "position": "absolute",
69
71
  "textAlignVertical": "center",
72
+ "top": "50%",
73
+ "zIndex": 1,
70
74
  },
71
75
  {
72
76
  "backgroundColor": "#ffffff",
@@ -384,8 +388,12 @@ exports[`RichTextEditor should render correctly 1`] = `
384
388
  "alignContent": "center",
385
389
  "alignItems": "center",
386
390
  "color": "#001f23",
391
+ "left": 0,
387
392
  "marginTop": -2,
393
+ "position": "absolute",
388
394
  "textAlignVertical": "center",
395
+ "top": "50%",
396
+ "zIndex": 1,
389
397
  },
390
398
  {
391
399
  "backgroundColor": "#ffffff",
package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -100,9 +100,7 @@ exports[`rendering allows custom renderer 1`] = `
100
100
  themeFocused={false}
101
101
  themeState="default"
102
102
  />
103
- <View
104
- onLayout={[Function]}
105
- />
103
+ <View />
106
104
  <View
107
105
  collapsable={false}
108
106
  pointerEvents="none"
@@ -120,7 +118,7 @@ exports[`rendering allows custom renderer 1`] = `
120
118
  "translateY": 0,
121
119
  },
122
120
  {
123
- "translateX": 24,
121
+ "translateX": 16,
124
122
  },
125
123
  {
126
124
  "scale": 1,
@@ -133,7 +131,6 @@ exports[`rendering allows custom renderer 1`] = `
133
131
  >
134
132
  <Text
135
133
  allowFontScaling={false}
136
- onLayout={[Function]}
137
134
  style={
138
135
  [
139
136
  {
@@ -148,8 +145,12 @@ exports[`rendering allows custom renderer 1`] = `
148
145
  "alignContent": "center",
149
146
  "alignItems": "center",
150
147
  "color": "#001f23",
148
+ "left": 0,
151
149
  "marginTop": -2,
150
+ "position": "absolute",
152
151
  "textAlignVertical": "center",
152
+ "top": "50%",
153
+ "zIndex": 1,
153
154
  },
154
155
  {
155
156
  "backgroundColor": "#ffffff",
@@ -1638,9 +1639,7 @@ exports[`rendering renders correct floating bottom sheet variant 1`] = `
1638
1639
  themeFocused={false}
1639
1640
  themeState="filled"
1640
1641
  />
1641
- <View
1642
- onLayout={[Function]}
1643
- />
1642
+ <View />
1644
1643
  <View
1645
1644
  collapsable={false}
1646
1645
  pointerEvents="none"
@@ -1658,7 +1657,7 @@ exports[`rendering renders correct floating bottom sheet variant 1`] = `
1658
1657
  "translateY": 0,
1659
1658
  },
1660
1659
  {
1661
- "translateX": 24,
1660
+ "translateX": 16,
1662
1661
  },
1663
1662
  {
1664
1663
  "scale": 1,
@@ -1671,7 +1670,6 @@ exports[`rendering renders correct floating bottom sheet variant 1`] = `
1671
1670
  >
1672
1671
  <Text
1673
1672
  allowFontScaling={false}
1674
- onLayout={[Function]}
1675
1673
  style={
1676
1674
  [
1677
1675
  {
@@ -1686,8 +1684,12 @@ exports[`rendering renders correct floating bottom sheet variant 1`] = `
1686
1684
  "alignContent": "center",
1687
1685
  "alignItems": "center",
1688
1686
  "color": "#001f23",
1687
+ "left": 0,
1689
1688
  "marginTop": -2,
1689
+ "position": "absolute",
1690
1690
  "textAlignVertical": "center",
1691
+ "top": "50%",
1692
+ "zIndex": 1,
1691
1693
  },
1692
1694
  {
1693
1695
  "backgroundColor": "#ffffff",
@@ -3368,9 +3370,7 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
3368
3370
  themeFocused={false}
3369
3371
  themeState="filled"
3370
3372
  />
3371
- <View
3372
- onLayout={[Function]}
3373
- />
3373
+ <View />
3374
3374
  <View
3375
3375
  collapsable={false}
3376
3376
  pointerEvents="none"
@@ -3388,7 +3388,7 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
3388
3388
  "translateY": 0,
3389
3389
  },
3390
3390
  {
3391
- "translateX": 24,
3391
+ "translateX": 16,
3392
3392
  },
3393
3393
  {
3394
3394
  "scale": 1,
@@ -3401,7 +3401,6 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
3401
3401
  >
3402
3402
  <Text
3403
3403
  allowFontScaling={false}
3404
- onLayout={[Function]}
3405
3404
  style={
3406
3405
  [
3407
3406
  {
@@ -3416,8 +3415,12 @@ exports[`rendering renders correctly when bottom sheet is NOT visible 1`] = `
3416
3415
  "alignContent": "center",
3417
3416
  "alignItems": "center",
3418
3417
  "color": "#001f23",
3418
+ "left": 0,
3419
3419
  "marginTop": -2,
3420
+ "position": "absolute",
3420
3421
  "textAlignVertical": "center",
3422
+ "top": "50%",
3423
+ "zIndex": 1,
3421
3424
  },
3422
3425
  {
3423
3426
  "backgroundColor": "#ffffff",
@@ -3654,9 +3657,7 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
3654
3657
  themeFocused={false}
3655
3658
  themeState="filled"
3656
3659
  />
3657
- <View
3658
- onLayout={[Function]}
3659
- />
3660
+ <View />
3660
3661
  <View
3661
3662
  collapsable={false}
3662
3663
  pointerEvents="none"
@@ -3674,7 +3675,7 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
3674
3675
  "translateY": 0,
3675
3676
  },
3676
3677
  {
3677
- "translateX": 24,
3678
+ "translateX": 16,
3678
3679
  },
3679
3680
  {
3680
3681
  "scale": 1,
@@ -3687,7 +3688,6 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
3687
3688
  >
3688
3689
  <Text
3689
3690
  allowFontScaling={false}
3690
- onLayout={[Function]}
3691
3691
  style={
3692
3692
  [
3693
3693
  {
@@ -3702,8 +3702,12 @@ exports[`rendering renders correctly when bottom sheet is visible 1`] = `
3702
3702
  "alignContent": "center",
3703
3703
  "alignItems": "center",
3704
3704
  "color": "#001f23",
3705
+ "left": 0,
3705
3706
  "marginTop": -2,
3707
+ "position": "absolute",
3706
3708
  "textAlignVertical": "center",
3709
+ "top": "50%",
3710
+ "zIndex": 1,
3707
3711
  },
3708
3712
  {
3709
3713
  "backgroundColor": "#ffffff",
@@ -5398,9 +5402,7 @@ exports[`rendering renders correctly when input is loading 1`] = `
5398
5402
  themeFocused={false}
5399
5403
  themeState="readonly"
5400
5404
  />
5401
- <View
5402
- onLayout={[Function]}
5403
- />
5405
+ <View />
5404
5406
  <View
5405
5407
  collapsable={false}
5406
5408
  pointerEvents="none"
@@ -5418,7 +5420,7 @@ exports[`rendering renders correctly when input is loading 1`] = `
5418
5420
  "translateY": 0,
5419
5421
  },
5420
5422
  {
5421
- "translateX": 24,
5423
+ "translateX": 16,
5422
5424
  },
5423
5425
  {
5424
5426
  "scale": 1,
@@ -5431,7 +5433,6 @@ exports[`rendering renders correctly when input is loading 1`] = `
5431
5433
  >
5432
5434
  <Text
5433
5435
  allowFontScaling={false}
5434
- onLayout={[Function]}
5435
5436
  style={
5436
5437
  [
5437
5438
  {
@@ -5446,8 +5447,12 @@ exports[`rendering renders correctly when input is loading 1`] = `
5446
5447
  "alignContent": "center",
5447
5448
  "alignItems": "center",
5448
5449
  "color": "#808f91",
5450
+ "left": 0,
5449
5451
  "marginTop": -2,
5452
+ "position": "absolute",
5450
5453
  "textAlignVertical": "center",
5454
+ "top": "50%",
5455
+ "zIndex": 1,
5451
5456
  },
5452
5457
  {
5453
5458
  "backgroundColor": "#ffffff",
@@ -5697,9 +5702,7 @@ exports[`rendering renders correctly when receives sections 1`] = `
5697
5702
  themeFocused={false}
5698
5703
  themeState="filled"
5699
5704
  />
5700
- <View
5701
- onLayout={[Function]}
5702
- />
5705
+ <View />
5703
5706
  <View
5704
5707
  collapsable={false}
5705
5708
  pointerEvents="none"
@@ -5717,7 +5720,7 @@ exports[`rendering renders correctly when receives sections 1`] = `
5717
5720
  "translateY": 0,
5718
5721
  },
5719
5722
  {
5720
- "translateX": 24,
5723
+ "translateX": 16,
5721
5724
  },
5722
5725
  {
5723
5726
  "scale": 1,
@@ -5730,7 +5733,6 @@ exports[`rendering renders correctly when receives sections 1`] = `
5730
5733
  >
5731
5734
  <Text
5732
5735
  allowFontScaling={false}
5733
- onLayout={[Function]}
5734
5736
  style={
5735
5737
  [
5736
5738
  {
@@ -5745,8 +5747,12 @@ exports[`rendering renders correctly when receives sections 1`] = `
5745
5747
  "alignContent": "center",
5746
5748
  "alignItems": "center",
5747
5749
  "color": "#001f23",
5750
+ "left": 0,
5748
5751
  "marginTop": -2,
5752
+ "position": "absolute",
5749
5753
  "textAlignVertical": "center",
5754
+ "top": "50%",
5755
+ "zIndex": 1,
5750
5756
  },
5751
5757
  {
5752
5758
  "backgroundColor": "#ffffff",
@@ -7021,9 +7027,7 @@ exports[`rendering renders correctly when receives sections 2`] = `
7021
7027
  themeFocused={false}
7022
7028
  themeState="filled"
7023
7029
  />
7024
- <View
7025
- onLayout={[Function]}
7026
- />
7030
+ <View />
7027
7031
  <View
7028
7032
  collapsable={false}
7029
7033
  pointerEvents="none"
@@ -7041,7 +7045,7 @@ exports[`rendering renders correctly when receives sections 2`] = `
7041
7045
  "translateY": 0,
7042
7046
  },
7043
7047
  {
7044
- "translateX": 24,
7048
+ "translateX": 16,
7045
7049
  },
7046
7050
  {
7047
7051
  "scale": 1,
@@ -7054,7 +7058,6 @@ exports[`rendering renders correctly when receives sections 2`] = `
7054
7058
  >
7055
7059
  <Text
7056
7060
  allowFontScaling={false}
7057
- onLayout={[Function]}
7058
7061
  style={
7059
7062
  [
7060
7063
  {
@@ -7069,8 +7072,12 @@ exports[`rendering renders correctly when receives sections 2`] = `
7069
7072
  "alignContent": "center",
7070
7073
  "alignItems": "center",
7071
7074
  "color": "#001f23",
7075
+ "left": 0,
7072
7076
  "marginTop": -2,
7077
+ "position": "absolute",
7073
7078
  "textAlignVertical": "center",
7079
+ "top": "50%",
7080
+ "zIndex": 1,
7074
7081
  },
7075
7082
  {
7076
7083
  "backgroundColor": "#ffffff",