@wordpress/eslint-plugin 25.4.0 → 25.4.2-next.v.202606191442.0

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.
Files changed (8) hide show
  1. package/README.md +5 -0
  2. package/configs/custom.js +0 -8
  3. package/package.json +12 -11
  4. package/rules/__tests__/no-ds-tokens.js +5 -5
  5. package/rules/__tests__/no-setting-ds-tokens.js +9 -9
  6. package/rules/__tests__/no-unknown-ds-tokens.js +23 -23
  7. package/rules/__tests__/use-recommended-components.js +9 -1
  8. package/rules/use-recommended-components.js +2 -0
package/README.md CHANGED
@@ -125,6 +125,11 @@ The granular rulesets will not define any environment globals. As such, if they
125
125
  | [no-dom-globals-in-module-scope](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-dom-globals-in-module-scope.md) | Disallow use of DOM globals in module scope. | |
126
126
  | [no-dom-globals-in-react-cc-render](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-dom-globals-in-react-cc-render.md) | Disallow use of DOM globals in React class component render methods. | |
127
127
  | [no-dom-globals-in-react-fc](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-dom-globals-in-react-fc.md) | Disallow use of DOM globals in the render cycle of a React function component. | |
128
+ | [no-ds-tokens](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-ds-tokens.md) | Disallow any usage of `--wpds-*` CSS custom properties. | |
129
+ | `no-global-active-element` | Disallow accessing the active element via `document.activeElement`. | ✓ |
130
+ | `no-global-get-selection` | Disallow accessing the selection via `window.getSelection`. | ✓ |
131
+ | [no-setting-ds-tokens](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-setting-ds-tokens.md) | Disallow setting any CSS custom property beginning with `--wpds-`. | ✓ |
132
+ | [no-unknown-ds-tokens](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-unknown-ds-tokens.md) | Prevent use of non-existing `--wpds-*` variables. | ✓ |
128
133
  | [components-no-missing-40px-size-prop](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/components-no-missing-40px-size-prop.md) | Disallow missing `__next40pxDefaultSize` prop on `@wordpress/components` components. | ✓ |
129
134
  | [components-no-unsafe-button-disabled](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/components-no-unsafe-button-disabled.md) | Disallow using `disabled` on Button without `accessibleWhenDisabled`. | ✓ |
130
135
  | [no-unsafe-render-order](https://github.com/WordPress/gutenberg/tree/HEAD/packages/eslint-plugin/docs/rules/no-unsafe-render-order.md) | Prevent unsafe `render` composition orders that silently remove semantics. | ✓ |
package/configs/custom.js CHANGED
@@ -23,14 +23,6 @@ module.exports = [
23
23
  '@wordpress/no-wp-process-env': 'error',
24
24
  },
25
25
  },
26
- {
27
- files: [ '**/*.native.js' ],
28
- rules: {
29
- '@wordpress/no-base-control-with-label-without-id': 'off',
30
- '@wordpress/i18n-no-flanking-whitespace': 'error',
31
- '@wordpress/i18n-hyphenated-range': 'error',
32
- },
33
- },
34
26
  {
35
27
  files: [ '**/*.test.js', '**/test/*.js' ],
36
28
  rules: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/eslint-plugin",
3
- "version": "25.4.0",
3
+ "version": "25.4.2-next.v.202606191442.0+17fe7db8a",
4
4
  "description": "ESLint plugin for WordPress development.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -42,29 +42,30 @@
42
42
  },
