-
Notifications
You must be signed in to change notification settings - Fork 5
/
no-physical-properties.ts
118 lines (103 loc) · 3.6 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
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: [],
},
defaultOptions: [],
create(context) {
// 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) => {
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