@seed-design/css 1.1.4 → 1.1.6

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 (54) hide show
  1. package/all.css +71 -47
  2. package/all.min.css +1 -1
  3. package/base.css +5 -0
  4. package/base.min.css +1 -1
  5. package/package.json +1 -1
  6. package/recipes/action-button.css +11 -11
  7. package/recipes/bottom-sheet-handle.css +1 -1
  8. package/recipes/checkmark.css +3 -2
  9. package/recipes/chip-tabs.css +4 -3
  10. package/recipes/chip.css +5 -5
  11. package/recipes/contextual-floating-button.css +1 -1
  12. package/recipes/floating-action-button.css +1 -1
  13. package/recipes/input-button.css +17 -7
  14. package/recipes/list-item.css +5 -5
  15. package/recipes/radiomark.css +3 -2
  16. package/recipes/reaction-button.css +7 -6
  17. package/recipes/segmented-control.css +1 -1
  18. package/recipes/select-box.css +3 -1
  19. package/recipes/text-input.css +1 -1
  20. package/recipes/toggle-button.css +1 -1
  21. package/vars/color/bg.d.ts +3 -1
  22. package/vars/color/bg.mjs +3 -1
  23. package/vars/component/action-button.d.ts +11 -11
  24. package/vars/component/action-button.mjs +11 -11
  25. package/vars/component/bottom-sheet-handle.d.ts +1 -1
  26. package/vars/component/bottom-sheet-handle.mjs +1 -1
  27. package/vars/component/checkmark.d.ts +10 -2
  28. package/vars/component/checkmark.mjs +10 -2
  29. package/vars/component/chip-tab.d.ts +5 -2
  30. package/vars/component/chip-tab.mjs +5 -2
  31. package/vars/component/chip.d.ts +7 -7
  32. package/vars/component/chip.mjs +7 -7
  33. package/vars/component/contextual-floating-button.d.ts +1 -1
  34. package/vars/component/contextual-floating-button.mjs +1 -1
  35. package/vars/component/floating-action-button.d.ts +1 -1
  36. package/vars/component/floating-action-button.mjs +1 -1
  37. package/vars/component/input-button.d.ts +16 -4
  38. package/vars/component/input-button.mjs +16 -4
  39. package/vars/component/list-item.d.ts +3 -2
  40. package/vars/component/list-item.mjs +3 -2
  41. package/vars/component/radiomark.d.ts +4 -1
  42. package/vars/component/radiomark.mjs +4 -1
  43. package/vars/component/reaction-button.d.ts +8 -6
  44. package/vars/component/reaction-button.mjs +8 -6
  45. package/vars/component/segmented-control-item.d.ts +2 -2
  46. package/vars/component/segmented-control-item.mjs +2 -2
  47. package/vars/component/select-box.d.ts +5 -2
  48. package/vars/component/select-box.mjs +5 -2
  49. package/vars/component/text-input.d.ts +1 -1
  50. package/vars/component/text-input.mjs +1 -1
  51. package/vars/component/toggle-button.d.ts +1 -1
  52. package/vars/component/toggle-button.mjs +1 -1
  53. package/vars/duration.d.ts +2 -1
  54. package/vars/duration.mjs +2 -1
package/vars/component/action-button.d.ts CHANGED
@@ -2,7 +2,7 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "colorDuration": "var(--seed-duration-d4)",
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
6
  "colorTimingFunction": "var(--seed-timing-function-easing)"
7
7
  },
