@seed-design/css 0.0.1-rc.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.
Files changed (219) hide show
  1. package/README.md +1 -0
  2. package/package.json +42 -0
  3. package/recipes/action-button.d.ts +32 -0
  4. package/recipes/action-button.mjs +87 -0
  5. package/recipes/action-chip.d.ts +28 -0
  6. package/recipes/action-chip.mjs +60 -0
  7. package/recipes/action-sheet-item.d.ts +24 -0
  8. package/recipes/action-sheet-item.mjs +38 -0
  9. package/recipes/action-sheet.d.ts +21 -0
  10. package/recipes/action-sheet.mjs +59 -0
  11. package/recipes/app-bar-main.d.ts +36 -0
  12. package/recipes/app-bar-main.mjs +61 -0
  13. package/recipes/app-bar.d.ts +36 -0
  14. package/recipes/app-bar.mjs +68 -0
  15. package/recipes/app-screen.d.ts +36 -0
  16. package/recipes/app-screen.mjs +66 -0
  17. package/recipes/avatar-stack.d.ts +24 -0
  18. package/recipes/avatar-stack.mjs +45 -0
  19. package/recipes/avatar.d.ts +24 -0
  20. package/recipes/avatar.mjs +55 -0
  21. package/recipes/badge.d.ts +36 -0
  22. package/recipes/badge.mjs +126 -0
  23. package/recipes/bottom-sheet.d.ts +21 -0
  24. package/recipes/bottom-sheet.mjs +63 -0
  25. package/recipes/callout.d.ts +24 -0
  26. package/recipes/callout.mjs +61 -0
  27. package/recipes/checkbox.d.ts +32 -0
  28. package/recipes/checkbox.mjs +77 -0
  29. package/recipes/chip-tabs.d.ts +32 -0
  30. package/recipes/chip-tabs.mjs +68 -0
  31. package/recipes/className.mjs +25 -0
  32. package/recipes/control-chip.d.ts +28 -0
  33. package/recipes/control-chip.mjs +60 -0
  34. package/recipes/dialog.d.ts +21 -0
  35. package/recipes/dialog.mjs +59 -0
  36. package/recipes/extended-action-sheet-item.d.ts +24 -0
  37. package/recipes/extended-action-sheet-item.mjs +38 -0
  38. package/recipes/extended-action-sheet.d.ts +21 -0
  39. package/recipes/extended-action-sheet.mjs +63 -0
  40. package/recipes/extended-fab.d.ts +28 -0
  41. package/recipes/extended-fab.mjs +43 -0
  42. package/recipes/fab.d.ts +21 -0
  43. package/recipes/fab.mjs +31 -0
  44. package/recipes/help-bubble.d.ts +21 -0
  45. package/recipes/help-bubble.mjs +55 -0
  46. package/recipes/identity-placeholder.d.ts +24 -0
  47. package/recipes/identity-placeholder.mjs +41 -0
  48. package/recipes/inline-banner.d.ts +24 -0
  49. package/recipes/inline-banner.mjs +63 -0
  50. package/recipes/link-with-icon.d.ts +24 -0
  51. package/recipes/link-with-icon.mjs +39 -0
  52. package/recipes/manner-temp-badge.d.ts +24 -0
  53. package/recipes/manner-temp-badge.mjs +42 -0
  54. package/recipes/mergeVariants.mjs +9 -0
  55. package/recipes/progress-circle.d.ts +28 -0
  56. package/recipes/progress-circle.mjs +54 -0
  57. package/recipes/pull-to-refresh.d.ts +21 -0
  58. package/recipes/pull-to-refresh.mjs +35 -0
  59. package/recipes/radio.d.ts +24 -0
  60. package/recipes/radio.mjs +42 -0
  61. package/recipes/reaction-button.d.ts +24 -0
  62. package/recipes/reaction-button.mjs +38 -0
  63. package/recipes/segmented-control.d.ts +21 -0
  64. package/recipes/segmented-control.mjs +39 -0
  65. package/recipes/select-box-group.d.ts +21 -0
  66. package/recipes/select-box-group.mjs +31 -0
  67. package/recipes/select-box.d.ts +21 -0
  68. package/recipes/select-box.mjs +59 -0
  69. package/recipes/skeleton.d.ts +24 -0
  70. package/recipes/skeleton.mjs +40 -0
  71. package/recipes/snackbar-region.d.ts +21 -0
  72. package/recipes/snackbar-region.mjs +31 -0
  73. package/recipes/snackbar.d.ts +24 -0
  74. package/recipes/snackbar.mjs +51 -0
  75. package/recipes/splitVariantProps.mjs +12 -0
  76. package/recipes/switch.d.ts +24 -0
  77. package/recipes/switch.mjs +50 -0
  78. package/recipes/tabs.d.ts +36 -0
  79. package/recipes/tabs.mjs +81 -0
  80. package/recipes/text-field.d.ts +24 -0
  81. package/recipes/text-field.mjs +103 -0
  82. package/recipes/text.d.ts +28 -0
  83. package/recipes/text.mjs +64 -0
  84. package/recipes/toggle-button.d.ts +28 -0
  85. package/recipes/toggle-button.mjs +43 -0
  86. package/recipes/visually-hidden.d.ts +21 -0
  87. package/recipes/visually-hidden.mjs +31 -0
  88. package/seed.css +5017 -0
  89. package/seed.min.css +1 -0
  90. package/vars/color/bg.d.ts +37 -0
  91. package/vars/color/bg.mjs +37 -0
  92. package/vars/color/fg.d.ts +16 -0
  93. package/vars/color/fg.mjs +16 -0
  94. package/vars/color/index.d.ts +5 -0
  95. package/vars/color/index.mjs +5 -0
  96. package/vars/color/manner-temp/index.d.ts +6 -0
  97. package/vars/color/manner-temp/index.mjs +6 -0
  98. package/vars/color/manner-temp/l1.d.ts +2 -0
  99. package/vars/color/manner-temp/l1.mjs +2 -0
  100. package/vars/color/manner-temp/l2.d.ts +2 -0
  101. package/vars/color/manner-temp/l2.mjs +2 -0
  102. package/vars/color/manner-temp/l3.d.ts +2 -0
  103. package/vars/color/manner-temp/l3.mjs +2 -0
  104. package/vars/color/manner-temp/l4.d.ts +2 -0
  105. package/vars/color/manner-temp/l4.mjs +2 -0
  106. package/vars/color/manner-temp/l5.d.ts +2 -0
  107. package/vars/color/manner-temp/l5.mjs +2 -0
  108. package/vars/color/manner-temp/l6.d.ts +2 -0
  109. package/vars/color/manner-temp/l6.mjs +2 -0
  110. package/vars/color/palette.d.ts +78 -0
  111. package/vars/color/palette.mjs +78 -0
  112. package/vars/color/stroke.d.ts +10 -0
  113. package/vars/color/stroke.mjs +10 -0
  114. package/vars/component/action-button.d.ts +491 -0
  115. package/vars/component/action-button.mjs +491 -0
  116. package/vars/component/action-chip.d.ts +128 -0
  117. package/vars/component/action-chip.mjs +128 -0
  118. package/vars/component/action-sheet-close-button.d.ts +23 -0
  119. package/vars/component/action-sheet-close-button.mjs +23 -0
  120. package/vars/component/action-sheet-item.d.ts +36 -0
  121. package/vars/component/action-sheet-item.mjs +36 -0
  122. package/vars/component/action-sheet.d.ts +45 -0
  123. package/vars/component/action-sheet.mjs +45 -0
  124. package/vars/component/avatar-stack.d.ts +60 -0
  125. package/vars/component/avatar-stack.mjs +60 -0
  126. package/vars/component/avatar.d.ts +83 -0
  127. package/vars/component/avatar.mjs +83 -0
  128. package/vars/component/badge.d.ts +223 -0
  129. package/vars/component/badge.mjs +223 -0
  130. package/vars/component/bottom-sheet.d.ts +61 -0
  131. package/vars/component/bottom-sheet.mjs +61 -0
  132. package/vars/component/callout.d.ts +173 -0
  133. package/vars/component/callout.mjs +173 -0
  134. package/vars/component/checkbox.d.ts +171 -0
  135. package/vars/component/checkbox.mjs +171 -0
  136. package/vars/component/chip-tab.d.ts +98 -0
  137. package/vars/component/chip-tab.mjs +98 -0
  138. package/vars/component/chip-tablist.d.ts +23 -0
  139. package/vars/component/chip-tablist.mjs +23 -0
  140. package/vars/component/control-chip.d.ts +156 -0
  141. package/vars/component/control-chip.mjs +156 -0
  142. package/vars/component/dialog.d.ts +49 -0
  143. package/vars/component/dialog.mjs +49 -0
  144. package/vars/component/extended-action-sheet-close-button.d.ts +25 -0
  145. package/vars/component/extended-action-sheet-close-button.mjs +25 -0
  146. package/vars/component/extended-action-sheet-item.d.ts +46 -0
  147. package/vars/component/extended-action-sheet-item.mjs +46 -0
  148. package/vars/component/extended-action-sheet.d.ts +48 -0
  149. package/vars/component/extended-action-sheet.mjs +48 -0
  150. package/vars/component/extended-fab.d.ts +82 -0
  151. package/vars/component/extended-fab.mjs +82 -0
  152. package/vars/component/fab.d.ts +21 -0
  153. package/vars/component/fab.mjs +21 -0
  154. package/vars/component/help-bubble.d.ts +36 -0
  155. package/vars/component/help-bubble.mjs +36 -0
  156. package/vars/component/identity-placeholder.d.ts +12 -0
  157. package/vars/component/identity-placeholder.mjs +12 -0
  158. package/vars/component/index.d.ts +40 -0
  159. package/vars/component/index.mjs +40 -0
  160. package/vars/component/inline-banner.d.ts +191 -0
  161. package/vars/component/inline-banner.mjs +191 -0
  162. package/vars/component/link-with-icon.d.ts +46 -0
  163. package/vars/component/link-with-icon.mjs +46 -0
  164. package/vars/component/manner-temp-badge.d.ts +77 -0
  165. package/vars/component/manner-temp-badge.mjs +77 -0
  166. package/vars/component/progress-circle.d.ts +67 -0
  167. package/vars/component/progress-circle.mjs +67 -0
  168. package/vars/component/radio.d.ts +77 -0
  169. package/vars/component/radio.mjs +77 -0
  170. package/vars/component/reaction-button.d.ts +134 -0
  171. package/vars/component/reaction-button.mjs +134 -0
  172. package/vars/component/segmented-control-item.d.ts +34 -0
  173. package/vars/component/segmented-control-item.mjs +34 -0
  174. package/vars/component/segmented-control.d.ts +18 -0
  175. package/vars/component/segmented-control.mjs +18 -0
  176. package/vars/component/select-box.d.ts +92 -0
  177. package/vars/component/select-box.mjs +92 -0
  178. package/vars/component/skeleton.d.ts +42 -0
  179. package/vars/component/skeleton.mjs +42 -0
  180. package/vars/component/snackbar.d.ts +58 -0
  181. package/vars/component/snackbar.mjs +58 -0
  182. package/vars/component/switch.d.ts +65 -0
  183. package/vars/component/switch.mjs +65 -0
  184. package/vars/component/tab.d.ts +53 -0
  185. package/vars/component/tab.mjs +53 -0
  186. package/vars/component/tablist.d.ts +51 -0
  187. package/vars/component/tablist.mjs +51 -0
  188. package/vars/component/text-field.d.ts +295 -0
  189. package/vars/component/text-field.mjs +295 -0
  190. package/vars/component/toggle-button.d.ts +205 -0
  191. package/vars/component/toggle-button.mjs +205 -0
  192. package/vars/component/top-navigation.d.ts +86 -0
  193. package/vars/component/top-navigation.mjs +86 -0
  194. package/vars/component/typography.d.ts +200 -0
  195. package/vars/component/typography.mjs +200 -0
  196. package/vars/dimension/index.d.ts +22 -0
  197. package/vars/dimension/index.mjs +22 -0
  198. package/vars/dimension/spacing-x.d.ts +2 -0
  199. package/vars/dimension/spacing-x.mjs +2 -0
  200. package/vars/dimension/spacing-y.d.ts +2 -0
  201. package/vars/dimension/spacing-y.mjs +2 -0
  202. package/vars/duration.d.ts +6 -0
  203. package/vars/duration.mjs +6 -0
  204. package/vars/font-size.d.ts +13 -0
  205. package/vars/font-size.mjs +13 -0
  206. package/vars/font-weight.d.ts +3 -0
  207. package/vars/font-weight.mjs +3 -0
  208. package/vars/gradient.d.ts +1 -0
  209. package/vars/gradient.mjs +1 -0
  210. package/vars/index.d.ts +32 -0
  211. package/vars/index.mjs +1 -0
  212. package/vars/line-height.d.ts +10 -0
  213. package/vars/line-height.mjs +10 -0
  214. package/vars/radius.d.ts +11 -0
  215. package/vars/radius.mjs +11 -0
  216. package/vars/timing-function.d.ts +6 -0
  217. package/vars/timing-function.mjs +6 -0
  218. package/vars/vars.d.ts +9 -0
  219. package/vars/vars.mjs +9 -0
