@hero-design/rn-work-uikit 1.2.3 → 1.3.1

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 (29) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/babel.config.js +6 -0
  3. package/lib/index.js +46464 -1337
  4. package/package.json +8 -5
  5. package/rollup.config.mjs +20 -5
  6. package/src/__tests__/index-export.spec.ts +64 -0
  7. package/src/__tests__/index.spec.tsx +0 -19
  8. package/src/components/DatePicker/__tests__/__snapshots__/index.spec.tsx.snap +1602 -0
  9. package/src/components/DatePicker/__tests__/index.spec.tsx +56 -0
  10. package/src/components/DatePicker/index.tsx +12 -0
  11. package/src/components/Select/__tests__/__snapshots__/index.spec.tsx.snap +1293 -0
  12. package/src/components/Select/__tests__/index.spec.tsx +43 -0
  13. package/src/components/Select/index.tsx +23 -0
  14. package/src/components/TextInput/Group/__tests__/__snapshots__/index.spec.tsx.snap +0 -6
  15. package/src/components/TextInput/PrefixComponent.tsx +4 -4
  16. package/src/components/TextInput/StyledTextInput.tsx +6 -3
  17. package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap +130 -34
  18. package/src/components/TimePicker/__tests__/index.spec.tsx +34 -0
  19. package/src/components/TimePicker/index.tsx +12 -0
  20. package/src/hero-editor.d.ts +8 -0
  21. package/src/index.ts +4 -1
  22. package/src/utils/functions.ts +2 -0
  23. package/stats/1.3.0/rn-work-uikit-stats.html +4842 -0
  24. package/stats/1.3.1/rn-work-uikit-stats.html +4844 -0
  25. package/tsconfig.json +9 -3
  26. package/tsconfig.rollup.json +8 -2
  27. package/src/__tests__/__snapshots__/index.spec.tsx.snap +0 -172
  28. package/src/__tests__/theme-export-override.spec.ts +0 -96
  29. package/stats/1.2.3/rn-work-uikit-stats.html +0 -4842
@@ -0,0 +1,43 @@
1
+ import React from 'react';
2
+ import Select from '..';
3
+ import renderWithTheme from '../../../../testUtils/renderWithTheme';
4
+ import { noop } from '../../../utils/functions';
5
+
6
+ const options = [
7
+ { text: 'Monday', value: 'mon' },
8
+ { text: 'Tuesday', value: 'tue' },
9
+ { text: 'Wednesday', value: 'wed' },
10
+ { text: 'Thursday', value: 'thu' },
11
+ { text: 'Friday', value: 'fri' },
12
+ { text: 'Saturday', value: 'sat' },
13
+ { text: 'Sunday', value: 'sun', disabled: true },
14
+ ];
15
+
16
+ describe('Select', () => {
17
+ it('renders correctly (snapshot)', () => {
18
+ const { toJSON } = renderWithTheme(
19
+ <Select
20
+ value="mon"
21
+ onConfirm={noop}
22
+ options={options}
23
+ label="Select Label"
24
+ />
25
+ );
26
+ expect(toJSON()).toMatchSnapshot();
27
+ });
28
+ });
29
+
30
+ describe('MultiSelect', () => {
31
+ it('renders correctly (snapshot)', () => {
32
+ const { toJSON } = renderWithTheme(
33
+ <Select.Multi
34
+ value={['tue', 'wed']}
35
+ onConfirm={noop}
36
+ options={options}
37
+ label="Select Label"
38
+ footerLabel="Confirm"
39
+ />
40
+ );
41
+ expect(toJSON()).toMatchSnapshot();
42
+ });
43
+ });
@@ -0,0 +1,23 @@
1
+ import React from 'react';
2
+ import {
3
+ Select as InternalSelect,
4
+ MultiSelectProps,
5
+ SingleSelectProps,
6
+ SelectOptionType,
7
+ } from '@hero-design/rn';
8
+ import TextInput from '../TextInput';
9
+
10
+ function Select<V, T extends SelectOptionType<V> = SelectOptionType<V>>(
11
+ props: SingleSelectProps<V, T>
12
+ ) {
13
+ return <InternalSelect {...props} TextInputComponent={TextInput} />;
14
+ }
15
+
16
+ Select.Multi = function <
17
+ V,
18
+ T extends SelectOptionType<V> = SelectOptionType<V>
19
+ >(props: MultiSelectProps<V, T>) {
20
+ return <InternalSelect.Multi {...props} TextInputComponent={TextInput} />;
21
+ };
22
+
23
+ export default Select;
@@ -91,7 +91,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
91
91
  {
92
92
  "alignItems": "center",
93
93
  "backgroundColor": "transparent",
94
- "flex": 1,
95
94
  "flexDirection": "row",
96
95
  },
