-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathno-physical-properties.ts
140 lines (124 loc) · 4.05 KB
/
no-physical-properties.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
import { isRecipeVariant, isPandaAttribute, isPandaProp, resolveLonghand } from '../utils/helpers'
import { type Rule, createRule } from '../utils'
import { isIdentifier, isJSXIdentifier } from '../utils/nodes'
import { physicalProperties } from '../utils/physical-properties'
import type { TSESTree } from '@typescript-eslint/utils'
export const RULE_NAME = 'no-physical-properties'
const rule: Rule = createRule({
name: RULE_NAME,
meta: {
docs: {
description:
'Encourage the use of logical properties over physical properties to foster a responsive and adaptable user interface.',
},
messages: {
physical: 'Use logical property instead of {{physical}}. Prefer `{{logical}}`.',
replace: 'Replace `{{physical}}` with `{{logical}}`.',
},
type: 'suggestion',
hasSuggestions: true,
schema: [
{
type: 'object',
properties: {
whitelist: {
type: 'array',
items: {
type: 'string',
minLength: 0,
},
uniqueItems: true,
},
},
additionalProperties: false,
},
],
},
defaultOptions: [
{
whitelist: [],
},
],
create(context) {
const whitelist: string[] = context.options[0]?.whitelist ?? []
// Cache for resolved longhand properties
const longhandCache = new Map<string, string>()
// Cache for helper functions
const pandaPropCache = new WeakMap<TSESTree.JSXAttribute, boolean | undefined>()
const pandaAttributeCache = new WeakMap<TSESTree.Property, boolean | undefined>()
const recipeVariantCache = new WeakMap<TSESTree.Property, boolean | undefined>()
const getLonghand = (name: string): string => {
if (longhandCache.has(name)) {
return longhandCache.get(name)!
}
const longhand = resolveLonghand(name, context) ?? name
longhandCache.set(name, longhand)
return longhand
}
const isCachedPandaProp = (node: TSESTree.JSXAttribute): boolean => {
if (pandaPropCache.has(node)) {
return pandaPropCache.get(node)!
}
const result = isPandaProp(node, context)
pandaPropCache.set(node, result)
return !!result
}
const isCachedPandaAttribute = (node: TSESTree.Property): boolean => {
if (pandaAttributeCache.has(node)) {
return pandaAttributeCache.get(node)!
}
const result = isPandaAttribute(node, context)
pandaAttributeCache.set(node, result)
return !!result
}
const isCachedRecipeVariant = (node: TSESTree.Property): boolean => {
if (recipeVariantCache.has(node)) {
return recipeVariantCache.get(node)!
}
const result = isRecipeVariant(node, context)
recipeVariantCache.set(node, result)
return !!result
}
const sendReport = (node: TSESTree.Identifier | TSESTree.JSXIdentifier) => {
if (whitelist.includes(node.name)) return
const longhandName = getLonghand(node.name)
if (!(longhandName in physicalProperties)) return
const logical = physicalProperties[longhandName]
const physicalName = `\`${node.name}\`${longhandName !== node.name ? ` (resolved to \`${longhandName}\`)` : ''}`
context.report({
node,
messageId: 'physical',
data: {
physical: physicalName,
logical,
},
suggest: [
{
messageId: 'replace',
data: {
physical: node.name,
logical,
},
fix: (fixer) => {
return fixer.replaceText(node, logical)
},
},
],
})
}
return {
JSXAttribute(node: TSESTree.JSXAttribute) {
if (!isJSXIdentifier(node.name)) return
if (!isCachedPandaProp(node)) return
sendReport(node.name)
},
Property(node: TSESTree.Property) {
if (!isIdentifier(node.key)) return
if (!isCachedPandaAttribute(node)) return
if (isCachedRecipeVariant(node)) return
sendReport(node.key)
},
}
},
})
export default rule