@thecb/components 11.1.15-beta.3 → 11.1.15-beta.4
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.
- package/dist/index.cjs.js +13 -7
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +13 -7
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/form-layouts/FormInput.js +11 -2
- package/src/components/molecules/partial-amount-form/PartialAmountField.js +18 -10
package/package.json
CHANGED
|
@@ -98,6 +98,7 @@ const FormattedInputField = styled(({ showErrors, themeValues, ...props }) => (
|
|
|
98
98
|
`;
|
|
99
99
|
|
|
100
100
|
const FormInput = ({
|
|
101
|
+
ariaLabelledBy = undefined,
|
|
101
102
|
type = "text",
|
|
102
103
|
labelDisplayOverride = null,
|
|
103
104
|
labelTextWhenNoError = "",
|
|
@@ -217,7 +218,11 @@ const FormInput = ({
|
|
|
217
218
|
<Box padding="0">
|
|
218
219
|
{formatter ? (
|
|
219
220
|
<FormattedInputField
|
|
220
|
-
aria-labelledby={
|
|
221
|
+
aria-labelledby={
|
|
222
|
+
ariaLabelledBy === undefined
|
|
223
|
+
? createIdFromString(labelTextWhenNoError)
|
|
224
|
+
: ariaLabelledBy
|
|
225
|
+
}
|
|
221
226
|
aria-describedby={createIdFromString(
|
|
222
227
|
labelTextWhenNoError,
|
|
223
228
|
"error message"
|
|
@@ -254,7 +259,11 @@ const FormInput = ({
|
|
|
254
259
|
/>
|
|
255
260
|
) : (
|
|
256
261
|
<InputField
|
|
257
|
-
aria-labelledby={
|
|
262
|
+
aria-labelledby={
|
|
263
|
+
ariaLabelledBy === undefined
|
|
264
|
+
? createIdFromString(labelTextWhenNoError)
|
|
265
|
+
: ariaLabelledBy
|
|
266
|
+
}
|
|
258
267
|
aria-describedby={createIdFromString(
|
|
259
268
|
labelTextWhenNoError,
|
|
260
269
|
"error message"
|
|
@@ -19,21 +19,29 @@ const PartialAmountField = ({
|
|
|
19
19
|
);
|
|
20
20
|
return (
|
|
21
21
|
<FormInput
|
|
22
|
+
ariaLabelledBy={null}
|
|
22
23
|
id={id}
|
|
23
24
|
labelTextWhenNoError={id}
|
|
24
25
|
labelDisplayOverride={
|
|
25
26
|
<Stack childGap="0px">
|
|
26
|
-
<Box padding="0">
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
27
|
+
<Box as="label" for={id} padding="0">
|
|
28
|
+
<Detail
|
|
29
|
+
as="span"
|
|
30
|
+
extraStyles="display: block;"
|
|
31
|
+
variant={themeValues.detailVariant}
|
|
32
|
+
weight={themeValues.weightTitle}
|
|
33
|
+
>
|
|
34
|
+
{lineItem.description}
|
|
35
|
+
</Detail>
|
|
36
|
+
<Detail
|
|
37
|
+
as="span"
|
|
38
|
+
extraStyles="display: block;"
|
|
39
|
+
variant={themeValues.detailVariant}
|
|
40
|
+
weight="400"
|
|
41
|
+
>
|
|
34
42
|
{lineItem.subDescription}
|
|
35
43
|
</Detail>
|
|
36
|
-
</
|
|
44
|
+
</Box>
|
|
37
45
|
</Stack>
|
|
38
46
|
}
|
|
39
47
|
key={lineItem.id}
|
|
@@ -56,7 +64,7 @@ const PartialAmountField = ({
|
|
|
56
64
|
</Text>
|
|
57
65
|
}
|
|
58
66
|
/>
|
|
59
|
-
)
|
|
67
|
+
);
|
|
60
68
|
};
|
|
61
69
|
|
|
62
70
|
function arePropsEqual(prevProps, nextProps) {
|