97
96
  ],
@@ -174,7 +173,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
174
173
  "flexDirection": "row",
175
174
  "flexGrow": 2,
176
175
  "flexShrink": 1,
177
- "gap": 3.9230769230769234,
178
176
  "opacity": 1,
179
177
  },
180
178
  ],
@@ -345,7 +343,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
345
343
  {
346
344
  "alignItems": "center",
347
345
  "backgroundColor": "transparent",
348
- "flex": 1,
349
346
  "flexDirection": "row",
350
347
  },
351
348
  ],
@@ -457,7 +454,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
457
454
  "flexDirection": "row",
458
455
  "flexGrow": 2,
459
456
  "flexShrink": 1,
460
- "gap": 3.9230769230769234,
461
457
  "opacity": 1,
462
458
  },
463
459
  ],
@@ -708,7 +704,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
708
704
  {
709
705
  "alignItems": "center",
710
706
  "backgroundColor": "transparent",
711
- "flex": 1,
712
707
  "flexDirection": "row",
713
708
  },
714
709
  ],
@@ -791,7 +786,6 @@ exports[`TextInputGroup should render: xxx 1`] = `
791
786
  "flexDirection": "row",
792
787
  "flexGrow": 2,
793
788
  "flexShrink": 1,
794
- "gap": 3.9230769230769234,
795
789
  "opacity": 1,
796
790
  },
797
791
  ],
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { Icon, IconName } from '@hero-design/rn';
3
3
  import { View, ViewProps } from 'react-native';
4
- import type { State } from './StyledTextInput';
4
+ import { StyledPrefixComponentWrapper, type State } from './StyledTextInput';
5
5
 
6
6
  export interface PrefixComponentProps extends ViewProps {
7
7
  /** Current input state for styling decisions */
@@ -46,9 +46,9 @@ const PrefixComponent: React.FC<PrefixComponentProps> = ({
46
46
  }) => {
47
47
  const actualPrefix = typeof prefix === 'string' ? prefix : '';
48
48
 
49
- if (typeof prefix === 'string' && actualPrefix) {
49
+ if (actualPrefix) {
50
50
  return (
51
- <View testID="input-prefix" {...rest}>
51
+ <StyledPrefixComponentWrapper testID="input-prefix" {...rest}>
52
52
  <Icon
53
53
  intent={state === 'disabled' ? 'disabled-text' : 'text'}
54
54
  icon={actualPrefix}
@@ -57,7 +57,7 @@ const PrefixComponent: React.FC<PrefixComponentProps> = ({
57
57
  accessibilityLabel={`Prefix icon: ${actualPrefix}`}
58
58
  accessibilityRole="image"
59
59
  />
60
- </View>
60
+ </StyledPrefixComponentWrapper>
61
61
  );
62
62
  }
63
63
 
@@ -42,7 +42,6 @@ const StyledFloatingLabelContainer = styled(Animated.View)<{
42
42
  themeVariant: Variant;
43
43
  }>(({ themeVariant }) => ({
44
44
  flexDirection: 'row',
45
- flex: 1,
46
45
  alignItems: themeVariant === 'text' ? 'center' : 'flex-start',
47
46
  backgroundColor: 'transparent',
48
47
  }));
@@ -115,16 +114,19 @@ const StyledInputWrapper = styled(View)(({ theme }) => ({
115
114
  }));
116
115
 
117
116
  const StyledInputRow = styled(Pressable)<{ themeOpacity: number }>(
118
- ({ theme, themeOpacity }) => ({
117
+ ({ themeOpacity }) => ({
119
118
  flexDirection: 'row',
120
119
  alignItems: 'center',
121
120
  flexGrow: 2,
122
121
  flexShrink: 1,
123
- gap: theme.__hd__.textInput.space.prefixAndInputContainerGap,
124
122
  opacity: themeOpacity,
125
123
  })
126
124
  );
127
125
 
126
+ const StyledPrefixComponentWrapper = styled(View)(({ theme }) => ({
127
+ marginRight: theme.__hd__.textInput.space.prefixAndInputContainerGap,
128
+ }));
129
+
128
130
  const StyledErrorAndHelpTextContainer = styled(View)(({ theme }) => ({
129
131
  paddingHorizontal:
130
132
  theme.__hd__.textInput.space.errorAndHelpTextContainerHorizontalPadding,
@@ -159,4 +161,5 @@ export {
159
161
  StyledBottomContainer,
160
162
  StyledSuffixContainer,
161
163
  StyledLabel,
164
+ StyledPrefixComponentWrapper,
162
165
  };
@@ -75,7 +75,6 @@ exports[`TextInput when user applies custom styling should respect user-provided
75
75
  {
76
76
  "alignItems": "center",
77
77
  "backgroundColor": "transparent",
78
- "flex": 1,
79
78
  "flexDirection": "row",
80
79
  },
