@opencode-ai/ui 0.0.0-dev-202609071625 → 0.0.0-dev-19265

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 (299) hide show
  1. package/dist/actions/button/button.d.ts +10 -0
  2. package/dist/actions/icon-button/icon-button.d.ts +11 -0
  3. package/dist/actions/split-button/split-button.d.ts +5 -0
  4. package/dist/components/card.d.ts +1 -1
  5. package/dist/components/list.d.ts +1 -1
  6. package/dist/components/scroll-view.d.ts +14 -4
  7. package/dist/context/i18n.d.ts +10 -7
  8. package/dist/context/marked-base.d.ts +3 -0
  9. package/dist/context/marked-parser.d.ts +1 -2
  10. package/dist/{components → data-display/accordion}/accordion.d.ts +6 -6
  11. package/dist/{v2/components/avatar-v2.d.ts → data-display/avatar/avatar.d.ts} +1 -1
  12. package/dist/data-display/badge/badge.d.ts +7 -0
  13. package/dist/{components → data-display/diff-changes}/diff-changes.d.ts +2 -1
  14. package/dist/data-display/keybind/keybind.d.ts +7 -0
  15. package/dist/{v2/components/line-comment-v2.d.ts → data-display/line-comment/line-comment.d.ts} +9 -9
  16. package/dist/{v2/components/project-avatar-v2.d.ts → data-display/project-avatar/project-avatar.d.ts} +1 -1
  17. package/dist/feedback/loader/loader.d.ts +3 -0
  18. package/dist/{components → feedback/progress-circle}/progress-circle.d.ts +2 -0
  19. package/dist/feedback/toast/toast.d.ts +57 -0
  20. package/dist/{components → forms/checkbox}/checkbox.d.ts +2 -2
  21. package/dist/{v2/components/field-v2.d.ts → forms/field/field.d.ts} +4 -10
  22. package/dist/forms/radio/radio.d.ts +16 -0
  23. package/dist/{v2/components/select-v2.d.ts → forms/select/select.d.ts} +5 -6
  24. package/dist/{components → forms/switch}/switch.d.ts +4 -2
  25. package/dist/{v2/components/text-input-v2.d.ts → forms/text-input/text-input.d.ts} +3 -3
  26. package/dist/forms/textarea/textarea.d.ts +7 -0
  27. package/dist/hooks/use-filtered-list.d.ts +9 -0
  28. package/dist/i18n/ar.d.ts +0 -2
  29. package/dist/i18n/bg.d.ts +0 -2
  30. package/dist/i18n/br.d.ts +0 -2
  31. package/dist/i18n/bs.d.ts +0 -2
  32. package/dist/i18n/da.d.ts +0 -2
  33. package/dist/i18n/de.d.ts +0 -2
  34. package/dist/i18n/en.d.ts +244 -1
  35. package/dist/i18n/es.d.ts +0 -2
  36. package/dist/i18n/fr.d.ts +0 -2
  37. package/dist/i18n/he.d.ts +197 -0
  38. package/dist/i18n/ja.d.ts +0 -2
  39. package/dist/i18n/km.d.ts +0 -2
  40. package/dist/i18n/ko.d.ts +0 -2
  41. package/dist/i18n/lo.d.ts +0 -2
  42. package/dist/i18n/mk.d.ts +0 -2
  43. package/dist/i18n/mn.d.ts +0 -2
  44. package/dist/i18n/my.d.ts +0 -2
  45. package/dist/i18n/pl.d.ts +0 -2
  46. package/dist/i18n/ru.d.ts +0 -2
  47. package/dist/i18n/sr.d.ts +0 -2
  48. package/dist/i18n/tg.d.ts +0 -2
  49. package/dist/i18n/th.d.ts +0 -2
  50. package/dist/i18n/tr.d.ts +0 -2
  51. package/dist/i18n/zh.d.ts +0 -2
  52. package/dist/i18n/zht.d.ts +0 -2
  53. package/dist/{components/icon.d.ts → icons/icon/additional-icons.d.ts} +8 -8
  54. package/dist/{v2/components → icons/icon}/icon.d.ts +60 -1
  55. package/dist/layout/divider/divider.d.ts +5 -0
  56. package/dist/navigation/menu/menu.d.ts +59 -0
  57. package/dist/{v2/components/segmented-control-v2.d.ts → navigation/segmented-control/segmented-control.d.ts} +5 -5
  58. package/dist/{components → navigation/tabs}/tabs.d.ts +15 -8
  59. package/dist/{v2/components/dialog-v2.d.ts → overlays/dialog/dialog.d.ts} +1 -2
  60. package/dist/overlays/tooltip/tooltip.d.ts +15 -0
  61. package/dist/{components → typography/text-shimmer}/text-shimmer.d.ts +1 -0
  62. package/dist/typography/wordmark/wordmark.d.ts +5 -0
  63. package/package.json +141 -35
  64. package/src/{v2/components/button-v2.css → actions/button/button.css} +30 -0
  65. package/src/{components → actions/button}/button.tsx +19 -11
  66. package/src/{v2/components/icon-button-v2.css → actions/icon-button/icon-button.css} +27 -9
  67. package/src/actions/icon-button/icon-button.tsx +32 -0
  68. package/src/{v2/components/split-button-v2.css → actions/split-button/split-button.css} +2 -6
  69. package/src/{v2/components/split-button-v2.tsx → actions/split-button/split-button.tsx} +4 -4
  70. package/src/components/animated-number.css +29 -11
  71. package/src/components/animated-number.tsx +2 -2
  72. package/src/components/card.css +2 -23
  73. package/src/components/card.tsx +4 -4
  74. package/src/components/collapsible.tsx +2 -2
  75. package/src/components/dock-surface.css +2 -9
  76. package/src/components/image-preview.tsx +3 -2
  77. package/src/components/list.css +5 -5
  78. package/src/components/list.tsx +7 -5
  79. package/src/components/popover.tsx +3 -2
  80. package/src/components/scroll-view.css +36 -4
  81. package/src/components/scroll-view.tsx +153 -88
  82. package/src/components/sticky-accordion-header.tsx +1 -1
  83. package/src/components/text-field.tsx +12 -4
  84. package/src/context/dialog.tsx +1 -0
  85. package/src/context/i18n.tsx +17 -14
  86. package/src/context/marked-base.tsx +27 -0
  87. package/src/context/marked-parser.tsx +3 -13
  88. package/src/{components → data-display/accordion}/accordion.css +7 -33
  89. package/src/{components → data-display/accordion}/accordion.tsx +14 -14
  90. package/src/{v2/components/avatar-v2.tsx → data-display/avatar/avatar.tsx} +1 -1
  91. package/src/{v2/components/badge-v2.css → data-display/badge/badge.css} +19 -0
  92. package/src/{v2/components/badge-v2.tsx → data-display/badge/badge.tsx} +6 -4
  93. package/src/{components → data-display/diff-changes}/diff-changes.css +22 -19
  94. package/src/{v2/components/diff-changes-v2.tsx → data-display/diff-changes/diff-changes.tsx} +7 -2
  95. package/src/{v2/components/keybind-v2.css → data-display/keybind/keybind.css} +1 -1
  96. package/src/{v2/components/keybind-v2.tsx → data-display/keybind/keybind.tsx} +3 -3
  97. package/src/{v2/components/line-comment-v2.css → data-display/line-comment/line-comment.css} +4 -4
  98. package/src/{v2/components/line-comment-v2.tsx → data-display/line-comment/line-comment.tsx} +17 -15
  99. package/src/{v2/components/project-avatar-v2.css → data-display/project-avatar/project-avatar.css} +4 -4
  100. package/src/{v2/components/project-avatar-v2.tsx → data-display/project-avatar/project-avatar.tsx} +1 -1
  101. package/src/{v2/components/loader-v2.tsx → feedback/loader/loader.tsx} +2 -2
  102. package/src/feedback/progress-circle/progress-circle.css +28 -0
  103. package/src/feedback/progress-circle/progress-circle.tsx +64 -0
  104. package/src/{v2/components/toast-v2.tsx → feedback/toast/toast.tsx} +60 -58
  105. package/src/{components → forms/checkbox}/checkbox.css +1 -7
  106. package/src/{components → forms/checkbox}/checkbox.tsx +13 -13
  107. package/src/{v2/components/field-v2.css → forms/field/field.css} +1 -1
  108. package/src/{v2/components/field-v2.tsx → forms/field/field.tsx} +9 -11
  109. package/src/{v2/components/radio-v2.tsx → forms/radio/radio.tsx} +30 -20
  110. package/src/{v2/components/select-v2.css → forms/select/select.css} +2 -8
  111. package/src/{v2/components/select-v2.tsx → forms/select/select.tsx} +42 -32
  112. package/src/{v2/components/switch-v2.css → forms/switch/switch.css} +110 -0
  113. package/src/forms/switch/switch.tsx +34 -0
  114. package/src/{v2/components/text-input-v2.css → forms/text-input/text-input.css} +3 -3
  115. package/src/{v2/components/text-input-v2.tsx → forms/text-input/text-input.tsx} +4 -4
  116. package/src/{v2/components/textarea-v2.tsx → forms/textarea/textarea.tsx} +3 -3
  117. package/src/hooks/create-auto-scroll.tsx +20 -0
  118. package/src/i18n/am.ts +7 -9
  119. package/src/i18n/ar.ts +7 -9
  120. package/src/i18n/az.ts +7 -9
  121. package/src/i18n/bg.ts +7 -9
  122. package/src/i18n/bn.ts +7 -9
  123. package/src/i18n/br.ts +7 -9
  124. package/src/i18n/bs.ts +7 -9
  125. package/src/i18n/ca.ts +7 -9
  126. package/src/i18n/cs.ts +7 -9
  127. package/src/i18n/da.ts +7 -9
  128. package/src/i18n/de.ts +1 -3
  129. package/src/i18n/dv.ts +7 -9
  130. package/src/i18n/dz.ts +5 -7
  131. package/src/i18n/el.ts +7 -9
  132. package/src/i18n/en.ts +61 -12
  133. package/src/i18n/es.ts +6 -8
  134. package/src/i18n/et.ts +7 -9
  135. package/src/i18n/fa.ts +7 -9
  136. package/src/i18n/fi.ts +7 -9
  137. package/src/i18n/fo.ts +7 -9
  138. package/src/i18n/fr.ts +6 -8
  139. package/src/i18n/he.ts +199 -0
  140. package/src/i18n/hi.ts +7 -9
  141. package/src/i18n/hr.ts +7 -9
  142. package/src/i18n/hu.ts +7 -9
  143. package/src/i18n/hy.ts +7 -9
  144. package/src/i18n/id.ts +7 -9
  145. package/src/i18n/is.ts +7 -9
  146. package/src/i18n/it.ts +7 -9
  147. package/src/i18n/ja.ts +7 -9
  148. package/src/i18n/ka.ts +7 -9
  149. package/src/i18n/km.ts +7 -9
  150. package/src/i18n/ko.ts +7 -9
  151. package/src/i18n/lo.ts +7 -9
  152. package/src/i18n/lt.ts +7 -9
  153. package/src/i18n/lv.ts +7 -9
  154. package/src/i18n/mk.ts +7 -9
  155. package/src/i18n/mn.ts +7 -9
  156. package/src/i18n/ms.ts +7 -9
  157. package/src/i18n/my.ts +7 -9
  158. package/src/i18n/ne.ts +7 -9
  159. package/src/i18n/nl.ts +7 -9
  160. package/src/i18n/no.ts +7 -9
  161. package/src/i18n/pa.ts +7 -9
  162. package/src/i18n/pl.ts +7 -9
  163. package/src/i18n/ro.ts +7 -9
  164. package/src/i18n/ru.ts +7 -9
  165. package/src/i18n/si.ts +7 -9
  166. package/src/i18n/sk.ts +7 -9
  167. package/src/i18n/sl.ts +7 -9
  168. package/src/i18n/sq.ts +7 -9
  169. package/src/i18n/sr.ts +7 -9
  170. package/src/i18n/sv.ts +7 -9
  171. package/src/i18n/tg.ts +7 -9
  172. package/src/i18n/th.ts +7 -9
  173. package/src/i18n/tk.ts +7 -9
  174. package/src/i18n/tr.ts +7 -9
  175. package/src/i18n/uk.ts +7 -9
  176. package/src/i18n/ur.ts +7 -9
  177. package/src/i18n/uz.ts +7 -9
  178. package/src/i18n/vi.ts +7 -9
  179. package/src/i18n/zh.ts +7 -9
  180. package/src/i18n/zht.ts +7 -9
  181. package/src/{components/icon.tsx → icons/icon/additional-icons.ts} +9 -75
  182. package/src/icons/icon/icon.css +3 -0
  183. package/src/{v2/components → icons/icon}/icon.tsx +96 -12
  184. package/src/{v2/components/divider-v2.tsx → layout/divider/divider.tsx} +3 -3
  185. package/src/{v2/components/menu-v2.css → navigation/menu/menu.css} +124 -2
  186. package/src/{v2/components/menu-v2.tsx → navigation/menu/menu.tsx} +96 -32
  187. package/src/{v2/components/segmented-control-v2.css → navigation/segmented-control/segmented-control.css} +1 -1
  188. package/src/{v2/components/segmented-control-v2.tsx → navigation/segmented-control/segmented-control.tsx} +9 -8
  189. package/src/{v2/components/tabs-v2.css → navigation/tabs/tabs-current.css} +25 -10
  190. package/src/{components → navigation/tabs}/tabs.css +53 -232
  191. package/src/navigation/tabs/tabs.tsx +194 -0
  192. package/src/{v2/components/dialog-v2.css → overlays/dialog/dialog.css} +3 -0
  193. package/src/{v2/components/dialog-v2.tsx → overlays/dialog/dialog.tsx} +11 -13
  194. package/src/{v2/components/tooltip-v2.css → overlays/tooltip/tooltip.css} +33 -0
  195. package/src/{v2/components/tooltip-v2.tsx → overlays/tooltip/tooltip.tsx} +24 -17
  196. package/src/styles/base.css +5 -0
  197. package/src/{v2/components/file-tree-v2.css → styles/file-tree.css} +64 -3
  198. package/src/styles/index.css +4 -20
  199. package/src/styles/tailwind/colors.css +2 -0
  200. package/src/styles/tailwind/index.css +18 -1
  201. package/src/styles/theme.css +2 -2
  202. package/src/{v2/styles → styles/tokens}/colors.css +8 -8
  203. package/src/{v2/styles → styles/tokens}/theme.css +23 -16
  204. package/src/theme/context.tsx +19 -11
  205. package/src/theme/themes/oc-2.json +50 -19
  206. package/src/theme/v2/default-primitives.ts +8 -8
  207. package/src/theme/v2/foreground.ts +1 -0
  208. package/src/theme/v2/mapping.ts +7 -1
  209. package/src/{components → typography/text-shimmer}/text-shimmer.css +2 -1
  210. package/src/{components → typography/text-shimmer}/text-shimmer.tsx +1 -0
  211. package/src/typography/wordmark/wordmark.tsx +39 -0
  212. package/dist/components/avatar.d.ts +0 -9
  213. package/dist/components/button.d.ts +0 -9
  214. package/dist/components/dialog.d.ts +0 -12
  215. package/dist/components/dropdown-menu.d.ts +0 -80
  216. package/dist/components/icon-button.d.ts +0 -10
  217. package/dist/components/keybind.d.ts +0 -6
  218. package/dist/components/radio-group.d.ts +0 -16
  219. package/dist/components/select.d.ts +0 -21
  220. package/dist/components/tag.d.ts +0 -5
  221. package/dist/components/toast.d.ts +0 -56
  222. package/dist/components/tooltip.d.ts +0 -17
  223. package/dist/v2/components/accordion-v2.d.ts +0 -26
  224. package/dist/v2/components/badge-v2.d.ts +0 -6
  225. package/dist/v2/components/button-v2.d.ts +0 -10
  226. package/dist/v2/components/checkbox-v2.d.ts +0 -10
  227. package/dist/v2/components/diff-changes-v2.d.ts +0 -11
  228. package/dist/v2/components/divider-v2.d.ts +0 -5
  229. package/dist/v2/components/icon-button-v2.d.ts +0 -11
  230. package/dist/v2/components/inline-input-v2.d.ts +0 -21
  231. package/dist/v2/components/keybind-v2.d.ts +0 -7
  232. package/dist/v2/components/loader-v2.d.ts +0 -3
  233. package/dist/v2/components/menu-v2.d.ts +0 -52
  234. package/dist/v2/components/progress-circle-v2.d.ts +0 -8
  235. package/dist/v2/components/radio-v2.d.ts +0 -16
  236. package/dist/v2/components/split-button-v2.d.ts +0 -5
  237. package/dist/v2/components/switch-v2.d.ts +0 -7
  238. package/dist/v2/components/tabs-v2.d.ts +0 -34
  239. package/dist/v2/components/text-shimmer-v2.d.ts +0 -9
  240. package/dist/v2/components/textarea-v2.d.ts +0 -7
  241. package/dist/v2/components/toast-v2.d.ts +0 -57
  242. package/dist/v2/components/tooltip-v2.d.ts +0 -13
  243. package/dist/v2/components/wordmark-v2.d.ts +0 -2
  244. package/src/components/avatar.css +0 -49
  245. package/src/components/avatar.tsx +0 -55
  246. package/src/components/button.css +0 -194
  247. package/src/components/dialog.css +0 -181
  248. package/src/components/dialog.tsx +0 -72
  249. package/src/components/diff-changes.tsx +0 -115
  250. package/src/components/dropdown-menu.css +0 -135
  251. package/src/components/dropdown-menu.tsx +0 -308
  252. package/src/components/icon-button.css +0 -181
  253. package/src/components/icon-button.tsx +0 -29
  254. package/src/components/icon.css +0 -39
  255. package/src/components/keybind.css +0 -18
  256. package/src/components/keybind.tsx +0 -20
  257. package/src/components/progress-circle.css +0 -16
  258. package/src/components/progress-circle.tsx +0 -64
  259. package/src/components/radio-group.css +0 -187
  260. package/src/components/radio-group.tsx +0 -83
  261. package/src/components/select.css +0 -201
  262. package/src/components/select.tsx +0 -174
  263. package/src/components/switch.css +0 -136
  264. package/src/components/switch.tsx +0 -29
  265. package/src/components/tabs.tsx +0 -126
  266. package/src/components/tag.css +0 -37
  267. package/src/components/tag.tsx +0 -22
  268. package/src/components/toast.css +0 -236
  269. package/src/components/toast.tsx +0 -185
  270. package/src/components/tooltip.css +0 -74
  271. package/src/components/tooltip.tsx +0 -163
  272. package/src/v2/components/accordion-v2.css +0 -139
  273. package/src/v2/components/accordion-v2.tsx +0 -86
  274. package/src/v2/components/button-v2.tsx +0 -35
  275. package/src/v2/components/checkbox-v2.css +0 -184
  276. package/src/v2/components/checkbox-v2.tsx +0 -65
  277. package/src/v2/components/diff-changes-v2.css +0 -26
  278. package/src/v2/components/icon-button-v2.tsx +0 -37
  279. package/src/v2/components/inline-input-v2.css +0 -225
  280. package/src/v2/components/inline-input-v2.tsx +0 -107
  281. package/src/v2/components/progress-circle-v2.css +0 -13
  282. package/src/v2/components/progress-circle-v2.tsx +0 -52
  283. package/src/v2/components/switch-v2.tsx +0 -28
  284. package/src/v2/components/tabs-v2.tsx +0 -149
  285. package/src/v2/components/text-shimmer-v2.css +0 -125
  286. package/src/v2/components/text-shimmer-v2.tsx +0 -63
  287. package/src/v2/components/wordmark-v2.tsx +0 -71
  288. /package/dist/{components → forms/inline-input}/inline-input.d.ts +0 -0
  289. /package/dist/{v2/components → navigation}/tab-state-indicator.d.ts +0 -0
  290. /package/src/{v2/components/avatar-v2.css → data-display/avatar/avatar.css} +0 -0
  291. /package/src/{v2/components/loader-v2.css → feedback/loader/loader.css} +0 -0
  292. /package/src/{v2/components/toast-v2.css → feedback/toast/toast.css} +0 -0
  293. /package/src/{components → forms/inline-input}/inline-input.css +0 -0
  294. /package/src/{components → forms/inline-input}/inline-input.tsx +0 -0
  295. /package/src/{v2/components/radio-v2.css → forms/radio/radio.css} +0 -0
  296. /package/src/{v2/components/textarea-v2.css → forms/textarea/textarea.css} +0 -0
  297. /package/src/{v2/components/divider-v2.css → layout/divider/divider.css} +0 -0
  298. /package/src/{v2/components → navigation}/tab-state-indicator.tsx +0 -0
  299. /package/src/{v2/styles/tailwind.css → styles/tokens/index.css} +0 -0
