@tulipfarm/sprout 0.3.0 → 0.4.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 (349) hide show
  1. package/README.md +45 -40
  2. package/dist/components/accordion.d.ts +2 -2
  3. package/dist/components/accordion.js +9 -9
  4. package/dist/components/agent-fanout.d.ts +2 -2
  5. package/dist/components/agent-fanout.js +65 -87
  6. package/dist/components/alert-dialog.d.ts +6 -6
  7. package/dist/components/alert-dialog.js +20 -20
  8. package/dist/components/alert.d.ts +6 -6
  9. package/dist/components/alert.js +13 -13
  10. package/dist/components/aspect-ratio.d.ts +2 -2
  11. package/dist/components/aspect-ratio.js +2 -2
  12. package/dist/components/attachment.d.ts +17 -17
  13. package/dist/components/attachment.js +82 -115
  14. package/dist/components/avatar.d.ts +10 -10
  15. package/dist/components/avatar.js +14 -14
  16. package/dist/components/badge.d.ts +4 -4
  17. package/dist/components/badge.js +18 -18
  18. package/dist/components/board.d.ts +107 -0
  19. package/dist/components/board.js +640 -0
  20. package/dist/components/brand-icon.d.ts +6 -6
  21. package/dist/components/brand-icon.js +55 -63
  22. package/dist/components/breadcrumb.d.ts +11 -11
  23. package/dist/components/breadcrumb.js +16 -18
  24. package/dist/components/button-group.d.ts +6 -6
  25. package/dist/components/button-group.js +14 -14
  26. package/dist/components/button.d.ts +11 -11
  27. package/dist/components/button.js +46 -56
  28. package/dist/components/calendar.d.ts +5 -5
  29. package/dist/components/calendar.js +44 -53
  30. package/dist/components/canvas.d.ts +4 -4
  31. package/dist/components/canvas.js +39 -46
  32. package/dist/components/card.d.ts +6 -6
  33. package/dist/components/card.js +17 -17
  34. package/dist/components/carousel.d.ts +7 -7
  35. package/dist/components/carousel.js +57 -75
  36. package/dist/components/chart.d.ts +5 -112
  37. package/dist/components/chart.js +5 -172
  38. package/dist/components/chat-confirmation.d.ts +13 -11
  39. package/dist/components/chat-confirmation.js +32 -38
  40. package/dist/components/chat-input.d.ts +4 -4
  41. package/dist/components/chat-input.js +74 -81
  42. package/dist/components/chat-plan.d.ts +2 -2
  43. package/dist/components/chat-plan.js +15 -20
  44. package/dist/components/chat-sources.d.ts +8 -8
  45. package/dist/components/chat-sources.js +18 -27
  46. package/dist/components/checkbox.d.ts +1 -1
  47. package/dist/components/checkbox.js +9 -9
  48. package/dist/components/choice-list.d.ts +2 -2
  49. package/dist/components/choice-list.js +16 -18
  50. package/dist/components/code-block.d.ts +5 -5
  51. package/dist/components/code-block.js +26 -26
  52. package/dist/components/collapsible.d.ts +1 -1
  53. package/dist/components/collapsible.js +7 -11
  54. package/dist/components/combobox.d.ts +3 -3
  55. package/dist/components/combobox.js +24 -24
  56. package/dist/components/command.d.ts +13 -13
  57. package/dist/components/command.js +61 -73
  58. package/dist/components/context-menu.d.ts +5 -5
  59. package/dist/components/context-menu.js +22 -22
  60. package/dist/components/dialog.d.ts +6 -6
  61. package/dist/components/dialog.js +23 -28
  62. package/dist/components/direction.d.ts +1 -1
  63. package/dist/components/direction.js +1 -1
  64. package/dist/components/dropdown-menu.d.ts +5 -5
  65. package/dist/components/dropdown-menu.js +20 -20
  66. package/dist/components/field.d.ts +11 -11
  67. package/dist/components/field.js +41 -61
  68. package/dist/components/file-explorer.d.ts +2 -2
  69. package/dist/components/file-explorer.js +89 -105
  70. package/dist/components/file-viewer.d.ts +10 -10
  71. package/dist/components/file-viewer.js +112 -140
  72. package/dist/components/form.d.ts +7 -7
  73. package/dist/components/form.js +24 -28
  74. package/dist/components/glass-banner.d.ts +3 -3
  75. package/dist/components/glass-banner.js +21 -24
  76. package/dist/components/gradient-banner.d.ts +5 -5
  77. package/dist/components/gradient-banner.js +13 -22
  78. package/dist/components/hover-card.d.ts +4 -4
  79. package/dist/components/hover-card.js +6 -6
  80. package/dist/components/input-group.d.ts +11 -11
  81. package/dist/components/input-group.js +22 -36
  82. package/dist/components/input-otp.d.ts +10 -10
  83. package/dist/components/input-otp.js +13 -15
  84. package/dist/components/input.d.ts +1 -1
  85. package/dist/components/input.js +7 -7
  86. package/dist/components/kbd.d.ts +3 -3
  87. package/dist/components/kbd.js +5 -5
  88. package/dist/components/label.d.ts +2 -2
  89. package/dist/components/label.js +2 -2
  90. package/dist/components/mention-list.d.ts +3 -3
  91. package/dist/components/mention-list.js +10 -10
  92. package/dist/components/menubar.d.ts +6 -6
  93. package/dist/components/menubar.js +22 -22
  94. package/dist/components/message-actions.d.ts +2 -2
  95. package/dist/components/message-actions.js +29 -31
  96. package/dist/components/message-response.d.ts +3 -3
  97. package/dist/components/message-response.js +18 -18
  98. package/dist/components/message-scroller.d.ts +12 -12
  99. package/dist/components/message-scroller.js +44 -56
  100. package/dist/components/message.d.ts +11 -11
  101. package/dist/components/message.js +25 -25
  102. package/dist/components/navigation-menu.d.ts +2 -2
  103. package/dist/components/navigation-menu.js +15 -15
  104. package/dist/components/notice-banner.d.ts +2 -2
  105. package/dist/components/notice-banner.js +2 -2
  106. package/dist/components/page-content.d.ts +2 -2
  107. package/dist/components/page-content.js +2 -2
  108. package/dist/components/page-header.d.ts +1 -1
  109. package/dist/components/page-header.js +16 -16
  110. package/dist/components/pagination.d.ts +9 -9
  111. package/dist/components/pagination.js +17 -17
  112. package/dist/components/plan-outline.d.ts +2 -2
  113. package/dist/components/plan-outline.js +43 -60
  114. package/dist/components/popover.d.ts +6 -6
  115. package/dist/components/popover.js +15 -15
  116. package/dist/components/presence-cursor.d.ts +2 -2
  117. package/dist/components/presence-cursor.js +3 -3
  118. package/dist/components/progress.d.ts +1 -1
  119. package/dist/components/progress.js +8 -8
  120. package/dist/components/prompt-list.d.ts +3 -3
  121. package/dist/components/prompt-list.js +6 -6
  122. package/dist/components/questionnaire.d.ts +19 -19
  123. package/dist/components/questionnaire.js +183 -242
  124. package/dist/components/radio-group.d.ts +2 -2
  125. package/dist/components/radio-group.js +6 -6
  126. package/dist/components/reasoning-effort.d.ts +3 -3
  127. package/dist/components/reasoning-effort.js +9 -12
  128. package/dist/components/record-list.d.ts +66 -0
  129. package/dist/components/record-list.js +151 -0
  130. package/dist/components/resizable.d.ts +5 -5
  131. package/dist/components/resizable.js +76 -102
  132. package/dist/components/result-card.d.ts +10 -5
  133. package/dist/components/result-card.js +42 -53
  134. package/dist/components/result-notice.d.ts +18 -0
  135. package/dist/components/result-notice.js +29 -0
  136. package/dist/components/review-card.d.ts +6 -6
  137. package/dist/components/review-card.js +18 -18
  138. package/dist/components/rich-text-editor.d.ts +2 -2
  139. package/dist/components/rich-text-editor.js +56 -72
  140. package/dist/components/schema-diagram.d.ts +3 -3
  141. package/dist/components/schema-diagram.js +39 -53
  142. package/dist/components/scroll-area.d.ts +1 -1
  143. package/dist/components/scroll-area.js +10 -14
  144. package/dist/components/search-dialog.d.ts +6 -6
  145. package/dist/components/search-dialog.js +16 -16
  146. package/dist/components/search-field.d.ts +1 -1
  147. package/dist/components/search-field.js +11 -11
  148. package/dist/components/select.d.ts +3 -3
  149. package/dist/components/select.js +20 -20
  150. package/dist/components/selection-slot.d.ts +2 -2
  151. package/dist/components/selection-slot.js +6 -9
  152. package/dist/components/separator.d.ts +15 -15
  153. package/dist/components/separator.js +22 -27
  154. package/dist/components/settings-list.d.ts +3 -3
  155. package/dist/components/settings-list.js +5 -5
  156. package/dist/components/sheet.d.ts +6 -6
  157. package/dist/components/sheet.js +27 -27
  158. package/dist/components/sidebar.d.ts +22 -22
  159. package/dist/components/sidebar.js +57 -58
  160. package/dist/components/skeleton.d.ts +5 -5
  161. package/dist/components/skeleton.js +14 -21
  162. package/dist/components/slider.d.ts +2 -2
  163. package/dist/components/slider.js +6 -6
  164. package/dist/components/spinner.d.ts +5 -5
  165. package/dist/components/spinner.js +22 -26
  166. package/dist/components/sql-viewer.d.ts +14 -14
  167. package/dist/components/sql-viewer.js +99 -128
  168. package/dist/components/state-panel-samples.d.ts +2 -2
  169. package/dist/components/state-panel-samples.js +209 -245
  170. package/dist/components/state-panel.d.ts +2 -35
  171. package/dist/components/state-panel.js +2 -29
  172. package/dist/components/state-sample.d.ts +7 -7
  173. package/dist/components/state-sample.js +18 -31
  174. package/dist/components/switch.d.ts +1 -1
  175. package/dist/components/switch.js +7 -7
  176. package/dist/components/table-nuqs.d.ts +2 -2
  177. package/dist/components/table-nuqs.js +11 -12
  178. package/dist/components/table.d.ts +4 -4
  179. package/dist/components/table.js +166 -235
  180. package/dist/components/tabs.d.ts +2 -2
  181. package/dist/components/tabs.js +12 -12
  182. package/dist/components/textarea.d.ts +2 -2
  183. package/dist/components/textarea.js +6 -8
  184. package/dist/components/timeline.d.ts +3 -0
  185. package/dist/components/timeline.js +3 -0
  186. package/dist/components/toast.d.ts +2 -2
  187. package/dist/components/toast.js +19 -25
  188. package/dist/components/toggle-group.d.ts +2 -2
  189. package/dist/components/toggle-group.js +18 -20
  190. package/dist/components/toggle.d.ts +2 -2
  191. package/dist/components/toggle.js +8 -8
  192. package/dist/components/tool-activity.d.ts +1 -1
  193. package/dist/components/tool-activity.js +83 -110
  194. package/dist/components/toolbar-status.d.ts +2 -2
  195. package/dist/components/toolbar-status.js +7 -7
  196. package/dist/components/tooltip.d.ts +5 -5
  197. package/dist/components/tooltip.js +12 -11
  198. package/dist/components/typed-text.d.ts +2 -2
  199. package/dist/components/typed-text.js +10 -12
  200. package/dist/components/view-switcher.d.ts +51 -0
  201. package/dist/components/view-switcher.js +114 -0
  202. package/dist/index.d.ts +98 -93
  203. package/dist/index.js +98 -93
  204. package/dist/internal/chart-kit.d.ts +142 -0
  205. package/dist/internal/chart-kit.js +200 -0
  206. package/dist/internal/charts/bars.d.ts +61 -0
  207. package/dist/internal/charts/bars.js +86 -0
  208. package/dist/internal/charts/lines.d.ts +67 -0
  209. package/dist/internal/charts/lines.js +70 -0
  210. package/dist/internal/charts/more.d.ts +77 -0
  211. package/dist/internal/charts/more.js +68 -0
  212. package/dist/internal/charts/parts.d.ts +54 -0
  213. package/dist/internal/charts/parts.js +82 -0
  214. package/dist/internal/charts/timeline-dates.d.ts +38 -0
  215. package/dist/internal/charts/timeline-dates.js +113 -0
  216. package/dist/internal/charts/timeline-window.d.ts +31 -0
  217. package/dist/internal/charts/timeline-window.js +26 -0
  218. package/dist/internal/charts/timeline.d.ts +72 -0
  219. package/dist/internal/charts/timeline.js +287 -0
  220. package/dist/internal/classes.d.ts +1 -1
  221. package/dist/internal/classes.js +7 -9
  222. package/dist/internal/code-tokens.d.ts +2 -2
  223. package/dist/internal/code-tokens.js +12 -12
  224. package/dist/internal/fieldset.d.ts +1 -1
  225. package/dist/internal/fieldset.js +6 -6
  226. package/dist/internal/file-kind.d.ts +1 -1
  227. package/dist/internal/file-kind.js +43 -51
  228. package/dist/internal/flow.d.ts +4 -4
  229. package/dist/internal/flow.js +20 -23
  230. package/dist/internal/languages.js +999 -999
  231. package/dist/internal/message-scroller.d.ts +3 -3
  232. package/dist/internal/message-scroller.js +64 -112
  233. package/dist/internal/pressable.d.ts +1 -1
  234. package/dist/internal/pressable.js +7 -7
  235. package/dist/internal/state-panel.d.ts +35 -0
  236. package/dist/internal/state-panel.js +22 -0
  237. package/dist/internal/syntax.d.ts +2 -2
  238. package/dist/internal/syntax.js +36 -47
  239. package/dist/styles/accordion.css +3 -5
  240. package/dist/styles/agent-fanout.css +64 -60
  241. package/dist/styles/alert-dialog.css +12 -26
  242. package/dist/styles/alert.css +10 -15
  243. package/dist/styles/attachment.css +51 -93
  244. package/dist/styles/avatar.css +17 -24
  245. package/dist/styles/badge.css +11 -36
  246. package/dist/styles/board.css +571 -0
  247. package/dist/styles/brand-icon.css +7 -8
  248. package/dist/styles/breadcrumb.css +4 -7
  249. package/dist/styles/button-group.css +8 -14
  250. package/dist/styles/button.css +22 -27
  251. package/dist/styles/calendar.css +24 -36
  252. package/dist/styles/canvas.css +2 -3
  253. package/dist/styles/card.css +7 -23
  254. package/dist/styles/carousel.css +11 -12
  255. package/dist/styles/chart.css +215 -31
  256. package/dist/styles/chat-input.css +15 -39
  257. package/dist/styles/chat-plan.css +3 -4
  258. package/dist/styles/chat-sources.css +3 -6
  259. package/dist/styles/checkbox.css +11 -25
  260. package/dist/styles/choice-list.css +17 -31
  261. package/dist/styles/code-block.css +11 -25
  262. package/dist/styles/collapsible.css +10 -15
  263. package/dist/styles/combobox.css +11 -15
  264. package/dist/styles/command.css +5 -8
  265. package/dist/styles/context-menu.css +2 -2
  266. package/dist/styles/dialog.css +5 -16
  267. package/dist/styles/dropdown-menu.css +2 -2
  268. package/dist/styles/field.css +15 -21
  269. package/dist/styles/file-explorer.css +19 -33
  270. package/dist/styles/file-viewer.css +13 -17
  271. package/dist/styles/form.css +3 -3
  272. package/dist/styles/glass-banner.css +12 -47
  273. package/dist/styles/gradient-banner.css +17 -35
  274. package/dist/styles/hover-card.css +9 -15
  275. package/dist/styles/index.css +116 -108
  276. package/dist/styles/input-group.css +25 -41
  277. package/dist/styles/input-otp.css +5 -6
  278. package/dist/styles/input.css +5 -5
  279. package/dist/styles/kbd.css +1 -1
  280. package/dist/styles/label.css +9 -30
  281. package/dist/styles/mention-list.css +6 -8
  282. package/dist/styles/menubar.css +5 -6
  283. package/dist/styles/message-actions.css +1 -1
  284. package/dist/styles/message-response.css +3 -5
  285. package/dist/styles/message-scroller.css +14 -21
  286. package/dist/styles/message.css +23 -60
  287. package/dist/styles/navigation-menu.css +14 -29
  288. package/dist/styles/notice-banner.css +1 -2
  289. package/dist/styles/page-header.css +7 -10
  290. package/dist/styles/pagination.css +1 -4
  291. package/dist/styles/plan-outline.css +20 -37
  292. package/dist/styles/popover.css +10 -19
  293. package/dist/styles/presence-cursor.css +1 -2
  294. package/dist/styles/progress.css +2 -4
  295. package/dist/styles/prompt-list.css +6 -17
  296. package/dist/styles/questionnaire.css +16 -40
  297. package/dist/styles/radio-group.css +12 -23
  298. package/dist/styles/reasoning-effort.css +8 -15
  299. package/dist/styles/record-list.css +243 -0
  300. package/dist/styles/resizable.css +10 -11
  301. package/dist/styles/result-card.css +17 -3
  302. package/dist/styles/result-notice.css +80 -0
  303. package/dist/styles/review-card.css +2 -3
  304. package/dist/styles/rich-text-editor.css +1 -2
  305. package/dist/styles/schema-diagram.css +12 -17
  306. package/dist/styles/scroll-area.css +8 -10
  307. package/dist/styles/search-dialog.css +1 -5
  308. package/dist/styles/search-field.css +1 -2
  309. package/dist/styles/select.css +7 -7
  310. package/dist/styles/selection-slot.css +1 -2
  311. package/dist/styles/separator.css +7 -8
  312. package/dist/styles/settings-list.css +1 -2
  313. package/dist/styles/sheet.css +40 -73
  314. package/dist/styles/sidebar.css +17 -21
  315. package/dist/styles/skeleton.css +9 -11
  316. package/dist/styles/slider.css +11 -21
  317. package/dist/styles/spinner.css +2 -2
  318. package/dist/styles/sql-viewer.css +29 -29
  319. package/dist/styles/state-panel.css +8 -9
  320. package/dist/styles/state-sample.css +20 -33
  321. package/dist/styles/switch.css +11 -18
  322. package/dist/styles/table.css +51 -77
  323. package/dist/styles/tabs.css +12 -16
  324. package/dist/styles/textarea.css +3 -3
  325. package/dist/styles/themes/chatgpt.css +11 -23
  326. package/dist/styles/themes/claude.css +12 -24
  327. package/dist/styles/themes/cloudflare.css +11 -23
  328. package/dist/styles/themes/discord.css +11 -23
  329. package/dist/styles/themes/github.css +11 -23
  330. package/dist/styles/themes/grok.css +11 -23
  331. package/dist/styles/themes/linear.css +12 -25
  332. package/dist/styles/themes/neutral.css +11 -23
  333. package/dist/styles/themes/notion.css +11 -23
  334. package/dist/styles/themes/perplexity.css +11 -23
  335. package/dist/styles/themes/raycast.css +11 -23
  336. package/dist/styles/themes/spotify.css +11 -23
  337. package/dist/styles/themes/stripe.css +11 -23
  338. package/dist/styles/themes/supabase.css +11 -23
  339. package/dist/styles/themes/tulipfarm.css +9 -10
  340. package/dist/styles/themes/vercel.css +12 -25
  341. package/dist/styles/timeline.css +276 -0
  342. package/dist/styles/toast.css +13 -20
  343. package/dist/styles/toggle-group.css +17 -23
  344. package/dist/styles/toggle.css +8 -8
  345. package/dist/styles/tool-activity.css +7 -13
  346. package/dist/styles/toolbar-status.css +2 -7
  347. package/dist/styles/tooltip.css +15 -21
  348. package/dist/styles/view-switcher.css +279 -0
  349. package/package.json +21 -1