81
80
  ],
@@ -158,7 +157,6 @@ exports[`TextInput when user applies custom styling should respect user-provided
158
157
  "flexDirection": "row",
159
158
  "flexGrow": 2,
160
159
  "flexShrink": 1,
161
- "gap": 3.9230769230769234,
162
160
  "opacity": 1,
163
161
  },
164
162
  ],
@@ -169,6 +167,16 @@ exports[`TextInput when user applies custom styling should respect user-provided
169
167
  >
170
168
  <View>
171
169
  <View
170
+ style={
171
+ [
172
+ [
173
+ {
174
+ "marginRight": 3.9230769230769234,
175
+ },
176
+ ],
177
+ undefined,
178
+ ]
179
+ }
172
180
  testID="input-prefix"
173
181
  >
174
182
  <Text
@@ -423,7 +431,6 @@ exports[`TextInput when user chooses textarea variant should provide multiline t
423
431
  {
424
432
  "alignItems": "flex-start",
425
433
  "backgroundColor": "transparent",
426
- "flex": 1,
427
434
  "flexDirection": "row",
428
435
  },
429
436
  ],
@@ -535,7 +542,6 @@ exports[`TextInput when user chooses textarea variant should provide multiline t
535
542
  "flexDirection": "row",
536
543
  "flexGrow": 2,
537
544
  "flexShrink": 1,
538
- "gap": 3.9230769230769234,
539
545
  "opacity": 1,
540
546
  },
541
547
  ],
@@ -704,7 +710,6 @@ exports[`TextInput when user encounters a disabled field should display content
704
710
  {
705
711
  "alignItems": "center",
706
712
  "backgroundColor": "transparent",
707
- "flex": 1,
708
713
  "flexDirection": "row",
709
714
  },
710
715
  ],
@@ -816,7 +821,6 @@ exports[`TextInput when user encounters a disabled field should display content
816
821
  "flexDirection": "row",
817
822
  "flexGrow": 2,
818
823
  "flexShrink": 1,
819
- "gap": 3.9230769230769234,
820
824
  "opacity": 1,
821
825
  },
822
826
  ],
@@ -984,7 +988,6 @@ exports[`TextInput when user encounters a read-only field should display content
984
988
  {
985
989
  "alignItems": "center",
986
990
  "backgroundColor": "transparent",
987
- "flex": 1,
988
991
  "flexDirection": "row",
989
992
  },
990
993
  ],
@@ -1096,7 +1099,6 @@ exports[`TextInput when user encounters a read-only field should display content
1096
1099
  "flexDirection": "row",
1097
1100
  "flexGrow": 2,
1098
1101
  "flexShrink": 1,
1099
- "gap": 3.9230769230769234,
1100
1102
  "opacity": 1,
1101
1103
  },
1102
1104
  ],
