@seed-design/css 1.2.16 → 2.0.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 (183) hide show
  1. package/all.css +4956 -1925
  2. package/all.layered.css +5922 -2883
  3. package/all.layered.min.css +1 -1
  4. package/all.min.css +1 -1
  5. package/base.css +348 -35
  6. package/base.layered.css +348 -35
  7. package/base.layered.min.css +1 -1
  8. package/base.min.css +1 -1
  9. package/breakpoints/index.d.ts +7 -0
  10. package/breakpoints/index.mjs +17 -0
  11. package/package.json +6 -1
  12. package/recipes/accordion.css +268 -0
  13. package/recipes/accordion.d.ts +33 -0
  14. package/recipes/accordion.layered.css +308 -0
  15. package/recipes/accordion.layered.mjs +94 -0
  16. package/recipes/accordion.mjs +94 -0
  17. package/recipes/action-button.css +56 -4
  18. package/recipes/action-button.d.ts +16 -0
  19. package/recipes/action-button.layered.css +60 -4
  20. package/recipes/app-bar.css +0 -3
  21. package/recipes/app-bar.d.ts +0 -4
  22. package/recipes/app-bar.layered.css +0 -4
  23. package/recipes/app-bar.layered.mjs +1 -5
  24. package/recipes/app-bar.mjs +1 -5
  25. package/recipes/app-screen.css +3 -0
  26. package/recipes/app-screen.layered.css +4 -0
  27. package/recipes/attachment-input-item.css +275 -0
  28. package/recipes/attachment-input-item.d.ts +24 -0
  29. package/recipes/attachment-input-item.layered.css +288 -0
  30. package/recipes/attachment-input-item.layered.mjs +79 -0
  31. package/recipes/attachment-input-item.mjs +79 -0
  32. package/recipes/attachment-input-trigger.css +71 -0
  33. package/recipes/attachment-input-trigger.d.ts +21 -0
  34. package/recipes/attachment-input-trigger.layered.css +85 -0
  35. package/recipes/attachment-input-trigger.layered.mjs +48 -0
  36. package/recipes/attachment-input-trigger.mjs +48 -0
  37. package/recipes/attachment-input.css +55 -0
  38. package/recipes/attachment-input.d.ts +21 -0
  39. package/recipes/attachment-input.layered.css +64 -0
  40. package/recipes/attachment-input.layered.mjs +48 -0
  41. package/recipes/attachment-input.mjs +48 -0
  42. package/recipes/avatar.d.ts +9 -0
  43. package/recipes/badge.d.ts +10 -0
  44. package/recipes/bottom-sheet.css +62 -5
  45. package/recipes/bottom-sheet.layered.css +67 -5
  46. package/recipes/callout.d.ts +7 -0
  47. package/recipes/checkmark.d.ts +3 -0
  48. package/recipes/chip-tabs.css +8 -52
  49. package/recipes/chip-tabs.d.ts +1 -1
  50. package/recipes/chip-tabs.layered.css +8 -62
  51. package/recipes/chip-tabs.layered.mjs +1 -2
  52. package/recipes/chip-tabs.mjs +1 -2
  53. package/recipes/chip.d.ts +4 -0
  54. package/recipes/contextual-floating-button.d.ts +6 -0
  55. package/recipes/dialog.css +14 -11
  56. package/recipes/dialog.layered.css +4 -0
  57. package/recipes/footer.css +44 -0
  58. package/recipes/footer.d.ts +24 -0
  59. package/recipes/footer.layered.css +52 -0
  60. package/recipes/footer.layered.mjs +39 -0
  61. package/recipes/footer.mjs +39 -0
  62. package/recipes/help-bubble.css +29 -1
  63. package/recipes/help-bubble.layered.css +34 -1
  64. package/recipes/image-frame.css +0 -3
  65. package/recipes/image-frame.d.ts +0 -4
  66. package/recipes/image-frame.layered.css +0 -4
  67. package/recipes/image-frame.layered.mjs +1 -6
  68. package/recipes/image-frame.mjs +1 -6
  69. package/recipes/input-button.css +176 -20
  70. package/recipes/input-button.d.ts +8 -1
  71. package/recipes/input-button.layered.css +197 -21
  72. package/recipes/input-button.layered.mjs +10 -2
  73. package/recipes/input-button.mjs +10 -2
  74. package/recipes/layout.css +25 -0
  75. package/recipes/layout.d.ts +24 -0
  76. package/recipes/layout.layered.css +25 -0
  77. package/recipes/layout.layered.mjs +44 -0
  78. package/recipes/layout.mjs +44 -0
  79. package/recipes/list-item.css +72 -4
  80. package/recipes/list-item.layered.css +84 -4
  81. package/recipes/menu-item.css +174 -0
  82. package/recipes/menu-item.d.ts +35 -0
  83. package/recipes/menu-item.layered.css +200 -0
  84. package/recipes/menu-item.layered.mjs +57 -0
  85. package/recipes/menu-item.mjs +57 -0
  86. package/recipes/menu-sheet-item.d.ts +6 -0
  87. package/recipes/menu-sheet.css +19 -1
  88. package/recipes/menu-sheet.layered.css +22 -1
  89. package/recipes/menu.css +119 -0
  90. package/recipes/menu.d.ts +28 -0
  91. package/recipes/menu.layered.css +139 -0
  92. package/recipes/menu.layered.mjs +56 -0
  93. package/recipes/menu.mjs +56 -0
  94. package/recipes/notification-badge.d.ts +3 -0
  95. package/recipes/page-banner.d.ts +5 -0
  96. package/recipes/progress-circle.d.ts +7 -0
  97. package/recipes/{selectBoxCheckmark.css → select-box-checkmark.css} +6 -6
  98. package/recipes/{selectBoxCheckmark.layered.css → select-box-checkmark.layered.css} +6 -6
  99. package/recipes/{selectBoxCheckmark.layered.mjs → select-box-checkmark.layered.mjs} +4 -4
  100. package/recipes/{selectBoxCheckmark.mjs → select-box-checkmark.mjs} +4 -4
  101. package/recipes/side-navigation-inset.css +4 -0
  102. package/recipes/side-navigation-inset.d.ts +19 -0
  103. package/recipes/side-navigation-inset.layered.css +6 -0
  104. package/recipes/side-navigation-inset.layered.mjs +22 -0
  105. package/recipes/side-navigation-inset.mjs +22 -0
  106. package/recipes/side-navigation-menu-item.css +135 -0
  107. package/recipes/side-navigation-menu-item.d.ts +21 -0
  108. package/recipes/side-navigation-menu-item.layered.css +156 -0
  109. package/recipes/side-navigation-menu-item.layered.mjs +48 -0
  110. package/recipes/side-navigation-menu-item.mjs +48 -0
  111. package/recipes/side-navigation.css +115 -0
  112. package/recipes/side-navigation.d.ts +24 -0
  113. package/recipes/side-navigation.layered.css +132 -0
  114. package/recipes/side-navigation.layered.mjs +63 -0
  115. package/recipes/side-navigation.mjs +63 -0
  116. package/recipes/side-panel.css +327 -0
  117. package/recipes/side-panel.d.ts +24 -0
  118. package/recipes/side-panel.layered.css +361 -0
  119. package/recipes/side-panel.layered.mjs +72 -0
  120. package/recipes/side-panel.mjs +72 -0
  121. package/recipes/skeleton.css +36 -2
  122. package/recipes/skeleton.d.ts +8 -0
  123. package/recipes/skeleton.layered.css +40 -2
  124. package/recipes/text-input.css +323 -52
  125. package/recipes/text-input.d.ts +8 -1
  126. package/recipes/text-input.layered.css +385 -51
  127. package/recipes/text-input.layered.mjs +18 -1
  128. package/recipes/text-input.mjs +18 -1
  129. package/recipes/text.css +180 -0
  130. package/recipes/text.d.ts +59 -1
  131. package/recipes/text.layered.css +216 -0
  132. package/recipes/text.layered.mjs +37 -1
  133. package/recipes/text.mjs +37 -1
  134. package/recipes/toggle-button.d.ts +3 -0
  135. package/vars/color/bg.d.ts +2 -2
  136. package/vars/color/bg.mjs +2 -1
  137. package/vars/color/stroke.d.ts +2 -2
  138. package/vars/color/stroke.mjs +2 -2
  139. package/vars/component/accordion-item.d.ts +132 -0
  140. package/vars/component/accordion-item.mjs +126 -0
  141. package/vars/component/accordion.d.ts +22 -0
  142. package/vars/component/accordion.mjs +16 -0
  143. package/vars/component/attachment-input-dropzone.d.ts +32 -0
  144. package/vars/component/attachment-input-dropzone.mjs +30 -0
  145. package/vars/component/attachment-input-item-action-button.d.ts +37 -0
  146. package/vars/component/attachment-input-item-action-button.mjs +37 -0
  147. package/vars/component/attachment-input-item-remove-button.d.ts +28 -0
  148. package/vars/component/attachment-input-item-remove-button.mjs +28 -0
  149. package/vars/component/attachment-input-item.d.ts +103 -0
  150. package/vars/component/attachment-input-item.mjs +102 -0
  151. package/vars/component/attachment-input-trigger.d.ts +46 -0
  152. package/vars/component/attachment-input-trigger.mjs +46 -0
  153. package/vars/component/attachment-input.d.ts +14 -0
  154. package/vars/component/attachment-input.mjs +12 -0
  155. package/vars/component/chip-tablist.d.ts +0 -7
  156. package/vars/component/chip-tablist.mjs +0 -7
  157. package/vars/component/image-frame.d.ts +1 -22
  158. package/vars/component/image-frame.mjs +1 -9
  159. package/vars/component/index.d.ts +12 -1
  160. package/vars/component/index.mjs +12 -1
  161. package/vars/component/input-button.d.ts +90 -17
  162. package/vars/component/input-button.mjs +84 -17
  163. package/vars/component/menu-item.d.ts +129 -0
  164. package/vars/component/menu-item.mjs +117 -0
  165. package/vars/component/menu.d.ts +68 -0
  166. package/vars/component/menu.mjs +60 -0
  167. package/vars/component/side-panel-close-button.d.ts +23 -0
  168. package/vars/component/side-panel-close-button.mjs +23 -0
  169. package/vars/component/side-panel.d.ts +94 -0
  170. package/vars/component/side-panel.mjs +83 -0
  171. package/vars/component/text-input.d.ts +92 -24
  172. package/vars/component/text-input.mjs +76 -24
  173. package/vars/component/typography.d.ts +414 -0
  174. package/vars/component/typography.mjs +324 -0
  175. package/vars/font-size.d.ts +17 -1
  176. package/vars/font-size.mjs +9 -1
  177. package/vars/gradient.d.ts +0 -8
  178. package/vars/gradient.mjs +0 -2
  179. package/vars/line-height.d.ts +17 -1
  180. package/vars/line-height.mjs +9 -1
  181. package/vars/component/chip-tab.d.ts +0 -162
  182. package/vars/component/chip-tab.mjs +0 -162
  183. /package/recipes/{selectBoxCheckmark.d.ts → select-box-checkmark.d.ts} +0 -0
