@rnzeus/eslint-plugin 0.1.2 → 0.1.3
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/README.md +62 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -20,9 +20,10 @@ Ensures that all styles declared in `*.styles.ts(x)` files are actually used in
|
|
|
20
20
|
**What it checks:**
|
|
21
21
|
- detects unused style keys
|
|
22
22
|
- forbids passing the whole `styles` object (`styles={styles}`)
|
|
23
|
-
- supports arrays: `style={[styles.foo, styles.bar]}`
|
|
23
|
+
- supports arrays: `style={[styles.foo, condition && styles.bar]}`
|
|
24
24
|
- supports conditional styles
|
|
25
25
|
- supports dynamic styles **only with explicit directive comments**
|
|
26
|
+
- supports additional “style-like” props (configurable): e.g. `contentContainerStyle`
|
|
26
27
|
|
|
27
28
|
**File convention (required):**
|
|
28
29
|
```
|
|
@@ -91,6 +92,64 @@ module.exports = [
|
|
|
91
92
|
|
|
92
93
|
---
|
|
93
94
|
|
|
95
|
+
## Configure `styles-usage` style props
|
|
96
|
+
|
|
97
|
+
By default, `rnzeus/styles-usage` tracks style usage from these JSX props:
|
|
98
|
+
|
|
99
|
+
- `style`
|
|
100
|
+
- `contentContainerStyle`
|
|
101
|
+
|
|
102
|
+
You can extend or override this list via rule options.
|
|
103
|
+
|
|
104
|
+
### Merge (default)
|
|
105
|
+
|
|
106
|
+
`type: "merge"` is the default behavior:
|
|
107
|
+
- takes plugin defaults
|
|
108
|
+
- adds your `styleProps`
|
|
109
|
+
- de-duplicates
|
|
110
|
+
|
|
111
|
+
Example (add FlatList prop):
|
|
112
|
+
|
|
113
|
+
```js
|
|
114
|
+
module.exports = [
|
|
115
|
+
...styles,
|
|
116
|
+
{
|
|
117
|
+
rules: {
|
|
118
|
+
"rnzeus/styles-usage": [
|
|
119
|
+
"error",
|
|
120
|
+
{
|
|
121
|
+
styleProps: ["columnWrapperStyle"],
|
|
122
|
+
type: "merge", // optional (default)
|
|
123
|
+
},
|
|
124
|
+
],
|
|
125
|
+
},
|
|
126
|
+
},
|
|
127
|
+
];
|
|
128
|
+
```
|
|
129
|
+
|
|
130
|
+
### Override
|
|
131
|
+
|
|
132
|
+
`type: "override"` ignores plugin defaults and uses **only** your `styleProps`.
|
|
133
|
+
|
|
134
|
+
```js
|
|
135
|
+
module.exports = [
|
|
136
|
+
...styles,
|
|
137
|
+
{
|
|
138
|
+
rules: {
|
|
139
|
+
"rnzeus/styles-usage": [
|
|
140
|
+
"error",
|
|
141
|
+
{
|
|
142
|
+
styleProps: ["style"],
|
|
143
|
+
type: "override",
|
|
144
|
+
},
|
|
145
|
+
],
|
|
146
|
+
},
|
|
147
|
+
},
|
|
148
|
+
];
|
|
149
|
+
```
|
|
150
|
+
|
|
151
|
+
---
|
|
152
|
+
|
|
94
153
|
## Dynamic styles (important)
|
|
95
154
|
|
|
96
155
|
Dynamic access like this is **not allowed by default**:
|
|
@@ -126,10 +185,11 @@ This makes dynamic styles:
|
|
|
126
185
|
| Check | Status |
|
|
127
186
|
|-----|------|
|
|
128
187
|
Unused styles | ✅ |
|
|
129
|
-
Whole styles object | ❌ |
|
|
188
|
+
Whole styles object (`styles={styles}`) | ❌ |
|
|
130
189
|
Array styles | ✅ |
|
|
131
190
|
Conditional styles | ✅ |
|
|
132
191
|
Dynamic styles | ⚠️ (directive required) |
|
|
192
|
+
Extra style props | ✅ (configurable) |
|
|
133
193
|
|
|
134
194
|
---
|
|
135
195
|
|