@@ -1107,6 +1109,16 @@ exports[`TextInput when user encounters a read-only field should display content
1107
1109
  >
1108
1110
  <View>
1109
1111
  <View
1112
+ style={
1113
+ [
1114
+ [
1115
+ {
1116
+ "marginRight": 3.9230769230769234,
1117
+ },
1118
+ ],
1119
+ undefined,
1120
+ ]
1121
+ }
1110
1122
  testID="input-prefix"
1111
1123
  >
1112
1124
  <Text
@@ -1338,7 +1350,6 @@ exports[`TextInput when user has entered text should show the input content and
1338
1350
  {
1339
1351
  "alignItems": "center",
1340
1352
  "backgroundColor": "transparent",
1341
- "flex": 1,
1342
1353
  "flexDirection": "row",
1343
1354
  },
1344
1355
  ],
@@ -1450,7 +1461,6 @@ exports[`TextInput when user has entered text should show the input content and
1450
1461
  "flexDirection": "row",
1451
1462
  "flexGrow": 2,
1452
1463
  "flexShrink": 1,
1453
- "gap": 3.9230769230769234,
1454
1464
  "opacity": 1,
1455
1465
  },
1456
1466
  ],
@@ -1461,6 +1471,16 @@ exports[`TextInput when user has entered text should show the input content and
1461
1471
  >
1462
1472
  <View>
1463
1473
  <View
1474
+ style={
1475
+ [
1476
+ [
1477
+ {
1478
+ "marginRight": 3.9230769230769234,
1479
+ },
1480
+ ],
1481
+ undefined,
1482
+ ]
1483
+ }
1464
1484
  testID="input-prefix"
1465
1485
  >
1466
1486
  <Text
@@ -1692,7 +1712,6 @@ exports[`TextInput when user interacts with placeholder text starting from empty
1692
1712
  {
1693
1713
  "alignItems": "center",
1694
1714
  "backgroundColor": "transparent",
1695
- "flex": 1,
1696
1715
  "flexDirection": "row",
1697
1716
  },
1698
1717
  ],
@@ -1775,7 +1794,6 @@ exports[`TextInput when user interacts with placeholder text starting from empty
1775
1794
  "flexDirection": "row",
1776
1795
  "flexGrow": 2,
1777
1796
  "flexShrink": 1,
1778
- "gap": 3.9230769230769234,
1779
1797
  "opacity": 0,
1780
1798
  },
1781
1799
  ],
@@ -1786,6 +1804,16 @@ exports[`TextInput when user interacts with placeholder text starting from empty
1786
1804
  >
1787
1805
  <View>
1788
1806
  <View
1807
+ style={
1808
+ [
1809
+ [
1810
+ {
1811
+ "marginRight": 3.9230769230769234,
1812
+ },
1813
+ ],
1814
+ undefined,
1815
+ ]
1816
+ }
1789
1817
  testID="input-prefix"
1790
1818
  >
1791
1819
  <Text
@@ -2003,7 +2031,6 @@ exports[`TextInput when user needs programmatic control should provide ref metho
2003
2031
  {
2004
2032
  "alignItems": "center",
2005
2033
  "backgroundColor": "transparent",
2006
- "flex": 1,
2007
2034
  "flexDirection": "row",
2008
2035
  },
2009
2036
  ],
@@ -2115,7 +2142,6 @@ exports[`TextInput when user needs programmatic control should provide ref metho
2115
2142
  "flexDirection": "row",
2116
2143
  "flexGrow": 2,
2117
2144
  "flexShrink": 1,
2118
- "gap": 3.9230769230769234,
2119
2145
  "opacity": 1,
2120
2146
  },
2121
2147
  ],
@@ -2283,7 +2309,6 @@ exports[`TextInput when user provides default values starting with pre-filled co
2283
2309
  {
2284
2310
  "alignItems": "center",
2285
2311
  "backgroundColor": "transparent",
2286
- "flex": 1,
2287
2312
  "flexDirection": "row",
2288
2313
  },
2289
2314
  ],
