@seed-design/css 0.2.3 → 0.2.5

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.
Files changed (41) hide show
  1. package/all.css +119 -67
  2. package/all.min.css +1 -1
  3. package/base.css +2 -2
  4. package/base.min.css +1 -1
  5. package/package.json +1 -1
  6. package/recipes/badge.css +1 -1
  7. package/recipes/checkbox.css +2 -2
  8. package/recipes/checkbox.d.ts +2 -2
  9. package/recipes/checkbox.mjs +3 -3
  10. package/recipes/checkmark.css +34 -31
  11. package/recipes/checkmark.d.ts +4 -0
  12. package/recipes/checkmark.mjs +23 -2
  13. package/recipes/page-banner.css +5 -5
  14. package/recipes/radio.css +2 -2
  15. package/recipes/radio.d.ts +2 -2
  16. package/recipes/radio.mjs +3 -3
  17. package/recipes/radiomark.css +19 -7
  18. package/recipes/radiomark.d.ts +4 -0
  19. package/recipes/radiomark.mjs +5 -0
  20. package/recipes/segmented-control.css +18 -9
  21. package/recipes/switch.css +15 -7
  22. package/recipes/switch.d.ts +4 -0
  23. package/recipes/switch.mjs +5 -0
  24. package/vars/component/badge.d.ts +1 -1
  25. package/vars/component/badge.mjs +1 -1
  26. package/vars/component/checkbox.d.ts +2 -2
  27. package/vars/component/checkbox.mjs +2 -2
  28. package/vars/component/checkmark.d.ts +57 -23
  29. package/vars/component/checkmark.mjs +57 -23
  30. package/vars/component/page-banner.d.ts +5 -5
  31. package/vars/component/page-banner.mjs +5 -5
  32. package/vars/component/radio.d.ts +2 -2
  33. package/vars/component/radio.mjs +2 -2
  34. package/vars/component/radiomark.d.ts +32 -11
  35. package/vars/component/radiomark.mjs +32 -11
  36. package/vars/component/segmented-control-item.d.ts +21 -6
  37. package/vars/component/segmented-control-item.mjs +21 -6
  38. package/vars/component/segmented-control.d.ts +3 -1
  39. package/vars/component/segmented-control.mjs +3 -1
  40. package/vars/component/switch.d.ts +28 -10
  41. package/vars/component/switch.mjs +28 -10
package/recipes/switch.css CHANGED
@@ -22,12 +22,8 @@
22
22
  .seed-switch__control:is(:disabled, [disabled], [data-disabled]) {
23
23
  opacity: 0.38;
24
24
  }
25
- .seed-switch__control:is(:checked, [data-checked]) {
26
- background: var(--seed-color-bg-brand-solid);
27
- }
28
25
  .seed-switch__thumb {
29
26
  border-radius: var(--seed-radius-full);
30
- background: var(--seed-color-palette-static-white);
31
27
  transition: transform 150ms cubic-bezier(0.35, 0, 0.35, 1);
32
28
  }