@@ -84,8 +84,9 @@ const names: Record<string, string> = {
84
84
  }
85
85
  const oc2Theme = oc2ThemeJson as DesktopTheme
86
86
 
87
- function normalize(id: string | null | undefined) {
88
- return id === "oc-1" ? "oc-2" : id
87
+ function resolveStoredTheme(id: string | null | undefined, registered?: Record<string, DesktopTheme>) {
88
+ if (id === "oc-2" || (id && (knownThemes().has(id) || registered?.[id]))) return id
89
+ return "oc-2"
89
90
  }
90
91
 
91
92
  function read(key: string) {
@@ -177,7 +178,12 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
177
178
  defaultTheme?: string
178
179
  onThemeApplied?: (theme: DesktopTheme, mode: "light" | "dark", scheme: ColorScheme) => void
179
180
  }) => {
180
- const themeId = normalize(read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme) ?? "oc-2"
181
+ const rawTheme = read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme
182
+ const themeId = resolveStoredTheme(rawTheme)
183
+ if (rawTheme && rawTheme !== themeId) {
184
+ write(STORAGE_KEYS.THEME_ID, themeId)
185
+ clear()
186
+ }
181
187
  const colorScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
182
188
  const mode = colorScheme === "system" ? getSystemMode() : colorScheme
183
189
  const [store, setStore] = createStore({
@@ -194,7 +200,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
194
200
  const loads = new Map<string, Promise<DesktopTheme | undefined>>()
195
201
 
196
202
  const load = (id: string) => {
197
- const next = normalize(id)
203
+ const next = id
198
204
  if (!next) return Promise.resolve(undefined)
199
205
  const hit = store.themes[next]
200
206
  if (hit) return Promise.resolve(hit)
@@ -233,9 +239,11 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
233
239
 
234
240
  const onStorage = (e: StorageEvent) => {
235
241
  if (e.key === STORAGE_KEYS.THEME_ID && e.newValue) {
236
- const next = normalize(e.newValue)
237
- if (!next) return
238
- if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) return
242
+ const next = resolveStoredTheme(e.newValue, store.themes)
243
+ if (next !== e.newValue) {
244
+ write(STORAGE_KEYS.THEME_ID, next)
245
+ clear()
246
+ }
239
247
  setStore("themeId", next)
240
248
  if (next === "oc-2") {
241
249
  clear()
@@ -262,8 +270,8 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
262
270
  }
263
271
  makeEventListener(mediaQuery, "change", onMedia)
264
272
 
265
- const rawTheme = read(STORAGE_KEYS.THEME_ID)
266
- const savedTheme = normalize(rawTheme ?? props.defaultTheme) ?? "oc-2"
273
+ const rawTheme = read(STORAGE_KEYS.THEME_ID) ?? props.defaultTheme
274
+ const savedTheme = resolveStoredTheme(rawTheme, store.themes)
267
275
  const savedScheme = (read(STORAGE_KEYS.COLOR_SCHEME) as ColorScheme | null) ?? "system"
268
276
  if (rawTheme && rawTheme !== savedTheme) {
269
277
  write(STORAGE_KEYS.THEME_ID, savedTheme)
@@ -285,7 +293,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
285
293
  })
286
294
 
287
295
  const setTheme = (id: string) => {
288
- const next = normalize(id)
296
+ const next = id
289
297
  if (!next) {
290
298
  console.warn(`Theme "${id}" not found`)
291
299
  return
@@ -325,7 +333,7 @@ export const { use: useTheme, provider: ThemeProvider } = createSimpleContext({
325
333
  setColorScheme,
326
334
  registerTheme: (theme: DesktopTheme) => setStore("themes", theme.id, theme),
327
335
  previewTheme: (id: string) => {
328
- const next = normalize(id)
336
+ const next = id
329
337
  if (!next) return
330
338
  if (next !== "oc-2" && !knownThemes().has(next) && !store.themes[next]) return
331
339
  setStore("previewThemeId", next)
@@ -25,7 +25,7 @@
25
25
  "border-weak-base": "#DBDBDB",
26
26
  "border-weaker-base": "#E8E8E8",
27
27
  "icon-base": "#8F8F8F",
28
- "icon-weak-base": "#C7C7C7",
28
+ "icon-weak-base": "C7C7C7",
29
29
  "surface-raised-base": "#F3F3F3",
30
30
  "surface-raised-base-hover": "#EDEDED",
31
31
  "surface-base": "#F8F8F8",
@@ -120,18 +120,18 @@
120
120
  "v2-cyan-1000": "#005a6eff",
121
121
  "v2-cyan-1100": "#004756ff",
122
122
  "v2-cyan-1200": "#00353fff",
123
- "v2-blue-100": "#ecf1feff",
124
- "v2-blue-200": "#d7e2fcff",
123
+ "v2-blue-100": "#f5f8ffff",
124
+ "v2-blue-200": "#ecf1feff",
125
125
  "v2-blue-300": "#c3d4fdff",
126
126
  "v2-blue-400": "#a2bcffff",
127
127
  "v2-blue-500": "#7698fdff",
128
128
  "v2-blue-600": "#3b5cf6ff",
129
- "v2-blue-700": "#3250dfff",
130
- "v2-blue-800": "#2c47c8ff",
131
- "v2-blue-900": "#263fa9ff",
132
- "v2-blue-1000": "#22388fff",
133
- "v2-blue-1100": "#1c2e70ff",
134
- "v2-blue-1200": "#1b2852ff",
129
+ "v2-blue-700": "#0b34f4ff",
130
+ "v2-blue-800": "#3250dfff",
131
+ "v2-blue-900": "#2c47c8ff",
132
+ "v2-blue-1000": "#263fa9ff",
133
+ "v2-blue-1100": "#22388fff",
134
+ "v2-blue-1200": "#021945ff",
135
135
  "v2-purple-100": "#ebecfeff",
136
136
  "v2-purple-200": "#d5d5fcff",
137
137
  "v2-purple-300": "#b9b8f5ff",
@@ -164,8 +164,10 @@
164
164
  "v2-background-bg-layer-04": "var(--v2-grey-400)",
165
165
  "v2-background-bg-inverse": "var(--v2-grey-1100)",
166
166
  "v2-background-bg-contrast": "var(--v2-grey-1000)",
167
+ "v2-background-bg-icon-button-contrast": "var(--v2-background-bg-contrast)",
167
168
  "v2-background-bg-button-neutral": "var(--v2-grey-50)",
168
169
  "v2-background-bg-accent": "var(--v2-blue-600)",
170
+ "v2-background-bg-code-path": "var(--v2-cyan-100)",
169
171
  "v2-text-text-base": "var(--v2-grey-1100)",
170
172
  "v2-text-text-muted": "var(--v2-grey-700)",
171
173
  "v2-text-text-faint": "var(--v2-grey-600)",
@@ -174,8 +176,10 @@
174
176
  "v2-text-text-accent": "var(--v2-blue-600)",
175
177
  "v2-text-text-accent-hover": "var(--v2-blue-700)",
176
178
  "v2-text-text-code-accent": "var(--v2-blue-900)",
179
+ "v2-text-text-code-path": "var(--v2-blue-900)",
177
180
  "v2-icon-icon-base": "var(--v2-grey-800)",
178
181
  "v2-icon-icon-muted": "var(--v2-grey-600)",
182
+ "v2-icon-icon-faint": "var(--v2-grey-500)",
179
183
  "v2-icon-icon-inverse": "var(--v2-grey-50)",
180
184
  "v2-icon-icon-contrast": "var(--v2-grey-100)",
181
185
  "v2-icon-icon-accent": "var(--v2-blue-600)",
@@ -204,9 +208,20 @@
204
208
  "v2-state-bg-danger": "var(--v2-red-100)",
205
209
  "v2-state-fg-danger": "var(--v2-red-800)",
206
210
  "v2-state-border-danger": "var(--v2-red-300)",
207
- "v2-state-bg-info": "var(--v2-blue-100)",
211
+ "v2-state-bg-info": "var(--v2-blue-200)",
208
212
  "v2-state-fg-info": "var(--v2-blue-800)",
209
213
  "v2-state-border-info": "var(--v2-blue-300)",
214
+ "v2-agent-plan-solid": "var(--v2-pink-800)",
215
+ "v2-agent-plan-border": "rgba(200, 61, 139, 0.2)",
216
+ "v2-agent-plan-background": "rgba(253, 236, 243, 0.1)",
217
+ "v2-agent-build-solid": "var(--v2-blue-800)",
218
+ "v2-agent-build-border": "rgba(44, 71, 200, 0.1)",
219
+ "v2-agent-build-background": "rgba(236, 241, 254, 0.1)",
220
+ "v2-agent-explore-solid": "var(--v2-yellow-900)",
221
+ "v2-agent-explore-border": "rgba(203, 159, 52, 0.2)",
222
+ "v2-agent-explore-background": "rgba(254, 250, 236, 0.1)",
223
+ "v2-agent-review-solid": "var(--v2-green-800)",
224
+ "v2-agent-writer-solid": "var(--v2-purple-700)",
210
225
  "v2-avatar-bg-orange": "#ee7330ff",
211
226
  "v2-avatar-border-orange": "#d16427ff",
212
227
  "v2-avatar-bg-yellow": "#e7af36ff",
@@ -235,7 +250,8 @@
235
250
  "v2-elevation-switch-on": "inset 0px 2px 2px 0px var(--v2-alpha-dark-10), inset 0px 1px 1px 0px var(--v2-alpha-dark-10), inset 0px 0px 0px 0.5px var(--v2-alpha-dark-20)",
236
251
  "v2-illustration-illustration-layer-01": "var(--v2-grey-300)",
237
252
  "v2-illustration-illustration-layer-02": "var(--v2-grey-400)",
238
- "v2-illustration-illustration-layer-03": "var(--v2-grey-500)"
253
+ "v2-illustration-illustration-layer-03": "var(--v2-grey-500)",
254
+ "v2-font-family-code": "var(--font-family-mono)"
239
255
  }
240
256
  },
241
257
  "dark": {
@@ -355,18 +371,18 @@
355
371
  "v2-cyan-1000": "#005a6eff",
356
372
  "v2-cyan-1100": "#004756ff",
357
373
  "v2-cyan-1200": "#00353fff",
358
- "v2-blue-100": "#ecf1feff",
359
- "v2-blue-200": "#d7e2fcff",
374
+ "v2-blue-100": "#f5f8ffff",
375
+ "v2-blue-200": "#ecf1feff",
360
376
  "v2-blue-300": "#c3d4fdff",
361
377
  "v2-blue-400": "#a2bcffff",
362
378
  "v2-blue-500": "#7698fdff",
363
379
  "v2-blue-600": "#3b5cf6ff",
364
- "v2-blue-700": "#3250dfff",
365
- "v2-blue-800": "#2c47c8ff",
366
- "v2-blue-900": "#263fa9ff",
367
- "v2-blue-1000": "#22388fff",
368
- "v2-blue-1100": "#1c2e70ff",
369
- "v2-blue-1200": "#1b2852ff",
380
+ "v2-blue-700": "#0b34f4ff",
381
+ "v2-blue-800": "#3250dfff",
382
+ "v2-blue-900": "#2c47c8ff",
383
+ "v2-blue-1000": "#263fa9ff",
384
+ "v2-blue-1100": "#22388fff",
385
+ "v2-blue-1200": "#021945ff",
370
386
  "v2-purple-100": "#ebecfeff",
371
387
  "v2-purple-200": "#d5d5fcff",
372
388
  "v2-purple-300": "#b9b8f5ff",
@@ -399,8 +415,10 @@
399
415
  "v2-background-bg-layer-04": "var(--v2-grey-700)",
400
416
  "v2-background-bg-inverse": "var(--v2-grey-50)",
401
417
  "v2-background-bg-contrast": "var(--v2-grey-700)",
418
+ "v2-background-bg-icon-button-contrast": "var(--v2-grey-400)",
402
419
  "v2-background-bg-button-neutral": "var(--v2-alpha-light-6)",
403
420
  "v2-background-bg-accent": "var(--v2-blue-600)",
421
+ "v2-background-bg-code-path": "var(--v2-cyan-1200)",
404
422
  "v2-text-text-base": "var(--v2-grey-100)",
405
423
  "v2-text-text-muted": "var(--v2-grey-500)",
406
424
  "v2-text-text-faint": "var(--v2-grey-600)",
@@ -409,8 +427,10 @@
409
427
  "v2-text-text-accent": "var(--v2-blue-400)",
410
428
  "v2-text-text-accent-hover": "var(--v2-blue-300)",
411
429
  "v2-text-text-code-accent": "var(--v2-blue-400)",
430
+ "v2-text-text-code-path": "var(--v2-blue-300)",
412
431
  "v2-icon-icon-base": "var(--v2-grey-400)",
413
432
  "v2-icon-icon-muted": "var(--v2-grey-600)",
433
+ "v2-icon-icon-faint": "var(--v2-grey-500)",
414
434
  "v2-icon-icon-inverse": "var(--v2-grey-1100)",
415
435
  "v2-icon-icon-contrast": "var(--v2-grey-100)",
416
436
  "v2-icon-icon-accent": "var(--v2-blue-400)",
@@ -442,6 +462,17 @@
442
462
  "v2-state-bg-info": "var(--v2-blue-1200)",
443
463
  "v2-state-fg-info": "var(--v2-blue-500)",
444
464
  "v2-state-border-info": "var(--v2-blue-900)",
465
+ "v2-agent-plan-solid": "var(--v2-pink-400)",
466
+ "v2-agent-plan-border": "rgba(247, 153, 198, 0.2)",
467
+ "v2-agent-plan-background": "rgba(170, 53, 118, 0.05)",
468
+ "v2-agent-build-solid": "var(--v2-blue-300)",
469
+ "v2-agent-build-border": "rgba(162, 188, 255, 0.2)",
470
+ "v2-agent-build-background": "rgba(38, 63, 169, 0.05)",
471
+ "v2-agent-explore-solid": "var(--v2-yellow-300)",
472
+ "v2-agent-explore-border": "rgba(243, 218, 155, 0.2)",
473
+ "v2-agent-explore-background": "rgba(172, 136, 51, 0.05)",
474
+ "v2-agent-review-solid": "var(--v2-green-300)",
475
+ "v2-agent-writer-solid": "var(--v2-purple-400)",
445
476
  "v2-avatar-bg-orange": "#723d22ff",
446
477
  "v2-avatar-border-orange": "#ff8648ff",
447
478
  "v2-avatar-bg-yellow": "#68552bff",
@@ -75,18 +75,18 @@ export const V2_PRIMITIVES_DEFAULT: Record<string, V2ColorValue> = {
75
75
  "v2-cyan-1000": "#005a6eff",
76
76
  "v2-cyan-1100": "#004756ff",
77
77
  "v2-cyan-1200": "#00353fff",
78
- "v2-blue-100": "#ecf1feff",
79
- "v2-blue-200": "#d7e2fcff",
78
+ "v2-blue-100": "#f5f8ffff",
79
+ "v2-blue-200": "#ecf1feff",
80
80
  "v2-blue-300": "#c3d4fdff",
81
81
  "v2-blue-400": "#a2bcffff",
82
82
  "v2-blue-500": "#7698fdff",
83
83
  "v2-blue-600": "#3b5cf6ff",
84
- "v2-blue-700": "#3250dfff",
85
- "v2-blue-800": "#2c47c8ff",
86
- "v2-blue-900": "#263fa9ff",
87
- "v2-blue-1000": "#22388fff",
88
- "v2-blue-1100": "#1c2e70ff",
89
- "v2-blue-1200": "#1b2852ff",
84
+ "v2-blue-700": "#0b34f4ff",
85
+ "v2-blue-800": "#3250dfff",
86
+ "v2-blue-900": "#2c47c8ff",
87
+ "v2-blue-1000": "#263fa9ff",
88
+ "v2-blue-1100": "#22388fff",
89
+ "v2-blue-1200": "#021945ff",
90
90
  "v2-purple-100": "#ebecfeff",
91
91
  "v2-purple-200": "#d5d5fcff",
92
92
  "v2-purple-300": "#b9b8f5ff",
@@ -52,6 +52,7 @@ export function mapV2Foreground(
52
52
  "v2-text-text-faint": shift(body, { l: isDark ? -0.2 : 0.21, c: isDark ? 0.78 : 0.72 }),
53
53
  "v2-icon-icon-base": greyRef(pickGrey(primitives, bgBase, 7, isDark ? 400 : 800)),
54
54
  "v2-icon-icon-muted": greyRef(pickGrey(primitives, bgBase, 3, 600)),
55
+ "v2-icon-icon-faint": greyRef(pickGrey(primitives, bgBase, 1.5, 500)),
55
56
  "v2-icon-icon-inverse": greyRef(pickGrey(primitives, bgInverse, 7, inverseTarget)),
56
57
  "v2-icon-icon-contrast": greyRef(pickGrey(primitives, bgContrast, 7, 100)),
57
58
  "v2-icon-icon-accent": isDark ? "var(--v2-blue-400)" : "var(--v2-blue-600)",
@@ -40,13 +40,16 @@ const light: Record<string, V2ColorValue> = {
40
40
  "v2-background-bg-layer-04": ref("v2-grey-600"),
41
41
  "v2-background-bg-inverse": ref("v2-grey-1000"),
42
42
  "v2-background-bg-contrast": ref("v2-grey-900"),
43
+ "v2-background-bg-icon-button-contrast": ref("v2-background-bg-contrast"),
43
44
  "v2-background-bg-button-neutral": ref("v2-grey-100"),
44
45
  "v2-background-bg-accent": ref("v2-blue-600"),
46
+ "v2-background-bg-code-path": ref("v2-cyan-100"),
45
47
  "v2-text-text-inverse": ref("v2-grey-100"),
46
48
  "v2-text-text-contrast": ref("v2-grey-100"),
47
49
  "v2-text-text-accent": ref("v2-blue-600"),
48
50
  "v2-text-text-accent-hover": ref("v2-blue-700"),
49
51
  "v2-text-text-code-accent": ref("v2-blue-900"),
52
+ "v2-text-text-code-path": ref("v2-blue-900"),
50
53
  "v2-border-border-muted": ref("v2-alpha-dark-8"),
51
54
  "v2-border-border-base": ref("v2-alpha-dark-10"),
52
55
  "v2-border-border-strong": ref("v2-alpha-dark-20"),
@@ -71,7 +74,7 @@ const light: Record<string, V2ColorValue> = {
71
74
  "v2-state-bg-danger": ref("v2-red-100"),
72
75
  "v2-state-fg-danger": ref("v2-red-800"),
73
76
  "v2-state-border-danger": ref("v2-red-300"),
74
- "v2-state-bg-info": ref("v2-blue-100"),
77
+ "v2-state-bg-info": ref("v2-blue-200"),
75
78
  "v2-state-fg-info": ref("v2-blue-800"),
76
79
  "v2-state-border-info": ref("v2-blue-300"),
77
80
  ...lightAgentTokens,
@@ -105,13 +108,16 @@ const dark: Record<string, V2ColorValue> = {
105
108
  "v2-background-bg-layer-04": ref("v2-grey-400"),
106
109
  "v2-background-bg-inverse": ref("v2-grey-100"),
107
110
  "v2-background-bg-contrast": ref("v2-grey-700"),
111
+ "v2-background-bg-icon-button-contrast": ref("v2-grey-400"),
108
112
  "v2-background-bg-button-neutral": ref("v2-alpha-light-6"),
109
113
  "v2-background-bg-accent": ref("v2-blue-600"),
114
+ "v2-background-bg-code-path": ref("v2-cyan-1200"),
110
115
  "v2-text-text-inverse": ref("v2-grey-1000"),
111
116
  "v2-text-text-contrast": ref("v2-grey-100"),
112
117
  "v2-text-text-accent": ref("v2-blue-400"),
113
118
  "v2-text-text-accent-hover": ref("v2-blue-300"),
114
119
  "v2-text-text-code-accent": ref("v2-blue-400"),
120
+ "v2-text-text-code-path": ref("v2-blue-300"),
115
121
  "v2-border-border-muted": ref("v2-alpha-light-8"),
116
122
  "v2-border-border-base": ref("v2-alpha-light-10"),
117
123
  "v2-border-border-strong": ref("v2-alpha-light-20"),
@@ -5,7 +5,8 @@
5
5
  --text-shimmer-index: 0;
6
6
  --text-shimmer-angle: 90deg;
7
7
  --text-shimmer-spread: 5.2ch;
8
- --text-shimmer-size: 360%;
8
+ --text-shimmer-gutter: calc(var(--text-shimmer-spread) + 1ch);
9
+ --text-shimmer-size: calc(200% + var(--text-shimmer-gutter) + var(--text-shimmer-gutter));
9
10
  --text-shimmer-base-color: var(--text-weak);
10
11
  --text-shimmer-peak-color: var(--text-strong);
11
12
  --text-shimmer-sweep: linear-gradient(
@@ -1,5 +1,6 @@
1
1
  import { createEffect, createMemo, createSignal, onCleanup, type ValidComponent } from "solid-js"
2
2
  import { Dynamic } from "solid-js/web"
3
+ import "./text-shimmer.css"
3
4
 
4
5
  export const TextShimmer = <T extends ValidComponent = "span">(props: {
5
6
  text: string
@@ -0,0 +1,39 @@
1
+ import { createUniqueId, type ComponentProps } from "solid-js"
2
+
3
+ export function Wordmark(props: Pick<ComponentProps<"svg">, "class"> & { fade?: boolean; muted?: boolean }) {
4
+ const mask = createUniqueId()
5
+ const maskGradient = createUniqueId()
6
+
7
+ return (
8
+ <svg
9
+ xmlns="http://www.w3.org/2000/svg"
10
+ viewBox="0 0 720 129"
11
+ fill="none"
12
+ classList={{ [props.class ?? ""]: !!props.class }}
13
+ >
14
+ <g opacity={props.muted === false ? 1 : 0.6} class="[[data-color-scheme=dark]_&]:opacity-100">
15
+ <g mask={props.fade === false ? undefined : `url(#${mask})`}>
16
+ <g opacity={props.muted === false ? 1 : 0.16 * 0.7} fill="currentColor">
17
+ <path d="M55.3846 36.4286H18.4615V91.7143H55.3846V36.4286ZM73.8462 110.143H0V18H73.8462V110.143Z" />
18
+ <path d="M110.462 91.7143H147.385V36.4286H110.462V91.7143ZM165.846 110.143H110.462V128.571H92V18H165.846V110.143Z" />
19
+ <path d="M258.846 73.2857H203.462V91.7143H258.846V110.143H185V18H258.846V73.2857ZM203.462 54.8571H240.385V36.4286H203.462V54.8571Z" />
20
+ <path d="M332.385 36.4286H295.462V110.143H277V18H332.385V36.4286ZM350.846 110.143H332.385V36.4286H350.846V110.143Z" />
21
+ <path d="M442.846 36.4286H387.462V91.7143H442.846V110.143H369V18H442.846V36.4286Z" />
22
+ <path d="M517.385 36.4286H480.462V91.7143H517.385V36.4286ZM535.846 110.143H462V18H535.846V110.143Z" />
23
+ <path d="M609.385 36.8571H572.462V92.1429H609.385V36.8571ZM627.846 110.571H554V18.4286H609.385V0H627.846V110.571Z" />
24
+ <path d="M664.462 36.4286V54.8571H701.385V36.4286H664.462ZM719.846 73.2857H664.462V91.7143H719.846V110.143H646V18H719.846V73.2857Z" />
25
+ </g>
26
+ </g>
27
+ </g>
28
+ <defs>
29
+ <mask id={mask} style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="720" height="129">
30
+ <rect width="720" height="129" fill={`url(#${maskGradient})`} />
31
+ </mask>
32
+ <linearGradient id={maskGradient} x1="360" y1="68" x2="360" y2="129" gradientUnits="userSpaceOnUse">
33
+ <stop stop-color="white" stop-opacity="0.7" />
34
+ <stop offset="1" stop-color="white" stop-opacity="0" />
35
+ </linearGradient>
36
+ </defs>
37
+ </svg>
38
+ )
39
+ }
@@ -1,9 +0,0 @@
1
- import { type ComponentProps } from "solid-js";
2
- export interface AvatarProps extends ComponentProps<"div"> {
3
- fallback: string;
4
- src?: string;
5
- background?: string;
6
- foreground?: string;
7
- size?: "small" | "normal" | "large";
8
- }
9
- export declare function Avatar(props: AvatarProps): import("solid-js").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { Button as Kobalte } from "@kobalte/core/button";
2
- import { type ComponentProps } from "solid-js";
3
- import { IconProps } from "./icon";
4
- export interface ButtonProps extends ComponentProps<typeof Kobalte>, Pick<ComponentProps<"button">, "class" | "classList" | "children"> {
5
- size?: "small" | "normal" | "large";
6
- variant?: "primary" | "secondary" | "ghost";
7
- icon?: IconProps["name"];
8
- }
9
- export declare function Button(props: ButtonProps): import("solid-js").JSX.Element;
@@ -1,12 +0,0 @@
1
- import { ComponentProps, JSXElement, ParentProps } from "solid-js";
2
- export interface DialogProps extends ParentProps {
3
- title?: JSXElement;
4
- description?: JSXElement;
5
- action?: JSXElement;
6
- size?: "normal" | "large" | "x-large";
7
- class?: ComponentProps<"div">["class"];
8
- classList?: ComponentProps<"div">["classList"];
9
- fit?: boolean;
10
- transition?: boolean;
11
- }
12
- export declare function Dialog(props: DialogProps): import("solid-js").JSX.Element;
@@ -1,80 +0,0 @@
1
- import { DropdownMenu as Kobalte } from "@kobalte/core/dropdown-menu";
2
- import type { ComponentProps, ParentProps } from "solid-js";
3
- export interface DropdownMenuProps extends ComponentProps<typeof Kobalte> {
4
- }
5
- export interface DropdownMenuTriggerProps extends ComponentProps<typeof Kobalte.Trigger> {
6
- }
7
- export interface DropdownMenuIconProps extends ComponentProps<typeof Kobalte.Icon> {
8
- }
9
- export interface DropdownMenuPortalProps extends ComponentProps<typeof Kobalte.Portal> {
10
- }
11
- export interface DropdownMenuContentProps extends ComponentProps<typeof Kobalte.Content> {
12
- }
13
- export interface DropdownMenuArrowProps extends ComponentProps<typeof Kobalte.Arrow> {
14
- }
15
- export interface DropdownMenuSeparatorProps extends ComponentProps<typeof Kobalte.Separator> {
16
- }
17
- export interface DropdownMenuGroupProps extends ComponentProps<typeof Kobalte.Group> {
18
- }
19
- export interface DropdownMenuGroupLabelProps extends ComponentProps<typeof Kobalte.GroupLabel> {
20
- }
21
- export interface DropdownMenuItemProps extends ComponentProps<typeof Kobalte.Item> {
22
- }
23
- export interface DropdownMenuItemLabelProps extends ComponentProps<typeof Kobalte.ItemLabel> {
24
- }
25
- export interface DropdownMenuItemDescriptionProps extends ComponentProps<typeof Kobalte.ItemDescription> {
26
- }
27
- export interface DropdownMenuItemIndicatorProps extends ComponentProps<typeof Kobalte.ItemIndicator> {
28
- }
29
- export interface DropdownMenuRadioGroupProps extends ComponentProps<typeof Kobalte.RadioGroup> {
30
- }
31
- export interface DropdownMenuRadioItemProps extends ComponentProps<typeof Kobalte.RadioItem> {
32
- }
33
- export interface DropdownMenuCheckboxItemProps extends ComponentProps<typeof Kobalte.CheckboxItem> {
34
- }
35
- export interface DropdownMenuSubProps extends ComponentProps<typeof Kobalte.Sub> {
36
- }
37
- export interface DropdownMenuSubTriggerProps extends ComponentProps<typeof Kobalte.SubTrigger> {
38
- }
39
- export interface DropdownMenuSubContentProps extends ComponentProps<typeof Kobalte.SubContent> {
40
- }
41
- declare function DropdownMenuRoot(props: DropdownMenuProps): import("solid-js").JSX.Element;
42
- declare function DropdownMenuTrigger(props: ParentProps<DropdownMenuTriggerProps>): import("solid-js").JSX.Element;
43
- declare function DropdownMenuIcon(props: ParentProps<DropdownMenuIconProps>): import("solid-js").JSX.Element;
44
- declare function DropdownMenuPortal(props: DropdownMenuPortalProps): import("solid-js").JSX.Element;
45
- declare function DropdownMenuContent(props: ParentProps<DropdownMenuContentProps>): import("solid-js").JSX.Element;
46
- declare function DropdownMenuArrow(props: DropdownMenuArrowProps): import("solid-js").JSX.Element;
47
- declare function DropdownMenuSeparator(props: DropdownMenuSeparatorProps): import("solid-js").JSX.Element;
48
- declare function DropdownMenuGroup(props: ParentProps<DropdownMenuGroupProps>): import("solid-js").JSX.Element;
49
- declare function DropdownMenuGroupLabel(props: ParentProps<DropdownMenuGroupLabelProps>): import("solid-js").JSX.Element;
50
- declare function DropdownMenuItem(props: ParentProps<DropdownMenuItemProps>): import("solid-js").JSX.Element;
51
- declare function DropdownMenuItemLabel(props: ParentProps<DropdownMenuItemLabelProps>): import("solid-js").JSX.Element;
52
- declare function DropdownMenuItemDescription(props: ParentProps<DropdownMenuItemDescriptionProps>): import("solid-js").JSX.Element;
53
- declare function DropdownMenuItemIndicator(props: ParentProps<DropdownMenuItemIndicatorProps>): import("solid-js").JSX.Element;
54
- declare function DropdownMenuRadioGroup(props: ParentProps<DropdownMenuRadioGroupProps>): import("solid-js").JSX.Element;
55
- declare function DropdownMenuRadioItem(props: ParentProps<DropdownMenuRadioItemProps>): import("solid-js").JSX.Element;
56
- declare function DropdownMenuCheckboxItem(props: ParentProps<DropdownMenuCheckboxItemProps>): import("solid-js").JSX.Element;
57
- declare function DropdownMenuSub(props: DropdownMenuSubProps): import("solid-js").JSX.Element;
58
- declare function DropdownMenuSubTrigger(props: ParentProps<DropdownMenuSubTriggerProps>): import("solid-js").JSX.Element;
59
- declare function DropdownMenuSubContent(props: ParentProps<DropdownMenuSubContentProps>): import("solid-js").JSX.Element;
60
- export declare const DropdownMenu: typeof DropdownMenuRoot & {
61
- Trigger: typeof DropdownMenuTrigger;
62
- Icon: typeof DropdownMenuIcon;
63
- Portal: typeof DropdownMenuPortal;
64
- Content: typeof DropdownMenuContent;
65
- Arrow: typeof DropdownMenuArrow;
66
- Separator: typeof DropdownMenuSeparator;
67
- Group: typeof DropdownMenuGroup;
68
- GroupLabel: typeof DropdownMenuGroupLabel;
69
- Item: typeof DropdownMenuItem;
70
- ItemLabel: typeof DropdownMenuItemLabel;
71
- ItemDescription: typeof DropdownMenuItemDescription;
72
- ItemIndicator: typeof DropdownMenuItemIndicator;
73
- RadioGroup: typeof DropdownMenuRadioGroup;
74
- RadioItem: typeof DropdownMenuRadioItem;
75
- CheckboxItem: typeof DropdownMenuCheckboxItem;
76
- Sub: typeof DropdownMenuSub;
77
- SubTrigger: typeof DropdownMenuSubTrigger;
78
- SubContent: typeof DropdownMenuSubContent;
79
- };
80
- export {};
@@ -1,10 +0,0 @@
1
- import { Button as Kobalte } from "@kobalte/core/button";
2
- import { type ComponentProps } from "solid-js";
3
- import { IconProps } from "./icon";
4
- export interface IconButtonProps extends ComponentProps<typeof Kobalte> {
5
- icon: IconProps["name"];
6
- size?: "small" | "normal" | "large";
7
- iconSize?: IconProps["size"];
8
- variant?: "primary" | "secondary" | "ghost";
9
- }
10
- export declare function IconButton(props: ComponentProps<"button"> & IconButtonProps): import("solid-js").JSX.Element;
@@ -1,6 +0,0 @@
1
- import type { ComponentProps, ParentProps } from "solid-js";
2
- export interface KeybindProps extends ParentProps {
3
- class?: string;
4
- classList?: ComponentProps<"span">["classList"];
5
- }
6
- export declare function Keybind(props: KeybindProps): import("solid-js").JSX.Element;
@@ -1,16 +0,0 @@
1
- import { SegmentedControl as Kobalte } from "@kobalte/core/segmented-control";
2
- import type { ComponentProps, JSX } from "solid-js";
3
- export type RadioGroupProps<T> = Omit<ComponentProps<typeof Kobalte>, "value" | "defaultValue" | "onChange" | "children"> & {
4
- options: T[];
5
- current?: T;
6
- defaultValue?: T;
7
- value?: (x: T) => string;
8
- label?: (x: T) => JSX.Element | string;
9
- onSelect?: (value: T | undefined) => void;
10
- class?: ComponentProps<"div">["class"];
11
- classList?: ComponentProps<"div">["classList"];
12
- size?: "small" | "medium";
13
- fill?: boolean;
14
- pad?: "none" | "normal";
15
- };
16
- export declare function RadioGroup<T>(props: RadioGroupProps<T>): JSX.Element;
@@ -1,21 +0,0 @@
1
- import { Select as Kobalte } from "@kobalte/core/select";
2
- import { type ComponentProps, type JSX } from "solid-js";
3
- import { ButtonProps } from "./button";
4
- export type SelectProps<T> = Omit<ComponentProps<typeof Kobalte<T>>, "value" | "onSelect" | "children"> & {
5
- placeholder?: string;
6
- options: T[];
7
- current?: T;
8
- value?: (x: T) => string;
9
- label?: (x: T) => string;
10
- groupBy?: (x: T) => string;
11
- valueClass?: ComponentProps<"div">["class"];
12
- onSelect?: (value: T | undefined) => void;
13
- onHighlight?: (value: T | undefined) => (() => void) | void;
14
- class?: ComponentProps<"div">["class"];
15
- classList?: ComponentProps<"div">["classList"];
16
- children?: (item: T | undefined) => JSX.Element;
17
- triggerStyle?: JSX.CSSProperties;
18
- triggerVariant?: "settings";
19
- triggerProps?: Record<string, string | number | boolean | undefined>;
20
- };
21
- export declare function Select<T>(props: SelectProps<T> & Omit<ButtonProps, "children">): JSX.Element;
@@ -1,5 +0,0 @@
1
- import { type ComponentProps } from "solid-js";
2
- export interface TagProps extends ComponentProps<"span"> {
3
- size?: "normal" | "large";
4
- }
5
- export declare function Tag(props: TagProps): import("solid-js").JSX.Element;
@@ -1,56 +0,0 @@
1
- import { Toast as Kobalte, toaster } from "@kobalte/core/toast";
2
- import type { ToastRootProps, ToastCloseButtonProps, ToastTitleProps, ToastDescriptionProps } from "@kobalte/core/toast";
3
- import type { ComponentProps, JSX } from "solid-js";
4
- import { type IconProps } from "./icon";
5
- export interface ToastRegionProps extends ComponentProps<typeof Kobalte.Region> {
6
- }
7
- declare function ToastRegion(props: ToastRegionProps): JSX.Element;
8
- export interface ToastRootComponentProps extends ToastRootProps {
9
- class?: string;
10
- classList?: ComponentProps<"li">["classList"];
11
- children?: JSX.Element;
12
- }
13
- declare function ToastRoot(props: ToastRootComponentProps): JSX.Element;
14
- declare function ToastIcon(props: {
15
- name: IconProps["name"];
16
- }): JSX.Element;
17
- declare function ToastContent(props: ComponentProps<"div">): JSX.Element;
18
- declare function ToastTitle(props: ToastTitleProps & ComponentProps<"div">): JSX.Element;
19
- declare function ToastDescription(props: ToastDescriptionProps & ComponentProps<"div">): JSX.Element;
20
- declare function ToastActions(props: ComponentProps<"div">): JSX.Element;
21
- declare function ToastCloseButton(props: ToastCloseButtonProps & ComponentProps<"button">): JSX.Element;
22
- declare function ToastProgressTrack(props: ComponentProps<typeof Kobalte.ProgressTrack>): JSX.Element;
23
- declare function ToastProgressFill(props: ComponentProps<typeof Kobalte.ProgressFill>): JSX.Element;
24
- export declare const Toast: typeof ToastRoot & {
25
- Region: typeof ToastRegion;
26
- Icon: typeof ToastIcon;
27
- Content: typeof ToastContent;
28
- Title: typeof ToastTitle;
29
- Description: typeof ToastDescription;
30
- Actions: typeof ToastActions;
31
- CloseButton: typeof ToastCloseButton;
32
- ProgressTrack: typeof ToastProgressTrack;
33
- ProgressFill: typeof ToastProgressFill;
34
- };
35
- export { toaster };
36
- export type ToastVariant = "default" | "success" | "error" | "loading";
37
- export interface ToastAction {
38
- label: string;
39
- onClick: "dismiss" | (() => void);
40
- }
41
- export interface ToastOptions {
42
- title?: string;
43
- description?: string;
44
- icon?: IconProps["name"];
45
- variant?: ToastVariant;
46
- duration?: number;
47
- persistent?: boolean;
48
- actions?: ToastAction[];
49
- }
50
- export declare function showToast(options: ToastOptions | string): number;
51
- export interface ToastPromiseOptions<T, U = unknown> {
52
- loading?: JSX.Element;
53
- success?: (data: T) => JSX.Element;
54
- error?: (error: U) => JSX.Element;
55
- }
56
- export declare function showPromiseToast<T, U = unknown>(promise: Promise<T> | (() => Promise<T>), options: ToastPromiseOptions<T, U>): number;
@@ -1,17 +0,0 @@
1
- import { Tooltip as KobalteTooltip } from "@kobalte/core/tooltip";
2
- import { type JSX } from "solid-js";
3
- import type { ComponentProps } from "solid-js";
4
- export interface TooltipProps extends ComponentProps<typeof KobalteTooltip> {
5
- value: JSX.Element;
6
- class?: string;
7
- contentClass?: string;
8
- contentStyle?: JSX.CSSProperties;
9
- inactive?: boolean;
10
- forceOpen?: boolean;
11
- }
12
- export interface TooltipKeybindProps extends Omit<TooltipProps, "value"> {
13
- title: string;
14
- keybind: string;
15
- }
16
- export declare function TooltipKeybind(props: TooltipKeybindProps): JSX.Element;
17
- export declare function Tooltip(props: TooltipProps): JSX.Element;