8
8
  "label": {
@@ -213,7 +213,7 @@ export declare const vars: {
213
213
  "variantNeutralOutline": {
214
214
  "enabled": {
215
215
  "root": {
216
- "color": "var(--seed-color-bg-layer-default)",
216
+ "color": "var(--seed-color-bg-transparent)",
217
217
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
218
218
  "strokeWidth": "1px"
219
219
  },
@@ -236,12 +236,12 @@ export declare const vars: {
236
236
  },
237
237
  "pressed": {
238
238
  "root": {
239
- "color": "var(--seed-color-bg-layer-default-pressed)"
239
+ "color": "var(--seed-color-bg-transparent-pressed)"
240
240
  }
241
241
  },
242
242
  "disabled": {
243
243
  "root": {
244
- "color": "var(--seed-color-bg-layer-default)",
244
+ "color": "var(--seed-color-bg-transparent)",
245
245
  "strokeColor": "var(--seed-color-stroke-neutral-muted)"
246
246
  },
247
247
  "label": {
@@ -259,14 +259,14 @@ export declare const vars: {
259
259
  },
260
260
  "loading": {
261
261
  "root": {
262
- "color": "var(--seed-color-bg-layer-default)"
262
+ "color": "var(--seed-color-bg-transparent)"
263
263
  }
264
264
  }
265
265
  },
266
266
  "variantBrandOutline": {
267
267
  "enabled": {
268
268
  "root": {
269
- "color": "var(--seed-color-bg-layer-default)",
269
+ "color": "var(--seed-color-bg-transparent)",
270
270
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
271
271
  "strokeWidth": "1px"
272
272
  },
@@ -289,12 +289,12 @@ export declare const vars: {
289
289
  },
290
290
  "pressed": {
291
291
  "root": {
292
- "color": "var(--seed-color-bg-layer-default-pressed)"
292
+ "color": "var(--seed-color-bg-transparent-pressed)"
293
293
  }
294
294
  },
295
295
  "disabled": {
296
296
  "root": {
297
- "color": "var(--seed-color-bg-layer-default)",
297
+ "color": "var(--seed-color-bg-transparent)",
298
298
  "strokeColor": "var(--seed-color-stroke-neutral-muted)"
299
299
  },
300
300
  "label": {
@@ -312,7 +312,7 @@ export declare const vars: {
312
312
  },
313
313
  "loading": {
314
314
  "root": {
315
- "color": "var(--seed-color-bg-layer-default)"
315
+ "color": "var(--seed-color-bg-transparent)"
316
316
  }
317
317
  }
318
318
  },
@@ -340,7 +340,7 @@ export declare const vars: {
340
340
  },
341
341
  "pressed": {
342
342
  "root": {
343
- "color": "var(--seed-color-bg-layer-default-pressed)"
343
+ "color": "var(--seed-color-bg-transparent-pressed)"
344
344
  }
345
345
  },
346
346
  "disabled": {
@@ -362,7 +362,7 @@ export declare const vars: {
362
362
  },
363
363
  "loading": {
364
364
  "root": {
365
- "color": "var(--seed-color-bg-layer-default-pressed)"
365
+ "color": "var(--seed-color-bg-transparent-pressed)"
366
366
  }
367
367
  }
368
368
  },
package/vars/component/action-button.mjs CHANGED
@@ -2,7 +2,7 @@ export const vars = {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "colorDuration": "var(--seed-duration-d4)",
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
6
  "colorTimingFunction": "var(--seed-timing-function-easing)"
7
7
  },
8
8
  "label": {
@@ -213,7 +213,7 @@ export const vars = {
213
213
  "variantNeutralOutline": {
214
214
  "enabled": {
215
215
  "root": {
216
- "color": "var(--seed-color-bg-layer-default)",
216
+ "color": "var(--seed-color-bg-transparent)",
217
217
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
218
218
  "strokeWidth": "1px"
219
219
  },
@@ -236,12 +236,12 @@ export const vars = {
236
236
  },
237
237
  "pressed": {
238
238
  "root": {
239
- "color": "var(--seed-color-bg-layer-default-pressed)"
239
+ "color": "var(--seed-color-bg-transparent-pressed)"
240
240
  }
241
241
  },
242
242
  "disabled": {
243
243
  "root": {
244
- "color": "var(--seed-color-bg-layer-default)",
244
+ "color": "var(--seed-color-bg-transparent)",
245
245
  "strokeColor": "var(--seed-color-stroke-neutral-muted)"
246
246
  },
247
247
  "label": {
@@ -259,14 +259,14 @@ export const vars = {
259
259
  },
260
260
  "loading": {
261
261
  "root": {
262
- "color": "var(--seed-color-bg-layer-default)"
262
+ "color": "var(--seed-color-bg-transparent)"
263
263
  }
264
264
  }
265
265
  },
266
266
  "variantBrandOutline": {
267
267
  "enabled": {
268
268
  "root": {
269
- "color": "var(--seed-color-bg-layer-default)",
269
+ "color": "var(--seed-color-bg-transparent)",
270
270
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
271
271
  "strokeWidth": "1px"
272
272
  },
@@ -289,12 +289,12 @@ export const vars = {
289
289
  },
290
290
  "pressed": {
291
291
  "root": {
292
- "color": "var(--seed-color-bg-layer-default-pressed)"
292
+ "color": "var(--seed-color-bg-transparent-pressed)"
293
293
  }
294
294
  },
295
295
  "disabled": {
296
296
  "root": {
297
- "color": "var(--seed-color-bg-layer-default)",
297
+ "color": "var(--seed-color-bg-transparent)",
298
298
  "strokeColor": "var(--seed-color-stroke-neutral-muted)"
299
299
  },
300
300
  "label": {
@@ -312,7 +312,7 @@ export const vars = {
312
312
  },
313
313
  "loading": {
314
314
  "root": {
315
- "color": "var(--seed-color-bg-layer-default)"
315
+ "color": "var(--seed-color-bg-transparent)"
316
316
  }
317
317
  }
318
318
  },
@@ -340,7 +340,7 @@ export const vars = {
340
340
  },
341
341
  "pressed": {
342
342
  "root": {
343
- "color": "var(--seed-color-bg-layer-default-pressed)"
343
+ "color": "var(--seed-color-bg-transparent-pressed)"
344
344
  }
345
345
  },
346
346
  "disabled": {
@@ -362,7 +362,7 @@ export const vars = {
362
362
  },
363
363
  "loading": {
364
364
  "root": {
365
- "color": "var(--seed-color-bg-layer-default-pressed)"
365
+ "color": "var(--seed-color-bg-transparent-pressed)"
366
366
  }
367
367
  }
368
368
  },
package/vars/component/bottom-sheet-handle.d.ts CHANGED
@@ -7,7 +7,7 @@ export declare const vars: {
7
7
  "height": "4px",
8
8
  "color": "var(--seed-color-palette-gray-400)",
9
9
  "borderRadius": "9999px",
10
- "colorDuration": "var(--seed-duration-d4)",
10
+ "colorDuration": "var(--seed-duration-color-transition)",
11
11
  "colorTimingFunction": "var(--seed-timing-function-easing)"
12
12
  },
13
13
  "touchArea": {
package/vars/component/bottom-sheet-handle.mjs CHANGED
@@ -7,7 +7,7 @@ export const vars = {
7
7
  "height": "4px",
8
8
  "color": "var(--seed-color-palette-gray-400)",
9
9
  "borderRadius": "9999px",
10
- "colorDuration": "var(--seed-duration-d4)",
10
+ "colorDuration": "var(--seed-duration-color-transition)",
11
11
  "colorTimingFunction": "var(--seed-timing-function-easing)"
12
12
  },
13
13
  "touchArea": {
package/vars/component/checkmark.d.ts CHANGED
@@ -1,4 +1,12 @@
1
1
  export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
7
+ }
8
+ }
9
+ },
2
10
  "variantSquare": {
3
11
  "enabled": {
4
12
  "root": {
@@ -8,7 +16,7 @@ export declare const vars: {
8
16
  },
9
17
  "pressed": {
10
18
  "root": {
11
- "color": "var(--seed-color-bg-layer-default-pressed)"
19
+ "color": "var(--seed-color-bg-transparent-pressed)"
12
20
  }
13
21
  },
14
22
  "enabledSelected": {
@@ -70,7 +78,7 @@ export declare const vars: {
70
78
  },
71
79
  "pressed": {
72
80
  "root": {
73
- "color": "var(--seed-color-bg-layer-default-pressed)"
81
+ "color": "var(--seed-color-bg-transparent-pressed)"
74
82
  }
75
83
  },
76
84
  "disabled": {
package/vars/component/checkmark.mjs CHANGED
@@ -1,4 +1,12 @@
1
1
  export const vars = {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
7
+ }
8
+ }
9
+ },
2
10
  "variantSquare": {
3
11
  "enabled": {
4
12
  "root": {
@@ -8,7 +16,7 @@ export const vars = {
8
16
  },
9
17
  "pressed": {
10
18
  "root": {
11
- "color": "var(--seed-color-bg-layer-default-pressed)"
19
+ "color": "var(--seed-color-bg-transparent-pressed)"
12
20
  }
13
21
  },
14
22
  "enabledSelected": {
@@ -70,7 +78,7 @@ export const vars = {
70
78
  },
71
79
  "pressed": {
72
80
  "root": {
73
- "color": "var(--seed-color-bg-layer-default-pressed)"
81
+ "color": "var(--seed-color-bg-transparent-pressed)"
74
82
  }
75
83
  },
76
84
  "disabled": {
package/vars/component/chip-tab.d.ts CHANGED
@@ -2,6 +2,8 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)",
5
7
  "paddingY": "var(--seed-dimension-x2)",
6
8
  "cornerRadius": "var(--seed-radius-full)"
7
9
  },
@@ -43,7 +45,7 @@ export declare const vars: {
43
45
  },
44
46
  "enabledPressed": {
45
47
  "root": {
46
- "color": "var(--seed-color-bg-layer-default-pressed)"
48
+ "color": "var(--seed-color-bg-transparent-pressed)"
47
49
  }
48
50
  },
49
51
  "selected": {
@@ -76,6 +78,7 @@ export declare const vars: {
76
78
  "variantNeutralOutline": {
77
79
  "enabled": {
78
80
  "root": {
81
+ "color": "var(--seed-color-bg-transparent)",
79
82
  "stroke": "var(--seed-color-stroke-neutral-muted)"
80
83
  },
81
84
  "label": {
@@ -84,7 +87,7 @@ export declare const vars: {
84
87
  },
85
88
  "enabledPressed": {
86
89
  "root": {
87
- "color": "var(--seed-color-bg-layer-default-pressed)"
90
+ "color": "var(--seed-color-bg-transparent-pressed)"
88
91
  }
89
92
  },
90
93
  "selected": {
package/vars/component/chip-tab.mjs CHANGED
@@ -2,6 +2,8 @@ export const vars = {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)",
5
7
  "paddingY": "var(--seed-dimension-x2)",
6
8
  "cornerRadius": "var(--seed-radius-full)"
7
9
  },
@@ -43,7 +45,7 @@ export const vars = {
43
45
  },
44
46
  "enabledPressed": {
45
47
  "root": {
46
- "color": "var(--seed-color-bg-layer-default-pressed)"
48
+ "color": "var(--seed-color-bg-transparent-pressed)"
47
49
  }
48
50
  },
49
51
  "selected": {
@@ -76,6 +78,7 @@ export const vars = {
76
78
  "variantNeutralOutline": {
77
79
  "enabled": {
78
80
  "root": {
81
+ "color": "var(--seed-color-bg-transparent)",
79
82
  "stroke": "var(--seed-color-stroke-neutral-muted)"
80
83
  },
81
84
  "label": {
@@ -84,7 +87,7 @@ export const vars = {
84
87
  },
85
88
  "enabledPressed": {
86
89
  "root": {
87
- "color": "var(--seed-color-bg-layer-default-pressed)"
90
+ "color": "var(--seed-color-bg-transparent-pressed)"
88
91
  }
89
92
  },
90
93
  "selected": {
package/vars/component/chip.d.ts CHANGED
@@ -2,7 +2,7 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "colorDuration": "var(--seed-duration-d4)",
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
6
  "colorTimingFunction": "var(--seed-timing-function-easing)",
7
7
  "cornerRadius": "var(--seed-radius-full)"
8
8
  },
@@ -83,9 +83,9 @@ export declare const vars: {
83
83
  "variantOutlineStrong": {
84
84
  "enabled": {
85
85
  "root": {
86
+ "color": "var(--seed-color-bg-transparent)",
86
87
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
87
- "strokeWidth": "1px",
88
- "color": "var(--seed-color-bg-layer-default)"
88
+ "strokeWidth": "1px"
89
89
  },
90
90
  "label": {
91
91
  "color": "var(--seed-color-fg-neutral)"
@@ -102,7 +102,7 @@ export declare const vars: {
102
102
  },
103
103
  "pressed": {
104
104
  "root": {
105
- "color": "var(--seed-color-bg-layer-default-pressed)"
105
+ "color": "var(--seed-color-bg-transparent-pressed)"
106
106
  }
107
107
  },
108
108
  "disabled": {
@@ -141,9 +141,9 @@ export declare const vars: {
141
141
  "variantOutlineWeak": {
142
142
  "enabled": {
143
143
  "root": {
144
+ "color": "var(--seed-color-bg-transparent)",
144
145
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
145
- "strokeWidth": "1px",
146
- "color": "var(--seed-color-bg-layer-default)"
146
+ "strokeWidth": "1px"
147
147
  },
148
148
  "label": {
149
149
  "color": "var(--seed-color-fg-neutral)"
@@ -160,7 +160,7 @@ export declare const vars: {
160
160
  },
161
161
  "pressed": {
162
162
  "root": {
163
- "color": "var(--seed-color-bg-layer-default-pressed)"
163
+ "color": "var(--seed-color-bg-transparent-pressed)"
164
164
  }
165
165
  },
166
166
  "disabled": {
package/vars/component/chip.mjs CHANGED
@@ -2,7 +2,7 @@ export const vars = {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
- "colorDuration": "var(--seed-duration-d4)",
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
6
  "colorTimingFunction": "var(--seed-timing-function-easing)",
7
7
  "cornerRadius": "var(--seed-radius-full)"
8
8
  },
@@ -83,9 +83,9 @@ export const vars = {
83
83
  "variantOutlineStrong": {
84
84
  "enabled": {
85
85
  "root": {
86
+ "color": "var(--seed-color-bg-transparent)",
86
87
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
87
- "strokeWidth": "1px",
88
- "color": "var(--seed-color-bg-layer-default)"
88
+ "strokeWidth": "1px"
89
89
  },
90
90
  "label": {
91
91
  "color": "var(--seed-color-fg-neutral)"
@@ -102,7 +102,7 @@ export const vars = {
102
102
  },
103
103
  "pressed": {
104
104
  "root": {
105
- "color": "var(--seed-color-bg-layer-default-pressed)"
105
+ "color": "var(--seed-color-bg-transparent-pressed)"
106
106
  }
107
107
  },
108
108
  "disabled": {
@@ -141,9 +141,9 @@ export const vars = {
141
141
  "variantOutlineWeak": {
142
142
  "enabled": {
143
143
  "root": {
144
+ "color": "var(--seed-color-bg-transparent)",
144
145
  "strokeColor": "var(--seed-color-stroke-neutral-muted)",
145
- "strokeWidth": "1px",
146
- "color": "var(--seed-color-bg-layer-default)"
146
+ "strokeWidth": "1px"
147
147
  },
148
148
  "label": {
149
149
  "color": "var(--seed-color-fg-neutral)"
@@ -160,7 +160,7 @@ export const vars = {
160
160
  },
161
161
  "pressed": {
162
162
  "root": {
163
- "color": "var(--seed-color-bg-layer-default-pressed)"
163
+ "color": "var(--seed-color-bg-transparent-pressed)"
164
164
  }
165
165
  },
166
166
  "disabled": {
package/vars/component/contextual-floating-button.d.ts CHANGED
@@ -4,7 +4,7 @@ export declare const vars: {
4
4
  "root": {
5
5
  "cornerRadius": "var(--seed-radius-full)",
6
6
  "shadow": "0px 2px 6px 0px #00000026",
7
- "colorDuration": "var(--seed-duration-d4)",
7
+ "colorDuration": "var(--seed-duration-color-transition)",
8
8
  "colorTimingFunction": "var(--seed-timing-function-easing)"
9
9
  },
10
10
  "progressCircle": {
package/vars/component/contextual-floating-button.mjs CHANGED
@@ -4,7 +4,7 @@ export const vars = {
4
4
  "root": {
5
5
  "cornerRadius": "var(--seed-radius-full)",
6
6
  "shadow": "0px 2px 6px 0px #00000026",
7
- "colorDuration": "var(--seed-duration-d4)",
7
+ "colorDuration": "var(--seed-duration-color-transition)",
8
8
  "colorTimingFunction": "var(--seed-timing-function-easing)"
9
9
  },
10
10
  "progressCircle": {
package/vars/component/floating-action-button.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare const vars: {
5
5
  "color": "var(--seed-color-bg-brand-solid)",
6
6
  "cornerRadius": "var(--seed-radius-full)",
7
7
  "shadow": "0px 2px 6px 0px #00000026",
8
- "colorDuration": "var(--seed-duration-d4)",
8
+ "colorDuration": "var(--seed-duration-color-transition)",
9
9
  "colorTimingFunction": "var(--seed-timing-function-easing)",
10
10
  "layoutDuration": "var(--seed-duration-d4)",
11
11
  "layoutTimingFunction": "var(--seed-timing-function-easing)"
package/vars/component/floating-action-button.mjs CHANGED
@@ -5,7 +5,7 @@ export const vars = {
5
5
  "color": "var(--seed-color-bg-brand-solid)",
6
6
  "cornerRadius": "var(--seed-radius-full)",
7
7
  "shadow": "0px 2px 6px 0px #00000026",
8
- "colorDuration": "var(--seed-duration-d4)",
8
+ "colorDuration": "var(--seed-duration-color-transition)",
9
9
  "colorTimingFunction": "var(--seed-timing-function-easing)",
10
10
  "layoutDuration": "var(--seed-duration-d4)",
11
11
  "layoutTimingFunction": "var(--seed-timing-function-easing)"
package/vars/component/input-button.d.ts CHANGED
@@ -8,11 +8,12 @@ export declare const vars: {
8
8
  "paddingX": "var(--seed-dimension-x4)",
9
9
  "strokeWidth": "1px",
10
10
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
11
- "colorDuration": "var(--seed-duration-d3)",
11
+ "color": "var(--seed-color-bg-transparent)",
12
+ "colorDuration": "var(--seed-duration-color-transition)",
12
13
  "colorTimingFunction": "var(--seed-timing-function-easing)",
13
- "strokeColorDuration": "var(--seed-duration-d3)",
14
+ "strokeColorDuration": "var(--seed-duration-color-transition)",
14
15
  "strokeColorTimingFunction": "var(--seed-timing-function-easing)",
15
- "strokeWidthDuration": "var(--seed-duration-d3)",
16
+ "strokeWidthDuration": "var(--seed-duration-color-transition)",
16
17
  "strokeWidthTimingFunction": "var(--seed-timing-function-easing)"
17
18
  },
18
19
  "value": {
@@ -54,7 +55,7 @@ export declare const vars: {
54
55
  },
55
56
  "pressed": {
56
57
  "root": {
57
- "color": "var(--seed-color-bg-layer-default-pressed)"
58
+ "color": "var(--seed-color-bg-transparent-pressed)"
58
59
  }
59
60
  },
60
61
  "invalid": {
@@ -73,6 +74,17 @@ export declare const vars: {
73
74
  "placeholder": {
74
75
  "color": "var(--seed-color-fg-disabled)"
75
76
  }
77
+ },
78
+ "readonly": {
79
+ "root": {
80
+ "color": "var(--seed-color-bg-disabled)"
81
+ },
82
+ "value": {
83
+ "color": "var(--seed-color-fg-neutral)"
84
+ },
85
+ "placeholder": {
86
+ "color": "var(--seed-color-fg-placeholder)"
87
+ }
76
88
  }
77
89
  }
78
90
  }
package/vars/component/input-button.mjs CHANGED
@@ -8,11 +8,12 @@ export const vars = {
8
8
  "paddingX": "var(--seed-dimension-x4)",
9
9
  "strokeWidth": "1px",
10
10
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
11
- "colorDuration": "var(--seed-duration-d3)",
11
+ "color": "var(--seed-color-bg-transparent)",
12
+ "colorDuration": "var(--seed-duration-color-transition)",
12
13
  "colorTimingFunction": "var(--seed-timing-function-easing)",
13
- "strokeColorDuration": "var(--seed-duration-d3)",
14
+ "strokeColorDuration": "var(--seed-duration-color-transition)",
14
15
  "strokeColorTimingFunction": "var(--seed-timing-function-easing)",
15
- "strokeWidthDuration": "var(--seed-duration-d3)",
16
+ "strokeWidthDuration": "var(--seed-duration-color-transition)",
16
17
  "strokeWidthTimingFunction": "var(--seed-timing-function-easing)"
17
18
  },
18
19
  "value": {
@@ -54,7 +55,7 @@ export const vars = {
54
55
  },
55
56
  "pressed": {
56
57
  "root": {
57
- "color": "var(--seed-color-bg-layer-default-pressed)"
58
+ "color": "var(--seed-color-bg-transparent-pressed)"
58
59
  }
59
60
  },
60
61
  "invalid": {
@@ -73,6 +74,17 @@ export const vars = {
73
74
  "placeholder": {
74
75
  "color": "var(--seed-color-fg-disabled)"
75
76
  }
77
+ },
78
+ "readonly": {
79
+ "root": {
80
+ "color": "var(--seed-color-bg-disabled)"
81
+ },
82
+ "value": {
83
+ "color": "var(--seed-color-fg-neutral)"
84
+ },
85
+ "placeholder": {
86
+ "color": "var(--seed-color-fg-placeholder)"
87
+ }
76
88
  }
77
89
  }
78
90
  }
package/vars/component/list-item.d.ts CHANGED
@@ -4,10 +4,11 @@ export declare const vars: {
4
4
  "root": {
5
5
  "paddingY": "var(--seed-dimension-x3)",
6
6
  "paddingX": "var(--seed-dimension-spacing-x-global-gutter)",
7
- "colorDuration": "var(--seed-duration-d3)",
7
+ "colorDuration": "var(--seed-duration-color-transition)",
8
8
  "colorTimingFunction": "var(--seed-timing-function-easing)"
9
9
  },
10
10
  "content": {
11
+ "color": "var(--seed-color-bg-transparent)",
11
12
  "gap": "var(--seed-dimension-x0_5)",
12
13
  "paddingRight": "var(--seed-dimension-x2_5)"
13
14
  },
@@ -51,7 +52,7 @@ export declare const vars: {
51
52
  },
52
53
  "pressed": {
53
54
  "root": {
54
- "color": "var(--seed-color-bg-layer-default-pressed)"
55
+ "color": "var(--seed-color-bg-transparent-pressed)"
55
56
  }
56
57
  },
57
58
  "disabled": {
package/vars/component/list-item.mjs CHANGED
@@ -4,10 +4,11 @@ export const vars = {
4
4
  "root": {
5
5
  "paddingY": "var(--seed-dimension-x3)",
6
6
  "paddingX": "var(--seed-dimension-spacing-x-global-gutter)",
7
- "colorDuration": "var(--seed-duration-d3)",
7
+ "colorDuration": "var(--seed-duration-color-transition)",
8
8
  "colorTimingFunction": "var(--seed-timing-function-easing)"
9
9
  },
10
10
  "content": {
11
+ "color": "var(--seed-color-bg-transparent)",
11
12
  "gap": "var(--seed-dimension-x0_5)",
12
13
  "paddingRight": "var(--seed-dimension-x2_5)"
13
14
  },
@@ -51,7 +52,7 @@ export const vars = {
51
52
  },
52
53
  "pressed": {
53
54
  "root": {
54
- "color": "var(--seed-color-bg-layer-default-pressed)"
55
+ "color": "var(--seed-color-bg-transparent-pressed)"
55
56
  }
56
57
  },
57
58
  "disabled": {
package/vars/component/radiomark.d.ts CHANGED
@@ -2,6 +2,8 @@ export declare const vars: {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)",
5
7
  "strokeWidth": "1px",
6
8
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
7
9
  "cornerRadius": "var(--seed-radius-full)"
@@ -12,7 +14,7 @@ export declare const vars: {
12
14
  },
13
15
  "enabledPressed": {
14
16
  "root": {
15
- "color": "var(--seed-color-bg-layer-default-pressed)"
17
+ "color": "var(--seed-color-bg-transparent-pressed)"
16
18
  }
17
19
  },
18
20
  "enabledSelected": {
@@ -28,6 +30,7 @@ export declare const vars: {
28
30
  },
29
31
  "disabledSelected": {
30
32
  "root": {
33
+ "color": "var(--seed-color-bg-transparent)",
31
34
  "strokeColor": "var(--seed-color-palette-gray-300)"
32
35
  },
33
36
  "icon": {
package/vars/component/radiomark.mjs CHANGED
@@ -2,6 +2,8 @@ export const vars = {
2
2
  "base": {
3
3
  "enabled": {
4
4
  "root": {
5
+ "colorDuration": "var(--seed-duration-color-transition)",
6
+ "colorTimingFunction": "var(--seed-timing-function-easing)",
5
7
  "strokeWidth": "1px",
6
8
  "strokeColor": "var(--seed-color-stroke-neutral-weak)",
7
9
  "cornerRadius": "var(--seed-radius-full)"
@@ -12,7 +14,7 @@ export const vars = {
12
14
  },
13
15
  "enabledPressed": {
14
16
  "root": {
15
- "color": "var(--seed-color-bg-layer-default-pressed)"
17
+ "color": "var(--seed-color-bg-transparent-pressed)"
16
18
  }
17
19
  },
18
20
  "enabledSelected": {
@@ -28,6 +30,7 @@ export const vars = {
28
30
  },
29
31
  "disabledSelected": {
30
32
  "root": {
33
+ "color": "var(--seed-color-bg-transparent)",
31
34
  "strokeColor": "var(--seed-color-palette-gray-300)"
32
35
  },
33
36
  "icon": {