33
29
  .seed-switch__label {
@@ -37,6 +33,18 @@
37
33
  .seed-switch__label:is(:disabled, [disabled], [data-disabled]) {
38
34
  color: var(--seed-color-fg-disabled);
39
35
  }
36
+ .seed-switch__control--tone_neutral:is(:checked, [data-checked]) {
37
+ background: var(--seed-color-bg-neutral-inverted);
38
+ }
39
+ .seed-switch__thumb--tone_neutral {
40
+ background: var(--seed-color-fg-neutral-inverted);
41
+ }
42
+ .seed-switch__control--tone_brand:is(:checked, [data-checked]) {
43
+ background: var(--seed-color-bg-brand-solid);
44
+ }
45
+ .seed-switch__thumb--tone_brand {
46
+ background: var(--seed-color-palette-static-white);
47
+ }
40
48
  .seed-switch__root--size_16 {
41
49
  min-height: 24px;
42
50
  gap: var(--seed-dimension-x1_5);
@@ -89,12 +97,12 @@
89
97
  .seed-switch__control--size_32 {
90
98
  min-inline-size: 52px;
91
99
  min-block-size: 32px;
92
- padding: 2px 2px;
100
+ padding: 3px 3px;
93
101
  margin: calc((32px - 32px) / 2) 0;
94
102
  }
95
103
  .seed-switch__thumb--size_32 {
96
- width: 28px;
97
- height: 28px;
104
+ width: 26px;
105
+ height: 26px;
98
106
  box-shadow: 0px 3px 8px 0px #00000026, 0px 1px 3px 0px #0000000f;
99
107
  }
100
108
  .seed-switch__thumb--size_32:is(:checked, [data-checked]) {
package/recipes/switch.d.ts CHANGED
@@ -1,5 +1,9 @@
1
1
  declare interface SwitchVariant {
2
2
  /**
3
+ * @default "brand"
4
+ */
5
+ tone: "neutral" | "brand";
6
+ /**
3
7
  * @default 32
4
8
  */
5
9
  size: "16" | "24" | "32";
package/recipes/switch.mjs CHANGED
@@ -21,12 +21,17 @@ const switchSlotNames = [
21
21
  ];
22
22
 
23
23
  const defaultVariant = {
24
+ "tone": "brand",
24
25
  "size": 32
25
26
  };
26
27
 
27
28
  const compoundVariants = [];
28
29
 
29
30
  export const switchVariantMap = {
31
+ "tone": [
32
+ "neutral",
33
+ "brand"
34
+ ],
30
35
  "size": [
31
36
  "16",
32
37
  "24",
package/vars/component/badge.d.ts CHANGED
@@ -189,7 +189,7 @@ export declare const vars: {
189
189
  "color": "var(--seed-color-bg-warning-solid)"
190
190
  },
191
191
  "label": {
192
- "color": "var(--seed-color-fg-neutral)"
192
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
193
193
  }
194
194
  }
195
195
  },
package/vars/component/badge.mjs CHANGED
@@ -189,7 +189,7 @@ export const vars = {
189
189
  "color": "var(--seed-color-bg-warning-solid)"
190
190
  },
191
191
  "label": {
192
- "color": "var(--seed-color-fg-neutral)"
192
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
193
193
  }
194
194
  }
195
195
  },
package/vars/component/checkbox.d.ts CHANGED
@@ -14,14 +14,14 @@ export declare const vars: {
14
14
  }
15
15
  }
16
16
  },
