@seed-design/css 1.2.3 → 1.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 (205) hide show
  1. package/all.css +1013 -174
  2. package/all.layered.css +9069 -0
  3. package/all.layered.min.css +1 -0
  4. package/all.min.css +1 -1
  5. package/base.css +5 -2
  6. package/base.layered.css +857 -0
  7. package/base.layered.min.css +1 -0
  8. package/base.min.css +1 -1
  9. package/package.json +11 -2
  10. package/recipes/action-button.css +69 -17
  11. package/recipes/action-button.layered.css +421 -0
  12. package/recipes/action-button.layered.mjs +79 -0
  13. package/recipes/action-chip.layered.css +84 -0
  14. package/recipes/action-chip.layered.mjs +51 -0
  15. package/recipes/action-sheet-item.layered.css +38 -0
  16. package/recipes/action-sheet-item.layered.mjs +29 -0
  17. package/recipes/action-sheet.layered.css +134 -0
  18. package/recipes/action-sheet.layered.mjs +60 -0
  19. package/recipes/app-bar-main.layered.css +165 -0
  20. package/recipes/app-bar-main.layered.mjs +63 -0
  21. package/recipes/app-bar.css +8 -0
  22. package/recipes/app-bar.layered.css +302 -0
  23. package/recipes/app-bar.layered.mjs +70 -0
  24. package/recipes/app-screen.layered.css +332 -0
  25. package/recipes/app-screen.layered.mjs +98 -0
  26. package/recipes/article.layered.css +12 -0
  27. package/recipes/article.layered.mjs +22 -0
  28. package/recipes/aspect-ratio.layered.css +26 -0
  29. package/recipes/aspect-ratio.layered.mjs +22 -0
  30. package/recipes/avatar-stack.layered.css +94 -0
  31. package/recipes/avatar-stack.layered.mjs +50 -0
  32. package/recipes/avatar.layered.css +222 -0
  33. package/recipes/avatar.layered.mjs +65 -0
  34. package/recipes/badge.layered.css +140 -0
  35. package/recipes/badge.layered.mjs +131 -0
  36. package/recipes/bottom-sheet-handle.css +9 -2
  37. package/recipes/bottom-sheet-handle.layered.css +36 -0
  38. package/recipes/bottom-sheet-handle.layered.mjs +36 -0
  39. package/recipes/bottom-sheet.css +11 -0
  40. package/recipes/bottom-sheet.layered.css +224 -0
  41. package/recipes/bottom-sheet.layered.mjs +75 -0
  42. package/recipes/callout.css +77 -12
  43. package/recipes/callout.layered.css +242 -0
  44. package/recipes/callout.layered.mjs +63 -0
  45. package/recipes/checkbox-group.layered.css +7 -0
  46. package/recipes/checkbox-group.layered.mjs +22 -0
  47. package/recipes/checkbox.layered.css +54 -0
  48. package/recipes/checkbox.layered.mjs +48 -0
  49. package/recipes/checkmark.css +61 -13
  50. package/recipes/checkmark.layered.css +187 -0
  51. package/recipes/checkmark.layered.mjs +86 -0
  52. package/recipes/chip-tabs.css +62 -14
  53. package/recipes/chip-tabs.layered.css +254 -0
  54. package/recipes/chip-tabs.layered.mjs +75 -0
  55. package/recipes/chip.css +60 -15
  56. package/recipes/chip.layered.css +272 -0
  57. package/recipes/chip.layered.mjs +80 -0
  58. package/recipes/contextual-floating-button.css +24 -7
  59. package/recipes/contextual-floating-button.layered.css +130 -0
  60. package/recipes/contextual-floating-button.layered.mjs +34 -0
  61. package/recipes/control-chip.layered.css +99 -0
  62. package/recipes/control-chip.layered.mjs +51 -0
  63. package/recipes/dialog.layered.css +111 -0
  64. package/recipes/dialog.layered.mjs +66 -0
  65. package/recipes/extended-action-sheet-item.layered.css +38 -0
  66. package/recipes/extended-action-sheet-item.layered.mjs +29 -0
  67. package/recipes/extended-action-sheet.layered.css +132 -0
  68. package/recipes/extended-action-sheet.layered.mjs +64 -0
  69. package/recipes/extended-fab.layered.css +79 -0
  70. package/recipes/extended-fab.layered.mjs +34 -0
  71. package/recipes/fab.layered.css +37 -0
  72. package/recipes/fab.layered.mjs +22 -0
  73. package/recipes/field-label.layered.css +35 -0
  74. package/recipes/field-label.layered.mjs +47 -0
  75. package/recipes/field.layered.css +81 -0
  76. package/recipes/field.layered.mjs +60 -0
  77. package/recipes/floating-action-button.css +15 -5
  78. package/recipes/floating-action-button.layered.css +101 -0
  79. package/recipes/floating-action-button.layered.mjs +47 -0
  80. package/recipes/help-bubble.css +8 -0
  81. package/recipes/help-bubble.layered.css +104 -0
  82. package/recipes/help-bubble.layered.mjs +60 -0
  83. package/recipes/identity-placeholder.css +2 -2
  84. package/recipes/identity-placeholder.d.ts +1 -1
  85. package/recipes/identity-placeholder.layered.css +22 -0
  86. package/recipes/identity-placeholder.layered.mjs +43 -0
  87. package/recipes/identity-placeholder.mjs +2 -1
  88. package/recipes/image-frame-icon.layered.css +8 -0
  89. package/recipes/image-frame-icon.layered.mjs +22 -0
  90. package/recipes/image-frame-indicator.layered.css +18 -0
  91. package/recipes/image-frame-indicator.layered.mjs +22 -0
  92. package/recipes/image-frame-reaction-button.css +9 -1
  93. package/recipes/image-frame-reaction-button.layered.css +43 -0
  94. package/recipes/image-frame-reaction-button.layered.mjs +22 -0
  95. package/recipes/image-frame.layered.css +28 -0
  96. package/recipes/image-frame.layered.mjs +34 -0
  97. package/recipes/inline-banner.layered.css +161 -0
  98. package/recipes/inline-banner.layered.mjs +64 -0
  99. package/recipes/input-button.css +27 -5
  100. package/recipes/input-button.layered.css +167 -0
  101. package/recipes/input-button.layered.mjs +64 -0
  102. package/recipes/link-content.layered.css +48 -0
  103. package/recipes/link-content.layered.mjs +35 -0
  104. package/recipes/list-header.layered.css +26 -0
  105. package/recipes/list-header.layered.mjs +29 -0
  106. package/recipes/list-item.css +63 -17
  107. package/recipes/list-item.layered.css +187 -0
  108. package/recipes/list-item.layered.mjs +59 -0
  109. package/recipes/manner-temp-badge.layered.css +72 -0
  110. package/recipes/manner-temp-badge.layered.mjs +37 -0
  111. package/recipes/manner-temp.layered.css +57 -0
  112. package/recipes/manner-temp.layered.mjs +37 -0
  113. package/recipes/menu-sheet-item.css +24 -3
  114. package/recipes/menu-sheet-item.layered.css +102 -0
  115. package/recipes/menu-sheet-item.layered.mjs +56 -0
  116. package/recipes/menu-sheet.css +18 -3
  117. package/recipes/menu-sheet.layered.css +167 -0
  118. package/recipes/menu-sheet.layered.mjs +74 -0
  119. package/recipes/notification-badge-positioner.layered.css +35 -0
  120. package/recipes/notification-badge-positioner.layered.mjs +51 -0
  121. package/recipes/notification-badge.layered.css +33 -0
  122. package/recipes/notification-badge.layered.mjs +29 -0
  123. package/recipes/page-banner.css +122 -22
  124. package/recipes/page-banner.layered.css +361 -0
  125. package/recipes/page-banner.layered.mjs +117 -0
  126. package/recipes/progress-circle.layered.css +52 -0
  127. package/recipes/progress-circle.layered.mjs +55 -0
  128. package/recipes/pull-to-refresh.layered.css +19 -0
  129. package/recipes/pull-to-refresh.layered.mjs +36 -0
  130. package/recipes/radio-group.layered.css +7 -0
  131. package/recipes/radio-group.layered.mjs +22 -0
  132. package/recipes/radio.layered.css +54 -0
  133. package/recipes/radio.layered.mjs +48 -0
  134. package/recipes/radiomark.css +34 -7
  135. package/recipes/radiomark.layered.css +132 -0
  136. package/recipes/radiomark.layered.mjs +48 -0
  137. package/recipes/reaction-button.css +24 -7
  138. package/recipes/reaction-button.layered.css +124 -0
  139. package/recipes/reaction-button.layered.mjs +29 -0
  140. package/recipes/scroll-fog.layered.css +27 -0
  141. package/recipes/scroll-fog.layered.mjs +28 -0
  142. package/recipes/segmented-control.css +31 -7
  143. package/recipes/segmented-control.layered.css +108 -0
  144. package/recipes/segmented-control.layered.mjs +40 -0
  145. package/recipes/select-box-group.layered.css +13 -0
  146. package/recipes/select-box-group.layered.mjs +22 -0
  147. package/recipes/select-box.css +19 -3
  148. package/recipes/select-box.layered.css +148 -0
  149. package/recipes/select-box.layered.mjs +63 -0
  150. package/recipes/selectBoxCheckmark.css +9 -2
  151. package/recipes/selectBoxCheckmark.layered.css +42 -0
  152. package/recipes/selectBoxCheckmark.layered.mjs +36 -0
  153. package/recipes/skeleton.layered.css +56 -0
  154. package/recipes/skeleton.layered.mjs +36 -0
  155. package/recipes/slider-marker.layered.css +54 -0
  156. package/recipes/slider-marker.layered.mjs +30 -0
  157. package/recipes/slider-tick.layered.css +25 -0
  158. package/recipes/slider-tick.layered.mjs +29 -0
  159. package/recipes/slider.css +25 -1
  160. package/recipes/slider.layered.css +238 -0
  161. package/recipes/slider.layered.mjs +68 -0
  162. package/recipes/snackbar-region.layered.css +18 -0
  163. package/recipes/snackbar-region.layered.mjs +22 -0
  164. package/recipes/snackbar.css +20 -1
  165. package/recipes/snackbar.layered.css +126 -0
  166. package/recipes/snackbar.layered.mjs +56 -0
  167. package/recipes/switch.layered.css +62 -0
  168. package/recipes/switch.layered.mjs +44 -0
  169. package/recipes/switchmark.css +9 -1
  170. package/recipes/switchmark.layered.css +100 -0
  171. package/recipes/switchmark.layered.mjs +49 -0
  172. package/recipes/tabs.css +9 -0
  173. package/recipes/tabs.layered.css +211 -0
  174. package/recipes/tabs.layered.mjs +78 -0
  175. package/recipes/tag-group-item.layered.css +98 -0
  176. package/recipes/tag-group-item.layered.mjs +55 -0
  177. package/recipes/tag-group.layered.css +58 -0
  178. package/recipes/tag-group.layered.mjs +62 -0
  179. package/recipes/text-input.css +1 -0
  180. package/recipes/text-input.layered.css +236 -0
  181. package/recipes/text-input.layered.mjs +73 -0
  182. package/recipes/text.layered.css +364 -0
  183. package/recipes/text.layered.mjs +90 -0
  184. package/recipes/toggle-button.css +42 -11
  185. package/recipes/toggle-button.layered.css +183 -0
  186. package/recipes/toggle-button.layered.mjs +34 -0
  187. package/vars/color/stroke.d.ts +2 -1
  188. package/vars/color/stroke.mjs +2 -1
  189. package/vars/component/identity-placeholder.d.ts +2 -2
  190. package/vars/component/identity-placeholder.mjs +2 -2
  191. package/vars/component/image-frame-floater.d.ts +1 -1
  192. package/vars/component/image-frame.d.ts +11 -17
  193. package/vars/component/image-frame.mjs +7 -12
  194. package/vars/component/index.d.ts +1 -0
  195. package/vars/component/index.mjs +1 -0
  196. package/vars/component/list-item.d.ts +1 -1
  197. package/vars/component/list-item.mjs +1 -1
  198. package/vars/component/segmented-control-indicator.d.ts +24 -0
  199. package/vars/component/segmented-control-indicator.mjs +24 -0
  200. package/vars/component/segmented-control-item.d.ts +3 -11
  201. package/vars/component/segmented-control-item.mjs +3 -11
  202. package/vars/component/segmented-control.d.ts +0 -8
  203. package/vars/component/segmented-control.mjs +0 -8
  204. package/vars/component/slider.d.ts +3 -1
  205. package/vars/component/slider.mjs +3 -1
