You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
ESLint React provides the following configurations:
6
10
7
-
## Settings
11
+
## Properties
8
12
9
-
### `version`
13
+
<TypeTable
14
+
type={{
15
+
version: {
16
+
description: <Linkhref="#version">React version to perform the analysis.</Link>,
17
+
type: "string",
18
+
default: "detect",
19
+
},
20
+
importSource: {
21
+
description: <Linkhref="#importsource">The source where React is imported from.</Link>,
22
+
type: "string",
23
+
default: "react",
24
+
},
25
+
polymorphicPropName: {
26
+
description: <Linkhref="#polymorphicpropname">The prop your code uses to create polymorphic components.</Link>,
27
+
type: "string",
28
+
default: "as",
29
+
},
30
+
additionalComponents: {
31
+
description: <Linkhref="#additionalcomponents">An array of components and its attributes mapping.</Link>,
32
+
type: "CustomComponent[]",
33
+
typeDescription: `
34
+
type CustomComponent = {
35
+
name: string;
36
+
as?: string;
37
+
attributes?: {
38
+
name: string;
39
+
as?: string;
40
+
defaultValue?: string;
41
+
}[]
42
+
}
43
+
`,
44
+
default: "[]",
45
+
},
46
+
additionalHooks: {
47
+
description: <Linkhref="#additionalhooks">An object of aliases for React built-in Hooks.</Link>,
48
+
type: "Record<ReactBuiltInHookName, string[]>",
49
+
typeDescription: `
50
+
type ReactBuiltInHookName = ${REACT_BUILD_IN_HOOKS.map(n=>'"'+n+'"').join(" | ")}
51
+
`,
52
+
default: "{}",
53
+
},
54
+
}}
55
+
/>
10
56
11
-
```ts
12
-
const version ="detect"
13
-
```
57
+
## Descriptions
58
+
59
+
### `version`
14
60
15
61
React version to perform the analysis, `"detect"` means auto detect React version from the project's dependencies.
16
62
17
63
If failed to detect, it will use the `19.0.0` version.
18
64
19
65
### `importSource`
20
66
21
-
```ts
22
-
const importSource ="react"
23
-
```
24
-
25
67
<Callouttype="info">If `importSource` is specified, an equivalent version of React should be provided to the [`version`](#version) setting.</Callout>
26
68
27
69
The source where React is imported from.
@@ -36,10 +78,6 @@ import React from "@pika/react";
36
78
37
79
### `polymorphicPropName`
38
80
39
-
```ts
40
-
const polymorphicPropName ="as"
41
-
```
42
-
43
81
You can optionally use the `polymorphicPropName` setting to define the prop your code uses to create polymorphic components. This setting will be used determine the element type in rules that require semantic context.
44
82
45
83
For example, if you set the `polymorphicPropName` setting to `as` then this element:
@@ -54,18 +92,6 @@ If no `polymorphicPropName` is set, then the component will be evaluated as `Box
54
92
55
93
### `additionalComponents`
56
94
57
-
```ts
58
-
const additionalComponents = [] satisfies {
59
-
name:string;
60
-
as?:string;
61
-
attributes?: {
62
-
name:string;
63
-
as?:string;
64
-
defaultValue?:string;
65
-
}[]
66
-
}[]
67
-
```
68
-
69
95
<Callouttype="info">Before using `additionalComponents`, consider whether `polymorphicPropName` can be used instead, as it simpler and more efficient.</Callout>
70
96
71
97
<Callouttype="warn">This is an experimental feature that can be unstable and lacks documentation.</Callout>
@@ -105,13 +131,6 @@ So that both the `dom/no-missing-iframe-sandbox` and `dom/no-unsafe-iframe-sandb
105
131
106
132
### `additionalHooks`
107
133
108
-
```ts
109
-
const additionalHooks = {
110
-
useLayoutEffect: ["useIsomorphicLayoutEffect"]
111
-
// ...
112
-
}
113
-
```
114
-
115
134
<Callouttype="warn">This is intended to cover edge cases. We suggest using the built-in React Hooks whenever possible.</Callout>
116
135
117
136
A object of aliases for React built-in Hooks. ESLint React will recognize these aliases as equivalent to the built-in Hooks in all its rules.
0 commit comments