17
- "weightDefault": {
17
+ "weightRegular": {
18
18
  "enabled": {
19
19
  "label": {
20
20
  "fontWeight": "var(--seed-font-weight-regular)"
21
21
  }
22
22
  }
23
23
  },
24
- "weightStronger": {
24
+ "weightBold": {
25
25
  "enabled": {
26
26
  "label": {
27
27
  "fontWeight": "var(--seed-font-weight-bold)"
package/vars/component/checkbox.mjs CHANGED
@@ -14,14 +14,14 @@ export const vars = {
14
14
  }
15
15
  }
16
16
  },
17
- "weightDefault": {
17
+ "weightRegular": {
18
18
  "enabled": {
19
19
  "label": {
20
20
  "fontWeight": "var(--seed-font-weight-regular)"
21
21
  }
22
22
  }
23
23
  },
24
- "weightStronger": {
24
+ "weightBold": {
25
25
  "enabled": {
26
26
  "label": {
27
27
  "fontWeight": "var(--seed-font-weight-bold)"
package/vars/component/checkmark.d.ts CHANGED
@@ -2,16 +2,8 @@ export declare const vars: {
2
2
  "variantSquare": {
3
3
  "enabled": {
4
4
  "root": {
5
- "strokeColor": "var(--seed-color-stroke-neutral-weak)",
6
- "strokeWidth": "1px"
7
- }
8
- },
9
- "enabledSelected": {
10
- "root": {
11
- "color": "var(--seed-color-bg-brand-solid)"
12
- },
13
- "icon": {
14
- "color": "var(--seed-color-palette-static-white)"
5
+ "strokeWidth": "1px",
6
+ "strokeColor": "var(--seed-color-stroke-neutral-weak)"
15
7
  }
16
8
  },
17
9
  "pressed": {
@@ -19,12 +11,10 @@ export declare const vars: {
19
11
  "color": "var(--seed-color-bg-layer-default-pressed)"
20
12
  }
21
13
  },
22
- "pressedSelected": {
14
+ "enabledSelected": {
23
15
  "root": {
24
- "color": "var(--seed-color-bg-brand-solid-pressed)"
25
- },
26
- "icon": {
27
- "color": "var(--seed-color-palette-static-white)"
16
+ "strokeWidth": "0px",
17
+ "strokeColor": "#00000000"
28
18
  }
29
19
  },
30
20
  "disabled": {
@@ -42,25 +32,45 @@ export declare const vars: {
42
32
  }
43
33
  }
44
34
  },
45
- "variantGhost": {
46
- "enabled": {
35
+ "variantSquareToneBrand": {
36
+ "enabledSelected": {
37
+ "root": {
38
+ "color": "var(--seed-color-bg-brand-solid)"
39
+ },
47
40
  "icon": {
48
- "color": "var(--seed-color-fg-placeholder)"
41
+ "color": "var(--seed-color-palette-static-white)"
49
42
  }
50
43
  },
44
+ "pressedSelected": {
45
+ "root": {
46
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
47
+ }
48
+ }
49
+ },
50
+ "variantSquareToneNeutral": {
51
51
  "enabledSelected": {
52
+ "root": {
53
+ "color": "var(--seed-color-bg-neutral-inverted)"
54
+ },
52
55
  "icon": {
53
- "color": "var(--seed-color-fg-brand)"
56
+ "color": "var(--seed-color-fg-neutral-inverted)"
54
57
  }
55
58
  },
56
- "pressed": {
59
+ "pressedSelected": {
57
60
  "root": {
58
- "color": "var(--seed-color-bg-layer-default-pressed)"
61
+ "color": "var(--seed-color-bg-neutral-inverted-pressed)"
62
+ }
63
+ }
64
+ },
65
+ "variantGhost": {
66
+ "enabled": {
67
+ "icon": {
68
+ "color": "var(--seed-color-fg-placeholder)"
59
69
  }
60
70
  },
61
- "pressedSelected": {
71
+ "pressed": {
62
72
  "root": {
63
- "color": "var(--seed-color-palette-carrot-200)"
73
+ "color": "var(--seed-color-bg-layer-default-pressed)"
64
74
  }
65
75
  },
66
76
  "disabled": {
@@ -74,6 +84,30 @@ export declare const vars: {
74
84
  }
75
85
  }
76
86
  },
87
+ "variantGhostToneBrand": {
88
+ "enabledSelected": {
89
+ "icon": {
90
+ "color": "var(--seed-color-fg-brand)"
91
+ }
92
+ },
93
+ "pressedSelected": {
94
+ "root": {
95
+ "color": "var(--seed-color-palette-carrot-200)"
96
+ }
97
+ }
98
+ },
99
+ "variantGhostToneNeutral": {
100
+ "enabledSelected": {
101
+ "icon": {
102
+ "color": "var(--seed-color-fg-neutral-muted)"
103
+ }
104
+ },
105
+ "pressedSelected": {
106
+ "root": {
107
+ "color": "var(--seed-color-palette-gray-200)"
108
+ }
109
+ }
110
+ },
77
111
  "sizeMedium": {
78
112
  "enabled": {
79
113
  "root": {
package/vars/component/checkmark.mjs CHANGED
@@ -2,16 +2,8 @@ export const vars = {
2
2
  "variantSquare": {
3
3
  "enabled": {
4
4
  "root": {
5
- "strokeColor": "var(--seed-color-stroke-neutral-weak)",
6
- "strokeWidth": "1px"
7
- }
8
- },
9
- "enabledSelected": {
10
- "root": {
11
- "color": "var(--seed-color-bg-brand-solid)"
12
- },
13
- "icon": {
14
- "color": "var(--seed-color-palette-static-white)"
5
+ "strokeWidth": "1px",
6
+ "strokeColor": "var(--seed-color-stroke-neutral-weak)"
15
7
  }
16
8
  },
17
9
  "pressed": {
@@ -19,12 +11,10 @@ export const vars = {
19
11
  "color": "var(--seed-color-bg-layer-default-pressed)"
20
12
  }
21
13
  },
22
- "pressedSelected": {
14
+ "enabledSelected": {
23
15
  "root": {
24
- "color": "var(--seed-color-bg-brand-solid-pressed)"
25
- },
26
- "icon": {
27
- "color": "var(--seed-color-palette-static-white)"
16
+ "strokeWidth": "0px",
17
+ "strokeColor": "#00000000"
28
18
  }
29
19
  },
30
20
  "disabled": {
@@ -42,25 +32,45 @@ export const vars = {
42
32
  }
43
33
  }
44
34
  },
45
- "variantGhost": {
46
- "enabled": {
35
+ "variantSquareToneBrand": {
36
+ "enabledSelected": {
37
+ "root": {
38
+ "color": "var(--seed-color-bg-brand-solid)"
39
+ },
47
40
  "icon": {
48
- "color": "var(--seed-color-fg-placeholder)"
41
+ "color": "var(--seed-color-palette-static-white)"
49
42
  }
50
43
  },
44
+ "pressedSelected": {
45
+ "root": {
46
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
47
+ }
48
+ }
49
+ },
50
+ "variantSquareToneNeutral": {
51
51
  "enabledSelected": {
52
+ "root": {
53
+ "color": "var(--seed-color-bg-neutral-inverted)"
54
+ },
52
55
  "icon": {
53
- "color": "var(--seed-color-fg-brand)"
56
+ "color": "var(--seed-color-fg-neutral-inverted)"
54
57
  }
55
58
  },
56
- "pressed": {
59
+ "pressedSelected": {
57
60
  "root": {
58
- "color": "var(--seed-color-bg-layer-default-pressed)"
61
+ "color": "var(--seed-color-bg-neutral-inverted-pressed)"
62
+ }
63
+ }
64
+ },
65
+ "variantGhost": {
66
+ "enabled": {
67
+ "icon": {
68
+ "color": "var(--seed-color-fg-placeholder)"
59
69
  }
60
70
  },
61
- "pressedSelected": {
71
+ "pressed": {
62
72
  "root": {
63
- "color": "var(--seed-color-palette-carrot-200)"
73
+ "color": "var(--seed-color-bg-layer-default-pressed)"
64
74
  }
65
75
  },
66
76
  "disabled": {
@@ -74,6 +84,30 @@ export const vars = {
74
84
  }
75
85
  }
76
86
  },
87
+ "variantGhostToneBrand": {
88
+ "enabledSelected": {
89
+ "icon": {
90
+ "color": "var(--seed-color-fg-brand)"
91
+ }
92
+ },
93
+ "pressedSelected": {
94
+ "root": {
95
+ "color": "var(--seed-color-palette-carrot-200)"
96
+ }
97
+ }
98
+ },
99
+ "variantGhostToneNeutral": {
100
+ "enabledSelected": {
101
+ "icon": {
102
+ "color": "var(--seed-color-fg-neutral-muted)"
103
+ }
104
+ },
105
+ "pressedSelected": {
106
+ "root": {
107
+ "color": "var(--seed-color-palette-gray-200)"
108
+ }
109
+ }
110
+ },
77
111
  "sizeMedium": {
78
112
  "enabled": {
79
113
  "root": {
package/vars/component/page-banner.d.ts CHANGED
@@ -231,19 +231,19 @@ export declare const vars: {
231
231
  "color": "var(--seed-color-bg-warning-solid)"
232
232
  },
233
233
  "prefixIcon": {
234
- "color": "var(--seed-color-fg-neutral)"
234
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
235
235
  },
236
236
  "title": {
237
- "color": "var(--seed-color-fg-neutral)"
237
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
238
238
  },
239
239
  "description": {
240
- "color": "var(--seed-color-fg-neutral)"
240
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
241
241
  },
242
242
  "button": {
243
- "color": "var(--seed-color-fg-neutral)"
243
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
244
244
  },
245
245
  "suffixIcon": {
246
- "color": "var(--seed-color-fg-neutral)"
246
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
247
247
  }
248
248
  },
249
249
  "pressed": {
package/vars/component/page-banner.mjs CHANGED
@@ -231,19 +231,19 @@ export const vars = {
231
231
  "color": "var(--seed-color-bg-warning-solid)"
232
232
  },
233
233
  "prefixIcon": {
234
- "color": "var(--seed-color-fg-neutral)"
234
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
235
235
  },
236
236
  "title": {
237
- "color": "var(--seed-color-fg-neutral)"
237
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
238
238
  },
239
239
  "description": {
240
- "color": "var(--seed-color-fg-neutral)"
240
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
241
241
  },
242
242
  "button": {
243
- "color": "var(--seed-color-fg-neutral)"
243
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
244
244
  },
245
245
  "suffixIcon": {
246
- "color": "var(--seed-color-fg-neutral)"
246
+ "color": "var(--seed-color-palette-static-black-alpha-900)"
247
247
  }
248
248
  },
249
249
  "pressed": {
package/vars/component/radio.d.ts CHANGED
@@ -14,14 +14,14 @@ export declare const vars: {
14
14
  }
15
15
  }
16
16
  },
17
- "weightDefault": {
17
+ "weightRegular": {
18
18
  "enabled": {
19
19
  "label": {
20
20
  "fontWeight": "var(--seed-font-weight-regular)"
21
21
  }
22
22
  }
23
23
  },
24
- "weightStronger": {
24
+ "weightBold": {
25
25
  "enabled": {
26
26
  "label": {
27
27
  "fontWeight": "var(--seed-font-weight-bold)"
package/vars/component/radio.mjs CHANGED
@@ -14,14 +14,14 @@ export const vars = {
14
14
  }
15
15
  }
16
16
  },
17
- "weightDefault": {
17
+ "weightRegular": {
18
18
  "enabled": {
19
19
  "label": {
20
20
  "fontWeight": "var(--seed-font-weight-regular)"
21
21
  }
22
22
  }
23
23
  },
24
- "weightStronger": {
24
+ "weightBold": {
25
25
  "enabled": {
26
26
  "label": {
27
27
  "fontWeight": "var(--seed-font-weight-bold)"
package/vars/component/radiomark.d.ts CHANGED
@@ -2,7 +2,6 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "color": "var(--seed-color-bg-layer-default)",
6
5
  "strokeWidth": "1px",
7
6
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
8
7
  "cornerRadius": "var(--seed-radius-full)"
@@ -18,16 +17,8 @@ export declare const vars: {
18
17
  },
19
18
  "enabledSelected": {
20
19
  "root": {
21
- "color": "var(--seed-color-bg-brand-solid)",
22
- "strokeWidth": "0px"
23
- },
24
- "icon": {
25
- "color": "var(--seed-color-palette-static-white)"
26
- }
27
- },
28
- "enabledSelectedPressed": {
29
- "root": {
30
- "color": "var(--seed-color-bg-brand-solid-pressed)"
20
+ "strokeWidth": "0px",
21
+ "strokeColor": "#00000000"
31
22
  }
32
23
  },
33
24
  "disabled": {
@@ -44,6 +35,36 @@ export declare const vars: {
44
35
  }
45
36
  }
46
37
  },
38
+ "toneBrand": {
39
+ "enabledSelected": {
40
+ "root": {
41
+ "color": "var(--seed-color-bg-brand-solid)"
42
+ },
43
+ "icon": {
44
+ "color": "var(--seed-color-palette-static-white)"
45
+ }
46
+ },
47
+ "enabledSelectedPressed": {
48
+ "root": {
49
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
50
+ }
51
+ }
52
+ },
53
+ "toneNeutral": {
54
+ "enabledSelected": {
55
+ "root": {
56
+ "color": "var(--seed-color-bg-neutral-inverted)"
57
+ },
58
+ "icon": {
59
+ "color": "var(--seed-color-fg-neutral-inverted)"
60
+ }
61
+ },
62
+ "enabledSelectedPressed": {
63
+ "root": {
64
+ "color": "var(--seed-color-bg-neutral-inverted-pressed)"
65
+ }
66
+ }
67
+ },
47
68
  "sizeMedium": {
48
69
  "enabled": {
49
70
  "root": {
package/vars/component/radiomark.mjs CHANGED
@@ -2,7 +2,6 @@ export const vars = {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "color": "var(--seed-color-bg-layer-default)",
6
5
  "strokeWidth": "1px",
7
6
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
8
7
  "cornerRadius": "var(--seed-radius-full)"
@@ -18,16 +17,8 @@ export const vars = {
18
17
  },
19
18
  "enabledSelected": {
20
19
  "root": {
21
- "color": "var(--seed-color-bg-brand-solid)",
22
- "strokeWidth": "0px"
23
- },
24
- "icon": {
25
- "color": "var(--seed-color-palette-static-white)"
26
- }
27
- },
28
- "enabledSelectedPressed": {
29
- "root": {
30
- "color": "var(--seed-color-bg-brand-solid-pressed)"
20
+ "strokeWidth": "0px",
21
+ "strokeColor": "#00000000"
31
22
  }
32
23
  },
33
24
  "disabled": {
@@ -44,6 +35,36 @@ export const vars = {
44
35
  }
45
36
  }
46
37
  },
38
+ "toneBrand": {
39
+ "enabledSelected": {
40
+ "root": {
41
+ "color": "var(--seed-color-bg-brand-solid)"
42
+ },
43
+ "icon": {
44
+ "color": "var(--seed-color-palette-static-white)"
45
+ }
46
+ },
47
+ "enabledSelectedPressed": {
48
+ "root": {
49
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
50
+ }
51
+ }
52
+ },
53
+ "toneNeutral": {
54
+ "enabledSelected": {
55
+ "root": {
56
+ "color": "var(--seed-color-bg-neutral-inverted)"
57
+ },
58
+ "icon": {
59
+ "color": "var(--seed-color-fg-neutral-inverted)"
60
+ }
61
+ },
62
+ "enabledSelectedPressed": {
63
+ "root": {
64
+ "color": "var(--seed-color-bg-neutral-inverted-pressed)"
65
+ }
66
+ }
67
+ },
47
68
  "sizeMedium": {
48
69
  "enabled": {
49
70
  "root": {
package/vars/component/segmented-control-item.d.ts CHANGED
@@ -2,16 +2,22 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "height": "var(--seed-dimension-x8)",
5
+ "minWidth": "86px",
6
+ "minHeight": "34px",
7
+ "paddingX": "var(--seed-dimension-x6)",
8
+ "paddingY": "var(--seed-dimension-x1_5)",
6
9
  "cornerRadius": "var(--seed-radius-full)",
7
- "paddingX": "var(--seed-dimension-x4)",
8
- "minWidth": "86px"
10
+ "gap": "var(--seed-dimension-x1_5)",
11
+ "colorDuration": "var(--seed-duration-d4)",
12
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
9
13
  },
10
14
  "label": {
11
15
  "fontSize": "var(--seed-font-size-t5)",
12
16
  "lineHeight": "var(--seed-line-height-t5)",
13
- "fontWeight": "var(--seed-font-weight-medium)",
14
- "color": "var(--seed-color-fg-neutral-muted)"
17
+ "fontWeight": "var(--seed-font-weight-bold)",
18
+ "color": "var(--seed-color-fg-neutral-subtle)",
19
+ "colorDuration": "var(--seed-duration-d4)",
20
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
15
21
  }
16
22
  },
17
23
  "pressed": {
@@ -21,14 +27,23 @@ export declare const vars: {
21
27
  },
22
28
  "selected": {
23
29
  "label": {
24
- "fontWeight": "var(--seed-font-weight-bold)",
25
30
  "color": "var(--seed-color-fg-neutral)"
26
31
  }
27
32
  },
33
+ "selectedPressed": {
34
+ "root": {
35
+ "color": "var(--seed-color-palette-gray-100)"
36
+ }
37
+ },
28
38
  "disabled": {
29
39
  "label": {
30
40
  "color": "var(--seed-color-fg-disabled)"
31
41
  }
42
+ },
43
+ "disabledSelected": {
44
+ "root": {
45
+ "color": "var(--seed-color-bg-disabled)"
46
+ }
32
47
  }
33
48
  }
34
49
  }