@thecb/components 8.4.11-beta.21 → 8.4.11-beta.23
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 +25 -11
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +25 -11
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/dropdown/Dropdown.js +1 -0
- package/src/components/atoms/form-layouts/FormInput.js +3 -0
- package/src/components/molecules/address-form/AddressForm.js +7 -0
- package/src/components/molecules/email-form/EmailForm.js +1 -0
- package/src/components/molecules/payment-form-card/PaymentFormCard.js +1 -0
- package/src/components/molecules/phone-form/PhoneForm.js +1 -0
package/package.json
CHANGED
|
@@ -217,6 +217,7 @@ const FormInput = ({
|
|
|
217
217
|
formatter={formatter}
|
|
218
218
|
showErrors={showErrors}
|
|
219
219
|
dataQa={labelTextWhenNoError}
|
|
220
|
+
data-qa={labelTextWhenNoError}
|
|
220
221
|
themeValues={themeValues}
|
|
221
222
|
$customHeight={customHeight}
|
|
222
223
|
$extraStyles={extraStyles}
|
|
@@ -242,6 +243,7 @@ const FormInput = ({
|
|
|
242
243
|
field={field}
|
|
243
244
|
showErrors={showErrors}
|
|
244
245
|
dataQa={labelTextWhenNoError}
|
|
246
|
+
data-qa={labelTextWhenNoError}
|
|
245
247
|
themeValues={themeValues}
|
|
246
248
|
background={background}
|
|
247
249
|
$customHeight={customHeight}
|
|
@@ -256,6 +258,7 @@ const FormInput = ({
|
|
|
256
258
|
justify="space-between"
|
|
257
259
|
aria-live="polite"
|
|
258
260
|
aria-atomic={true}
|
|
261
|
+
data-qa={"Errors container"}
|
|
259
262
|
>
|
|
260
263
|
{(field.hasErrors && field.dirty) || (field.hasErrors && showErrors) ? (
|
|
261
264
|
<Text
|
|
@@ -64,6 +64,7 @@ const AddressForm = ({
|
|
|
64
64
|
}
|
|
65
65
|
}}
|
|
66
66
|
showErrors={showErrors}
|
|
67
|
+
data-qa={"Country"}
|
|
67
68
|
/>
|
|
68
69
|
<FormInput
|
|
69
70
|
labelTextWhenNoError="Address"
|
|
@@ -75,6 +76,7 @@ const AddressForm = ({
|
|
|
75
76
|
onKeyDown={e => e.key === "Enter" && handleSubmit(e)}
|
|
76
77
|
autocomplete="address-line1"
|
|
77
78
|
aria-label="Address Line 1"
|
|
79
|
+
data-qa={"Address Line 1"}
|
|
78
80
|
/>
|
|
79
81
|
<FormInput
|
|
80
82
|
labelTextWhenNoError="Apt, Suite, Unit, Floor, etc. (Optional)"
|
|
@@ -84,6 +86,7 @@ const AddressForm = ({
|
|
|
84
86
|
onKeyDown={e => e.key === "Enter" && handleSubmit(e)}
|
|
85
87
|
autocomplete="address-line2"
|
|
86
88
|
aria-label="Address Line 2"
|
|
89
|
+
data-qa={"Address Line 2"}
|
|
87
90
|
/>
|
|
88
91
|
<FormInput
|
|
89
92
|
labelTextWhenNoError="City"
|
|
@@ -95,6 +98,7 @@ const AddressForm = ({
|
|
|
95
98
|
onKeyDown={e => e.key === "Enter" && handleSubmit(e)}
|
|
96
99
|
autocomplete="city"
|
|
97
100
|
aria-label="City"
|
|
101
|
+
data-qa="City"
|
|
98
102
|
/>
|
|
99
103
|
<StateProvinceDropdown
|
|
100
104
|
labelTextWhenNoError={isUS ? "State" : "State or Province"}
|
|
@@ -107,6 +111,7 @@ const AddressForm = ({
|
|
|
107
111
|
aria-label={isUS ? "State" : "State or Province"}
|
|
108
112
|
required={true}
|
|
109
113
|
autocomplete="administrative-area"
|
|
114
|
+
data-qa={"State or Province"}
|
|
110
115
|
/>
|
|
111
116
|
<FormInput
|
|
112
117
|
isNum={isUS}
|
|
@@ -120,6 +125,7 @@ const AddressForm = ({
|
|
|
120
125
|
aria-label="Zip code"
|
|
121
126
|
autocomplete="postal-code"
|
|
122
127
|
required={true}
|
|
128
|
+
data-qa={"Zip code"}
|
|
123
129
|
/>
|
|
124
130
|
{showWalletCheckbox && (
|
|
125
131
|
<Checkbox
|
|
@@ -127,6 +133,7 @@ const AddressForm = ({
|
|
|
127
133
|
title="Save address to wallet"
|
|
128
134
|
checked={walletCheckboxMarked}
|
|
129
135
|
onChange={saveToWallet}
|
|
136
|
+
data-qa={"Save address to wallet"}
|
|
130
137
|
/>
|
|
131
138
|
)}
|
|
132
139
|
</FormInputColumn>
|