43
43
  "dependencies": {
44
44
  "@babel/eslint-parser": "^7.28.6",
45
- "@eslint-community/eslint-plugin-eslint-comments": "^4.4.0",
45
+ "@eslint-community/eslint-plugin-eslint-comments": "^4.7.0",
46
46
  "@eslint/compat": "^2.0.0",
47
- "@wordpress/babel-preset-default": "^8.48.0",
48
- "@wordpress/prettier-config": "^4.48.0",
49
- "@wordpress/theme": "^0.15.0",
47
+ "@wordpress/babel-preset-default": "^8.48.2-next.v.202606191442.0+17fe7db8a",
48
+ "@wordpress/prettier-config": "^4.48.2-next.v.202606191442.0+17fe7db8a",
49
+ "@wordpress/theme": "^0.16.1-next.v.202606191442.0+17fe7db8a",
50
50
  "cosmiconfig": "^7.0.0",
51
51
  "eslint-config-prettier": "^10.0.0",
52
52
  "eslint-import-resolver-typescript": "^4.4.4",
53
53
  "eslint-plugin-import": "^2.31.0",
54
- "eslint-plugin-jest": "^28.0.0",
54
+ "eslint-plugin-jest": "^28.11.0",
55
55
  "eslint-plugin-jsdoc": "^50.0.0",
56
56
  "eslint-plugin-jsx-a11y": "^6.10.0",
57
57
  "eslint-plugin-playwright": "^2.1.0",
58
- "eslint-plugin-prettier": "^5.0.0",
58
+ "eslint-plugin-prettier": "^5.5.5",
59
59
  "eslint-plugin-react": "^7.37.0",
60
- "eslint-plugin-react-hooks": "7.1.1",
60
+ "eslint-plugin-react-hooks": "^7.1.1",
61
61
  "globals": "^16.0.0",
62
62
  "requireindex": "^1.2.0",
63
- "typescript-eslint": "^8.0.0"
63
+ "typescript-eslint": "^8.57.1"
64
64
  },
65
65
  "devDependencies": {
66
66
  "@types/eslint": "^9",
67
- "@types/estree": "1.0.5"
67
+ "@types/estree": "^1.0.5",
68
+ "eslint": "^10.0.0"
68
69
  },
69
70
  "peerDependencies": {
70
71
  "@babel/core": ">=7",
@@ -83,5 +84,5 @@
83
84
  "publishConfig": {
84
85
  "access": "public"
85
86
  },
86
- "gitHead": "e7856693aeb4e2522d13608cd32c994e4a97cb9c"
87
+ "gitHead": "1b6a19222df5a88f161880b5789efb3171d8f425"
87
88
  }
