Skip to content

Commit f224547

Browse files
castastrophecastastrophe
authored
feat(badge): remove modifiers from the API [SWC-1264] (#4283)
1 parent 4b11b1e commit f224547

File tree

5 files changed

+244
-497
lines changed

5 files changed

+244
-497
lines changed

‎.changeset/weak-colts-divide.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
"@spectrum-css/assetcard": major
55
"@spectrum-css/assetlist": major
66
"@spectrum-css/avatar": major
7+
"@spectrum-css/badge": major
78
"@spectrum-css/miller": major
89
"@spectrum-css/well": major
910
---

‎components/badge/dist/metadata.json‎

Lines changed: 62 additions & 202 deletions
Original file line numberDiff line numberDiff line change
@@ -2,232 +2,92 @@
22
"sourceFile": "index.css",
33
"selectors": [
44
".spectrum-Badge",
5-
".spectrum-Badge--accent",
6-
".spectrum-Badge--blue",
7-
".spectrum-Badge--brown",
8-
".spectrum-Badge--celery",
9-
".spectrum-Badge--chartreuse",
10-
".spectrum-Badge--cinnamon",
11-
".spectrum-Badge--cyan",
125
".spectrum-Badge--fixed-block-end",
136
".spectrum-Badge--fixed-block-start",
147
".spectrum-Badge--fixed-inline-end",
158
".spectrum-Badge--fixed-inline-start",
16-
".spectrum-Badge--fuchsia",
17-
".spectrum-Badge--gray",
18-
".spectrum-Badge--green",
19-
".spectrum-Badge--indigo",
20-
".spectrum-Badge--informative",
21-
".spectrum-Badge--magenta",
22-
".spectrum-Badge--negative",
23-
".spectrum-Badge--neutral",
24-
".spectrum-Badge--notice",
25-
".spectrum-Badge--orange",
26-
".spectrum-Badge--pink",
27-
".spectrum-Badge--positive",
28-
".spectrum-Badge--purple",
29-
".spectrum-Badge--red",
30-
".spectrum-Badge--seafoam",
31-
".spectrum-Badge--silver",
9+
".spectrum-Badge--outline:where(.spectrum-Badge--accent)",
10+
".spectrum-Badge--outline:where(.spectrum-Badge--informative)",
11+
".spectrum-Badge--outline:where(.spectrum-Badge--negative)",
12+
".spectrum-Badge--outline:where(.spectrum-Badge--neutral)",
13+
".spectrum-Badge--outline:where(.spectrum-Badge--neutral, .spectrum-Badge--accent, .spectrum-Badge--informative, .spectrum-Badge--negative, .spectrum-Badge--positive, .spectrum-Badge--notice)",
14+
".spectrum-Badge--outline:where(.spectrum-Badge--notice)",
15+
".spectrum-Badge--outline:where(.spectrum-Badge--positive)",
3216
".spectrum-Badge--sizeL",
3317
".spectrum-Badge--sizeS",
3418
".spectrum-Badge--sizeXL",
35-
".spectrum-Badge--style-outline.spectrum-Badge--accent",
36-
".spectrum-Badge--style-outline.spectrum-Badge--informative",
37-
".spectrum-Badge--style-outline.spectrum-Badge--negative",
38-
".spectrum-Badge--style-outline.spectrum-Badge--neutral",
39-
".spectrum-Badge--style-outline.spectrum-Badge--notice",
40-
".spectrum-Badge--style-outline.spectrum-Badge--positive",
41-
".spectrum-Badge--style-outline:is(.spectrum-Badge--neutral, .spectrum-Badge--accent, .spectrum-Badge--informative, .spectrum-Badge--negative, .spectrum-Badge--positive, .spectrum-Badge--notice)",
42-
".spectrum-Badge--style-subtle",
43-
".spectrum-Badge--style-subtle.spectrum-Badge--accent",
44-
".spectrum-Badge--style-subtle.spectrum-Badge--blue",
45-
".spectrum-Badge--style-subtle.spectrum-Badge--brown",
46-
".spectrum-Badge--style-subtle.spectrum-Badge--celery",
47-
".spectrum-Badge--style-subtle.spectrum-Badge--chartreuse",
48-
".spectrum-Badge--style-subtle.spectrum-Badge--cinnamon",
49-
".spectrum-Badge--style-subtle.spectrum-Badge--cyan",
50-
".spectrum-Badge--style-subtle.spectrum-Badge--fuchsia",
51-
".spectrum-Badge--style-subtle.spectrum-Badge--gray",
52-
".spectrum-Badge--style-subtle.spectrum-Badge--green",
53-
".spectrum-Badge--style-subtle.spectrum-Badge--indigo",
54-
".spectrum-Badge--style-subtle.spectrum-Badge--informative",
55-
".spectrum-Badge--style-subtle.spectrum-Badge--magenta",
56-
".spectrum-Badge--style-subtle.spectrum-Badge--negative",
57-
".spectrum-Badge--style-subtle.spectrum-Badge--neutral",
58-
".spectrum-Badge--style-subtle.spectrum-Badge--notice",
59-
".spectrum-Badge--style-subtle.spectrum-Badge--orange",
60-
".spectrum-Badge--style-subtle.spectrum-Badge--pink",
61-
".spectrum-Badge--style-subtle.spectrum-Badge--positive",
62-
".spectrum-Badge--style-subtle.spectrum-Badge--purple",
63-
".spectrum-Badge--style-subtle.spectrum-Badge--red",
64-
".spectrum-Badge--style-subtle.spectrum-Badge--seafoam",
65-
".spectrum-Badge--style-subtle.spectrum-Badge--silver",
66-
".spectrum-Badge--style-subtle.spectrum-Badge--turquoise",
67-
".spectrum-Badge--style-subtle.spectrum-Badge--yellow",
68-
".spectrum-Badge--turquoise",
69-
".spectrum-Badge--yellow",
19+
".spectrum-Badge--subtle",
20+
".spectrum-Badge--subtle:where(.spectrum-Badge--accent)",
21+
".spectrum-Badge--subtle:where(.spectrum-Badge--blue)",
22+
".spectrum-Badge--subtle:where(.spectrum-Badge--brown)",
23+
".spectrum-Badge--subtle:where(.spectrum-Badge--celery)",
24+
".spectrum-Badge--subtle:where(.spectrum-Badge--chartreuse)",
25+
".spectrum-Badge--subtle:where(.spectrum-Badge--cinnamon)",
26+
".spectrum-Badge--subtle:where(.spectrum-Badge--cyan)",
27+
".spectrum-Badge--subtle:where(.spectrum-Badge--fuchsia)",
28+
".spectrum-Badge--subtle:where(.spectrum-Badge--gray)",
29+
".spectrum-Badge--subtle:where(.spectrum-Badge--green)",
30+
".spectrum-Badge--subtle:where(.spectrum-Badge--indigo)",
31+
".spectrum-Badge--subtle:where(.spectrum-Badge--informative)",
32+
".spectrum-Badge--subtle:where(.spectrum-Badge--magenta)",
33+
".spectrum-Badge--subtle:where(.spectrum-Badge--negative)",
34+
".spectrum-Badge--subtle:where(.spectrum-Badge--neutral)",
35+
".spectrum-Badge--subtle:where(.spectrum-Badge--notice)",
36+
".spectrum-Badge--subtle:where(.spectrum-Badge--orange)",
37+
".spectrum-Badge--subtle:where(.spectrum-Badge--pink)",
38+
".spectrum-Badge--subtle:where(.spectrum-Badge--positive)",
39+
".spectrum-Badge--subtle:where(.spectrum-Badge--purple)",
40+
".spectrum-Badge--subtle:where(.spectrum-Badge--red)",
41+
".spectrum-Badge--subtle:where(.spectrum-Badge--seafoam)",
42+
".spectrum-Badge--subtle:where(.spectrum-Badge--silver)",
43+
".spectrum-Badge--subtle:where(.spectrum-Badge--turquoise)",
44+
".spectrum-Badge--subtle:where(.spectrum-Badge--yellow)",
7045
".spectrum-Badge-icon",
7146
".spectrum-Badge-icon + .spectrum-Badge-label",
7247
".spectrum-Badge-icon--no-label",
7348
".spectrum-Badge-label",
7449
".spectrum-Badge-label:lang(ja)",
7550
".spectrum-Badge-label:lang(ko)",
76-
".spectrum-Badge-label:lang(zh)"
77-
],
78-
"modifiers": [
79-
"--mod-badge-background-color-accent",
80-
"--mod-badge-background-color-blue",
81-
"--mod-badge-background-color-brown",
82-
"--mod-badge-background-color-celery",
83-
"--mod-badge-background-color-chartreuse",
84-
"--mod-badge-background-color-cinnamon",
85-
"--mod-badge-background-color-cyan",
86-
"--mod-badge-background-color-default",
87-
"--mod-badge-background-color-fuchsia",
88-
"--mod-badge-background-color-gray",
89-
"--mod-badge-background-color-green",
90-
"--mod-badge-background-color-indigo",
91-
"--mod-badge-background-color-informative",
92-
"--mod-badge-background-color-magenta",
93-
"--mod-badge-background-color-negative",
94-
"--mod-badge-background-color-notice",
95-
"--mod-badge-background-color-orange",
96-
"--mod-badge-background-color-pink",
97-
"--mod-badge-background-color-positive",
98-
"--mod-badge-background-color-purple",
99-
"--mod-badge-background-color-red",
100-
"--mod-badge-background-color-seafoam",
101-
"--mod-badge-background-color-silver",
102-
"--mod-badge-background-color-turquoise",
103-
"--mod-badge-background-color-yellow",
104-
"--mod-badge-border-color",
105-
"--mod-badge-border-width",
106-
"--mod-badge-corner-radius",
107-
"--mod-badge-font-size",
108-
"--mod-badge-height",
109-
"--mod-badge-icon-only-spacing-horizontal",
110-
"--mod-badge-icon-spacing-horizontal",
111-
"--mod-badge-icon-spacing-vertical-top",
112-
"--mod-badge-icon-text-spacing",
113-
"--mod-badge-label-icon-color",
114-
"--mod-badge-label-spacing-horizontal",
115-
"--mod-badge-label-spacing-vertical-bottom",
116-
"--mod-badge-label-spacing-vertical-top",
117-
"--mod-badge-line-height",
118-
"--mod-badge-line-height-cjk",
119-
"--mod-badge-outline-background-color-default",
120-
"--mod-badge-outline-border-color-accent",
121-
"--mod-badge-outline-border-color-informative",
122-
"--mod-badge-outline-border-color-negative",
123-
"--mod-badge-outline-border-color-neutral",
124-
"--mod-badge-outline-border-color-notice",
125-
"--mod-badge-outline-border-color-positive",
126-
"--mod-badge-outline-label-icon-color",
127-
"--mod-badge-subtle-background-color-accent",
128-
"--mod-badge-subtle-background-color-blue",
129-
"--mod-badge-subtle-background-color-brown",
130-
"--mod-badge-subtle-background-color-celery",
131-
"--mod-badge-subtle-background-color-chartreuse",
132-
"--mod-badge-subtle-background-color-cinnamon",
133-
"--mod-badge-subtle-background-color-cyan",
134-
"--mod-badge-subtle-background-color-default",
135-
"--mod-badge-subtle-background-color-fuchsia",
136-
"--mod-badge-subtle-background-color-gray",
137-
"--mod-badge-subtle-background-color-green",
138-
"--mod-badge-subtle-background-color-indigo",
139-
"--mod-badge-subtle-background-color-informative",
140-
"--mod-badge-subtle-background-color-magenta",
141-
"--mod-badge-subtle-background-color-negative",
142-
"--mod-badge-subtle-background-color-notice",
143-
"--mod-badge-subtle-background-color-orange",
144-
"--mod-badge-subtle-background-color-pink",
145-
"--mod-badge-subtle-background-color-positive",
146-
"--mod-badge-subtle-background-color-purple",
147-
"--mod-badge-subtle-background-color-red",
148-
"--mod-badge-subtle-background-color-seafoam",
149-
"--mod-badge-subtle-background-color-silver",
150-
"--mod-badge-subtle-background-color-turquoise",
151-
"--mod-badge-subtle-background-color-yellow",
152-
"--mod-badge-subtle-label-icon-color",
153-
"--mod-badge-workflow-icon-size"
51+
".spectrum-Badge-label:lang(zh)",
52+
".spectrum-Badge:where(.spectrum-Badge--accent)",
53+
".spectrum-Badge:where(.spectrum-Badge--blue)",
54+
".spectrum-Badge:where(.spectrum-Badge--brown)",
55+
".spectrum-Badge:where(.spectrum-Badge--celery)",
56+
".spectrum-Badge:where(.spectrum-Badge--chartreuse)",
57+
".spectrum-Badge:where(.spectrum-Badge--cinnamon)",
58+
".spectrum-Badge:where(.spectrum-Badge--cyan)",
59+
".spectrum-Badge:where(.spectrum-Badge--fuchsia)",
60+
".spectrum-Badge:where(.spectrum-Badge--gray)",
61+
".spectrum-Badge:where(.spectrum-Badge--green)",
62+
".spectrum-Badge:where(.spectrum-Badge--indigo)",
63+
".spectrum-Badge:where(.spectrum-Badge--informative)",
64+
".spectrum-Badge:where(.spectrum-Badge--magenta)",
65+
".spectrum-Badge:where(.spectrum-Badge--negative)",
66+
".spectrum-Badge:where(.spectrum-Badge--neutral)",
67+
".spectrum-Badge:where(.spectrum-Badge--notice)",
68+
".spectrum-Badge:where(.spectrum-Badge--notice, .spectrum-Badge--orange, .spectrum-Badge--yellow, .spectrum-Badge--chartreuse, .spectrum-Badge--celery)",
69+
".spectrum-Badge:where(.spectrum-Badge--orange)",
70+
".spectrum-Badge:where(.spectrum-Badge--pink)",
71+
".spectrum-Badge:where(.spectrum-Badge--positive)",
72+
".spectrum-Badge:where(.spectrum-Badge--purple)",
73+
".spectrum-Badge:where(.spectrum-Badge--red)",
74+
".spectrum-Badge:where(.spectrum-Badge--seafoam)",
75+
".spectrum-Badge:where(.spectrum-Badge--silver)",
76+
".spectrum-Badge:where(.spectrum-Badge--turquoise)",
77+
".spectrum-Badge:where(.spectrum-Badge--yellow)"
15478
],
79+
"modifiers": [],
15580
"component": [
156-
"--spectrum-badge-background-color-accent",
157-
"--spectrum-badge-background-color-blue",
158-
"--spectrum-badge-background-color-brown",
159-
"--spectrum-badge-background-color-celery",
160-
"--spectrum-badge-background-color-chartreuse",
161-
"--spectrum-badge-background-color-cinnamon",
162-
"--spectrum-badge-background-color-cyan",
163-
"--spectrum-badge-background-color-default",
164-
"--spectrum-badge-background-color-fuchsia",
165-
"--spectrum-badge-background-color-gray",
166-
"--spectrum-badge-background-color-green",
167-
"--spectrum-badge-background-color-indigo",
168-
"--spectrum-badge-background-color-informative",
169-
"--spectrum-badge-background-color-magenta",
170-
"--spectrum-badge-background-color-negative",
171-
"--spectrum-badge-background-color-notice",
172-
"--spectrum-badge-background-color-orange",
173-
"--spectrum-badge-background-color-pink",
174-
"--spectrum-badge-background-color-positive",
175-
"--spectrum-badge-background-color-purple",
176-
"--spectrum-badge-background-color-red",
177-
"--spectrum-badge-background-color-seafoam",
178-
"--spectrum-badge-background-color-silver",
179-
"--spectrum-badge-background-color-turquoise",
180-
"--spectrum-badge-background-color-yellow",
181-
"--spectrum-badge-border-color",
182-
"--spectrum-badge-border-width",
18381
"--spectrum-badge-corner-radius",
18482
"--spectrum-badge-font-size",
185-
"--spectrum-badge-font-weight",
18683
"--spectrum-badge-height",
18784
"--spectrum-badge-icon-only-spacing-horizontal",
18885
"--spectrum-badge-icon-spacing-horizontal",
18986
"--spectrum-badge-icon-spacing-vertical-top",
19087
"--spectrum-badge-icon-text-spacing",
191-
"--spectrum-badge-label-icon-color",
19288
"--spectrum-badge-label-spacing-horizontal",
19389
"--spectrum-badge-label-spacing-vertical-bottom",
19490
"--spectrum-badge-label-spacing-vertical-top",
195-
"--spectrum-badge-line-height",
196-
"--spectrum-badge-line-height-cjk",
197-
"--spectrum-badge-outline-background-color",
198-
"--spectrum-badge-outline-border-color-accent",
199-
"--spectrum-badge-outline-border-color-informative",
200-
"--spectrum-badge-outline-border-color-negative",
201-
"--spectrum-badge-outline-border-color-neutral",
202-
"--spectrum-badge-outline-border-color-notice",
203-
"--spectrum-badge-outline-border-color-positive",
204-
"--spectrum-badge-outline-label-icon-color",
205-
"--spectrum-badge-subtle-background-color-accent",
206-
"--spectrum-badge-subtle-background-color-blue",
207-
"--spectrum-badge-subtle-background-color-brown",
208-
"--spectrum-badge-subtle-background-color-celery",
209-
"--spectrum-badge-subtle-background-color-chartreuse",
210-
"--spectrum-badge-subtle-background-color-cinnamon",
211-
"--spectrum-badge-subtle-background-color-cyan",
212-
"--spectrum-badge-subtle-background-color-default",
213-
"--spectrum-badge-subtle-background-color-fuchsia",
214-
"--spectrum-badge-subtle-background-color-gray",
215-
"--spectrum-badge-subtle-background-color-green",
216-
"--spectrum-badge-subtle-background-color-indigo",
217-
"--spectrum-badge-subtle-background-color-informative",
218-
"--spectrum-badge-subtle-background-color-magenta",
219-
"--spectrum-badge-subtle-background-color-negative",
220-
"--spectrum-badge-subtle-background-color-notice",
221-
"--spectrum-badge-subtle-background-color-orange",
222-
"--spectrum-badge-subtle-background-color-pink",
223-
"--spectrum-badge-subtle-background-color-positive",
224-
"--spectrum-badge-subtle-background-color-purple",
225-
"--spectrum-badge-subtle-background-color-red",
226-
"--spectrum-badge-subtle-background-color-seafoam",
227-
"--spectrum-badge-subtle-background-color-silver",
228-
"--spectrum-badge-subtle-background-color-turquoise",
229-
"--spectrum-badge-subtle-background-color-yellow",
230-
"--spectrum-badge-subtle-label-icon-color",
23191
"--spectrum-badge-workflow-icon-size"
23292
],
23393
"global": [
@@ -339,5 +199,5 @@
339199
"--spectrum-yellow-subtle-background-color-default"
340200
],
341201
"passthroughs": [],
342-
"high-contrast": ["--highcontrast-badge-border-color"]
202+
"high-contrast": []
343203
}

0 commit comments

Comments
 (0)