@@ -2366,7 +2391,6 @@ exports[`TextInput when user provides default values starting with pre-filled co
2366
2391
  "flexDirection": "row",
2367
2392
  "flexGrow": 2,
2368
2393
  "flexShrink": 1,
2369
- "gap": 3.9230769230769234,
2370
2394
  "opacity": 1,
2371
2395
  },
2372
2396
  ],
@@ -2377,6 +2401,16 @@ exports[`TextInput when user provides default values starting with pre-filled co
2377
2401
  >
2378
2402
  <View>
2379
2403
  <View
2404
+ style={
2405
+ [
2406
+ [
2407
+ {
2408
+ "marginRight": 3.9230769230769234,
2409
+ },
2410
+ ],
2411
+ undefined,
2412
+ ]
2413
+ }
2380
2414
  testID="input-prefix"
2381
2415
  >
2382
2416
  <Text
@@ -2630,7 +2664,6 @@ exports[`TextInput when user provides default values when both default and contr
2630
2664
  {
2631
2665
  "alignItems": "center",
2632
2666
  "backgroundColor": "transparent",
2633
- "flex": 1,
2634
2667
  "flexDirection": "row",
2635
2668
  },
2636
2669
  ],
@@ -2713,7 +2746,6 @@ exports[`TextInput when user provides default values when both default and contr
2713
2746
  "flexDirection": "row",
2714
2747
  "flexGrow": 2,
2715
2748
  "flexShrink": 1,
2716
- "gap": 3.9230769230769234,
2717
2749
  "opacity": 1,
2718
2750
  },
2719
2751
  ],
@@ -2724,6 +2756,16 @@ exports[`TextInput when user provides default values when both default and contr
2724
2756
  >
2725
2757
  <View>
2726
2758
  <View
2759
+ style={
2760
+ [
2761
+ [
2762
+ {
2763
+ "marginRight": 3.9230769230769234,
2764
+ },
2765
+ ],
2766
+ undefined,
2767
+ ]
2768
+ }
2727
2769
  testID="input-prefix"
2728
2770
  >
2729
2771
  <Text
@@ -2978,7 +3020,6 @@ exports[`TextInput when user sees a loading state should show loading indicator
2978
3020
  {
2979
3021
  "alignItems": "center",
2980
3022
  "backgroundColor": "transparent",
2981
- "flex": 1,
2982
3023
  "flexDirection": "row",
2983
3024
  },
2984
3025
  ],
@@ -3090,7 +3131,6 @@ exports[`TextInput when user sees a loading state should show loading indicator
3090
3131
  "flexDirection": "row",
3091
3132
  "flexGrow": 2,
3092
3133
  "flexShrink": 1,
3093
- "gap": 3.9230769230769234,
3094
3134
  "opacity": 1,
3095
3135
  },
3096
3136
  ],
@@ -3101,6 +3141,16 @@ exports[`TextInput when user sees a loading state should show loading indicator
3101
3141
  >
3102
3142
  <View>
3103
3143
  <View
3144
+ style={
3145
+ [
3146
+ [
3147
+ {
3148
+ "marginRight": 3.9230769230769234,
3149
+ },
3150
+ ],
3151
+ undefined,
3152
+ ]
3153
+ }
3104
3154
  testID="input-prefix"
3105
3155
  >
3106
3156
  <Text
@@ -3351,7 +3401,6 @@ exports[`TextInput when user sees a required field should indicate the field is
3351
3401
  {
3352
3402
  "alignItems": "center",
3353
3403
  "backgroundColor": "transparent",
3354
- "flex": 1,
3355
3404
  "flexDirection": "row",
3356
3405
  },
3357
3406
  ],
@@ -3434,7 +3483,6 @@ exports[`TextInput when user sees a required field should indicate the field is
3434
3483
  "flexDirection": "row",
3435
3484
  "flexGrow": 2,
3436
3485
  "flexShrink": 1,
3437
- "gap": 3.9230769230769234,
3438
3486
  "opacity": 0,
3439
3487
  },
3440
3488
  ],