package/rules/__tests__/no-ds-tokens.js CHANGED
@@ -32,7 +32,7 @@ ruleTester.run( 'no-ds-tokens', rule, {
32
32
  ],
33
33
  invalid: [
34
34
  {
35
- code: `const style = 'color: var(--wpds-color-fg-content-neutral)';`,
35
+ code: `const style = 'color: var(--wpds-color-foreground-content-neutral)';`,
36
36
  errors: [
37
37
  {
38
38
  messageId: 'disallowed',
@@ -40,7 +40,7 @@ ruleTester.run( 'no-ds-tokens', rule, {
40
40
  ],
41
41
  },
42
42
  {
43
- code: 'const style = `color: var(--wpds-color-fg-content-neutral)`;',
43
+ code: 'const style = `color: var(--wpds-color-foreground-content-neutral)`;',
44
44
  errors: [
45
45
  {
46
46
  messageId: 'disallowed',
@@ -48,7 +48,7 @@ ruleTester.run( 'no-ds-tokens', rule, {
48
48
  ],
49
49
  },
50
50
  {
51
- code: `<div style={ { color: 'var(--wpds-color-fg-content-neutral)' } } />`,
51
+ code: `<div style={ { color: 'var(--wpds-color-foreground-content-neutral)' } } />`,
52
52
  errors: [
53
53
  {
54
54
  messageId: 'disallowed',
@@ -64,7 +64,7 @@ ruleTester.run( 'no-ds-tokens', rule, {
64
64
  ],
65
65
  },
66
66
  {
67
- code: `const token = '--wpds-color-fg-content-neutral';`,
67
+ code: `const token = '--wpds-color-foreground-content-neutral';`,
68
68
  errors: [
69
69
  {
70
70
  messageId: 'disallowed',
@@ -72,7 +72,7 @@ ruleTester.run( 'no-ds-tokens', rule, {
72
72
  ],
73
73
  },
74
74
  {
75
- code: 'const style = `--wpds-color-fg-content-neutral: red`;',
75
+ code: 'const style = `--wpds-color-foreground-content-neutral: red`;',
76
76
  errors: [
77
77
  {
78
78
  messageId: 'disallowed',
package/rules/__tests__/no-setting-ds-tokens.js CHANGED
@@ -18,7 +18,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
18
18
  code: `<div style={ { '--my-custom-prop': 'value' } } />`,
19
19
  },
20
20
  {
21
- code: `<div style={ { color: 'var(--wpds-color-fg-content-neutral)' } } />`,
21
+ code: `<div style={ { color: 'var(--wpds-color-foreground-content-neutral)' } } />`,
22
22
  },
23
23
  {
24
24
  code: `<div style={ { '--other-prefix-token': '10px' } } />`,
@@ -30,10 +30,10 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
30
30
  code: `const styles = { '--my-custom-prop': 'value' };`,
31
31
  },
32
32
  {
33
- code: `const styles = { color: 'var(--wpds-color-fg-content-neutral)' };`,
33
+ code: `const styles = { color: 'var(--wpds-color-foreground-content-neutral)' };`,
34
34
  },
35
35
  {
36
- code: `const { '--wpds-color-fg-content-neutral': neutralColor } = styles;`,
36
+ code: `const { '--wpds-color-foreground-content-neutral': neutralColor } = styles;`,
37
37
  },
38
38
  {
39
39
  code: `const css = '--my-custom-prop: red;';`,
@@ -50,7 +50,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
50
50
  ],
51
51
  invalid: [
52
52
  {
53
- code: `<div style={ { '--wpds-color-fg-content-neutral': 'red' } } />`,
53
+ code: `<div style={ { '--wpds-color-foreground-content-neutral': 'red' } } />`,
54
54
  errors: [
55
55
  {
56
56
  messageId: 'disallowedSet',
@@ -66,7 +66,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
66
66
  ],
67
67
  },
68
68
  {
69
- code: `const styles = { '--wpds-color-fg-content-neutral': 'red' };`,
69
+ code: `const styles = { '--wpds-color-foreground-content-neutral': 'red' };`,
70
70
  errors: [
71
71
  {
72
72
  messageId: 'disallowedSet',
@@ -82,7 +82,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
82
82
  ],
83
83
  },
84
84
  {
85
- code: `const config = { inner: { '--wpds-color-fg-content-neutral': 'red' } };`,
85
+ code: `const config = { inner: { '--wpds-color-foreground-content-neutral': 'red' } };`,
86
86
  errors: [
87
87
  {
88
88
  messageId: 'disallowedSet',
@@ -90,7 +90,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
90
90
  ],
91
91
  },
92
92
  {
93
- code: `const css = '--wpds-color-fg-content-neutral: red;';`,
93
+ code: `const css = '--wpds-color-foreground-content-neutral: red;';`,
94
94
  errors: [
95
95
  {
96
96
  messageId: 'disallowedSet',
@@ -98,7 +98,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
98
98
  ],
99
99
  },
100
100
  {
101
- code: 'const css = `--wpds-color-fg-content-neutral: red;`;',
101
+ code: 'const css = `--wpds-color-foreground-content-neutral: red;`;',
102
102
  errors: [
103
103
  {
104
104
  messageId: 'disallowedSet',
@@ -106,7 +106,7 @@ ruleTester.run( 'no-setting-ds-tokens', rule, {
106
106
  ],
107
107
  },
108
108
  {
109
- code: 'const css = `--wpds-color-fg-content-neutral: ${ value };`;',
109
+ code: 'const css = `--wpds-color-foreground-content-neutral: ${ value };`;',
110
110
  errors: [
111
111
  {
112
112
  messageId: 'disallowedSet',
package/rules/__tests__/no-unknown-ds-tokens.js CHANGED
@@ -24,34 +24,34 @@ ruleTester.run( 'no-unknown-ds-tokens', rule, {
24
24
  code: `<div style={ { color: 'var(--other-prefix-token)' } } />`,
25
25
  },
26
26
  {
27
- code: `<div style={ { color: 'var(--wpds-color-fg-content-neutral)' } } />`,
27
+ code: `<div style={ { color: 'var(--wpds-color-foreground-content-neutral)' } } />`,
28
28
  },
29
29
  {
30
- code: '<div style={ { color: `var(--wpds-color-fg-content-neutral)` } } />',
30
+ code: '<div style={ { color: `var(--wpds-color-foreground-content-neutral)` } } />',
31
31
  },
32
32
  {
33
- code: `const token = 'var(--wpds-color-fg-content-neutral)';`,
33
+ code: `const token = 'var(--wpds-color-foreground-content-neutral)';`,
34
34
  },
35
35
  {
36
36
  code: `const name = 'something--wpds-color';`,
37
37
  },
38
38
  {
39
- code: '`${ prefix }: var(--wpds-color-fg-content-neutral)`',
39
+ code: '`${ prefix }: var(--wpds-color-foreground-content-neutral)`',
40
40
  },
41
41
  {
42
- code: '`var(--wpds-color-fg-content-neutral) ${ suffix }`',
42
+ code: '`var(--wpds-color-foreground-content-neutral) ${ suffix }`',
43
43
  },
44
44
  {
45
- code: `const style = { '--wpds-color-fg-content-neutral': 'red' };`,
45
+ code: `const style = { '--wpds-color-foreground-content-neutral': 'red' };`,
46
46
  },
47
47
  {
48
- code: `const css = '--wpds-color-fg-content-neutral: red;';`,
48
+ code: `const css = '--wpds-color-foreground-content-neutral: red;';`,
49
49
  },
50
50
  {
51
- code: 'const css = `--wpds-color-fg-content-neutral: red;`;',
51
+ code: 'const css = `--wpds-color-foreground-content-neutral: red;`;',
52
52
  },
53
53
  {
54
- code: 'const css = `--wpds-color-fg-content-neutral: ${ value };`;',
54
+ code: 'const css = `--wpds-color-foreground-content-neutral: ${ value };`;',
55
55
  },
56
56
  ],
57
57
  invalid: [
@@ -168,78 +168,78 @@ ruleTester.run( 'no-unknown-ds-tokens', rule, {
168
168
  ],
169
169
  },
170
170
  {
171
- code: `const token = '--wpds-color-fg-content-neutral';`,
171
+ code: `const token = '--wpds-color-foreground-content-neutral';`,
172
172
  errors: [
173
173
  {
174
174
  messageId: 'bareToken',
175
175
  data: {
176
- tokenNames: "'--wpds-color-fg-content-neutral'",
176
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
177
177
  },
178
178
  },
179
179
  ],
180
180
  },
181
181
  {
182
- code: 'const token = `--wpds-color-fg-content-neutral`;',
182
+ code: 'const token = `--wpds-color-foreground-content-neutral`;',
183
183
  errors: [
184
184
  {
185
185
  messageId: 'bareToken',
186
186
  data: {
187
- tokenNames: "'--wpds-color-fg-content-neutral'",
187
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
188
188
  },
189
189
  },
190
190
  ],
191
191
  },
192
192
  {
193
- code: '<div style={ { gap: `--wpds-color-fg-content-neutral` } } />',
193
+ code: '<div style={ { gap: `--wpds-color-foreground-content-neutral` } } />',
194
194
  errors: [
195
195
  {
196
196
  messageId: 'bareToken',
197
197
  data: {
198
- tokenNames: "'--wpds-color-fg-content-neutral'",
198
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
199
199
  },
200
200
  },
201
201
  ],
202
202
  },
203
203
  {
204
- code: '`${ prefix }: --wpds-color-fg-content-neutral`',
204
+ code: '`${ prefix }: --wpds-color-foreground-content-neutral`',
205
205
  errors: [
206
206
  {
207
207
  messageId: 'bareToken',
208
208
  data: {
209
- tokenNames: "'--wpds-color-fg-content-neutral'",
209
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
210
210
  },
211
211
  },
212
212
  ],
213
213
  },
214
214
  {
215
- code: '`var(--wpds-color-fg-content-neutral) --wpds-color-fg-content-neutral ${ x }`',
215
+ code: '`var(--wpds-color-foreground-content-neutral) --wpds-color-foreground-content-neutral ${ x }`',
216
216
  errors: [
217
217
  {
218
218
  messageId: 'bareToken',
219
219
  data: {
220
- tokenNames: "'--wpds-color-fg-content-neutral'",
220
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
221
221
  },
222
222
  },
223
223
  ],
224
224
  },
225
225
  {
226
- code: `const css = '--wpds-color-fg-content-neutral: red; color: --wpds-color-bg-surface-neutral;';`,
226
+ code: `const css = '--wpds-color-foreground-content-neutral: red; color: --wpds-color-background-surface-neutral;';`,
227
227
  errors: [
228
228
  {
229
229
  messageId: 'bareToken',
230
230
  data: {
231
- tokenNames: "'--wpds-color-bg-surface-neutral'",
231
+ tokenNames: "'--wpds-color-background-surface-neutral'",
232
232
  },
233
233
  },
234
234
  ],
235
235
  },
236
236
  {
237
- code: `const css = '--wpds-color-fg-content-neutral: red; background: --wpds-color-fg-content-neutral;';`,
237
+ code: `const css = '--wpds-color-foreground-content-neutral: red; background: --wpds-color-foreground-content-neutral;';`,
238
238
  errors: [
239
239
  {
240
240
  messageId: 'bareToken',
241
241
  data: {
242
- tokenNames: "'--wpds-color-fg-content-neutral'",
242
+ tokenNames: "'--wpds-color-foreground-content-neutral'",
243
243
  },
244
244
  },
245
245
  ],
package/rules/__tests__/use-recommended-components.js CHANGED
@@ -24,7 +24,7 @@ ruleTester.run( 'use-recommended-components', rule, {
24
24
  "import { Link } from '@wordpress/ui';",
25
25
  "import { Stack } from '@wordpress/ui';",
26
26
  "import { Text } from '@wordpress/ui';",
27
- "import { Badge, Icon, Link, Stack, Tabs, Text } from '@wordpress/ui';",
27
+ "import { Badge, Icon, Link, Stack, Tabs, Text, Tooltip } from '@wordpress/ui';",
28
28
 
29
29
  // Unlocked private APIs are only checked for denied names.
30
30
  "import { privateApis } from '@wordpress/components'; import { unlock } from '../../lock-unlock'; const { SomethingElse } = unlock( privateApis );",
@@ -114,6 +114,14 @@ ruleTester.run( 'use-recommended-components', rule, {
114
114
  },
115
115
  ],
116
116
  },
117
+ {
118
+ code: "import { Tooltip } from '@wordpress/components';",
119
+ errors: [
120
+ {
121
+ message: 'Use `Tooltip` from `@wordpress/ui` instead.',
122
+ },
123
+ ],
124
+ },
117
125
  ],
118
126
  } );
119
127
 
package/rules/use-recommended-components.js CHANGED
@@ -26,6 +26,7 @@ const ALLOWLIST = {
26
26
  'Stack',
27
27
  'Tabs',
28
28
  'Text',
29
+ 'Tooltip',
29
30
  'VisuallyHidden',
30
31
  ],
31
32
  message:
@@ -60,6 +61,7 @@ const DENYLIST = {
60
61
  CardMedia: 'Use `Card.FullBleed` from `@wordpress/ui` instead.',
61
62
  TabPanel: 'Use `Tabs` from `@wordpress/ui` instead.',
62
63
  Tabs: 'Use `Tabs` from `@wordpress/ui` instead.',
64
+ Tooltip: 'Use `Tooltip` from `@wordpress/ui` instead.',
63
65
  VisuallyHidden: 'Use `{{ name }}` from `@wordpress/ui` instead.',
64
66
  },
65
67
  };