package/vars/component/progress-circle.mjs ADDED
@@ -0,0 +1,67 @@
1
+ export const vars = {
2
+ "size40": {
3
+ "enabled": {
4
+ "root": {
5
+ "size": "var(--seed-dimension-x10)",
6
+ "thickness": "5px"
7
+ }
8
+ }
9
+ },
10
+ "size24": {
11
+ "enabled": {
12
+ "root": {
13
+ "size": "var(--seed-dimension-x6)",
14
+ "thickness": "3px"
15
+ }
16
+ }
17
+ },
18
+ "indeterminateFalse": {
19
+ "enabled": {
20
+ "range": {
21
+ "lengthDuration": "300ms",
22
+ "lengthTimingFunction": "cubic-bezier(0, 0, 0.15, 1)"
23
+ }
24
+ }
25
+ },
26
+ "indeterminateTrue": {
27
+ "enabled": {
28
+ "range": {
29
+ "lengthDuration": "1.2s",
30
+ "rotateDuration": "1.2s",
31
+ "headTimingFunction": "cubic-bezier(0.35, 0, 0.65, 1)",
32
+ "tailTimingFunction": "cubic-bezier(0.35, 0, 0.65, 0.6)",
33
+ "rotateTimingFunction": "cubic-bezier(0.35, 0.25, 0.65, 0.75)"
34
+ }
35
+ }
36
+ },
37
+ "toneNeutral": {
38
+ "enabled": {
39
+ "track": {
40
+ "color": "var(--seed-color-palette-gray-200)"
41
+ },
42
+ "range": {
43
+ "color": "var(--seed-color-palette-gray-500)"
44
+ }
45
+ }
46
+ },
47
+ "toneBrand": {
48
+ "enabled": {
49
+ "track": {
50
+ "color": "var(--seed-color-palette-carrot-200)"
51
+ },
52
+ "range": {
53
+ "color": "var(--seed-color-bg-brand-solid)"
54
+ }
55
+ }
56
+ },
57
+ "toneStaticWhite": {
58
+ "enabled": {
59
+ "track": {
60
+ "color": "var(--seed-color-palette-static-white-alpha-200)"
61
+ },
62
+ "range": {
63
+ "color": "var(--seed-color-palette-static-white)"
64
+ }
65
+ }
66
+ }
67
+ }
package/vars/component/radio.d.ts ADDED
@@ -0,0 +1,77 @@
1
+ export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "color": "var(--seed-color-bg-layer-default)",
6
+ "strokeWidth": "1px",
7
+ "strokeColor": "var(--seed-color-stroke-control)",
8
+ "cornerRadius": "var(--seed-radius-full)"
9
+ },
10
+ "icon": {
11
+ "cornerRadius": "var(--seed-radius-full)"
12
+ }
13
+ },
14
+ "enabledPressed": {
15
+ "root": {
16
+ "color": "var(--seed-color-bg-layer-default-pressed)"
17
+ }
18
+ },
19
+ "enabledSelected": {
20
+ "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)"
31
+ }
32
+ },
33
+ "disabled": {
34
+ "root": {
35
+ "color": "var(--seed-color-palette-gray-300)"
36
+ }
37
+ },
38
+ "disabledSelected": {
39
+ "root": {
40
+ "strokeColor": "var(--seed-color-palette-gray-300)"
41
+ },
42
+ "icon": {
43
+ "color": "var(--seed-color-palette-gray-300)"
44
+ }
45
+ }
46
+ },
47
+ "sizeLarge": {
48
+ "enabled": {
49
+ "root": {
50
+ "size": "var(--seed-dimension-x6)"
51
+ },
52
+ "icon": {
53
+ "size": "var(--seed-dimension-x2_5)"
54
+ }
55
+ },
56
+ "disabled": {
57
+ "icon": {
58
+ "size": "var(--seed-dimension-x3)"
59
+ }
60
+ }
61
+ },
62
+ "sizeMedium": {
63
+ "enabled": {
64
+ "root": {
65
+ "size": "var(--seed-dimension-x5)"
66
+ },
67
+ "icon": {
68
+ "size": "var(--seed-dimension-x2)"
69
+ }
70
+ },
71
+ "disabled": {
72
+ "icon": {
73
+ "size": "var(--seed-dimension-x2_5)"
74
+ }
75
+ }
76
+ }
77
+ }
package/vars/component/radio.mjs ADDED
@@ -0,0 +1,77 @@
1
+ export const vars = {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "color": "var(--seed-color-bg-layer-default)",
6
+ "strokeWidth": "1px",
7
+ "strokeColor": "var(--seed-color-stroke-control)",
8
+ "cornerRadius": "var(--seed-radius-full)"
9
+ },
10
+ "icon": {
11
+ "cornerRadius": "var(--seed-radius-full)"
12
+ }
13
+ },
14
+ "enabledPressed": {
15
+ "root": {
16
+ "color": "var(--seed-color-bg-layer-default-pressed)"
17
+ }
18
+ },
19
+ "enabledSelected": {
20
+ "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)"
31
+ }
32
+ },
33
+ "disabled": {
34
+ "root": {
35
+ "color": "var(--seed-color-palette-gray-300)"
36
+ }
37
+ },
38
+ "disabledSelected": {
39
+ "root": {
40
+ "strokeColor": "var(--seed-color-palette-gray-300)"
41
+ },
42
+ "icon": {
43
+ "color": "var(--seed-color-palette-gray-300)"
44
+ }
45
+ }
46
+ },
47
+ "sizeLarge": {
48
+ "enabled": {
49
+ "root": {
50
+ "size": "var(--seed-dimension-x6)"
51
+ },
52
+ "icon": {
53
+ "size": "var(--seed-dimension-x2_5)"
54
+ }
55
+ },
56
+ "disabled": {
57
+ "icon": {
58
+ "size": "var(--seed-dimension-x3)"
59
+ }
60
+ }
61
+ },
62
+ "sizeMedium": {
63
+ "enabled": {
64
+ "root": {
65
+ "size": "var(--seed-dimension-x5)"
66
+ },
67
+ "icon": {
68
+ "size": "var(--seed-dimension-x2)"
69
+ }
70
+ },
71
+ "disabled": {
72
+ "icon": {
73
+ "size": "var(--seed-dimension-x2_5)"
74
+ }
75
+ }
76
+ }
77
+ }
package/vars/component/reaction-button.d.ts ADDED
@@ -0,0 +1,134 @@
1
+ export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "color": "var(--seed-color-bg-neutral-weak)",
6
+ "colorDuration": "var(--seed-duration-d4)",
7
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
8
+ },
9
+ "label": {
10
+ "color": "var(--seed-color-fg-neutral)",
11
+ "fontWeight": "var(--seed-font-weight-medium)"
12
+ },
13
+ "count": {
14
+ "color": "var(--seed-color-fg-neutral)",
15
+ "fontWeight": "var(--seed-font-weight-bold)"
16
+ },
17
+ "prefixIcon": {
18
+ "color": "var(--seed-color-fg-neutral)"
19
+ },
20
+ "progressCircle": {
21
+ "trackColor": "var(--seed-color-palette-gray-500)",
22
+ "rangeColor": "var(--seed-color-fg-neutral)"
23
+ }
24
+ },
25
+ "pressed": {
26
+ "root": {
27
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
28
+ }
29
+ },
30
+ "selected": {
31
+ "root": {
32
+ "color": "var(--seed-color-bg-layer-default)",
33
+ "strokeColor": "var(--seed-color-stroke-brand)",
34
+ "strokeWidth": "1px"
35
+ },
36
+ "label": {
37
+ "color": "var(--seed-color-fg-brand)"
38
+ },
39
+ "count": {
40
+ "color": "var(--seed-color-fg-brand)"
41
+ },
42
+ "prefixIcon": {
43
+ "color": "var(--seed-color-fg-brand)"
44
+ },
45
+ "progressCircle": {
46
+ "trackColor": "var(--seed-color-palette-carrot-200)",
47
+ "rangeColor": "var(--seed-color-fg-brand)"
48
+ }
49
+ },
50
+ "selectedPressed": {
51
+ "root": {
52
+ "color": "var(--seed-color-bg-layer-default-pressed)"
53
+ }
54
+ },
55
+ "disabled": {
56
+ "root": {
57
+ "color": "var(--seed-color-bg-disabled)",
58
+ "strokeWidth": "0px"
59
+ },
60
+ "label": {
61
+ "color": "var(--seed-color-fg-disabled)"
62
+ },
63
+ "count": {
64
+ "color": "var(--seed-color-fg-disabled)"
65
+ },
66
+ "prefixIcon": {
67
+ "color": "var(--seed-color-fg-disabled)"
68
+ }
69
+ },
70
+ "loading": {
71
+ "root": {
72
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
73
+ }
74
+ },
75
+ "selectedLoading": {
76
+ "root": {
77
+ "color": "var(--seed-color-bg-layer-default-pressed)",
78
+ "strokeWidth": "1px"
79
+ }
80
+ }
81
+ },
82
+ "sizeXsmall": {
83
+ "enabled": {
84
+ "root": {
85
+ "minHeight": "var(--seed-dimension-x8)",
86
+ "cornerRadius": "var(--seed-radius-full)",
87
+ "gap": "var(--seed-dimension-x1)",
88
+ "paddingX": "var(--seed-dimension-x3)",
89
+ "paddingY": "var(--seed-dimension-x1_5)"
90
+ },
91
+ "prefixIcon": {
92
+ "size": "18px"
93
+ },
94
+ "label": {
95
+ "fontSize": "var(--seed-font-size-t3)",
96
+ "lineHeight": "var(--seed-line-height-t3)"
97
+ },
98
+ "count": {
99
+ "fontSize": "var(--seed-font-size-t3)",
100
+ "lineHeight": "var(--seed-line-height-t3)"
101
+ },
102
+ "progressCircle": {
103
+ "size": "14px",
104
+ "thickness": "2px"
105
+ }
106
+ }
107
+ },
108
+ "sizeSmall": {
109
+ "enabled": {
110
+ "root": {
111
+ "minHeight": "var(--seed-dimension-x9)",
112
+ "cornerRadius": "var(--seed-radius-full)",
113
+ "gap": "var(--seed-dimension-x1)",
114
+ "paddingX": "var(--seed-dimension-x3_5)",
115
+ "paddingY": "var(--seed-dimension-x2)"
116
+ },
117
+ "prefixIcon": {
118
+ "size": "18px"
119
+ },
120
+ "label": {
121
+ "fontSize": "var(--seed-font-size-t3)",
122
+ "lineHeight": "var(--seed-line-height-t3)"
123
+ },
124
+ "count": {
125
+ "fontSize": "var(--seed-font-size-t3)",
126
+ "lineHeight": "var(--seed-line-height-t3)"
127
+ },
128
+ "progressCircle": {
129
+ "size": "14px",
130
+ "thickness": "2px"
131
+ }
132
+ }
133
+ }
134
+ }
package/vars/component/reaction-button.mjs ADDED
@@ -0,0 +1,134 @@
1
+ export const vars = {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "color": "var(--seed-color-bg-neutral-weak)",
6
+ "colorDuration": "var(--seed-duration-d4)",
7
+ "colorTimingFunction": "var(--seed-timing-function-easing)"
8
+ },
9
+ "label": {
10
+ "color": "var(--seed-color-fg-neutral)",
11
+ "fontWeight": "var(--seed-font-weight-medium)"
12
+ },
13
+ "count": {
14
+ "color": "var(--seed-color-fg-neutral)",
15
+ "fontWeight": "var(--seed-font-weight-bold)"
16
+ },
17
+ "prefixIcon": {
18
+ "color": "var(--seed-color-fg-neutral)"
19
+ },
20
+ "progressCircle": {
21
+ "trackColor": "var(--seed-color-palette-gray-500)",
22
+ "rangeColor": "var(--seed-color-fg-neutral)"
23
+ }
24
+ },
25
+ "pressed": {
26
+ "root": {
27
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
28
+ }
29
+ },
30
+ "selected": {
31
+ "root": {
32
+ "color": "var(--seed-color-bg-layer-default)",
33
+ "strokeColor": "var(--seed-color-stroke-brand)",
34
+ "strokeWidth": "1px"
35
+ },
36
+ "label": {
37
+ "color": "var(--seed-color-fg-brand)"
38
+ },
39
+ "count": {
40
+ "color": "var(--seed-color-fg-brand)"
41
+ },
42
+ "prefixIcon": {
43
+ "color": "var(--seed-color-fg-brand)"
44
+ },
45
+ "progressCircle": {
46
+ "trackColor": "var(--seed-color-palette-carrot-200)",
47
+ "rangeColor": "var(--seed-color-fg-brand)"
48
+ }
49
+ },
50
+ "selectedPressed": {
51
+ "root": {
52
+ "color": "var(--seed-color-bg-layer-default-pressed)"
53
+ }
54
+ },
55
+ "disabled": {
56
+ "root": {
57
+ "color": "var(--seed-color-bg-disabled)",
58
+ "strokeWidth": "0px"
59
+ },
60
+ "label": {
61
+ "color": "var(--seed-color-fg-disabled)"
62
+ },
63
+ "count": {
64
+ "color": "var(--seed-color-fg-disabled)"
65
+ },
66
+ "prefixIcon": {
67
+ "color": "var(--seed-color-fg-disabled)"
68
+ }
69
+ },
70
+ "loading": {
71
+ "root": {
72
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
73
+ }
74
+ },
75
+ "selectedLoading": {
76
+ "root": {
77
+ "color": "var(--seed-color-bg-layer-default-pressed)",
78
+ "strokeWidth": "1px"
79
+ }
80
+ }
81
+ },
82
+ "sizeXsmall": {
83
+ "enabled": {
84
+ "root": {
85
+ "minHeight": "var(--seed-dimension-x8)",
86
+ "cornerRadius": "var(--seed-radius-full)",
87
+ "gap": "var(--seed-dimension-x1)",
88
+ "paddingX": "var(--seed-dimension-x3)",
89
+ "paddingY": "var(--seed-dimension-x1_5)"
90
+ },
91
+ "prefixIcon": {
92
+ "size": "18px"
93
+ },
94
+ "label": {
95
+ "fontSize": "var(--seed-font-size-t3)",
96
+ "lineHeight": "var(--seed-line-height-t3)"
97
+ },
98
+ "count": {
99
+ "fontSize": "var(--seed-font-size-t3)",
100
+ "lineHeight": "var(--seed-line-height-t3)"
101
+ },
102
+ "progressCircle": {
103
+ "size": "14px",
104
+ "thickness": "2px"
105
+ }
106
+ }
107
+ },
108
+ "sizeSmall": {
109
+ "enabled": {
110
+ "root": {
111
+ "minHeight": "var(--seed-dimension-x9)",
112
+ "cornerRadius": "var(--seed-radius-full)",
113
+ "gap": "var(--seed-dimension-x1)",
114
+ "paddingX": "var(--seed-dimension-x3_5)",
115
+ "paddingY": "var(--seed-dimension-x2)"
116
+ },
117
+ "prefixIcon": {
118
+ "size": "18px"
119
+ },
120
+ "label": {
121
+ "fontSize": "var(--seed-font-size-t3)",
122
+ "lineHeight": "var(--seed-line-height-t3)"
123
+ },
124
+ "count": {
125
+ "fontSize": "var(--seed-font-size-t3)",
126
+ "lineHeight": "var(--seed-line-height-t3)"
127
+ },
128
+ "progressCircle": {
129
+ "size": "14px",
130
+ "thickness": "2px"
131
+ }
132
+ }
133
+ }
134
+ }
package/vars/component/segmented-control-item.d.ts ADDED
@@ -0,0 +1,34 @@
1
+ export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "height": "var(--seed-dimension-x8)",
6
+ "cornerRadius": "var(--seed-radius-full)",
7
+ "paddingX": "var(--seed-dimension-x4)",
8
+ "minWidth": "86px"
9
+ },
10
+ "label": {
11
+ "fontSize": "var(--seed-font-size-t5)",
12
+ "lineHeight": "var(--seed-line-height-t5)",
13
+ "fontWeight": "var(--seed-font-weight-medium)",
14
+ "color": "var(--seed-color-fg-neutral-muted)"
15
+ }
16
+ },
17
+ "pressed": {
18
+ "root": {
19
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
20
+ }
21
+ },
22
+ "selected": {
23
+ "label": {
24
+ "fontWeight": "var(--seed-font-weight-bold)",
25
+ "color": "var(--seed-color-fg-neutral)"
26
+ }
27
+ },
28
+ "disabled": {
29
+ "label": {
30
+ "color": "var(--seed-color-fg-disabled)"
31
+ }
32
+ }
33
+ }
34
+ }
package/vars/component/segmented-control-item.mjs ADDED
@@ -0,0 +1,34 @@
1
+ export const vars = {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "height": "var(--seed-dimension-x8)",
6
+ "cornerRadius": "var(--seed-radius-full)",
7
+ "paddingX": "var(--seed-dimension-x4)",
8
+ "minWidth": "86px"
9
+ },
10
+ "label": {
11
+ "fontSize": "var(--seed-font-size-t5)",
12
+ "lineHeight": "var(--seed-line-height-t5)",
13
+ "fontWeight": "var(--seed-font-weight-medium)",
14
+ "color": "var(--seed-color-fg-neutral-muted)"
15
+ }
16
+ },
17
+ "pressed": {
18
+ "root": {
19
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
20
+ }
21
+ },
22
+ "selected": {
23
+ "label": {
24
+ "fontWeight": "var(--seed-font-weight-bold)",
25
+ "color": "var(--seed-color-fg-neutral)"
26
+ }
27
+ },
28
+ "disabled": {
29
+ "label": {
30
+ "color": "var(--seed-color-fg-disabled)"
31
+ }
32
+ }
33
+ }
34
+ }
package/vars/component/segmented-control.d.ts ADDED
@@ -0,0 +1,18 @@
1
+ export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "padding": "var(--seed-dimension-x1)",
6
+ "cornerRadius": "var(--seed-radius-full)",
7
+ "color": "var(--seed-color-bg-neutral-weak)"
8
+ },
9
+ "indicator": {
10
+ "color": "var(--seed-color-bg-layer-default)",
11
+ "cornerRadius": "var(--seed-radius-full)",
12
+ "shadow": "0px 1px 6px 0px #0000000d",
13
+ "transformDuration": "var(--seed-duration-d4)",
14
+ "transformTimingFunction": "var(--seed-timing-function-easing)"
15
+ }
16
+ }
17
+ }
18
+ }
package/vars/component/segmented-control.mjs ADDED
@@ -0,0 +1,18 @@
1
+ export const vars = {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "padding": "var(--seed-dimension-x1)",
6
+ "cornerRadius": "var(--seed-radius-full)",
7
+ "color": "var(--seed-color-bg-neutral-weak)"
8
+ },
9
+ "indicator": {
10
+ "color": "var(--seed-color-bg-layer-default)",
11
+ "cornerRadius": "var(--seed-radius-full)",
12
+ "shadow": "0px 1px 6px 0px #0000000d",
13
+ "transformDuration": "var(--seed-duration-d4)",
14
+ "transformTimingFunction": "var(--seed-timing-function-easing)"
15
+ }
16
+ }
17
+ }
18
+ }
package/vars/component/select-box.d.ts ADDED
@@ -0,0 +1,92 @@
1
+ export declare const vars: {
2
+ "base": {
3
+ "enabled": {
4
+ "root": {
5
+ "paddingX": "var(--seed-dimension-x4)",
6
+ "paddingY": "var(--seed-dimension-x5)",
7
+ "gap": "var(--seed-dimension-x2_5)",
8
+ "strokeWidth": "1px",
9
+ "strokeColor": "var(--seed-color-stroke-neutral)",
10
+ "cornerRadius": "var(--seed-radius-r3)"
11
+ },
12
+ "content": {
13
+ "gap": "var(--seed-dimension-x0_5)"
14
+ },
15
+ "label": {
16
+ "color": "var(--seed-color-fg-neutral)",
17
+ "fontWeight": "var(--seed-font-weight-bold)",
18
+ "fontSize": "var(--seed-font-size-t5)",
19
+ "lineHeight": "var(--seed-line-height-t5)"
20
+ },
21
+ "description": {
22
+ "color": "var(--seed-color-fg-neutral-muted)",
23
+ "fontWeight": "var(--seed-font-weight-regular)",
24
+ "fontSize": "var(--seed-font-size-t4)",
25
+ "lineHeight": "var(--seed-line-height-t4)"
26
+ },
27
+ "checkboxControl": {
28
+ "size": "var(--seed-dimension-x6)",
29
+ "color": "var(--seed-color-bg-layer-default)",
30
+ "strokeWidth": "1px",
31
+ "strokeColor": "var(--seed-color-stroke-control)",
32
+ "cornerRadius": "var(--seed-radius-r1)"
33
+ },
34
+ "checkboxIcon": {
35
+ "size": "var(--seed-dimension-x3_5)"
36
+ },
37
+ "radioControl": {
38
+ "size": "var(--seed-dimension-x6)",
39
+ "color": "var(--seed-color-bg-layer-default)",
40
+ "strokeWidth": "1px",
41
+ "strokeColor": "var(--seed-color-stroke-control)",
42
+ "cornerRadius": "var(--seed-radius-full)"
43
+ },
44
+ "radioIcon": {
45
+ "size": "var(--seed-dimension-x2_5)",
46
+ "cornerRadius": "var(--seed-radius-full)"
47
+ }
48
+ },
49
+ "enabledPressed": {
50
+ "root": {
51
+ "color": "var(--seed-color-bg-layer-default-pressed)"
52
+ },
53
+ "checkboxControl": {
54
+ "color": "var(--seed-color-bg-layer-default-pressed)"
55
+ },
56
+ "radioControl": {
57
+ "color": "var(--seed-color-bg-layer-default-pressed)"
58
+ }
59
+ },
60
+ "enabledSelected": {
61
+ "root": {
62
+ "color": "var(--seed-color-bg-neutral-weak)",
63
+ "strokeColor": "var(--seed-color-stroke-control)"
64
+ },
65
+ "checkboxControl": {
66
+ "color": "var(--seed-color-bg-brand-solid)",
67
+ "strokeWidth": "0"
68
+ },
69
+ "checkboxIcon": {
70
+ "color": "var(--seed-color-palette-static-white)"
71
+ },
72
+ "radioControl": {
73
+ "color": "var(--seed-color-bg-brand-solid)",
74
+ "strokeWidth": "0"
75
+ },
76
+ "radioIcon": {
77
+ "color": "var(--seed-color-palette-static-white)"
78
+ }
79
+ },
80
+ "enabledSelectedPressed": {
81
+ "root": {
82
+ "color": "var(--seed-color-bg-neutral-weak-pressed)"
83
+ },
84
+ "checkboxControl": {
85
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
86
+ },
87
+ "radioControl": {
88
+ "color": "var(--seed-color-bg-brand-solid-pressed)"
89
+ }
90
+ }
91
+ }
92
+ }