@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
@@ -18,13 +18,11 @@
18
18
  font-size: var(--sprout-text-sm);
19
19
  color: var(--sprout-text);
20
20
  }
21
- .sprout-message[data-align="end"] {
21
+ .sprout-message[data-align='end'] {
22
22
  flex-direction: row-reverse;
23
23
  }
24
24
  /* A ghost bubble has no padding, so names and status line up with its text. */
25
- .sprout-message:has(
26
- > [data-slot="message-content"] > [data-variant="ghost"]
27
- ) {
25
+ .sprout-message:has(> [data-slot='message-content'] > [data-variant='ghost']) {
28
26
  --sprout-message-meta-inset: 0px;
29
27
  }
30
28
 
@@ -41,13 +39,8 @@
41
39
  background: var(--sprout-secondary);
42
40
  }
43
41
  /* Keeps the avatar beside the last bubble instead of beside the footer. */
44
- .sprout-message:has(
45
- > [data-slot="message-content"] > [data-slot="message-footer"]
46
- )
47
- > .sprout-message-avatar {
48
- transform: translateY(
49
- calc(-1 * (var(--sprout-message-content-gap) + 1rem))
50
- );
42
+ .sprout-message:has(> [data-slot='message-content'] > [data-slot='message-footer']) > .sprout-message-avatar {
43
+ transform: translateY(calc(-1 * (var(--sprout-message-content-gap) + 1rem)));
51
44
  }
52
45
 
53
46
  .sprout-message-content {
@@ -58,7 +51,7 @@
58
51
  min-width: 0;
59
52
  overflow-wrap: break-word;
60
53
  }
61
- .sprout-message[data-align="end"] > .sprout-message-content > [data-slot] {
54
+ .sprout-message[data-align='end'] > .sprout-message-content > [data-slot] {
62
55
  align-self: flex-end;
63
56
  }
64
57
 
@@ -74,9 +67,7 @@
74
67
  font-weight: 500;
75
68
  line-height: 1rem;
76
69
  }
77
- .sprout-message[data-align="end"]
78
- > .sprout-message-content
79
- > .sprout-message-footer {
70
+ .sprout-message[data-align='end'] > .sprout-message-content > .sprout-message-footer {
80
71
  justify-content: flex-end;
81
72
  }
82
73
 
@@ -102,14 +93,11 @@
102
93
  .sprout-message-bubble-frame > .sprout-message-bubble {
103
94
  max-width: 100%;
104
95
  }
105
- .sprout-message-bubble-frame[data-variant="ghost"] {
96
+ .sprout-message-bubble-frame[data-variant='ghost'] {
106
97
  max-width: 100%;
107
98
  }
108
- [data-slot="message"][data-align="end"]
109
- :is(
110
- .sprout-message-bubble-frame,
111
- :not(.sprout-message-bubble-frame) > .sprout-message-bubble
112
- ) {
99
+ [data-slot='message'][data-align='end']
100
+ :is(.sprout-message-bubble-frame, :not(.sprout-message-bubble-frame) > .sprout-message-bubble) {
113
101
  align-self: flex-end;
114
102
  margin-inline-start: auto;
115
103
  }
@@ -149,7 +137,7 @@
149
137
  outline-offset: 0;
150
138
  }
151
139
  .sprout-message-bubble:is(button):disabled,
152
- .sprout-message-bubble[aria-disabled="true"] {
140
+ .sprout-message-bubble[aria-disabled='true'] {
153
141
  opacity: 0.55;
154
142
  cursor: not-allowed;
155
143
  }
@@ -161,31 +149,15 @@
161
149
  }
162
150
  .sprout-message-bubble-secondary {
163
151
  --sprout-message-bubble-fill: var(--sprout-secondary);
164
- --sprout-message-bubble-fill-hover: color-mix(
165
- in oklab,
166
- var(--sprout-text) 6%,
167
- var(--sprout-secondary)
168
- );
152
+ --sprout-message-bubble-fill-hover: color-mix(in oklab, var(--sprout-text) 6%, var(--sprout-secondary));
169
153
  }
170
154
  .sprout-message-bubble-muted {
171
- --sprout-message-bubble-fill: color-mix(
172
- in oklab,
173
- var(--sprout-secondary) 55%,
174
- var(--sprout-surface)
175
- );
155
+ --sprout-message-bubble-fill: color-mix(in oklab, var(--sprout-secondary) 55%, var(--sprout-surface));
176
156
  --sprout-message-bubble-fill-hover: var(--sprout-secondary);
177
157
  }
178
158
  .sprout-message-bubble-tinted {
179
- --sprout-message-bubble-fill: color-mix(
180
- in oklab,
181
- var(--sprout-primary) 14%,
182
- var(--sprout-surface)
183
- );
184
- --sprout-message-bubble-fill-hover: color-mix(
185
- in oklab,
186
- var(--sprout-primary) 22%,
187
- var(--sprout-surface)
188
- );
159
+ --sprout-message-bubble-fill: color-mix(in oklab, var(--sprout-primary) 14%, var(--sprout-surface));
160
+ --sprout-message-bubble-fill-hover: color-mix(in oklab, var(--sprout-primary) 22%, var(--sprout-surface));
189
161
  }
190
162
  .sprout-message-bubble-outline {
191
163
  --sprout-message-bubble-fill: var(--sprout-surface);
@@ -199,11 +171,7 @@
199
171
  }
200
172
  .sprout-message-bubble-destructive {
201
173
  --sprout-message-bubble-fill: var(--sprout-danger-subtle);
202
- --sprout-message-bubble-fill-hover: color-mix(
203
- in oklab,
204
- var(--sprout-danger) 16%,
205
- var(--sprout-danger-subtle)
206
- );
174
+ --sprout-message-bubble-fill-hover: color-mix(in oklab, var(--sprout-danger) 16%, var(--sprout-danger-subtle));
207
175
  --sprout-message-bubble-ink: var(--sprout-danger);
208
176
  }
209
177
  .sprout-message-bubble-destructive:is(button, a):focus-visible {
@@ -224,25 +192,24 @@
224
192
  padding: 2px 6px;
225
193
  border-radius: 999px;
226
194
  background: var(--sprout-secondary);
227
- box-shadow: 0 0 0 3px
228
- var(--sprout-message-reactions-ring, var(--sprout-surface));
195
+ box-shadow: 0 0 0 3px var(--sprout-message-reactions-ring, var(--sprout-surface));
229
196
  font-size: var(--sprout-text-sm);
230
197
  line-height: 20px;
231
198
  white-space: nowrap;
232
199
  color: var(--sprout-text);
233
200
  }
234
- .sprout-message-reactions[data-side="top"] {
201
+ .sprout-message-reactions[data-side='top'] {
235
202
  top: 0;
236
203
  translate: 0 -75%;
237
204
  }
238
- .sprout-message-reactions[data-side="bottom"] {
205
+ .sprout-message-reactions[data-side='bottom'] {
239
206
  bottom: 0;
240
207
  translate: 0 75%;
241
208
  }
242
- .sprout-message-reactions[data-align="start"] {
209
+ .sprout-message-reactions[data-align='start'] {
243
210
  inset-inline-start: 12px;
244
211
  }
245
- .sprout-message-reactions[data-align="end"] {
212
+ .sprout-message-reactions[data-align='end'] {
246
213
  inset-inline-end: 12px;
247
214
  }
248
215
  .sprout-message-reactions:has(button) {
@@ -265,7 +232,7 @@
265
232
  cursor: pointer;
266
233
  outline: none;
267
234
  }
268
- .sprout-message-reactions > button[aria-pressed="true"] {
235
+ .sprout-message-reactions > button[aria-pressed='true'] {
269
236
  background: var(--sprout-primary-subtle);
270
237
  color: var(--sprout-primary);
271
238
  }
@@ -281,12 +248,8 @@
281
248
  .sprout-message-reactions > button:hover {
282
249
  background: var(--sprout-hover);
283
250
  }
284
- .sprout-message-reactions > button[aria-pressed="true"]:hover {
285
- background: color-mix(
286
- in oklab,
287
- var(--sprout-primary) 16%,
288
- var(--sprout-surface)
289
- );
251
+ .sprout-message-reactions > button[aria-pressed='true']:hover {
252
+ background: color-mix(in oklab, var(--sprout-primary) 16%, var(--sprout-surface));
290
253
  }
291
254
  }
292
255
 
@@ -30,9 +30,7 @@
30
30
 
31
31
  /* Triggers, and top-level links given navigationMenuTriggerStyle(). */
32
32
  .sprout-navigation-menu-trigger,
33
- .sprout-navigation-menu-list
34
- > .sprout-navigation-menu-item
35
- > .sprout-navigation-menu-link {
33
+ .sprout-navigation-menu-list > .sprout-navigation-menu-item > .sprout-navigation-menu-link {
36
34
  box-sizing: border-box;
37
35
  display: inline-flex;
38
36
  align-items: center;
@@ -59,21 +57,15 @@
59
57
  -webkit-tap-highlight-color: transparent;
60
58
  }
61
59
  .sprout-navigation-menu-trigger:hover,
62
- .sprout-navigation-menu-list
63
- > .sprout-navigation-menu-item
64
- > .sprout-navigation-menu-link:hover {
60
+ .sprout-navigation-menu-list > .sprout-navigation-menu-item > .sprout-navigation-menu-link:hover {
65
61
  background: var(--sprout-hover);
66
62
  }
67
63
  .sprout-navigation-menu-trigger[data-popup-open],
68
- .sprout-navigation-menu-list
69
- > .sprout-navigation-menu-item
70
- > .sprout-navigation-menu-link[data-active] {
64
+ .sprout-navigation-menu-list > .sprout-navigation-menu-item > .sprout-navigation-menu-link[data-active] {
71
65
  background: var(--sprout-hover);
72
66
  }
73
67
  .sprout-navigation-menu-trigger[data-popup-open]:hover,
74
- .sprout-navigation-menu-list
75
- > .sprout-navigation-menu-item
76
- > .sprout-navigation-menu-link[data-active]:hover {
68
+ .sprout-navigation-menu-list > .sprout-navigation-menu-item > .sprout-navigation-menu-link[data-active]:hover {
77
69
  background: var(--sprout-active);
78
70
  }
79
71
  .sprout-navigation-menu-trigger:focus-visible,
@@ -118,7 +110,7 @@
118
110
  .sprout-navigation-menu-link > svg {
119
111
  flex-shrink: 0;
120
112
  }
121
- .sprout-navigation-menu-link > svg:not([class*="size-"]) {
113
+ .sprout-navigation-menu-link > svg:not([class*='size-']) {
122
114
  width: 16px;
123
115
  height: 16px;
124
116
  }
@@ -178,9 +170,9 @@
178
170
  /* A hover bridge across the side offset so the pointer can reach the panel. */
179
171
  .sprout-navigation-menu-positioner::before {
180
172
  position: absolute;
181
- content: "";
173
+ content: '';
182
174
  }
183
- .sprout-navigation-menu-positioner[data-side="bottom"]::before {
175
+ .sprout-navigation-menu-positioner[data-side='bottom']::before {
184
176
  top: -8px;
185
177
  right: 0;
186
178
  left: 0;
@@ -233,8 +225,7 @@
233
225
  @media (prefers-reduced-motion: no-preference) {
234
226
  .sprout-navigation-menu-trigger,
235
227
  .sprout-navigation-menu-link {
236
- transition: background-color var(--sprout-motion-fast)
237
- var(--sprout-motion-ease);
228
+ transition: background-color var(--sprout-motion-fast) var(--sprout-motion-ease);
238
229
  }
239
230
  .sprout-navigation-menu-chevron {
240
231
  transition: rotate var(--sprout-motion-normal) var(--sprout-motion-ease);
@@ -261,10 +252,7 @@
261
252
  width var(--sprout-motion-normal) var(--sprout-motion-ease),
262
253
  height var(--sprout-motion-normal) var(--sprout-motion-ease);
263
254
  }
264
- .sprout-navigation-menu-popup:is(
265
- [data-starting-style],
266
- [data-ending-style]
267
- ) {
255
+ .sprout-navigation-menu-popup:is([data-starting-style], [data-ending-style]) {
268
256
  opacity: 0;
269
257
  scale: 0.96;
270
258
  }
@@ -273,18 +261,15 @@
273
261
  opacity var(--sprout-motion-fast) var(--sprout-motion-ease),
274
262
  translate var(--sprout-motion-normal) var(--sprout-motion-ease);
275
263
  }
276
- .sprout-navigation-menu-content:is(
277
- [data-starting-style],
278
- [data-ending-style]
279
- ) {
264
+ .sprout-navigation-menu-content:is([data-starting-style], [data-ending-style]) {
280
265
  opacity: 0;
281
266
  }
282
- .sprout-navigation-menu-content[data-starting-style][data-activation-direction="left"],
283
- .sprout-navigation-menu-content[data-ending-style][data-activation-direction="right"] {
267
+ .sprout-navigation-menu-content[data-starting-style][data-activation-direction='left'],
268
+ .sprout-navigation-menu-content[data-ending-style][data-activation-direction='right'] {
284
269
  translate: -24px 0;
285
270
  }
286
- .sprout-navigation-menu-content[data-starting-style][data-activation-direction="right"],
287
- .sprout-navigation-menu-content[data-ending-style][data-activation-direction="left"] {
271
+ .sprout-navigation-menu-content[data-starting-style][data-activation-direction='right'],
272
+ .sprout-navigation-menu-content[data-ending-style][data-activation-direction='left'] {
288
273
  translate: 24px 0;
289
274
  }
290
275
  }
@@ -54,8 +54,7 @@
54
54
 
55
55
  @media (prefers-reduced-motion: no-preference) {
56
56
  .sprout-notice-banner {
57
- animation: sprout-notice-banner-in var(--sprout-motion-normal)
58
- var(--sprout-motion-ease);
57
+ animation: sprout-notice-banner-in var(--sprout-motion-normal) var(--sprout-motion-ease);
59
58
  }
60
59
  }
61
60
 
@@ -29,12 +29,12 @@
29
29
  font-weight: 500;
30
30
  letter-spacing: normal;
31
31
  }
32
- .sprout-page-header-title[data-placement="page"] {
32
+ .sprout-page-header-title[data-placement='page'] {
33
33
  font-size: 1.5rem;
34
34
  line-height: 2rem;
35
35
  overflow-wrap: break-word;
36
36
  }
37
- .sprout-page-header-title[data-placement="chrome"] {
37
+ .sprout-page-header-title[data-placement='chrome'] {
38
38
  min-width: 0;
39
39
  overflow: hidden;
40
40
  font-size: var(--sprout-text-sm);
@@ -65,10 +65,10 @@
65
65
  align-items: center;
66
66
  gap: 0.5rem;
67
67
  }
68
- .sprout-page-header-actions[data-placement="page"] {
68
+ .sprout-page-header-actions[data-placement='page'] {
69
69
  flex-wrap: wrap;
70
70
  }
71
- .sprout-page-header-actions[data-placement="inline"] {
71
+ .sprout-page-header-actions[data-placement='inline'] {
72
72
  justify-content: flex-end;
73
73
  }
74
74
 
@@ -111,19 +111,16 @@
111
111
  outline: var(--sprout-focus-width) solid var(--sprout-focus-ring);
112
112
  outline-offset: 0;
113
113
  }
114
- .sprout-page-header-breadcrumb[data-placement="chrome"]
115
- .sprout-page-header-breadcrumb-item:first-child {
114
+ .sprout-page-header-breadcrumb[data-placement='chrome'] .sprout-page-header-breadcrumb-item:first-child {
116
115
  flex-shrink: 3;
117
116
  min-width: 2rem;
118
117
  }
119
- .sprout-page-header-breadcrumb[data-placement="chrome"]
120
- .sprout-page-header-breadcrumb-link {
118
+ .sprout-page-header-breadcrumb[data-placement='chrome'] .sprout-page-header-breadcrumb-link {
121
119
  min-width: 0;
122
120
  overflow: hidden;
123
121
  text-overflow: ellipsis;
124
122
  }
125
- .sprout-page-header-breadcrumb[data-placement="chrome"]
126
- .sprout-page-header-breadcrumb-current {
123
+ .sprout-page-header-breadcrumb[data-placement='chrome'] .sprout-page-header-breadcrumb-current {
127
124
  min-width: 2.5rem;
128
125
  }
129
126
  .sprout-page-header-breadcrumb-separator {
@@ -61,10 +61,7 @@
61
61
  .sprout-pagination-label {
62
62
  display: none;
63
63
  }
64
- .sprout-pagination-link:is(
65
- .sprout-pagination-previous,
66
- .sprout-pagination-next
67
- ) {
64
+ .sprout-pagination-link:is(.sprout-pagination-previous, .sprout-pagination-next) {
68
65
  aspect-ratio: 1;
69
66
  padding-inline: 0;
70
67
  }
@@ -66,19 +66,19 @@
66
66
  border-start-end-radius: 999px;
67
67
  border-end-end-radius: 999px;
68
68
  }
69
- .sprout-plan-outline-segment[data-mark="running"] {
69
+ .sprout-plan-outline-segment[data-mark='running'] {
70
70
  background: var(--sprout-info);
71
71
  }
72
- .sprout-plan-outline-segment[data-mark="attention"] {
72
+ .sprout-plan-outline-segment[data-mark='attention'] {
73
73
  background: var(--sprout-warning);
74
74
  }
75
- .sprout-plan-outline-segment[data-mark="blocked"] {
75
+ .sprout-plan-outline-segment[data-mark='blocked'] {
76
76
  background: color-mix(in oklab, var(--sprout-muted) 40%, transparent);
77
77
  }
78
- .sprout-plan-outline-segment[data-mark="done"] {
78
+ .sprout-plan-outline-segment[data-mark='done'] {
79
79
  background: var(--sprout-success);
80
80
  }
81
- .sprout-plan-outline-segment[data-mark="failed"] {
81
+ .sprout-plan-outline-segment[data-mark='failed'] {
82
82
  background: var(--sprout-danger);
83
83
  }
84
84
  .sprout-plan-outline-progress-text {
@@ -160,16 +160,16 @@
160
160
  width: 14px;
161
161
  height: 14px;
162
162
  }
163
- [data-mark="running"] > .sprout-plan-outline-row .sprout-plan-outline-mark {
163
+ [data-mark='running'] > .sprout-plan-outline-row .sprout-plan-outline-mark {
164
164
  color: var(--sprout-info);
165
165
  }
166
- [data-mark="attention"] > .sprout-plan-outline-row .sprout-plan-outline-mark {
166
+ [data-mark='attention'] > .sprout-plan-outline-row .sprout-plan-outline-mark {
167
167
  color: var(--sprout-warning);
168
168
  }
169
- [data-mark="done"] > .sprout-plan-outline-row .sprout-plan-outline-mark {
169
+ [data-mark='done'] > .sprout-plan-outline-row .sprout-plan-outline-mark {
170
170
  color: var(--sprout-success);
171
171
  }
172
- [data-mark="failed"] > .sprout-plan-outline-row .sprout-plan-outline-mark {
172
+ [data-mark='failed'] > .sprout-plan-outline-row .sprout-plan-outline-mark {
173
173
  color: var(--sprout-danger);
174
174
  }
175
175
  .sprout-plan-outline-text {
@@ -184,21 +184,13 @@
184
184
  line-height: 1.25rem;
185
185
  overflow-wrap: anywhere;
186
186
  }
187
- [data-kind="group"]
188
- > .sprout-plan-outline-row
189
- .sprout-plan-outline-task-title {
187
+ [data-kind='group'] > .sprout-plan-outline-row .sprout-plan-outline-task-title {
190
188
  font-weight: 500;
191
189
  }
192
- [data-mark="cancelled"]
193
- > .sprout-plan-outline-row
194
- .sprout-plan-outline-task-title {
190
+ [data-mark='cancelled'] > .sprout-plan-outline-row .sprout-plan-outline-task-title {
195
191
  color: var(--sprout-muted);
196
192
  text-decoration: line-through;
197
- text-decoration-color: color-mix(
198
- in oklab,
199
- var(--sprout-muted) 60%,
200
- transparent
201
- );
193
+ text-decoration-color: color-mix(in oklab, var(--sprout-muted) 60%, transparent);
202
194
  }
203
195
  .sprout-plan-outline-assignee {
204
196
  display: flex;
@@ -225,13 +217,11 @@
225
217
  line-height: 1rem;
226
218
  text-align: end;
227
219
  }
228
- [data-mark="attention"]
229
- > .sprout-plan-outline-row
230
- .sprout-plan-outline-label {
220
+ [data-mark='attention'] > .sprout-plan-outline-row .sprout-plan-outline-label {
231
221
  color: var(--sprout-warning);
232
222
  font-weight: 500;
233
223
  }
234
- [data-mark="failed"] > .sprout-plan-outline-row .sprout-plan-outline-label {
224
+ [data-mark='failed'] > .sprout-plan-outline-row .sprout-plan-outline-label {
235
225
  color: var(--sprout-danger);
236
226
  }
237
227
  .sprout-plan-outline-chevron {
@@ -287,10 +277,7 @@
287
277
  margin: 0;
288
278
  overflow-wrap: anywhere;
289
279
  }
290
- [data-mark="failed"]
291
- > .sprout-plan-outline-panel
292
- > .sprout-plan-outline-detail
293
- > .sprout-plan-outline-reason {
280
+ [data-mark='failed'] > .sprout-plan-outline-panel > .sprout-plan-outline-detail > .sprout-plan-outline-reason {
294
281
  color: var(--sprout-danger);
295
282
  }
296
283
  .sprout-plan-outline-task-brief {
@@ -364,21 +351,17 @@
364
351
 
365
352
  @media (prefers-reduced-motion: no-preference) {
366
353
  .sprout-plan-outline-segment {
367
- transition: background-color var(--sprout-motion-normal, 180ms)
368
- var(--sprout-motion-ease, ease-out);
354
+ transition: background-color var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease-out);
369
355
  }
370
356
  .sprout-plan-outline-trigger {
371
- transition: background-color var(--sprout-motion-fast, 120ms)
372
- var(--sprout-motion-ease, ease-out);
357
+ transition: background-color var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out);
373
358
  }
374
359
  .sprout-plan-outline-chevron {
375
- transition: transform var(--sprout-motion-fast, 120ms)
376
- var(--sprout-motion-ease, ease-out);
360
+ transition: transform var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out);
377
361
  }
378
362
  .sprout-plan-outline-panel {
379
363
  transition:
380
- height var(--sprout-motion-normal, 180ms)
381
- var(--sprout-motion-ease, ease-out),
364
+ height var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease-out),
382
365
  opacity var(--sprout-motion-fast, 120ms) ease-out;
383
366
  }
384
367
  }
@@ -386,7 +369,7 @@
386
369
  .sprout-plan-outline-segment {
387
370
  background: GrayText;
388
371
  }
389
- .sprout-plan-outline-segment[data-mark="done"] {
372
+ .sprout-plan-outline-segment[data-mark='done'] {
390
373
  background: CanvasText;
391
374
  }
392
375
  }
@@ -106,34 +106,25 @@
106
106
  opacity: 0;
107
107
  scale: 0.96;
108
108
  }
109
- .sprout-popover-content[data-side="bottom"]:is(
110
- [data-starting-style],
111
- [data-ending-style]
112
- ) {
109
+ .sprout-popover-content[data-side='bottom']:is([data-starting-style], [data-ending-style]) {
113
110
  translate: 0 calc(var(--sprout-popover-shift) * -1);
114
111
  }
115
- .sprout-popover-content[data-side="top"]:is(
112
+ .sprout-popover-content[data-side='top']:is([data-starting-style], [data-ending-style]) {
113
+ translate: 0 var(--sprout-popover-shift);
114
+ }
115
+ .sprout-popover-content:is([data-side='right'], [data-side='inline-end']):is(
116
116
  [data-starting-style],
117
117
  [data-ending-style]
118
118
  ) {
119
- translate: 0 var(--sprout-popover-shift);
120
- }
121
- .sprout-popover-content:is(
122
- [data-side="right"],
123
- [data-side="inline-end"]
124
- ):is([data-starting-style], [data-ending-style]) {
125
119
  translate: calc(var(--sprout-popover-shift) * -1) 0;
126
120
  }
127
- .sprout-popover-content:is(
128
- [data-side="left"],
129
- [data-side="inline-start"]
130
- ):is([data-starting-style], [data-ending-style]) {
121
+ .sprout-popover-content:is([data-side='left'], [data-side='inline-start']):is(
122
+ [data-starting-style],
123
+ [data-ending-style]
124
+ ) {
131
125
  translate: var(--sprout-popover-shift) 0;
132
126
  }
133
- .sprout-popover-content:is(
134
- .sprout-popover-app-actions,
135
- .sprout-popover-bud
136
- ) {
127
+ .sprout-popover-content:is(.sprout-popover-app-actions, .sprout-popover-bud) {
137
128
  transition-duration: var(--sprout-motion-normal);
138
129
  }
139
130
  }
@@ -51,8 +51,7 @@
51
51
 
52
52
  @media (prefers-reduced-motion: no-preference) {
53
53
  .sprout-presence-cursor {
54
- transition: transform var(--sprout-motion-normal)
55
- var(--sprout-motion-ease);
54
+ transition: transform var(--sprout-motion-normal) var(--sprout-motion-ease);
56
55
  }
57
56
  }
58
57
 
@@ -52,8 +52,7 @@
52
52
  inset-block: 0;
53
53
  inset-inline-start: 0;
54
54
  width: 40%;
55
- animation: sprout-progress-slide 1.4s var(--sprout-motion-ease, ease-in-out)
56
- infinite;
55
+ animation: sprout-progress-slide 1.4s var(--sprout-motion-ease, ease-in-out) infinite;
57
56
  }
58
57
 
59
58
  @keyframes sprout-progress-slide {
@@ -67,8 +66,7 @@
67
66
 
68
67
  @media (prefers-reduced-motion: no-preference) {
69
68
  .sprout-progress-indicator {
70
- transition: width var(--sprout-motion-normal, 180ms)
71
- var(--sprout-motion-ease, ease-out);
69
+ transition: width var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease-out);
72
70
  }
73
71
  }
74
72
 
@@ -87,7 +87,7 @@
87
87
  -webkit-tap-highlight-color: transparent;
88
88
  }
89
89
  .sprout-prompt-list-button::after {
90
- content: "";
90
+ content: '';
91
91
  position: absolute;
92
92
  inset: 0;
93
93
  border-radius: inherit;
@@ -113,21 +113,16 @@
113
113
  transform: scaleX(-1);
114
114
  }
115
115
 
116
- .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(
117
- :hover,
118
- :focus-within
119
- )
116
+ .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(:hover, :focus-within)
120
117
  :is(.sprout-prompt-list-icon, .sprout-prompt-list-arrow) {
121
118
  color: var(--sprout-text);
122
119
  }
123
120
 
124
121
  @media (prefers-reduced-motion: no-preference) {
125
122
  .sprout-prompt-list-item {
126
- animation: sprout-prompt-rise var(--sprout-motion-normal)
127
- var(--sprout-motion-ease) both;
123
+ animation: sprout-prompt-rise var(--sprout-motion-normal) var(--sprout-motion-ease) both;
128
124
  animation-delay: calc(var(--sprout-prompt-index, 0) * 40ms);
129
- transition: background-color var(--sprout-motion-fast)
130
- var(--sprout-motion-ease);
125
+ transition: background-color var(--sprout-motion-fast) var(--sprout-motion-ease);
131
126
  }
132
127
  .sprout-prompt-list-icon,
133
128
  .sprout-prompt-list-arrow {
@@ -135,17 +130,11 @@
135
130
  transform var(--sprout-motion-fast) var(--sprout-motion-ease),
136
131
  color var(--sprout-motion-fast) var(--sprout-motion-ease);
137
132
  }
138
- .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(
139
- :hover,
140
- :focus-within
141
- )
133
+ .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(:hover, :focus-within)
142
134
  .sprout-prompt-list-icon {
143
135
  transform: scale(1.08);
144
136
  }
145
- .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(
146
- :hover,
147
- :focus-within
148
- )
137
+ .sprout-prompt-list-item:has(.sprout-prompt-list-button:enabled):is(:hover, :focus-within)
149
138
  .sprout-prompt-list-arrow:not(:dir(rtl)) {
150
139
  transform: translateX(2px);
151
140
  }