@@ -3445,6 +3493,16 @@ exports[`TextInput when user sees a required field should indicate the field is
3445
3493
  >
3446
3494
  <View>
3447
3495
  <View
3496
+ style={
3497
+ [
3498
+ [
3499
+ {
3500
+ "marginRight": 3.9230769230769234,
3501
+ },
3502
+ ],
3503
+ undefined,
3504
+ ]
3505
+ }
3448
3506
  testID="input-prefix"
3449
3507
  >
3450
3508
  <Text
@@ -3675,7 +3733,6 @@ exports[`TextInput when user sees a textarea with character count should display
3675
3733
  {
3676
3734
  "alignItems": "flex-start",
3677
3735
  "backgroundColor": "transparent",
3678
- "flex": 1,
3679
3736
  "flexDirection": "row",
3680
3737
  },
3681
3738
  ],
@@ -3787,7 +3844,6 @@ exports[`TextInput when user sees a textarea with character count should display
3787
3844
  "flexDirection": "row",
3788
3845
  "flexGrow": 2,
3789
3846
  "flexShrink": 1,
3790
- "gap": 3.9230769230769234,
3791
3847
  "opacity": 1,
3792
3848
  },
3793
3849
  ],
@@ -3798,6 +3854,16 @@ exports[`TextInput when user sees a textarea with character count should display
3798
3854
  >
3799
3855
  <View>
3800
3856
  <View
3857
+ style={
3858
+ [
3859
+ [
3860
+ {
3861
+ "marginRight": 3.9230769230769234,
3862
+ },
3863
+ ],
3864
+ undefined,
3865
+ ]
3866
+ }
3801
3867
  testID="input-prefix"
3802
3868
  >
3803
3869
  <Text
@@ -4066,7 +4132,6 @@ exports[`TextInput when user sees a textarea with character count should hide ch
4066
4132
  {
4067
4133
  "alignItems": "flex-start",
4068
4134
  "backgroundColor": "transparent",
4069
- "flex": 1,
4070
4135
  "flexDirection": "row",
4071
4136
  },
4072
4137
  ],
@@ -4178,7 +4243,6 @@ exports[`TextInput when user sees a textarea with character count should hide ch
4178
4243
  "flexDirection": "row",
4179
4244
  "flexGrow": 2,
4180
4245
  "flexShrink": 1,
4181
- "gap": 3.9230769230769234,
4182
4246
  "opacity": 1,
4183
4247
  },
4184
4248
  ],
@@ -4189,6 +4253,16 @@ exports[`TextInput when user sees a textarea with character count should hide ch
4189
4253
  >
4190
4254
  <View>
4191
4255
  <View
4256
+ style={
4257
+ [
4258
+ [
4259
+ {
4260
+ "marginRight": 3.9230769230769234,
4261
+ },
4262
+ ],
4263
+ undefined,
4264
+ ]
4265
+ }
4192
4266
  testID="input-prefix"
4193
4267
  >
4194
4268
  <Text
@@ -4424,7 +4498,6 @@ exports[`TextInput when user sees an empty input field should display label and
4424
4498
  {
4425
4499
  "alignItems": "center",
4426
4500
  "backgroundColor": "transparent",
4427
- "flex": 1,
4428
4501
  "flexDirection": "row",
4429
4502
  },
4430
4503
  ],
@@ -4536,7 +4609,6 @@ exports[`TextInput when user sees an empty input field should display label and
4536
4609
  "flexDirection": "row",
4537
4610
  "flexGrow": 2,
4538
4611
  "flexShrink": 1,
4539
- "gap": 3.9230769230769234,
4540
4612
  "opacity": 0,
4541
4613
  },
4542
4614
  ],
@@ -4547,6 +4619,16 @@ exports[`TextInput when user sees an empty input field should display label and
4547
4619
  >
4548
4620
  <View>
4549
4621
  <View
4622
+ style={
4623
+ [
4624
+ [
4625
+ {
4626
+ "marginRight": 3.9230769230769234,
4627
+ },
4628
+ ],
4629
+ undefined,
4630
+ ]
4631
+ }
4550
4632
  testID="input-prefix"
4551
4633
  >
4552
4634
  <Text
@@ -4777,7 +4859,6 @@ exports[`TextInput when user sees an error state should display error message to
4777
4859
  {
4778
4860
  "alignItems": "center",
4779
4861
  "backgroundColor": "transparent",
4780
- "flex": 1,
4781
4862
  "flexDirection": "row",
4782
4863
  },
4783
4864
  ],
@@ -4860,7 +4941,6 @@ exports[`TextInput when user sees an error state should display error message to
4860
4941
  "flexDirection": "row",
4861
4942
  "flexGrow": 2,
4862
4943
  "flexShrink": 1,
4863
- "gap": 3.9230769230769234,
4864
4944
  "opacity": 0,
4865
4945
  },
4866
4946
  ],
