Skip to content

Commit 0d31417

Browse files
Mitch-At-WorkMitch-At-Work
authored
Rebase and squish changes (#2)
1 parent cce7245 commit 0d31417

File tree

5 files changed

+458
-22
lines changed

5 files changed

+458
-22
lines changed

‎packages/react-components/token-analyzer-preview/library/README.md

+4-1
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,13 @@ A static analysis tool that scans your project's style files to track and analyz
1010
- we also need to ensure var analysis is done correctly after the refactor
1111
~~- Manage makeResetStyles (likely same as makeStyles)~~
1212
- Button has some weird patterns in it where it uses makeResetStyles and then uses enums to pull in the styles, we might need to account for those as well.
13-
- what if we have multiple `makeStyles` calls merged, are we handling that correctly or just nuking the conflicts in our output?
13+
- ~~what if we have multiple `makeStyles` calls merged, are we handling that correctly or just nuking the conflicts in our output?~~
1414
- make sure this works with shorthand spread
1515
- as we update the functionality, we should update our test cases to reflect the new functionality we support and ensure it works.
1616
- if we have functions we can't process (or other code for that matter), can we add that data into our report so we know to manually go deal with it?
17+
- ~~assignedSlots in output to track which slots classes are applied to~~
18+
- ~~Add variables full name to metadata (i.e. classNames.icon instead of just 'icon)~~
19+
- Module importing
1720

1821
## Features
1922

‎packages/react-components/token-analyzer-preview/library/analysis-link.json

+192
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,192 @@
1+
{
2+
"library/src/components/Link/useLinkStyles.styles.ts": {
3+
"styles": {
4+
"useStyles": {
5+
"root": {
6+
"tokens": [
7+
{
8+
"property": "color",
9+
"token": "tokens.colorBrandForegroundLink",
10+
"path": ["color"]
11+
},
12+
{
13+
"property": "fontFamily",
14+
"token": "tokens.fontFamilyBase",
15+
"path": ["fontFamily"]
16+
},
17+
{
18+
"property": "fontSize",
19+
"token": "tokens.fontSizeBase300",
20+
"path": ["fontSize"]
21+
},
22+
{
23+
"property": "fontWeight",
24+
"token": "tokens.fontWeightRegular",
25+
"path": ["fontWeight"]
26+
},
27+
{
28+
"property": "textDecorationThickness",
29+
"token": "tokens.strokeWidthThin",
30+
"path": ["textDecorationThickness"]
31+
}
32+
],
33+
"nested": {
34+
"':hover'": {
35+
"tokens": [
36+
{
37+
"property": "color",
38+
"token": "tokens.colorBrandForegroundLinkHover",
39+
"path": []
40+
}
41+
]
42+
},
43+
"':active'": {
44+
"tokens": [
45+
{
46+
"property": "color",
47+
"token": "tokens.colorBrandForegroundLinkPressed",
48+
"path": []
49+
}
50+
]
51+
}
52+
},
53+
"assignedVariables": ["styles"]
54+
},
55+
"subtle": {
56+
"tokens": [
57+
{
58+
"property": "color",
59+
"token": "tokens.colorNeutralForeground2",
60+
"path": ["color"]
61+
}
62+
],
63+
"nested": {
64+
"':hover'": {
65+
"tokens": [
66+
{
67+
"property": "color",
68+
"token": "tokens.colorNeutralForeground2Hover",
69+
"path": []
70+
}
71+
]
72+
},
73+
"':active'": {
74+
"tokens": [
75+
{
76+
"property": "color",
77+
"token": "tokens.colorNeutralForeground2Pressed",
78+
"path": []
79+
}
80+
]
81+
}
82+
},
83+
"assignedVariables": ["styles"]
84+
},
85+
"disabled": {
86+
"tokens": [
87+
{
88+
"property": "color",
89+
"token": "tokens.colorNeutralForegroundDisabled",
90+
"path": ["color"]
91+
}
92+
],
93+
"nested": {
94+
"':hover'": {
95+
"tokens": [
96+
{
97+
"property": "color",
98+
"token": "tokens.colorNeutralForegroundDisabled",
99+
"path": []
100+
}
101+
]
102+
},
103+
"':active'": {
104+
"tokens": [
105+
{
106+
"property": "color",
107+
"token": "tokens.colorNeutralForegroundDisabled",
108+
"path": []
109+
}
110+
]
111+
}
112+
},
113+
"assignedVariables": ["styles"]
114+
},
115+
"inverted": {
116+
"tokens": [
117+
{
118+
"property": "color",
119+
"token": "tokens.colorBrandForegroundInverted",
120+
"path": ["color"]
121+
}
122+
],
123+
"nested": {
124+
"':hover'": {
125+
"tokens": [
126+
{
127+
"property": "color",
128+
"token": "tokens.colorBrandForegroundInvertedHover",
129+
"path": []
130+
}
131+
]
132+
},
133+
"':active'": {
134+
"tokens": [
135+
{
136+
"property": "color",
137+
"token": "tokens.colorBrandForegroundInvertedPressed",
138+
"path": []
139+
}
140+
]
141+
}
142+
},
143+
"assignedVariables": ["styles"]
144+
}
145+
}
146+
},
147+
"metadata": {
148+
"styleConditions": {
149+
"linkClassNames.root": {
150+
"isBase": true,
151+
"slotName": "root"
152+
},
153+
"styles.root": {
154+
"isBase": true,
155+
"slotName": "root"
156+
},
157+
"styles.focusIndicator": {
158+
"isBase": true,
159+
"slotName": "root"
160+
},
161+
"state.root.className": {
162+
"isBase": true,
163+
"slotName": "root"
164+
},
165+
"styles.href": {
166+
"conditions": ["root.as === 'a' && root.href"],
167+
"slotName": "root"
168+
},
169+
"styles.button": {
170+
"conditions": ["root.as === 'button'"],
171+
"slotName": "root"
172+
},
173+
"styles.subtle": {
174+
"conditions": ["appearance === 'subtle'"],
175+
"slotName": "root"
176+
},
177+
"styles.inverted": {
178+
"conditions": ["backgroundAppearance === 'inverted'"],
179+
"slotName": "root"
180+
},
181+
"styles.inline": {
182+
"conditions": ["inline"],
183+
"slotName": "root"
184+
},
185+
"styles.disabled": {
186+
"conditions": ["disabled"],
187+
"slotName": "root"
188+
}
189+
}
190+
}
191+
}
192+
}

0 commit comments

Comments
 (0)