package/dist/styles/themes/discord.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="discord"] {
9
+ [data-sprout-theme='discord'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.25rem;
12
12
  --sprout-radius-panel: 0.5rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="discord"],
16
- .light[data-sprout-theme="discord"],
17
- .light [data-sprout-theme="discord"] {
15
+ [data-sprout-theme='discord'],
16
+ .light[data-sprout-theme='discord'],
17
+ .light [data-sprout-theme='discord'] {
18
18
  --sprout-canvas: #f2f3f5;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f0f0f0;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #eeeeee;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="discord"],
53
- .dark [data-sprout-theme="discord"] {
48
+ .dark[data-sprout-theme='discord'],
49
+ .dark [data-sprout-theme='discord'] {
54
50
  --sprout-canvas: #1e1f22;
55
51
  --sprout-surface: #2b2d31;
56
52
  --sprout-hover: #393b3f;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #3b3d41;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="discord"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="discord"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='discord'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='discord'] {
91
83
  --sprout-canvas: #1e1f22;
92
84
  --sprout-surface: #2b2d31;
93
85
  --sprout-hover: #393b3f;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #3b3d41;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/github.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="github"] {
9
+ [data-sprout-theme='github'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.375rem;
12
12
  --sprout-radius-panel: 0.75rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="github"],
16
- .light[data-sprout-theme="github"],
17
- .light [data-sprout-theme="github"] {
15
+ [data-sprout-theme='github'],
16
+ .light[data-sprout-theme='github'],
17
+ .light [data-sprout-theme='github'] {
18
18
  --sprout-canvas: #f6f8fa;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f2f2f2;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #eff0f0;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="github"],
53
- .dark [data-sprout-theme="github"] {
48
+ .dark[data-sprout-theme='github'],
49
+ .dark [data-sprout-theme='github'] {
54
50
  --sprout-canvas: #010409;
55
51
  --sprout-surface: #0d1117;
56
52
  --sprout-hover: #1f2329;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #21262c;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="github"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="github"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='github'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='github'] {
91
83
  --sprout-canvas: #010409;
92
84
  --sprout-surface: #0d1117;
93
85
  --sprout-hover: #1f2329;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #21262c;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/grok.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="grok"] {
9
+ [data-sprout-theme='grok'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.75rem;
12
12
  --sprout-radius-panel: 1.25rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="grok"],
16
- .light[data-sprout-theme="grok"],
17
- .light [data-sprout-theme="grok"] {
15
+ [data-sprout-theme='grok'],
16
+ .light[data-sprout-theme='grok'],
17
+ .light [data-sprout-theme='grok'] {
18
18
  --sprout-canvas: #ffffff;
19
19
  --sprout-surface: #fafafa;
20
20
  --sprout-hover: #ececec;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #e9e9e9;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="grok"],
53
- .dark [data-sprout-theme="grok"] {
48
+ .dark[data-sprout-theme='grok'],
49
+ .dark [data-sprout-theme='grok'] {
54
50
  --sprout-canvas: #000000;
55
51
  --sprout-surface: #0f0f0f;
56
52
  --sprout-hover: #222222;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #242424;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="grok"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="grok"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='grok'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='grok'] {
91
83
  --sprout-canvas: #000000;
92
84
  --sprout-surface: #0f0f0f;
93
85
  --sprout-hover: #222222;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #242424;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/linear.css CHANGED
@@ -6,16 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="linear"] {
10
- --sprout-font:
11
- "Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif;
9
+ [data-sprout-theme='linear'] {
10
+ --sprout-font: 'Inter Variable', Inter, ui-sans-serif, system-ui, sans-serif;
12
11
  --sprout-radius-control: 0.375rem;
13
12
  --sprout-radius-panel: 0.625rem;
14
13
  }
15
14
 
16
- [data-sprout-theme="linear"],
17
- .light[data-sprout-theme="linear"],
18
- .light [data-sprout-theme="linear"] {
15
+ [data-sprout-theme='linear'],
16
+ .light[data-sprout-theme='linear'],
17
+ .light [data-sprout-theme='linear'] {
19
18
  --sprout-canvas: #f7f8f8;
20
19
  --sprout-surface: #ffffff;
21
20
  --sprout-hover: #f1f1f2;
@@ -41,17 +40,13 @@
41
40
  --sprout-success-subtle: #e8f4eb;
42
41
  --sprout-warning: #8a4b08;
43
42
  --sprout-warning-subtle: #fdf1dc;
44
- --sprout-primary-subtle: color-mix(
45
- in oklab,
46
- var(--sprout-primary) 10%,
47
- var(--sprout-surface)
48
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
49
44
  --sprout-secondary: #efefef;
50
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
51
46
  }
52
47
 
53
- .dark[data-sprout-theme="linear"],
54
- .dark [data-sprout-theme="linear"] {
48
+ .dark[data-sprout-theme='linear'],
49
+ .dark [data-sprout-theme='linear'] {
55
50
  --sprout-canvas: #08090a;
56
51
  --sprout-surface: #141516;
57
52
  --sprout-hover: #262728;
@@ -77,18 +72,14 @@
77
72
  --sprout-success-subtle: #1c3223;
78
73
  --sprout-warning: #eec27e;
79
74
  --sprout-warning-subtle: #34291b;
80
- --sprout-primary-subtle: color-mix(
81
- in oklab,
82
- var(--sprout-primary) 16%,
83
- var(--sprout-surface)
84
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
85
76
  --sprout-secondary: #28292a;
86
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
87
78
  }
88
79
 
89
80
  @media (prefers-color-scheme: dark) {
90
- :root:not(.light):not(.dark)[data-sprout-theme="linear"],
91
- :root:not(.light):not(.dark) [data-sprout-theme="linear"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='linear'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='linear'] {
92
83
  --sprout-canvas: #08090a;
93
84
  --sprout-surface: #141516;
94
85
  --sprout-hover: #262728;
@@ -114,11 +105,7 @@
114
105
  --sprout-success-subtle: #1c3223;
115
106
  --sprout-warning: #eec27e;
116
107
  --sprout-warning-subtle: #34291b;
117
- --sprout-primary-subtle: color-mix(
118
- in oklab,
119
- var(--sprout-primary) 16%,
120
- var(--sprout-surface)
121
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
122
109
  --sprout-secondary: #28292a;
123
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
124
111
  }
package/dist/styles/themes/neutral.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="neutral"] {
9
+ [data-sprout-theme='neutral'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.375rem;
12
12
  --sprout-radius-panel: 0.75rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="neutral"],
16
- .light[data-sprout-theme="neutral"],
17
- .light [data-sprout-theme="neutral"] {
15
+ [data-sprout-theme='neutral'],
16
+ .light[data-sprout-theme='neutral'],
17
+ .light [data-sprout-theme='neutral'] {
18
18
  --sprout-canvas: #f8f8f8;
19
19
  --sprout-surface: #fdfdfd;
20
20
  --sprout-hover: #eeeeee;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #ececec;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="neutral"],
53
- .dark [data-sprout-theme="neutral"] {
48
+ .dark[data-sprout-theme='neutral'],
49
+ .dark [data-sprout-theme='neutral'] {
54
50
  --sprout-canvas: #151515;
55
51
  --sprout-surface: #1d1d1d;
56
52
  --sprout-hover: #2b2b2b;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #2c2c2c;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="neutral"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="neutral"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='neutral'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='neutral'] {
91
83
  --sprout-canvas: #151515;
92
84
  --sprout-surface: #1d1d1d;
93
85
  --sprout-hover: #2b2b2b;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #2c2c2c;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/notion.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="notion"] {
9
+ [data-sprout-theme='notion'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.375rem;
12
12
  --sprout-radius-panel: 0.5rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="notion"],
16
- .light[data-sprout-theme="notion"],
17
- .light [data-sprout-theme="notion"] {
15
+ [data-sprout-theme='notion'],
16
+ .light[data-sprout-theme='notion'],
17
+ .light [data-sprout-theme='notion'] {
18
18
  --sprout-canvas: #f7f7f5;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f3f3f3;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #f1f1f0;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="notion"],
53
- .dark [data-sprout-theme="notion"] {
48
+ .dark[data-sprout-theme='notion'],
49
+ .dark [data-sprout-theme='notion'] {
54
50
  --sprout-canvas: #191919;
55
51
  --sprout-surface: #202020;
56
52
  --sprout-hover: #30302f;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #323231;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="notion"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="notion"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='notion'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='notion'] {
91
83
  --sprout-canvas: #191919;
92
84
  --sprout-surface: #202020;
93
85
  --sprout-hover: #30302f;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #323231;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/perplexity.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="perplexity"] {
9
+ [data-sprout-theme='perplexity'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.5rem;
12
12
  --sprout-radius-panel: 0.75rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="perplexity"],
16
- .light[data-sprout-theme="perplexity"],
17
- .light [data-sprout-theme="perplexity"] {
15
+ [data-sprout-theme='perplexity'],
16
+ .light[data-sprout-theme='perplexity'],
17
+ .light [data-sprout-theme='perplexity'] {
18
18
  --sprout-canvas: #fcfcf9;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f1f3f3;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #eef1f1;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="perplexity"],
53
- .dark [data-sprout-theme="perplexity"] {
48
+ .dark[data-sprout-theme='perplexity'],
49
+ .dark [data-sprout-theme='perplexity'] {
54
50
  --sprout-canvas: #191a1a;
55
51
  --sprout-surface: #202222;
56
52
  --sprout-hover: #303232;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #323434;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="perplexity"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="perplexity"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='perplexity'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='perplexity'] {
91
83
  --sprout-canvas: #191a1a;
92
84
  --sprout-surface: #202222;
93
85
  --sprout-hover: #303232;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #323434;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/raycast.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="raycast"] {
9
+ [data-sprout-theme='raycast'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.5rem;
12
12
  --sprout-radius-panel: 0.75rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="raycast"],
16
- .light[data-sprout-theme="raycast"],
17
- .light [data-sprout-theme="raycast"] {
15
+ [data-sprout-theme='raycast'],
16
+ .light[data-sprout-theme='raycast'],
17
+ .light [data-sprout-theme='raycast'] {
18
18
  --sprout-canvas: #f7f7f7;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f1f1f1;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #eeeeee;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="raycast"],
53
- .dark [data-sprout-theme="raycast"] {
48
+ .dark[data-sprout-theme='raycast'],
49
+ .dark [data-sprout-theme='raycast'] {
54
50
  --sprout-canvas: #0c0c0c;
55
51
  --sprout-surface: #161616;
56
52
  --sprout-hover: #282828;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #2a2a2a;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="raycast"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="raycast"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='raycast'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='raycast'] {
91
83
  --sprout-canvas: #0c0c0c;
92
84
  --sprout-surface: #161616;
93
85
  --sprout-hover: #282828;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #2a2a2a;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }
package/dist/styles/themes/spotify.css CHANGED
@@ -6,15 +6,15 @@
6
6
  * that subtree.
7
7
  */
8
8
  @layer base {
9
- [data-sprout-theme="spotify"] {
9
+ [data-sprout-theme='spotify'] {
10
10
  --sprout-font: ui-sans-serif, system-ui, sans-serif;
11
11
  --sprout-radius-control: 0.5rem;
12
12
  --sprout-radius-panel: 0.75rem;
13
13
  }
14
14
 
15
- [data-sprout-theme="spotify"],
16
- .light[data-sprout-theme="spotify"],
17
- .light [data-sprout-theme="spotify"] {
15
+ [data-sprout-theme='spotify'],
16
+ .light[data-sprout-theme='spotify'],
17
+ .light [data-sprout-theme='spotify'] {
18
18
  --sprout-canvas: #f6f6f6;
19
19
  --sprout-surface: #ffffff;
20
20
  --sprout-hover: #f1f1f1;
@@ -40,17 +40,13 @@
40
40
  --sprout-success-subtle: #e8f4eb;
41
41
  --sprout-warning: #8a4b08;
42
42
  --sprout-warning-subtle: #fdf1dc;
43
- --sprout-primary-subtle: color-mix(
44
- in oklab,
45
- var(--sprout-primary) 10%,
46
- var(--sprout-surface)
47
- );
43
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 10%, var(--sprout-surface));
48
44
  --sprout-secondary: #eeeeee;
49
45
  --sprout-overlay: rgb(18 18 18 / 0.35);
50
46
  }
51
47
 
52
- .dark[data-sprout-theme="spotify"],
53
- .dark [data-sprout-theme="spotify"] {
48
+ .dark[data-sprout-theme='spotify'],
49
+ .dark [data-sprout-theme='spotify'] {
54
50
  --sprout-canvas: #121212;
55
51
  --sprout-surface: #181818;
56
52
  --sprout-hover: #2a2a2a;
@@ -76,18 +72,14 @@
76
72
  --sprout-success-subtle: #1c3223;
77
73
  --sprout-warning: #eec27e;
78
74
  --sprout-warning-subtle: #34291b;
79
- --sprout-primary-subtle: color-mix(
80
- in oklab,
81
- var(--sprout-primary) 16%,
82
- var(--sprout-surface)
83
- );
75
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
84
76
  --sprout-secondary: #2d2d2d;
85
77
  --sprout-overlay: rgb(8 8 8 / 0.65);
86
78
  }
87
79
 
88
80
  @media (prefers-color-scheme: dark) {
89
- :root:not(.light):not(.dark)[data-sprout-theme="spotify"],
90
- :root:not(.light):not(.dark) [data-sprout-theme="spotify"] {
81
+ :root:not(.light):not(.dark)[data-sprout-theme='spotify'],
82
+ :root:not(.light):not(.dark) [data-sprout-theme='spotify'] {
91
83
  --sprout-canvas: #121212;
92
84
  --sprout-surface: #181818;
93
85
  --sprout-hover: #2a2a2a;
@@ -113,11 +105,7 @@
113
105
  --sprout-success-subtle: #1c3223;
114
106
  --sprout-warning: #eec27e;
115
107
  --sprout-warning-subtle: #34291b;
116
- --sprout-primary-subtle: color-mix(
117
- in oklab,
118
- var(--sprout-primary) 16%,
119
- var(--sprout-surface)
120
- );
108
+ --sprout-primary-subtle: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
121
109
  --sprout-secondary: #2d2d2d;
122
110
  --sprout-overlay: rgb(8 8 8 / 0.65);
123
111
  }