@phcdevworks/spectre-tokens 2.7.0 → 2.9.0
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 +6 -4
- package/dist/index.cjs +334 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +110 -0
- package/dist/index.d.cts +292 -0
- package/dist/index.d.ts +292 -0
- package/dist/index.js +334 -14
- package/dist/index.js.map +1 -1
- package/dist/tokens.dtcg.json +3158 -0
- package/package.json +18 -9
- package/tokens/components.json +173 -0
- package/tokens/modes.json +400 -0
- package/tokens/palette.json +3 -3
- package/tokens/primitives.json +58 -1
- package/tokens/semantic-roles.json +37 -0
package/tokens/primitives.json
CHANGED
|
@@ -1,17 +1,24 @@
|
|
|
1
1
|
{
|
|
2
2
|
"space": {
|
|
3
3
|
"0": "0rem",
|
|
4
|
+
"1": "0.0625rem",
|
|
5
|
+
"2": "0.125rem",
|
|
4
6
|
"4": "0.25rem",
|
|
7
|
+
"6": "0.375rem",
|
|
5
8
|
"8": "0.5rem",
|
|
9
|
+
"10": "0.625rem",
|
|
6
10
|
"12": "0.75rem",
|
|
11
|
+
"14": "0.875rem",
|
|
7
12
|
"16": "1rem",
|
|
8
13
|
"20": "1.25rem",
|
|
9
14
|
"24": "1.5rem",
|
|
15
|
+
"28": "1.75rem",
|
|
10
16
|
"32": "2rem",
|
|
11
17
|
"40": "2.5rem",
|
|
12
18
|
"48": "3rem",
|
|
13
19
|
"56": "3.5rem",
|
|
14
20
|
"64": "4rem",
|
|
21
|
+
"72": "4.5rem",
|
|
15
22
|
"80": "5rem",
|
|
16
23
|
"96": "6rem"
|
|
17
24
|
},
|
|
@@ -22,6 +29,8 @@
|
|
|
22
29
|
"lg": "8px",
|
|
23
30
|
"xl": "12px",
|
|
24
31
|
"2xl": "16px",
|
|
32
|
+
"3xl": "24px",
|
|
33
|
+
"4xl": "32px",
|
|
25
34
|
"pill": "999px"
|
|
26
35
|
},
|
|
27
36
|
"shadows": {
|
|
@@ -52,6 +61,7 @@
|
|
|
52
61
|
},
|
|
53
62
|
"transitions": {
|
|
54
63
|
"duration": {
|
|
64
|
+
"reduced": "0.01ms",
|
|
55
65
|
"instant": "75ms",
|
|
56
66
|
"fast": "150ms",
|
|
57
67
|
"base": "200ms",
|
|
@@ -111,6 +121,48 @@
|
|
|
111
121
|
"duration": "{transitions.duration.slowest}",
|
|
112
122
|
"easing": "{transitions.easing.spring}",
|
|
113
123
|
"keyframes": "pulse"
|
|
124
|
+
},
|
|
125
|
+
"reducedMotion": {
|
|
126
|
+
"fadeIn": {
|
|
127
|
+
"duration": "{transitions.duration.reduced}",
|
|
128
|
+
"easing": "{transitions.easing.linear}",
|
|
129
|
+
"keyframes": "fade-in"
|
|
130
|
+
},
|
|
131
|
+
"fadeOut": {
|
|
132
|
+
"duration": "{transitions.duration.reduced}",
|
|
133
|
+
"easing": "{transitions.easing.linear}",
|
|
134
|
+
"keyframes": "fade-out"
|
|
135
|
+
},
|
|
136
|
+
"slideUp": {
|
|
137
|
+
"duration": "{transitions.duration.reduced}",
|
|
138
|
+
"easing": "{transitions.easing.linear}",
|
|
139
|
+
"keyframes": "slide-up"
|
|
140
|
+
},
|
|
141
|
+
"slideDown": {
|
|
142
|
+
"duration": "{transitions.duration.reduced}",
|
|
143
|
+
"easing": "{transitions.easing.linear}",
|
|
144
|
+
"keyframes": "slide-down"
|
|
145
|
+
},
|
|
146
|
+
"scaleIn": {
|
|
147
|
+
"duration": "{transitions.duration.reduced}",
|
|
148
|
+
"easing": "{transitions.easing.linear}",
|
|
149
|
+
"keyframes": "scale-in"
|
|
150
|
+
},
|
|
151
|
+
"bounce": {
|
|
152
|
+
"duration": "{transitions.duration.reduced}",
|
|
153
|
+
"easing": "{transitions.easing.linear}",
|
|
154
|
+
"keyframes": "bounce"
|
|
155
|
+
},
|
|
156
|
+
"shake": {
|
|
157
|
+
"duration": "{transitions.duration.reduced}",
|
|
158
|
+
"easing": "{transitions.easing.linear}",
|
|
159
|
+
"keyframes": "shake"
|
|
160
|
+
},
|
|
161
|
+
"pulse": {
|
|
162
|
+
"duration": "{transitions.duration.reduced}",
|
|
163
|
+
"easing": "{transitions.easing.linear}",
|
|
164
|
+
"keyframes": "pulse"
|
|
165
|
+
}
|
|
114
166
|
}
|
|
115
167
|
},
|
|
116
168
|
"opacity": {
|
|
@@ -146,17 +198,22 @@
|
|
|
146
198
|
"offset": "2px",
|
|
147
199
|
"style": "solid"
|
|
148
200
|
},
|
|
201
|
+
"reducedMotion": "{transitions.duration.reduced}",
|
|
202
|
+
"forcedColors": "auto",
|
|
149
203
|
"minTouchTarget": "44px",
|
|
150
204
|
"minTextSize": "16px"
|
|
151
205
|
},
|
|
152
206
|
"border": {
|
|
153
207
|
"width": {
|
|
208
|
+
"none": "0",
|
|
154
209
|
"base": "1px",
|
|
155
210
|
"thick": "2px"
|
|
156
211
|
},
|
|
157
212
|
"style": {
|
|
158
213
|
"none": "none",
|
|
159
|
-
"solid": "solid"
|
|
214
|
+
"solid": "solid",
|
|
215
|
+
"dashed": "dashed",
|
|
216
|
+
"dotted": "dotted"
|
|
160
217
|
}
|
|
161
218
|
}
|
|
162
219
|
}
|
|
@@ -24,6 +24,43 @@
|
|
|
24
24
|
"overlay": {
|
|
25
25
|
"value": "{colors.black} / 0.6",
|
|
26
26
|
"description": "modals, dropdowns, flyouts"
|
|
27
|
+
},
|
|
28
|
+
"hover": {
|
|
29
|
+
"value": "{colors.neutral.100}",
|
|
30
|
+
"description": "background for hovered clickable rows, items, and menu entries"
|
|
31
|
+
},
|
|
32
|
+
"selected": {
|
|
33
|
+
"value": "{colors.info.50}",
|
|
34
|
+
"description": "background for selected list items, rows, and menu entries"
|
|
35
|
+
},
|
|
36
|
+
"active": {
|
|
37
|
+
"value": "{colors.neutral.200}",
|
|
38
|
+
"description": "background for pressed/active clickable rows, items, and menu entries"
|
|
39
|
+
},
|
|
40
|
+
"divider": {
|
|
41
|
+
"value": "{colors.neutral.200}",
|
|
42
|
+
"description": "hairline color for <hr>, table borders, and section separators"
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
"link": {
|
|
46
|
+
"default": {
|
|
47
|
+
"value": "{colors.brand.600}",
|
|
48
|
+
"description": "default inline link color",
|
|
49
|
+
"metadata": {
|
|
50
|
+
"pair": "surface.page"
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
"hover": {
|
|
54
|
+
"value": "{colors.brand.700}",
|
|
55
|
+
"description": "link color on hover"
|
|
56
|
+
},
|
|
57
|
+
"active": {
|
|
58
|
+
"value": "{colors.brand.800}",
|
|
59
|
+
"description": "link color while pressed"
|
|
60
|
+
},
|
|
61
|
+
"visited": {
|
|
62
|
+
"value": "{colors.accent.700}",
|
|
63
|
+
"description": "link color after the destination has been visited"
|
|
27
64
|
}
|
|
28
65
|
},
|
|
29
66
|
"text": {
|