@hero-design/rn 8.25.0 → 8.25.2

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 (30) hide show
  1. package/.turbo/turbo-build.log +9 -9
  2. package/es/index.js +67 -61
  3. package/lib/index.js +65 -59
  4. package/package.json +5 -5
  5. package/src/components/Collapse/index.tsx +11 -10
  6. package/src/components/DatePicker/__tests__/__snapshots__/DatePicker.spec.tsx.snap +21 -15
  7. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerAndroid.spec.tsx.snap +7 -5
  8. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerCalendar.spec.tsx.snap +7 -5
  9. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap +7 -5
  10. package/src/components/FAB/ActionGroup/__tests__/__snapshots__/index.spec.tsx.snap +152 -180
  11. package/src/components/FAB/FAB.tsx +15 -20
  12. package/src/components/FAB/StyledFAB.tsx +5 -10
  13. package/src/components/FAB/__tests__/StyledFAB.spec.tsx +4 -4
  14. package/src/components/FAB/__tests__/__snapshots__/StyledFAB.spec.tsx.snap +28 -13
  15. package/src/components/FAB/__tests__/__snapshots__/index.spec.tsx.snap +170 -212
  16. package/src/components/PinInput/index.tsx +119 -88
  17. package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +28 -20
  18. package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap +28 -20
  19. package/src/components/TextInput/StyledTextInput.tsx +4 -0
  20. package/src/components/TextInput/__tests__/__snapshots__/StyledTextInput.spec.tsx.snap +21 -1
  21. package/src/components/TextInput/__tests__/__snapshots__/index.spec.tsx.snap +112 -78
  22. package/src/components/TextInput/index.tsx +1 -4
  23. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerAndroid.spec.tsx.snap +14 -10
  24. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap +14 -10
  25. package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +5 -1
  26. package/src/theme/components/textInput.ts +16 -2
  27. package/types/components/Collapse/index.d.ts +1 -1
  28. package/types/components/FAB/StyledFAB.d.ts +1 -5
  29. package/types/components/PinInput/index.d.ts +12 -1
  30. package/types/theme/components/textInput.d.ts +4 -0
package/src/components/PinInput/index.tsx CHANGED
@@ -1,4 +1,11 @@
1
- import React, { useCallback, useEffect, useRef, useState } from 'react';
1
+ import React, {
2
+ forwardRef,
3
+ useCallback,
4
+ useEffect,
5
+ useImperativeHandle,
6
+ useRef,
7
+ useState,
8
+ } from 'react';
2
9
  import { InteractionManager, TextInput } from 'react-native';
3
10
  import type { StyleProp, ViewStyle } from 'react-native';
4
11
  import Icon from '../Icon';