package/vars/component/chip-tab.mjs DELETED
@@ -1,162 +0,0 @@
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
- "paddingY": "var(--seed-dimension-x2)",
8
- "cornerRadius": "var(--seed-radius-full)"
9
- },
10
- "label": {
11
- "fontWeight": "var(--seed-font-weight-medium)"
12
- }
13
- }
14
- },
15
- "sizeMedium": {
16
- "enabled": {
17
- "root": {
18
- "paddingX": "var(--seed-dimension-x3_5)",
19
- "minHeight": "36px"
20
- },
21
- "label": {
22
- "fontSize": "var(--seed-font-size-t4)"
23
- }
24
- }
25
- },
26
- "sizeLarge": {
27
- "enabled": {
28
- "root": {
29
- "paddingX": "var(--seed-dimension-x4)",
30
- "minHeight": "40px"
31
- },
32
- "label": {
33
- "fontSize": "var(--seed-font-size-t4)"
34
- }
35
- }
36
- },
37
- "variantNeutralSolid": {
38
- "enabled": {
39
- "root": {
40
- "color": "var(--seed-color-bg-neutral-weak-alpha)"
41
- },
42
- "label": {
43
- "color": "var(--seed-color-fg-neutral)"
44
- }
45
- },
46
- "enabledPressed": {
47
- "root": {
48
- "color": "var(--seed-color-bg-neutral-weak-alpha-pressed)"
49
- }
50
- },
51
- "selected": {
52
- "root": {
53
- "color": "var(--seed-color-bg-neutral-inverted)"
54
- },
55
- "label": {
56
- "color": "var(--seed-color-fg-neutral-inverted)"
57
- }
58
- },
59
- "selectedPressed": {
60
- "root": {
61
- "color": "var(--seed-color-bg-neutral-inverted-pressed)"
62
- }
63
- },
64
- "disabled": {
65
- "label": {
66
- "color": "var(--seed-color-fg-disabled)"
67
- }
68
- },
69
- "selectedDisabled": {
70
- "root": {
71
- "color": "var(--seed-color-bg-disabled)"
72
- },
73
- "label": {
74
- "color": "var(--seed-color-fg-disabled)"
75
- }
76
- }
77
- },
78
- "variantNeutralOutline": {
79
- "enabled": {
80
- "root": {
81
- "color": "var(--seed-color-bg-transparent)",
82
- "strokeColor": "var(--seed-color-stroke-neutral-muted)",
83
- "strokeWidth": "1px"
84
- },
85
- "label": {
86
- "color": "var(--seed-color-fg-neutral)"
87
- }
88
- },
89
- "enabledPressed": {
90
- "root": {
91
- "color": "var(--seed-color-bg-transparent-pressed)"
92
- }
93
- },
94
- "selected": {
95
- "root": {
96
- "color": "var(--seed-color-bg-neutral-inverted)"
97
- },
98
- "label": {
99
- "color": "var(--seed-color-fg-neutral-inverted)"
100
- }
101
- },
102
- "selectedPressed": {
103
- "root": {
104
- "color": "var(--seed-color-bg-neutral-inverted-pressed)"
105
- }
106
- },
107
- "disabled": {
108
- "label": {
109
- "color": "var(--seed-color-fg-disabled)"
110
- }
111
- },
112
- "selectedDisabled": {
113
- "root": {
114
- "color": "var(--seed-color-bg-disabled)"
115
- },
116
- "label": {
117
- "color": "var(--seed-color-fg-disabled)"
118
- }
119
- }
120
- },
121
- "variantBrandSolid": {
122
- "enabled": {
123
- "root": {
124
- "color": "var(--seed-color-bg-neutral-weak)"
125
- },
126
- "label": {
127
- "color": "var(--seed-color-fg-neutral-muted)"
128
- }
129
- },
130
- "enabledPressed": {
131
- "root": {
132
- "color": "var(--seed-color-bg-neutral-weak-pressed)"
133
- }
134
- },
135
- "selected": {
136
- "root": {
137
- "color": "var(--seed-color-bg-brand-solid)"
138
- },
139
- "label": {
140
- "color": "var(--seed-color-palette-static-white)"
141
- }
142
- },
143
- "selectedPressed": {
144
- "root": {
145
- "color": "var(--seed-color-bg-brand-solid-pressed)"
146
- }
147
- },
148
- "disabled": {
149
- "root": {
150
- "color": "var(--seed-color-bg-disabled)"
151
- },
152
- "label": {
153
- "color": "var(--seed-color-fg-disabled)"
154
- }
155
- },
156
- "selectedDisabled": {
157
- "root": {
158
- "color": "var(--seed-color-bg-disabled)"
159
- }
160
- }
161
- }
162
- }