Skip to content

Commit eab4d15

Browse files
mperrottiagreenberry
mperrotti
and
agreenberry
authored
Remove 'warning' status from form validation (#3414)
* 3230 Refactor internal components - TextInputInnerVisualSlot (#3373) * refactor(TextInputInnerVisualSlot): moved to internal * fix import * removes 'warning' status from form validation * Update generated/components.json * adds changeset * Update old-coats-sniff.md --------- Co-authored-by: Amanda Brown <amanda.brown@testdouble.com> Co-authored-by: mperrotti <mperrotti@users.noreply.github.com>
1 parent 318f9d6 commit eab4d15

31 files changed

+35
-426
lines changed

‎.changeset/old-coats-sniff.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@primer/react': major
3+
---
4+
5+
Removes 'warning' option from form components' `validationStatus` props

‎docs/content/TextInput.mdx

Lines changed: 8 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -152,26 +152,16 @@ render(<WithIconAndLoadingIndicator />)
152152
</FormControl>
153153
```
154154

155-
### With error and warning states
155+
### With error state
156156

157157
```jsx live
158-
<>
159-
<TextInput
160-
validationStatus="error"
161-
aria-label="Zipcode"
162-
name="zipcode"
163-
placeholder="Error"
164-
autoComplete="postal-code"
165-
/>
166-
167-
<TextInput
168-
validationStatus="warning"
169-
aria-label="Zipcode"
170-
name="zipcode"
171-
placeholder="Warning"
172-
autoComplete="postal-code"
173-
/>
174-
</>
158+
<TextInput
159+
validationStatus="error"
160+
aria-label="Zipcode"
161+
name="zipcode"
162+
placeholder="Error"
163+
autoComplete="postal-code"
164+
/>
175165
```
176166

177167
### Block text input

‎e2e/components/CheckboxGroup.test.ts

Lines changed: 0 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -174,38 +174,4 @@ test.describe('CheckboxGroup', () => {
174174
})
175175
}
176176
})
177-
178-
test.describe('Warning', () => {
179-
for (const theme of themes) {
180-
test.describe(theme, () => {
181-
test('default @vrt', async ({page}) => {
182-
await visit(page, {
183-
id: 'components-checkboxgroup-features--warning',
184-
globals: {
185-
colorScheme: theme,
186-
},
187-
})
188-
189-
// Default state
190-
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`CheckboxGroup.Warning.${theme}.png`)
191-
})
192-
193-
test('axe @aat', async ({page}) => {
194-
await visit(page, {
195-
id: 'components-checkboxgroup-features--warning',
196-
globals: {
197-
colorScheme: theme,
198-
},
199-
})
200-
await expect(page).toHaveNoViolations({
201-
rules: {
202-
'color-contrast': {
203-
enabled: false,
204-
},
205-
},
206-
})
207-
})
208-
})
209-
}
210-
})
211177
})

‎e2e/components/RadioGroup.test.ts

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -143,34 +143,6 @@ test.describe('RadioGroup', () => {
143143
}
144144
})
145145

146-
test.describe('Warning', () => {
147-
for (const theme of themes) {
148-
test.describe(theme, () => {
149-
test('default @vrt', async ({page}) => {
150-
await visit(page, {
151-
id: 'components-radiogroup-features--warning',
152-
globals: {
153-
colorScheme: theme,
154-
},
155-
})
156-
157-
// Default state
158-
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`RadioGroup.Warning.${theme}.png`)
159-
})
160-
161-
test('axe @aat', async ({page}) => {
162-
await visit(page, {
163-
id: 'components-radiogroup-features--warning',
164-
globals: {
165-
colorScheme: theme,
166-
},
167-
})
168-
await expect(page).toHaveNoViolations()
169-
})
170-
})
171-
}
172-
})
173-
174146
test.describe('With External Label', () => {
175147
for (const theme of themes) {
176148
test.describe(theme, () => {

‎e2e/components/Select.test.ts

Lines changed: 0 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -279,41 +279,6 @@ test.describe('Select', () => {
279279
}
280280
})
281281

282-
test.describe('Warning', () => {
283-
for (const theme of themes) {
284-
test.describe(theme, () => {
285-
test('default @vrt', async ({page}) => {
286-
await visit(page, {
287-
id: 'components-select-features--warning',
288-
globals: {
289-
colorScheme: theme,
290-
},
291-
})
292-
293-
// Default state
294-
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`Select.Warning.${theme}.png`)
295-
})
296-
297-
test('axe @aat', async ({page}) => {
298-
await visit(page, {
299-
id: 'components-select-features--warning',
300-
globals: {
301-
colorScheme: theme,
302-
},
303-
})
304-
await expect(page.getByText('Warning')).toBeVisible()
305-
await expect(page).toHaveNoViolations({
306-
rules: {
307-
'color-contrast': {
308-
enabled: theme !== 'dark_dimmed',
309-
},
310-
},
311-
})
312-
})
313-
})
314-
}
315-
})
316-
317282
test.describe('With Caption', () => {
318283
for (const theme of themes) {
319284
test.describe(theme, () => {

‎e2e/components/TextInput.test.ts

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -227,34 +227,6 @@ test.describe('TextInput', () => {
227227
}
228228
})
229229

230-
test.describe('Warning', () => {
231-
for (const theme of themes) {
232-
test.describe(theme, () => {
233-
test('default @vrt', async ({page}) => {
234-
await visit(page, {
235-
id: 'components-textinput-features--warning',
236-
globals: {
237-
colorScheme: theme,
238-
},
239-
})
240-
241-
// Default state
242-
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`TextInput.Warning.${theme}.png`)
243-
})
244-
245-
test('axe @aat', async ({page}) => {
246-
await visit(page, {
247-
id: 'components-textinput-features--warning',
248-
globals: {
249-
colorScheme: theme,
250-
},
251-
})
252-
await expect(page).toHaveNoViolations()
253-
})
254-
})
255-
}
256-
})
257-
258230
test.describe('With Caption', () => {
259231
for (const theme of themes) {
260232
test.describe(theme, () => {

‎e2e/components/Textarea.test.ts

Lines changed: 0 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -171,34 +171,6 @@ test.describe('Textarea', () => {
171171
}
172172
})
173173

174-
test.describe('Warning', () => {
175-
for (const theme of themes) {
176-
test.describe(theme, () => {
177-
test('default @vrt', async ({page}) => {
178-
await visit(page, {
179-
id: 'components-textarea-features--warning',
180-
globals: {
181-
colorScheme: theme,
182-
},
183-
})
184-
185-
// Default state
186-
expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`Textarea.Warning.${theme}.png`)
187-
})
188-
189-
test('axe @aat', async ({page}) => {
190-
await visit(page, {
191-
id: 'components-textarea-features--warning',
192-
globals: {
193-
colorScheme: theme,
194-
},
195-
})
196-
await expect(page).toHaveNoViolations()
197-
})
198-
})
199-
}
200-
})
201-
202174
test.describe('With Caption', () => {
203175
for (const theme of themes) {
204176
test.describe(theme, () => {

‎generated/components.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1041,7 +1041,7 @@
10411041
},
10421042
{
10431043
"name": "validationStatus",
1044-
"type": "'error' | 'success' | 'warning'",
1044+
"type": "'error' | 'success'",
10451045
"defaultValue": "",
10461046
"description": "Only used to inform ARIA attributes.<br /> Individual checkboxes do not have validation styles."
10471047
},
@@ -1163,7 +1163,7 @@
11631163
},
11641164
{
11651165
"name": "variant",
1166-
"type": "'error' | 'success' | 'warning'",
1166+
"type": "'error' | 'success'",
11671167
"defaultValue": "",
11681168
"required": true,
11691169
"description": "Changes the visual style to match the validation status"
@@ -1770,7 +1770,7 @@
17701770
},
17711771
{
17721772
"name": "variant",
1773-
"type": "'error' | 'success' | 'warning'",
1773+
"type": "'error' | 'success'",
17741774
"defaultValue": "",
17751775
"required": true,
17761776
"description": "Changes the visual style to match the validation status"
@@ -3220,7 +3220,7 @@
32203220
},
32213221
{
32223222
"name": "variant",
3223-
"type": "'error' | 'success' | 'warning'",
3223+
"type": "'error' | 'success'",
32243224
"defaultValue": "",
32253225
"required": true,
32263226
"description": "Changes the visual style to match the validation status"
@@ -3526,7 +3526,7 @@
35263526
},
35273527
{
35283528
"name": "validationStatus",
3529-
"type": "'error' | 'success' | 'warning'",
3529+
"type": "'error' | 'success'",
35303530
"defaultValue": "",
35313531
"description": "Style the input to match the status"
35323532
}
@@ -4050,7 +4050,7 @@
40504050
},
40514051
{
40524052
"name": "validationStatus",
4053-
"type": "'error' | 'success' | 'warning'",
4053+
"type": "'error' | 'success'",
40544054
"defaultValue": "",
40554055
"description": "Style the input to match the status"
40564056
},
@@ -4206,7 +4206,7 @@
42064206
},
42074207
{
42084208
"name": "validationStatus",
4209-
"type": "'error' | 'success' | 'warning'",
4209+
"type": "'error' | 'success'",
42104210
"defaultValue": "",
42114211
"description": "Style the input to match the status"
42124212
},

‎script/generate-e2e-tests.js

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -326,10 +326,6 @@ const components = new Map([
326326
id: 'components-checkboxgroup-features--visually-hidden-label',
327327
name: 'Visually Hidden Label',
328328
},
329-
{
330-
id: 'components-checkboxgroup-features--warning',
331-
name: 'Warning',
332-
},
333329
],
334330
},
335331
],
@@ -954,10 +950,6 @@ const components = new Map([
954950
id: 'components-radiogroup-features--visually-hidden-label',
955951
name: 'Visually Hidden Label',
956952
},
957-
{
958-
id: 'components-radiogroup-features--warning',
959-
name: 'Warning',
960-
},
961953
{
962954
id: 'components-radiogroup-features--with-external-label',
963955
name: 'With External Label',
@@ -1001,10 +993,6 @@ const components = new Map([
1001993
id: 'components-select-features--visually-hidden-label',
1002994
name: 'Visually Hidden Label',
1003995
},
1004-
{
1005-
id: 'components-select-features--warning',
1006-
name: 'Warning',
1007-
},
1008996
{
1009997
id: 'components-select-features--with-caption',
1010998
name: 'With Caption',
@@ -1137,10 +1125,6 @@ const components = new Map([
11371125
id: 'components-textarea-features--visually-hidden-label',
11381126
name: 'Visually Hidden Label',
11391127
},
1140-
{
1141-
id: 'components-textarea-features--warning',
1142-
name: 'Warning',
1143-
},
11441128
{
11451129
id: 'components-textarea-features--with-caption',
11461130
name: 'With Caption',
@@ -1184,10 +1168,6 @@ const components = new Map([
11841168
id: 'components-textinput-features--visually-hidden-label',
11851169
name: 'Visually Hidden Label',
11861170
},
1187-
{
1188-
id: 'components-textinput-features--warning',
1189-
name: 'Warning',
1190-
},
11911171
{
11921172
id: 'components-textinput-features--with-caption',
11931173
name: 'With Caption',

‎src/Checkbox/Checkbox.docs.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
},
3838
{
3939
"name": "validationStatus",
40-
"type": "'error' | 'success' | 'warning'",
40+
"type": "'error' | 'success'",
4141
"defaultValue": "",
4242
"description": "Only used to inform ARIA attributes.<br /> Individual checkboxes do not have validation styles."
4343
},

0 commit comments

Comments
 (0)