@@ -73,98 +80,122 @@ export function getState({
73
80
  return 'default';
74
81
  }
75
82
 
76
- function PinInput({
77
- value = '',
78
- onChangeText,
79
- onFulfill,
80
- length = 4,
81
- disabled = false,
82
- secure = true,
83
- autoFocus = false,
84
- error,
85
- style,
86
- testID,
87
- }: PinInputProps) {
88
- const inputRef = useRef<TextInput>(null);
89
- const [focused, setFocused] = useState(autoFocus);
90
- const state = getState({ disabled, error });
83
+ export interface PinInputHandler {
84
+ /**
85
+ * focus into input
86
+ */
87
+ focus: () => void;
88
+ /**
89
+ * blur text input
90
+ */
91
+ blur: () => void;
92
+ }
91
93
 
92
- const focus = useCallback(() => {
93
- if (inputRef?.current) {
94
- inputRef.current.focus();
95
- setFocused(true);
96
- }
97
- }, []);
94
+ const PinInput = forwardRef<PinInputHandler, PinInputProps>(
95
+ (
96
+ {
97
+ value = '',
98
+ onChangeText,
99
+ onFulfill,
100
+ length = 4,
101
+ disabled = false,
102
+ secure = true,
103
+ autoFocus = false,
104
+ error,
105
+ style,
106
+ testID,
107
+ },
108
+ ref
109
+ ) => {
110
+ const inputRef = useRef<TextInput>(null);
111
+ const [focused, setFocused] = useState(autoFocus);
112
+ const state = getState({ disabled, error });
98
113
 
99
- const blur = useCallback(() => {
100
- if (inputRef?.current) {
101
- inputRef.current.blur();
102
- setFocused(false);
103
- }
104
- }, []);
114
+ const focus = useCallback(() => {
115
+ if (inputRef?.current) {
116
+ inputRef.current.focus();
117
+ setFocused(true);
118
+ }
119
+ }, []);
105
120
 
106
- const changeText = useCallback((text: string) => {
107
- const pin = (text.match(/[0-9]/g) || []).join('');
108
- if (onChangeText) {
109
- onChangeText(pin);
110
- }
111
- if (pin.length === length && onFulfill) {
112
- onFulfill(pin);
113
- }
114
- }, []);
121
+ const blur = useCallback(() => {
122
+ if (inputRef?.current) {
123
+ inputRef.current.blur();
124
+ setFocused(false);
125
+ }
126
+ }, []);
115
127
 
116
- useEffect(() => {
117
- // Must run after animations for keyboard to automatically open
118
- if (autoFocus) {
119
- InteractionManager.runAfterInteractions(focus);
120
- }
121
- }, [inputRef]);
128
+ const changeText = useCallback(
129
+ (text: string) => {
130
+ const pin = (text.match(/[0-9]/g) || []).join('');
122
131
 
123
- return (
124
- <StyledWrapper style={style} testID={testID}>
125
- <StyledPinWrapper>
126
- {[...Array(length).keys()].map((index) => (
127
- <React.Fragment key={index}>
128
- {index !== 0 && <StyledSpacer />}
129
- <PinCell
130
- value={value.charAt(index)}
131
- secure={secure}
132
- focused={focused && index === value.length}
133
- state={state}
132
+ onChangeText?.(pin);
133
+
134
+ if (pin.length === length) {
135
+ onFulfill?.(pin);
136
+ }
137
+ },
138
+ [length, onChangeText, onFulfill]
139
+ );
140
+
141
+ useEffect(() => {
142
+ // Must run after animations for keyboard to automatically open
143
+ if (autoFocus) {
144
+ InteractionManager.runAfterInteractions(focus);
145
+ }
146
+ }, [inputRef]);
147
+
148
+ useImperativeHandle(ref, () => ({
149
+ focus,
150
+ blur,
151
+ }));
152
+
153
+ return (
154
+ <StyledWrapper style={style} testID={testID}>
155
+ <StyledPinWrapper>
156
+ {[...Array(length).keys()].map((index) => (
157
+ <React.Fragment key={index}>
158
+ {index !== 0 && <StyledSpacer />}
159
+ <PinCell
160
+ value={value.charAt(index)}
161
+ secure={secure}
162
+ focused={focused && index === value.length}
163
+ state={state}
164
+ />
165
+ </React.Fragment>
166
+ ))}
167
+ </StyledPinWrapper>
168
+ {state === 'error' && (
169
+ <StyledErrorContainer>
170
+ <Icon
171
+ icon="circle-info"
172
+ size="xsmall"
173
+ intent="danger"
174
+ testID="pin-error-icon"
134
175
  />
135
- </React.Fragment>
136
- ))}
137
- </StyledPinWrapper>
138
- {state === 'error' && (
139
- <StyledErrorContainer>
140
- <Icon
141
- icon="circle-info"
142
- size="xsmall"
143
- intent="danger"
144
- testID="pin-error-icon"
145
- />
146
- <StyledErrorMessage>{error}</StyledErrorMessage>
147
- </StyledErrorContainer>
148
- )}
149
- <StyledHiddenInput
150
- themePinLength={length}
151
- ref={inputRef}
152
- value={value}
153
- onChangeText={changeText}
154
- secureTextEntry={secure}
155
- editable={!disabled}
156
- autoFocus={autoFocus}
157
- onFocus={focus}
158
- onBlur={blur}
159
- maxLength={length}
160
- keyboardType="numeric"
161
- contextMenuHidden
162
- caretHidden
163
- pointerEvents="box-only"
164
- testID="pin-hidden-input"
165
- />
166
- </StyledWrapper>
167
- );
168
- }
176
+ <StyledErrorMessage>{error}</StyledErrorMessage>
177
+ </StyledErrorContainer>
178
+ )}
179
+ <StyledHiddenInput
180
+ themePinLength={length}
181
+ ref={inputRef}
182
+ value={value}
183
+ onChangeText={changeText}
184
+ secureTextEntry={secure}
185
+ editable={!disabled}
186
+ autoFocus={autoFocus}
187
+ onFocus={focus}
188
+ onBlur={blur}
189
+ maxLength={length}
190
+ keyboardType="numeric"
191
+ contextMenuHidden
192
+ caretHidden
193
+ pointerEvents="box-only"
194
+ testID="pin-hidden-input"
195
+ />
196
+ </StyledWrapper>
197
+ );
198
+ }
199
+ );
169
200
 
170
201
  export default PinInput;
package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1486,7 +1486,7 @@ Array [
1486
1486
  "left": 16,
1487
1487
  "paddingHorizontal": 4,
1488
1488
  "position": "absolute",
1489
- "top": -10,
1489
+ "top": -5,
1490
1490
  "zIndex": 1,
1491
1491
  },
1492
1492
  Object {
@@ -1503,13 +1503,15 @@ Array [
1503
1503
  Object {
1504
1504
  "color": "#001f23",
1505
1505
  "fontFamily": "BeVietnamPro-Regular",
1506
- "fontSize": 12,
1507
- "letterSpacing": 0.36,
1508
- "lineHeight": 20,
1506
+ "fontSize": 14,
1507
+ "letterSpacing": 0.42,
1508
+ "lineHeight": 22,
1509
1509
  },
1510
1510
  Array [
1511
1511
  Object {
1512
1512
  "color": "#001f23",
1513
+ "fontSize": 12,
1514
+ "lineHeight": 12,
1513
1515
  },
1514
1516
  Object {
1515
1517
  "backgroundColor": "#ffffff",
@@ -1518,7 +1520,7 @@ Array [
1518
1520
  ]
1519
1521
  }
1520
1522
  testID="input-label"
1521
- themeFontSize="small"
1523
+ themeFontSize="medium"
1522
1524
  themeFontWeight="regular"
1523
1525
  themeIntent="body"
1524
1526
  themeState="filled"
@@ -1717,7 +1719,7 @@ Array [
1717
1719
  "left": 16,
1718
1720
  "paddingHorizontal": 4,
1719
1721
  "position": "absolute",
1720
- "top": -10,
1722
+ "top": -5,
1721
1723
  "zIndex": 1,
1722
1724
  },
1723
1725
  Object {
@@ -1734,13 +1736,15 @@ Array [
1734
1736
  Object {
1735
1737
  "color": "#001f23",
1736
1738
  "fontFamily": "BeVietnamPro-Regular",
1737
- "fontSize": 12,
1738
- "letterSpacing": 0.36,
1739
- "lineHeight": 20,
1739
+ "fontSize": 14,
1740
+ "letterSpacing": 0.42,
1741
+ "lineHeight": 22,
1740
1742
  },
1741
1743
  Array [
1742
1744
  Object {
1743
1745
  "color": "#001f23",
1746
+ "fontSize": 12,
1747
+ "lineHeight": 12,
1744
1748
  },
1745
1749
  Object {
1746
1750
  "backgroundColor": "#ffffff",
@@ -1749,7 +1753,7 @@ Array [
1749
1753
  ]
1750
1754
  }
1751
1755
  testID="input-label"
1752
- themeFontSize="small"
1756
+ themeFontSize="medium"
1753
1757
  themeFontWeight="regular"
1754
1758
  themeIntent="body"
1755
1759
  themeState="filled"
@@ -3295,7 +3299,7 @@ Array [
3295
3299
  "left": 16,
3296
3300
  "paddingHorizontal": 4,
3297
3301
  "position": "absolute",
3298
- "top": -10,
3302
+ "top": -5,
3299
3303
  "zIndex": 1,
3300
3304
  },
3301
3305
  Object {
@@ -3312,13 +3316,15 @@ Array [
3312
3316
  Object {
3313
3317
  "color": "#001f23",
3314
3318
  "fontFamily": "BeVietnamPro-Regular",
3315
- "fontSize": 12,
3316
- "letterSpacing": 0.36,
3317
- "lineHeight": 20,
3319
+ "fontSize": 14,
3320
+ "letterSpacing": 0.42,
3321
+ "lineHeight": 22,
3318
3322
  },
3319
3323
  Array [
3320
3324
  Object {
3321
3325
  "color": "#808f91",
3326
+ "fontSize": 12,
3327
+ "lineHeight": 12,
3322
3328
  },
3323
3329
  Object {
3324
3330
  "backgroundColor": "#ffffff",
@@ -3327,7 +3333,7 @@ Array [
3327
3333
  ]
3328
3334
  }
3329
3335
  testID="input-label"
3330
- themeFontSize="small"
3336
+ themeFontSize="medium"
3331
3337
  themeFontWeight="regular"
3332
3338
  themeIntent="body"
3333
3339
  themeState="readonly"
@@ -3539,7 +3545,7 @@ Array [
3539
3545
  "left": 16,
3540
3546
  "paddingHorizontal": 4,
3541
3547
  "position": "absolute",
3542
- "top": -10,
3548
+ "top": -5,
3543
3549
  "zIndex": 1,
3544
3550
  },
3545
3551
  Object {
@@ -3556,13 +3562,15 @@ Array [
3556
3562
  Object {
3557
3563
  "color": "#001f23",
3558
3564
  "fontFamily": "BeVietnamPro-Regular",
3559
- "fontSize": 12,
3560
- "letterSpacing": 0.36,
3561
- "lineHeight": 20,
3565
+ "fontSize": 14,
3566
+ "letterSpacing": 0.42,
3567
+ "lineHeight": 22,
3562
3568
  },
3563
3569
  Array [
3564
3570
  Object {
3565
3571
  "color": "#001f23",
3572
+ "fontSize": 12,
3573
+ "lineHeight": 12,
3566
3574
  },
3567
3575
  Object {
3568
3576
  "backgroundColor": "#ffffff",
@@ -3571,7 +3579,7 @@ Array [
3571
3579
  ]
3572
3580
  }
3573
3581
  testID="input-label"
3574
- themeFontSize="small"
3582
+ themeFontSize="medium"
3575
3583
  themeFontWeight="regular"
3576
3584
  themeIntent="body"
3577
3585
  themeState="filled"
package/src/components/Select/SingleSelect/__tests__/__snapshots__/index.spec.tsx.snap CHANGED
@@ -1408,7 +1408,7 @@ Array [
1408
1408
  "left": 16,
1409
1409
  "paddingHorizontal": 4,
1410
1410
  "position": "absolute",
1411
- "top": -10,
1411
+ "top": -5,
1412
1412
  "zIndex": 1,
1413
1413
  },
1414
1414
  Object {
@@ -1425,13 +1425,15 @@ Array [
1425
1425
  Object {
1426
1426
  "color": "#001f23",
1427
1427
  "fontFamily": "BeVietnamPro-Regular",
1428
- "fontSize": 12,
1429
- "letterSpacing": 0.36,
1430
- "lineHeight": 20,
1428
+ "fontSize": 14,
1429
+ "letterSpacing": 0.42,
1430
+ "lineHeight": 22,
1431
1431
  },
1432
1432
  Array [
1433
1433
  Object {
1434
1434
  "color": "#001f23",
1435
+ "fontSize": 12,
1436
+ "lineHeight": 12,
1435
1437
  },
1436
1438
  Object {
1437
1439
  "backgroundColor": "#ffffff",
@@ -1440,7 +1442,7 @@ Array [
1440
1442
  ]
1441
1443
  }
1442
1444
  testID="input-label"
1443
- themeFontSize="small"
1445
+ themeFontSize="medium"
1444
1446
  themeFontWeight="regular"
1445
1447
  themeIntent="body"
1446
1448
  themeState="filled"
@@ -1639,7 +1641,7 @@ Array [
1639
1641
  "left": 16,
1640
1642
  "paddingHorizontal": 4,
1641
1643
  "position": "absolute",
1642
- "top": -10,
1644
+ "top": -5,
1643
1645
  "zIndex": 1,
1644
1646
  },
1645
1647
  Object {
@@ -1656,13 +1658,15 @@ Array [
1656
1658
  Object {
1657
1659
  "color": "#001f23",
1658
1660
  "fontFamily": "BeVietnamPro-Regular",
1659
- "fontSize": 12,
1660
- "letterSpacing": 0.36,
1661
- "lineHeight": 20,
1661
+ "fontSize": 14,
1662
+ "letterSpacing": 0.42,
1663
+ "lineHeight": 22,
1662
1664
  },
1663
1665
  Array [
1664
1666
  Object {
1665
1667
  "color": "#001f23",
1668
+ "fontSize": 12,
1669
+ "lineHeight": 12,
1666
1670
  },
1667
1671
  Object {
1668
1672
  "backgroundColor": "#ffffff",
@@ -1671,7 +1675,7 @@ Array [
1671
1675
  ]
1672
1676
  }
1673
1677
  testID="input-label"
1674
- themeFontSize="small"
1678
+ themeFontSize="medium"
1675
1679
  themeFontWeight="regular"
1676
1680
  themeIntent="body"
1677
1681
  themeState="filled"
@@ -3086,7 +3090,7 @@ Array [
3086
3090
  "left": 16,
3087
3091
  "paddingHorizontal": 4,
3088
3092
  "position": "absolute",
3089
- "top": -10,
3093
+ "top": -5,
3090
3094
  "zIndex": 1,
3091
3095
  },
3092
3096
  Object {
@@ -3103,13 +3107,15 @@ Array [
3103
3107
  Object {
3104
3108
  "color": "#001f23",
3105
3109
  "fontFamily": "BeVietnamPro-Regular",
3106
- "fontSize": 12,
3107
- "letterSpacing": 0.36,
3108
- "lineHeight": 20,
3110
+ "fontSize": 14,
3111
+ "letterSpacing": 0.42,
3112
+ "lineHeight": 22,
3109
3113
  },
3110
3114
  Array [
3111
3115
  Object {
3112
3116
  "color": "#808f91",
3117
+ "fontSize": 12,
3118
+ "lineHeight": 12,
3113
3119
  },
3114
3120
  Object {
3115
3121
  "backgroundColor": "#ffffff",
@@ -3118,7 +3124,7 @@ Array [
3118
3124
  ]
3119
3125
  }
3120
3126
  testID="input-label"
3121
- themeFontSize="small"
3127
+ themeFontSize="medium"
3122
3128
  themeFontWeight="regular"
3123
3129
  themeIntent="body"
3124
3130
  themeState="readonly"
@@ -3330,7 +3336,7 @@ Array [
3330
3336
  "left": 16,
3331
3337
  "paddingHorizontal": 4,
3332
3338
  "position": "absolute",
3333
- "top": -10,
3339
+ "top": -5,
3334
3340
  "zIndex": 1,
3335
3341
  },
3336
3342
  Object {
@@ -3347,13 +3353,15 @@ Array [
3347
3353
  Object {
3348
3354
  "color": "#001f23",
3349
3355
  "fontFamily": "BeVietnamPro-Regular",
3350
- "fontSize": 12,
3351
- "letterSpacing": 0.36,
3352
- "lineHeight": 20,
3356
+ "fontSize": 14,
3357
+ "letterSpacing": 0.42,
3358
+ "lineHeight": 22,
3353
3359
  },
3354
3360
  Array [
3355
3361
  Object {
3356
3362
  "color": "#001f23",
3363
+ "fontSize": 12,
3364
+ "lineHeight": 12,
3357
3365
  },
3358
3366
  Object {
3359
3367
  "backgroundColor": "#ffffff",
@@ -3362,7 +3370,7 @@ Array [
3362
3370
  ]
3363
3371
  }
3364
3372
  testID="input-label"
3365
- themeFontSize="small"
3373
+ themeFontSize="medium"
3366
3374
  themeFontWeight="regular"
3367
3375
  themeIntent="body"
3368
3376
  themeState="filled"
package/src/components/TextInput/StyledTextInput.tsx CHANGED
@@ -23,12 +23,16 @@ const StyledLabel = styled(Typography.Text)<{
23
23
  themeState: State;
24
24
  }>(({ theme, themeState }) => ({
25
25
  color: theme.__hd__.textInput.colors.labels[themeState],
26
+ fontSize: theme.__hd__.textInput.fontSizes.topLabel,
27
+ lineHeight: theme.__hd__.textInput.lineHeights.topLabel,
26
28
  }));
27
29
 
28
30
  const StyledAsteriskLabel = styled(Typography.Text)<{
29
31
  themeState: State;
30
32
  }>(({ theme, themeState }) => ({
31
33
  color: theme.__hd__.textInput.colors.asterisks[themeState],
34
+ fontSize: theme.__hd__.textInput.fontSizes.topLabel,
35
+ lineHeight: theme.__hd__.textInput.lineHeights.topLabel,
32
36
  }));
33
37
 
34
38
  const StyledLabelContainerInsideTextInput = styled(View)<{
package/src/components/TextInput/__tests__/__snapshots__/StyledTextInput.spec.tsx.snap CHANGED
@@ -15,6 +15,8 @@ exports[`Label renders correctly with themeState default 1`] = `
15
15
  Array [
16
16
  Object {
17
17
  "color": "#001f23",
18
+ "fontSize": 12,
19
+ "lineHeight": 12,
18
20
  },
19
21
  undefined,
20
22
  ],
@@ -45,6 +47,8 @@ exports[`Label renders correctly with themeState disabled 1`] = `
45
47
  Array [
46
48
  Object {
47
49
  "color": "#bfc1c5",
50
+ "fontSize": 12,
51
+ "lineHeight": 12,
48
52
  },
49
53
  undefined,
50
54
  ],
@@ -75,6 +79,8 @@ exports[`Label renders correctly with themeState error 1`] = `
75
79
  Array [
76
80
  Object {
77
81
  "color": "#001f23",
82
+ "fontSize": 12,
83
+ "lineHeight": 12,
78
84
  },
79
85
  undefined,
80
86
  ],
@@ -105,6 +111,8 @@ exports[`Label renders correctly with themeState filled 1`] = `
105
111
  Array [
106
112
  Object {
107
113
  "color": "#001f23",
114
+ "fontSize": 12,
115
+ "lineHeight": 12,
108
116
  },
109
117
  undefined,
110
118
  ],
@@ -135,6 +143,8 @@ exports[`Label renders correctly with themeState readonly 1`] = `
135
143
  Array [
136
144
  Object {
137
145
  "color": "#808f91",
146
+ "fontSize": 12,
147
+ "lineHeight": 12,
138
148
  },
139
149
  undefined,
140
150
  ],
@@ -160,7 +170,7 @@ exports[`LabelContainer renders correctly 1`] = `
160
170
  "left": 16,
161
171
  "paddingHorizontal": 4,
162
172
  "position": "absolute",
163
- "top": -10,
173
+ "top": -5,
164
174
  "zIndex": 1,
165
175
  },
166
176
  undefined,
@@ -359,6 +369,8 @@ exports[`StyledAsteriskLabel renders correctly with themeState default 1`] = `
359
369
  Array [
360
370
  Object {
361
371
  "color": "#de350b",
372
+ "fontSize": 12,
373
+ "lineHeight": 12,
362
374
  },
363
375
  undefined,
364
376
  ],
@@ -389,6 +401,8 @@ exports[`StyledAsteriskLabel renders correctly with themeState disabled 1`] = `
389
401
  Array [
390
402
  Object {
391
403
  "color": "#bfc1c5",
404
+ "fontSize": 12,
405
+ "lineHeight": 12,
392
406
  },
393
407
  undefined,
394
408
  ],
@@ -419,6 +433,8 @@ exports[`StyledAsteriskLabel renders correctly with themeState error 1`] = `
419
433
  Array [
420
434
  Object {
421
435
  "color": "#de350b",
436
+ "fontSize": 12,
437
+ "lineHeight": 12,
422
438
  },
423
439
  undefined,
424
440
  ],
@@ -449,6 +465,8 @@ exports[`StyledAsteriskLabel renders correctly with themeState filled 1`] = `
449
465
  Array [
450
466
  Object {
451
467
  "color": "#de350b",
468
+ "fontSize": 12,
469
+ "lineHeight": 12,
452
470
  },
453
471
  undefined,
454
472
  ],
@@ -479,6 +497,8 @@ exports[`StyledAsteriskLabel renders correctly with themeState readonly 1`] = `
479
497
  Array [
480
498
  Object {
481
499
  "color": "#808f91",
500
+ "fontSize": 12,
501
+ "lineHeight": 12,
482
502
  },
483
503
  undefined,
484
504
  ],