eslint-plugin-primer-react 4.0.0-rc.4ff148f → 4.0.0-rc.5015672

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/CHANGELOG.md CHANGED
@@ -6,6 +6,14 @@
6
6
 
7
7
  - [#51](https://github.com/primer/eslint-plugin-primer-react/pull/51) [`a65aa32`](https://github.com/primer/eslint-plugin-primer-react/commit/a65aa32c612c7fe952ec47bb3d926cf8adae9fab) Thanks [@broccolinisoup](https://github.com/broccolinisoup)! - Add `a11y-tooltip-interactive-trigger`
8
8
 
9
+ * [#66](https://github.com/primer/eslint-plugin-primer-react/pull/66) [`d1df609`](https://github.com/primer/eslint-plugin-primer-react/commit/d1df609b260505ee9dea1740bc96a3187355d727) Thanks [@TylerJDev](https://github.com/TylerJDev)! - Add `a11y-explicit-heading` rule
10
+
11
+ ### Minor Changes
12
+
13
+ - [#67](https://github.com/primer/eslint-plugin-primer-react/pull/67) [`4dfdb47`](https://github.com/primer/eslint-plugin-primer-react/commit/4dfdb47b40e7f187573b8203830541b86cc7a953) Thanks [@TylerJDev](https://github.com/TylerJDev)! - \* Updates component mapping, adds `components.js`
14
+ - Bumps `eslint-plugin-github` and `eslint-plugin-jsx-a11y`
15
+ - Fixes bug in `a11y-explicit-heading` when using spread props, or variable for `as`
16
+
9
17
  ## 3.0.0
10
18
 
11
19
  ### Major Changes
package/README.md CHANGED
@@ -33,3 +33,4 @@ ESLint rules for Primer React
33
33
  - [no-deprecated-colors](https://github.com/primer/eslint-plugin-primer-react/blob/main/docs/rules/no-deprecated-colors.md)
34
34
  - [no-system-props](https://github.com/primer/eslint-plugin-primer-react/blob/main/docs/rules/no-system-props.md)
35
35
  - [a11y-tooltip-interactive-trigger](https://github.com/primer/eslint-plugin-primer-react/blob/main/docs/rules/a11y-tooltip-interactive-trigger.md)
36
+ - [a11y-explicit-heading](https://github.com/primer/eslint-plugin-primer-react/blob/main/docs/rules/a11y-explicit-heading.md)
@@ -0,0 +1,37 @@
1
+ ## Require explicit heading level on `<Heading>` component
2
+
3
+ The `Heading` component does not require you to use `as` to specify the heading level, as it will default to an `h2` if one isn't specified. This may lead to inaccessible usage if the default is out of order in the existing heading hierarchy.
4
+
5
+ ## Rule Details
6
+
7
+ This rule enforces using `as` on the `<Heading>` component to specify a heading level (`h1`-`h6`). In addition, it enforces `as` usage to only be used for headings.
8
+
9
+ 👎 Examples of **incorrect** code for this rule
10
+
11
+ ```jsx
12
+ import {Heading} from '@primer/react'
13
+
14
+ <Heading>Heading without explicit heading level</Heading>
15
+ ```
16
+
17
+ `as` must only be for headings (`h1`-`h6`)
18
+
19
+ ```jsx
20
+ import {Heading} from '@primer/react'
21
+
22
+ <Heading as="span">Heading component used as "span"</Heading>
23
+ ```
24
+
25
+ 👍 Examples of **correct** code for this rule:
26
+
27
+ ```jsx
28
+ import {Heading} from '@primer/react';
29
+
30
+ <Heading as="h2">Heading level 2</Heading>
31
+ ```
32
+
33
+ ## Options
34
+
35
+ - `skipImportCheck` (default: `false`)
36
+
37
+ By default, the `a11y-explicit-heading` rule will only check for `<Heading>` components imported directly from `@primer/react`. You can disable this behavior by setting `skipImportCheck` to `true`.