Skip to content

Commit 0dbe146

Browse files
authored
Merge branch 'main' into dependabot/npm_and_yarn/eslint-plugin-github-6.0.0
2 parents e9c72f8 + d10759d commit 0dbe146

14 files changed

+476
-81
lines changed

.changeset/curvy-stingrays-decide.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"eslint-plugin-primer-react": patch
3+
---
4+
5+
Add rule for Link to not be allowed without href

.changeset/gold-pigs-carry.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'eslint-plugin-primer-react': minor
3+
---
4+
5+
Add `a11y-no-duplicate-form-labels` rule to prevent duplicate labels on TextInput components.

CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# eslint-plugin-primer-react
22

3+
## 7.0.2
4+
5+
### Patch Changes
6+
7+
- [#359](https://github.com/primer/eslint-plugin-primer-react/pull/359) [`1480eba`](https://github.com/primer/eslint-plugin-primer-react/commit/1480eba98bd8023c16d55aad5777a52c9da3079d) Thanks [@TylerJDev](https://github.com/TylerJDev)! - Fixes error when `imported` does not exist in specifier object
8+
39
## 7.0.1
410

511
### Patch Changes
Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
## Rule Details
2+
3+
This rule prevents accessibility issues by ensuring form controls have only one label. When a `FormControl` contains both a `FormControl.Label` and a `TextInput` with an `aria-label`, it creates duplicate labels which can confuse screen readers and other assistive technologies.
4+
5+
👎 Examples of **incorrect** code for this rule:
6+
7+
```jsx
8+
import {FormControl, TextInput} from '@primer/react'
9+
10+
function ExampleComponent() {
11+
return (
12+
// TextInput has aria-label when FormControl.Label is present
13+
<FormControl>
14+
<FormControl.Label>Form Input Label</FormControl.Label>
15+
<TextInput aria-label="Form Input Label" />
16+
</FormControl>
17+
)
18+
}
19+
```
20+
21+
👍 Examples of **correct** code for this rule:
22+
23+
```jsx
24+
import {FormControl, TextInput} from '@primer/react'
25+
26+
function ExampleComponent() {
27+
return (
28+
<>
29+
{/* TextInput without aria-label when FormControl.Label is present */}
30+
<FormControl>
31+
<FormControl.Label>Form Input Label</FormControl.Label>
32+
<TextInput />
33+
</FormControl>
34+
35+
{/* TextInput with aria-label when no FormControl.Label is present */}
36+
<FormControl>
37+
<TextInput aria-label="Form Input Label" />
38+
</FormControl>
39+
40+
{/* Using visuallyHidden FormControl.Label without aria-label */}
41+
<FormControl>
42+
<FormControl.Label visuallyHidden>Form Input Label</FormControl.Label>
43+
<TextInput />
44+
</FormControl>
45+
</>
46+
)
47+
}
48+
```

package-lock.json

Lines changed: 95 additions & 77 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "eslint-plugin-primer-react",
3-
"version": "7.0.1",
3+
"version": "7.0.2",
44
"description": "ESLint rules for Primer React",
55
"main": "src/index.js",
66
"scripts": {
@@ -34,7 +34,7 @@
3434
"eslint-traverse": "^1.0.0",
3535
"lodash": "^4.17.21",
3636
"styled-system": "^5.1.5",
37-
"@typescript-eslint/utils": "8.35.0",
37+
"@typescript-eslint/utils": "8.38.0",
3838
"typescript": "^5.8.2"
3939
},
4040
"devDependencies": {

0 commit comments

Comments
 (0)