package/base.css CHANGED
@@ -193,8 +193,7 @@
193
193
  grid-row: var(--seed-box-grid-row);
194
194
  }
195
195
 
196
- .seed-box:is(:active, [data-active]) {
197
- --seed-box-background--active: var(--seed-box-background);
196
+ .seed-box[data-has-active-bg]:is(:active, [data-active]) {
198
197
  background: var(--seed-box-background--active);
199
198
  }
200
199
 
@@ -236,10 +235,12 @@
236
235
 
237
236
  [data-seed-color-mode="light-only"] {
238
237
  color-scheme: light;
238
+ color-scheme: light only;
239
239
  }
240
240
 
241
241
  [data-seed-color-mode="dark-only"] {
242
242
  color-scheme: dark;
243
+ color-scheme: dark only;
243
244
  }
244
245
 
245
246
  :root {
@@ -504,6 +505,7 @@
504
505
  --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
505
506
  --seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
506
507
  --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
508
+ --seed-color-stroke-focus-ring: var(--seed-color-palette-blue-600);
507
509
  --seed-color-manner-temp-l1-bg: #f1f2f3;
508
510
  --seed-color-manner-temp-l1-text: #757b85;
509
511
  --seed-color-manner-temp-l10-bg: #ffebee;
@@ -714,6 +716,7 @@
714
716
  --seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
715
717
  --seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
716
718
  --seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
719
+ --seed-color-stroke-focus-ring: var(--seed-color-palette-blue-600);
717
720
  --seed-color-manner-temp-l1-bg: #292929;
718
721
  --seed-color-manner-temp-l1-text: #b8b8b9;
719
722
  --seed-color-manner-temp-l10-bg: #34040a;