Skip to content

Commit ded3726

Browse files
Add use-next-tooltip rule
1 parent d797f9b commit ded3726

File tree

3 files changed

+84
-0
lines changed

3 files changed

+84
-0
lines changed

docs/rules/use-next-tooltip.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
# Recommends to use the `next` tooltip instead of the current stable one.
2+
3+
## Rule details
4+
5+
This rule recommends using the tooltip that is imported from `@primer/react/next` instead of the main entrypoint. The components that are exported from `@primer/react/next` are recommended over the main entrypoint ones because `next` components are reviewed and remediated for accessibility issues.
6+
👎 Examples of **incorrect** code for this rule:
7+
8+
```tsx
9+
import {Tooltip} from '@primer/react'
10+
```
11+
12+
👍 Examples of **correct** code for this rule:
13+
14+
```tsx
15+
import {Tooltip} from '@primer/react/next'
16+
```
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
const rule = require('../use-next-tooltip')
2+
const {RuleTester} = require('eslint')
3+
4+
const ruleTester = new RuleTester({
5+
parserOptions: {
6+
ecmaVersion: 'latest',
7+
sourceType: 'module',
8+
ecmaFeatures: {
9+
jsx: true
10+
}
11+
}
12+
})
13+
14+
ruleTester.run('use-next-tooltip', rule, {
15+
valid: [
16+
`import {Tooltip} from '@primer/react/next'`,
17+
`import {UnderlineNav, Button} from '@primer/react';
18+
import {Tooltip} from '@primer/react/next';`,
19+
`import {UnderlineNav, Button} from '@primer/react';
20+
import {Tooltip, SelectPanel} from '@primer/react/next';`
21+
],
22+
invalid: [
23+
{
24+
code: `import {Tooltip} from '@primer/react'`,
25+
errors: [{messageId: 'useNextTooltip'}]
26+
},
27+
{
28+
code: `import {Tooltip, Button} from '@primer/react'`,
29+
errors: [{messageId: 'useNextTooltip'}]
30+
}
31+
]
32+
})

src/rules/use-next-tooltip.js

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
'use strict'
2+
3+
module.exports = {
4+
meta: {
5+
type: 'suggestion',
6+
docs: {
7+
description: 'recommends the use of @primer/react/next Tooltip component',
8+
category: 'Best Practices',
9+
recommended: true
10+
},
11+
fixable: null,
12+
schema: [],
13+
messages: {
14+
useNextTooltip: 'Please use @primer/react/next Tooltip component that has accessibility improvements'
15+
}
16+
},
17+
create(context) {
18+
return {
19+
ImportDeclaration(node) {
20+
if (node.source.value !== '@primer/react') {
21+
return
22+
}
23+
const hasTooltip = node.specifiers.some(
24+
specifier => specifier.imported && specifier.imported.name === 'Tooltip'
25+
)
26+
if (!hasTooltip) {
27+
return
28+
}
29+
context.report({
30+
node,
31+
messageId: 'useNextTooltip'
32+
})
33+
}
34+
}
35+
}
36+
}

0 commit comments

Comments
 (0)