@@ -4871,6 +4951,16 @@ exports[`TextInput when user sees an error state should display error message to
4871
4951
  >
4872
4952
  <View>
4873
4953
  <View
4954
+ style={
4955
+ [
4956
+ [
4957
+ {
4958
+ "marginRight": 3.9230769230769234,
4959
+ },
4960
+ ],
4961
+ undefined,
4962
+ ]
4963
+ }
4874
4964
  testID="input-prefix"
4875
4965
  >
4876
4966
  <Text
@@ -5146,7 +5236,6 @@ exports[`TextInput when user sees helper text should display guidance text to as
5146
5236
  {
5147
5237
  "alignItems": "center",
5148
5238
  "backgroundColor": "transparent",
5149
- "flex": 1,
5150
5239
  "flexDirection": "row",
5151
5240
  },
5152
5241
  ],
@@ -5229,7 +5318,6 @@ exports[`TextInput when user sees helper text should display guidance text to as
5229
5318
  "flexDirection": "row",
5230
5319
  "flexGrow": 2,
5231
5320
  "flexShrink": 1,
5232
- "gap": 3.9230769230769234,
5233
5321
  "opacity": 0,
5234
5322
  },
5235
5323
  ],
@@ -5240,6 +5328,16 @@ exports[`TextInput when user sees helper text should display guidance text to as
5240
5328
  >
5241
5329
  <View>
5242
5330
  <View
5331
+ style={
5332
+ [
5333
+ [
5334
+ {
5335
+ "marginRight": 3.9230769230769234,
5336
+ },
5337
+ ],
5338
+ undefined,
5339
+ ]
5340
+ }
5243
5341
  testID="input-prefix"
5244
5342
  >
5245
5343
  <Text
@@ -5457,7 +5555,6 @@ exports[`TextInput when user sees input with custom prefix and suffix elements s
5457
5555
  {
5458
5556
  "alignItems": "center",
5459
5557
  "backgroundColor": "transparent",
5460
- "flex": 1,
5461
5558
  "flexDirection": "row",
5462
5559
  },
5463
5560
  ],
@@ -5540,7 +5637,6 @@ exports[`TextInput when user sees input with custom prefix and suffix elements s
5540
5637
  "flexDirection": "row",
5541
5638
  "flexGrow": 2,
5542
5639
  "flexShrink": 1,
5543
- "gap": 3.9230769230769234,
5544
5640
  "opacity": 0,
5545
5641
  },
5546
5642
  ],
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { Platform } from 'react-native';
3
+ import TimePicker from '..';
4
+ import renderWithTheme from '../../../../testUtils/renderWithTheme';
5
+
6
+ describe('TimePicker', () => {
7
+ it('renders TimePickerIOS when OS is iOS', () => {
8
+ Platform.OS = 'ios';
9
+ const { getByTestId } = renderWithTheme(
10
+ <TimePicker
11
+ label="Start time"
12
+ value={new Date('December 17, 1995 03:24:00')}
13
+ confirmLabel="Confirm"
14
+ onChange={jest.fn()}
15
+ />
16
+ );
17
+
18
+ expect(getByTestId('timePickerInputIOS')).toBeDefined();
19
+ });
20
+
21
+ it('renders TimePickerAndroid when OS is android', () => {
22
+ Platform.OS = 'android';
23
+ const { getByTestId } = renderWithTheme(
24
+ <TimePicker
25
+ label="Start time"
26
+ value={new Date('December 17, 1995 03:24:00')}
27
+ confirmLabel="Confirm"
28
+ onChange={jest.fn()}
29
+ />
30
+ );
31
+
32
+ expect(getByTestId('timePickerInputAndroid')).toBeDefined();
33
+ });
34
+ });