@heyramzi/ui 0.0.0-stage → 6.1.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 (599) hide show
  1. package/COMPONENTS.md +141 -0
  2. package/README.md +130 -2
  3. package/package.json +215 -3
  4. package/scripts/lib/sync-core.mjs +113 -0
  5. package/scripts/relative-imports.mjs +39 -0
  6. package/scripts/sf-symbol.mjs +93 -0
  7. package/scripts/sync-shadcn.mjs +341 -0
  8. package/scripts/sync-transitions.mjs +146 -0
  9. package/scripts/validate-apple-symbol-exports.mjs +45 -0
  10. package/src/agents/agent-avatar.svelte +639 -0
  11. package/src/agents/agent-cast.svelte +173 -0
  12. package/src/agents/demo.svelte +78 -0
  13. package/src/agents/index.ts +11 -0
  14. package/src/agents/types.ts +72 -0
  15. package/src/agents/vendor/LICENSE +21 -0
  16. package/src/agents/vendor/color.ts +155 -0
  17. package/src/agents/vendor/draw.ts +840 -0
  18. package/src/agents/vendor/engine.ts +845 -0
  19. package/src/agents/vendor/mesh.ts +838 -0
  20. package/src/agents/vendor/plastic.ts +4958 -0
  21. package/src/agents/vendor/presets.ts +103 -0
  22. package/src/agents/vendor/shapes.ts +41 -0
  23. package/src/agents/vendor/ticker.ts +67 -0
  24. package/src/agents/vendor/types.ts +261 -0
  25. package/src/agents/vendor/wear.ts +1699 -0
  26. package/src/ai/composer/Composer.css +108 -0
  27. package/src/ai/composer/Composer.svelte +111 -0
  28. package/src/ai/composer/index.ts +10 -0
  29. package/src/ai/confirmation/Confirmation.svelte +54 -0
  30. package/src/ai/confirmation/ConfirmationAccepted.svelte +23 -0
  31. package/src/ai/confirmation/ConfirmationAction.svelte +53 -0
  32. package/src/ai/confirmation/ConfirmationActions.svelte +24 -0
  33. package/src/ai/confirmation/ConfirmationFailed.svelte +23 -0
  34. package/src/ai/confirmation/ConfirmationRejected.svelte +23 -0
  35. package/src/ai/confirmation/ConfirmationRequest.svelte +25 -0
  36. package/src/ai/confirmation/ConfirmationTitle.svelte +25 -0
  37. package/src/ai/confirmation/confirmation-context.svelte.ts +22 -0
  38. package/src/ai/confirmation/index.ts +50 -0
  39. package/src/ai/conversation/Conversation.svelte +28 -0
  40. package/src/ai/conversation/ConversationContent.svelte +35 -0
  41. package/src/ai/conversation/ConversationEmptyState.svelte +46 -0
  42. package/src/ai/conversation/ConversationScrollButton.svelte +51 -0
  43. package/src/ai/conversation/index.ts +33 -0
  44. package/src/ai/conversation/stick-to-bottom-context.svelte.ts +131 -0
  45. package/src/ai/index.ts +119 -0
  46. package/src/ai/loading-state/PixelLoader.svelte +138 -0
  47. package/src/ai/loading-state/index.ts +5 -0
  48. package/src/ai/prompt-input/PromptInput.svelte +38 -0
  49. package/src/ai/prompt-input/PromptInputBody.svelte +19 -0
  50. package/src/ai/prompt-input/PromptInputSubmit.svelte +73 -0
  51. package/src/ai/prompt-input/PromptInputTextarea.svelte +74 -0
  52. package/src/ai/prompt-input/PromptInputToolbar.svelte +19 -0
  53. package/src/ai/prompt-input/index.ts +34 -0
  54. package/src/ai/reasoning/Reasoning.svelte +47 -0
  55. package/src/ai/reasoning/ReasoningContent.svelte +27 -0
  56. package/src/ai/reasoning/ReasoningTrigger.svelte +48 -0
  57. package/src/ai/reasoning/index.ts +22 -0
  58. package/src/ai/reasoning/reasoning-context.svelte.ts +20 -0
  59. package/src/ai/response/Response.css +32 -0
  60. package/src/ai/response/Response.svelte +130 -0
  61. package/src/ai/response/index.ts +5 -0
  62. package/src/ai/suggestion/Suggestion.svelte +43 -0
  63. package/src/ai/suggestion/Suggestions.svelte +25 -0
  64. package/src/ai/suggestion/index.ts +14 -0
  65. package/src/ai/thinking-dots/ThinkingDots.svelte +42 -0
  66. package/src/ai/thinking-dots/index.ts +5 -0
  67. package/src/ai/typing-dots/TypingDots.css +39 -0
  68. package/src/ai/typing-dots/TypingDots.svelte +27 -0
  69. package/src/ai/typing-dots/index.ts +10 -0
  70. package/src/ai/voice-waveform/VoiceWaveform.css +40 -0
  71. package/src/ai/voice-waveform/VoiceWaveform.svelte +46 -0
  72. package/src/ai/voice-waveform/index.ts +5 -0
  73. package/src/animations/README.md +84 -0
  74. package/src/animations/accordion.css +58 -0
  75. package/src/animations/avatar-group-hover.css +47 -0
  76. package/src/animations/card-tilt.css +74 -0
  77. package/src/animations/digit-pop-in.css +78 -0
  78. package/src/animations/dropdown.css +121 -0
  79. package/src/animations/icon-swap.css +43 -0
  80. package/src/animations/index.css +34 -0
  81. package/src/animations/input-clear-dissolve.css +86 -0
  82. package/src/animations/input-shake.css +114 -0
  83. package/src/animations/learn-more-hover.css +48 -0
  84. package/src/animations/like-button.css +93 -0
  85. package/src/animations/modal.css +75 -0
  86. package/src/animations/notification-badge.css +81 -0
  87. package/src/animations/page-side-by-side.css +63 -0
  88. package/src/animations/panel.css +86 -0
  89. package/src/animations/plus-menu-morph.css +97 -0
  90. package/src/animations/reasoning-stream.css +49 -0
  91. package/src/animations/resize.css +20 -0
  92. package/src/animations/shimmer-text.css +72 -0
  93. package/src/animations/skeleton-reveal.css +97 -0
  94. package/src/animations/spinning-counter.css +52 -0
  95. package/src/animations/streaming-text.css +31 -0
  96. package/src/animations/success-check.css +120 -0
  97. package/src/animations/tabs-sliding.css +83 -0
  98. package/src/animations/text-swap.css +40 -0
  99. package/src/animations/text-swap.ts +40 -0
  100. package/src/animations/texts-reveal.css +70 -0
  101. package/src/animations/thinking-states.css +65 -0
  102. package/src/animations/tooltip.css +72 -0
  103. package/src/animations/upstream-coverage.test.ts +65 -0
  104. package/src/animations/view-transition-reveal.ts +74 -0
  105. package/src/charts/animated-value.css +7 -0
  106. package/src/charts/animated-value.svelte +110 -0
  107. package/src/charts/area-chart.css +29 -0
  108. package/src/charts/area-chart.svelte +195 -0
  109. package/src/charts/bar-chart.css +119 -0
  110. package/src/charts/bar-chart.svelte +269 -0
  111. package/src/charts/charts.css +201 -0
  112. package/src/charts/crosshair.svelte +35 -0
  113. package/src/charts/donut-chart.css +56 -0
  114. package/src/charts/donut-chart.svelte +158 -0
  115. package/src/charts/edge-fade.svelte +43 -0
  116. package/src/charts/edge-fade.ts +16 -0
  117. package/src/charts/figure.css +100 -0
  118. package/src/charts/figure.svelte +122 -0
  119. package/src/charts/gauge-chart.css +94 -0
  120. package/src/charts/gauge-chart.svelte +303 -0
  121. package/src/charts/hover-band.test.ts +30 -0
  122. package/src/charts/hover-band.ts +21 -0
  123. package/src/charts/hover-focus.svelte +85 -0
  124. package/src/charts/index.ts +30 -0
  125. package/src/charts/legend.css +131 -0
  126. package/src/charts/legend.svelte +112 -0
  127. package/src/charts/line-chart.css +26 -0
  128. package/src/charts/line-chart.svelte +256 -0
  129. package/src/charts/motion.ts +19 -0
  130. package/src/charts/number-chart.css +168 -0
  131. package/src/charts/number-chart.svelte +177 -0
  132. package/src/charts/primitives/chart-container.svelte +57 -0
  133. package/src/charts/primitives/chart-style.svelte +36 -0
  134. package/src/charts/primitives/chart-tooltip.svelte +161 -0
  135. package/src/charts/primitives/chart-utils.ts +54 -0
  136. package/src/charts/primitives/index.ts +11 -0
  137. package/src/charts/reveal.svelte +61 -0
  138. package/src/charts/ring-chart.css +96 -0
  139. package/src/charts/ring-chart.svelte +158 -0
  140. package/src/charts/sparkline.css +45 -0
  141. package/src/charts/sparkline.svelte +140 -0
  142. package/src/charts/stat-card.css +103 -0
  143. package/src/charts/stat-card.svelte +267 -0
  144. package/src/charts/time-series-chart.css +28 -0
  145. package/src/charts/time-series-chart.svelte +179 -0
  146. package/src/charts/trend-pill.css +38 -0
  147. package/src/charts/trend-pill.svelte +48 -0
  148. package/src/design/index.css +270 -0
  149. package/src/design/polish.css +159 -0
  150. package/src/effects/animated-beam/AnimatedBeam.svelte +132 -0
  151. package/src/effects/animated-beam/diagrams/BeamSvg.svelte +91 -0
  152. package/src/effects/animated-beam/index.ts +2 -0
  153. package/src/effects/animated-beam/path-calculator.svelte.ts +70 -0
  154. package/src/effects/animated-beam/types.ts +23 -0
  155. package/src/effects/border-beam/BorderBeam.svelte +223 -0
  156. package/src/effects/border-beam/css.test.ts +46 -0
  157. package/src/effects/border-beam/css.ts +574 -0
  158. package/src/effects/border-beam/presets.ts +699 -0
  159. package/src/effects/border-beam/register-properties.test.ts +74 -0
  160. package/src/effects/border-beam/register-properties.ts +73 -0
  161. package/src/effects/border-beam/types.ts +38 -0
  162. package/src/effects/image-comparison/ImageComparison.css +66 -0
  163. package/src/effects/image-comparison/ImageComparison.svelte +92 -0
  164. package/src/effects/image-reveal/ImageReveal.css +10 -0
  165. package/src/effects/image-reveal/ImageReveal.svelte +357 -0
  166. package/src/effects/image-reveal/index.ts +2 -0
  167. package/src/effects/image-reveal/types.ts +35 -0
  168. package/src/effects/magnetic/magnetic.ts +81 -0
  169. package/src/effects/marquee/Marquee.css +52 -0
  170. package/src/effects/marquee/Marquee.svelte +96 -0
  171. package/src/effects/progressive-blur/ProgressiveBlur.css +9 -0
  172. package/src/effects/progressive-blur/ProgressiveBlur.svelte +63 -0
  173. package/src/effects/reveal/AnimatedGroup.svelte +101 -0
  174. package/src/effects/reveal/InView.svelte +77 -0
  175. package/src/effects/reveal/TextEffect.svelte +142 -0
  176. package/src/effects/reveal/index.ts +10 -0
  177. package/src/effects/reveal/observe.ts +33 -0
  178. package/src/effects/reveal/reveal.css +141 -0
  179. package/src/effects/reveal/types.ts +25 -0
  180. package/src/effects/shader-gradient/ShaderGradient.svelte +227 -0
  181. package/src/effects/shader-gradient/color.ts +44 -0
  182. package/src/effects/shader-gradient/index.ts +5 -0
  183. package/src/effects/shader-gradient/renderer.ts +456 -0
  184. package/src/effects/shader-gradient/shaders.ts +324 -0
  185. package/src/effects/shader-gradient/types.ts +68 -0
  186. package/src/effects/spotlight/Spotlight.css +14 -0
  187. package/src/effects/spotlight/Spotlight.svelte +61 -0
  188. package/src/effects/theme-toggle/ThemeToggle.css +21 -0
  189. package/src/effects/theme-toggle/ThemeToggle.svelte +101 -0
  190. package/src/icons/TradeIcon.svelte +16 -0
  191. package/src/icons/apple-symbol-exports.ts +135 -0
  192. package/src/icons/sf-symbols.ts +527 -0
  193. package/src/icons/trades.ts +89 -0
  194. package/src/index.ts +49 -0
  195. package/src/lib/arrive.ts +26 -0
  196. package/src/lib/hooks/is-mobile.svelte.ts +11 -0
  197. package/src/lib/icon-types.ts +17 -0
  198. package/src/lib/layout.ts +8 -0
  199. package/src/lib/panel.ts +15 -0
  200. package/src/lib/theme-transition.ts +51 -0
  201. package/src/lib/utils.ts +45 -0
  202. package/src/shadcn/accordion/accordion-content.svelte +22 -0
  203. package/src/shadcn/accordion/accordion-item.svelte +17 -0
  204. package/src/shadcn/accordion/accordion-trigger.svelte +35 -0
  205. package/src/shadcn/accordion/accordion.svelte +19 -0
  206. package/src/shadcn/accordion/index.ts +16 -0
  207. package/src/shadcn/alert/alert-description.svelte +23 -0
  208. package/src/shadcn/alert/alert-title.svelte +20 -0
  209. package/src/shadcn/alert/alert.svelte +44 -0
  210. package/src/shadcn/alert/index.ts +14 -0
  211. package/src/shadcn/alert-dialog/alert-dialog-action.svelte +18 -0
  212. package/src/shadcn/alert-dialog/alert-dialog-cancel.svelte +18 -0
  213. package/src/shadcn/alert-dialog/alert-dialog-content.svelte +29 -0
  214. package/src/shadcn/alert-dialog/alert-dialog-description.svelte +17 -0
  215. package/src/shadcn/alert-dialog/alert-dialog-footer.svelte +20 -0
  216. package/src/shadcn/alert-dialog/alert-dialog-header.svelte +20 -0
  217. package/src/shadcn/alert-dialog/alert-dialog-overlay.svelte +17 -0
  218. package/src/shadcn/alert-dialog/alert-dialog-portal.svelte +7 -0
  219. package/src/shadcn/alert-dialog/alert-dialog-title.svelte +17 -0
  220. package/src/shadcn/alert-dialog/alert-dialog-trigger.svelte +7 -0
  221. package/src/shadcn/alert-dialog/alert-dialog.svelte +7 -0
  222. package/src/shadcn/alert-dialog/index.ts +37 -0
  223. package/src/shadcn/attachment/attachment-action.svelte +23 -0
  224. package/src/shadcn/attachment/attachment-actions.svelte +23 -0
  225. package/src/shadcn/attachment/attachment-content.svelte +23 -0
  226. package/src/shadcn/attachment/attachment-description.svelte +23 -0
  227. package/src/shadcn/attachment/attachment-group.svelte +23 -0
  228. package/src/shadcn/attachment/attachment-media.svelte +44 -0
  229. package/src/shadcn/attachment/attachment-title.svelte +23 -0
  230. package/src/shadcn/attachment/attachment-trigger.svelte +29 -0
  231. package/src/shadcn/attachment/attachment.svelte +55 -0
  232. package/src/shadcn/attachment/index.ts +40 -0
  233. package/src/shadcn/avatar/avatar-badge.svelte +26 -0
  234. package/src/shadcn/avatar/avatar-fallback.svelte +20 -0
  235. package/src/shadcn/avatar/avatar-group-count.svelte +23 -0
  236. package/src/shadcn/avatar/avatar-group.svelte +23 -0
  237. package/src/shadcn/avatar/avatar-image.svelte +17 -0
  238. package/src/shadcn/avatar/avatar.svelte +26 -0
  239. package/src/shadcn/avatar/index.ts +22 -0
  240. package/src/shadcn/badge/badge.svelte +53 -0
  241. package/src/shadcn/badge/index.ts +2 -0
  242. package/src/shadcn/breadcrumb/breadcrumb-ellipsis.svelte +23 -0
  243. package/src/shadcn/breadcrumb/breadcrumb-item.svelte +20 -0
  244. package/src/shadcn/breadcrumb/breadcrumb-link.svelte +31 -0
  245. package/src/shadcn/breadcrumb/breadcrumb-list.svelte +23 -0
  246. package/src/shadcn/breadcrumb/breadcrumb-page.svelte +23 -0
  247. package/src/shadcn/breadcrumb/breadcrumb-separator.svelte +27 -0
  248. package/src/shadcn/breadcrumb/breadcrumb.svelte +21 -0
  249. package/src/shadcn/breadcrumb/index.ts +25 -0
  250. package/src/shadcn/bubble/bubble-content.svelte +31 -0
  251. package/src/shadcn/bubble/bubble-group.svelte +20 -0
  252. package/src/shadcn/bubble/bubble-reactions.svelte +52 -0
  253. package/src/shadcn/bubble/bubble.svelte +58 -0
  254. package/src/shadcn/bubble/index.ts +25 -0
  255. package/src/shadcn/button/button.svelte +121 -0
  256. package/src/shadcn/button/index.ts +17 -0
  257. package/src/shadcn/calendar/calendar-caption.svelte +76 -0
  258. package/src/shadcn/calendar/calendar-cell.svelte +19 -0
  259. package/src/shadcn/calendar/calendar-day.svelte +35 -0
  260. package/src/shadcn/calendar/calendar-grid-body.svelte +12 -0
  261. package/src/shadcn/calendar/calendar-grid-head.svelte +12 -0
  262. package/src/shadcn/calendar/calendar-grid-row.svelte +12 -0
  263. package/src/shadcn/calendar/calendar-grid.svelte +16 -0
  264. package/src/shadcn/calendar/calendar-head-cell.svelte +19 -0
  265. package/src/shadcn/calendar/calendar-header.svelte +19 -0
  266. package/src/shadcn/calendar/calendar-heading.svelte +16 -0
  267. package/src/shadcn/calendar/calendar-month-select.svelte +44 -0
  268. package/src/shadcn/calendar/calendar-month.svelte +15 -0
  269. package/src/shadcn/calendar/calendar-months.svelte +19 -0
  270. package/src/shadcn/calendar/calendar-nav.svelte +19 -0
  271. package/src/shadcn/calendar/calendar-next-button.svelte +31 -0
  272. package/src/shadcn/calendar/calendar-prev-button.svelte +31 -0
  273. package/src/shadcn/calendar/calendar-year-select.svelte +43 -0
  274. package/src/shadcn/calendar/calendar.svelte +118 -0
  275. package/src/shadcn/calendar/index.ts +40 -0
  276. package/src/shadcn/card/card-action.svelte +23 -0
  277. package/src/shadcn/card/card-content.svelte +20 -0
  278. package/src/shadcn/card/card-description.svelte +20 -0
  279. package/src/shadcn/card/card-footer.svelte +23 -0
  280. package/src/shadcn/card/card-header.svelte +23 -0
  281. package/src/shadcn/card/card-title.svelte +29 -0
  282. package/src/shadcn/card/card.svelte +25 -0
  283. package/src/shadcn/card/index.ts +25 -0
  284. package/src/shadcn/checkbox/checkbox.svelte +38 -0
  285. package/src/shadcn/checkbox/index.ts +6 -0
  286. package/src/shadcn/collapsible/collapsible-content.svelte +7 -0
  287. package/src/shadcn/collapsible/collapsible-trigger.svelte +7 -0
  288. package/src/shadcn/collapsible/collapsible.svelte +11 -0
  289. package/src/shadcn/collapsible/index.ts +13 -0
  290. package/src/shadcn/command/command-dialog.svelte +66 -0
  291. package/src/shadcn/command/command-empty.svelte +17 -0
  292. package/src/shadcn/command/command-group.svelte +40 -0
  293. package/src/shadcn/command/command-input.svelte +64 -0
  294. package/src/shadcn/command/command-item.svelte +37 -0
  295. package/src/shadcn/command/command-link-item.svelte +20 -0
  296. package/src/shadcn/command/command-list.svelte +20 -0
  297. package/src/shadcn/command/command-loading.svelte +7 -0
  298. package/src/shadcn/command/command-separator.svelte +17 -0
  299. package/src/shadcn/command/command-shortcut.svelte +23 -0
  300. package/src/shadcn/command/command.svelte +28 -0
  301. package/src/shadcn/command/index.ts +37 -0
  302. package/src/shadcn/context-menu/context-menu-checkbox-item.svelte +41 -0
  303. package/src/shadcn/context-menu/context-menu-content.svelte +28 -0
  304. package/src/shadcn/context-menu/context-menu-group-heading.svelte +21 -0
  305. package/src/shadcn/context-menu/context-menu-group.svelte +7 -0
  306. package/src/shadcn/context-menu/context-menu-item.svelte +27 -0
  307. package/src/shadcn/context-menu/context-menu-label.svelte +27 -0
  308. package/src/shadcn/context-menu/context-menu-portal.svelte +7 -0
  309. package/src/shadcn/context-menu/context-menu-radio-group.svelte +16 -0
  310. package/src/shadcn/context-menu/context-menu-radio-item.svelte +35 -0
  311. package/src/shadcn/context-menu/context-menu-separator.svelte +17 -0
  312. package/src/shadcn/context-menu/context-menu-shortcut.svelte +23 -0
  313. package/src/shadcn/context-menu/context-menu-sub-content.svelte +25 -0
  314. package/src/shadcn/context-menu/context-menu-sub-trigger.svelte +29 -0
  315. package/src/shadcn/context-menu/context-menu-sub.svelte +7 -0
  316. package/src/shadcn/context-menu/context-menu-trigger.svelte +17 -0
  317. package/src/shadcn/context-menu/context-menu.svelte +7 -0
  318. package/src/shadcn/context-menu/index.ts +52 -0
  319. package/src/shadcn/dialog/dialog-close.svelte +11 -0
  320. package/src/shadcn/dialog/dialog-content.svelte +57 -0
  321. package/src/shadcn/dialog/dialog-description.svelte +20 -0
  322. package/src/shadcn/dialog/dialog-footer.svelte +32 -0
  323. package/src/shadcn/dialog/dialog-header.svelte +20 -0
  324. package/src/shadcn/dialog/dialog-overlay.svelte +20 -0
  325. package/src/shadcn/dialog/dialog-portal.svelte +7 -0
  326. package/src/shadcn/dialog/dialog-title.svelte +17 -0
  327. package/src/shadcn/dialog/dialog-trigger.svelte +11 -0
  328. package/src/shadcn/dialog/dialog.svelte +7 -0
  329. package/src/shadcn/dialog/index.ts +34 -0
  330. package/src/shadcn/dropdown-menu/dropdown-menu-checkbox-group.svelte +16 -0
  331. package/src/shadcn/dropdown-menu/dropdown-menu-checkbox-item.svelte +43 -0
  332. package/src/shadcn/dropdown-menu/dropdown-menu-content.svelte +31 -0
  333. package/src/shadcn/dropdown-menu/dropdown-menu-group-heading.svelte +22 -0
  334. package/src/shadcn/dropdown-menu/dropdown-menu-group.svelte +7 -0
  335. package/src/shadcn/dropdown-menu/dropdown-menu-item.svelte +29 -0
  336. package/src/shadcn/dropdown-menu/dropdown-menu-label.svelte +27 -0
  337. package/src/shadcn/dropdown-menu/dropdown-menu-portal.svelte +7 -0
  338. package/src/shadcn/dropdown-menu/dropdown-menu-radio-group.svelte +16 -0
  339. package/src/shadcn/dropdown-menu/dropdown-menu-radio-item.svelte +34 -0
  340. package/src/shadcn/dropdown-menu/dropdown-menu-separator.svelte +17 -0
  341. package/src/shadcn/dropdown-menu/dropdown-menu-shortcut.svelte +23 -0
  342. package/src/shadcn/dropdown-menu/dropdown-menu-sub-content.svelte +20 -0
  343. package/src/shadcn/dropdown-menu/dropdown-menu-sub-trigger.svelte +29 -0
  344. package/src/shadcn/dropdown-menu/dropdown-menu-sub.svelte +7 -0
  345. package/src/shadcn/dropdown-menu/dropdown-menu-trigger.svelte +7 -0
  346. package/src/shadcn/dropdown-menu/dropdown-menu.svelte +7 -0
  347. package/src/shadcn/dropdown-menu/index.ts +56 -0
  348. package/src/shadcn/dropdown-menu/menu-item.ts +43 -0
  349. package/src/shadcn/empty/empty-content.svelte +23 -0
  350. package/src/shadcn/empty/empty-description.svelte +23 -0
  351. package/src/shadcn/empty/empty-header.svelte +20 -0
  352. package/src/shadcn/empty/empty-media.svelte +41 -0
  353. package/src/shadcn/empty/empty-title.svelte +20 -0
  354. package/src/shadcn/empty/empty.svelte +23 -0
  355. package/src/shadcn/empty/index.ts +22 -0
  356. package/src/shadcn/field/field-content.svelte +20 -0
  357. package/src/shadcn/field/field-description.svelte +25 -0
  358. package/src/shadcn/field/field-error.svelte +58 -0
  359. package/src/shadcn/field/field-group.svelte +23 -0
  360. package/src/shadcn/field/field-label.svelte +26 -0
  361. package/src/shadcn/field/field-legend.svelte +29 -0
  362. package/src/shadcn/field/field-separator.svelte +35 -0
  363. package/src/shadcn/field/field-set.svelte +24 -0
  364. package/src/shadcn/field/field-title.svelte +23 -0
  365. package/src/shadcn/field/field.svelte +53 -0
  366. package/src/shadcn/field/index.ts +33 -0
  367. package/src/shadcn/hooks/is-mobile.svelte.ts +9 -0
  368. package/src/shadcn/hover-card/hover-card-content.svelte +31 -0
  369. package/src/shadcn/hover-card/hover-card-portal.svelte +7 -0
  370. package/src/shadcn/hover-card/hover-card-trigger.svelte +7 -0
  371. package/src/shadcn/hover-card/hover-card.svelte +7 -0
  372. package/src/shadcn/hover-card/index.ts +15 -0
  373. package/src/shadcn/input/index.ts +9 -0
  374. package/src/shadcn/input/input.svelte +48 -0
  375. package/src/shadcn/input/secret-input.svelte +75 -0
  376. package/src/shadcn/input-otp/index.ts +15 -0
  377. package/src/shadcn/input-otp/input-otp-group.svelte +20 -0
  378. package/src/shadcn/input-otp/input-otp-separator.svelte +25 -0
  379. package/src/shadcn/input-otp/input-otp-slot.svelte +26 -0
  380. package/src/shadcn/input-otp/input-otp.svelte +22 -0
  381. package/src/shadcn/label/index.ts +7 -0
  382. package/src/shadcn/label/label.svelte +20 -0
  383. package/src/shadcn/marker/index.ts +15 -0
  384. package/src/shadcn/marker/marker-content.svelte +23 -0
  385. package/src/shadcn/marker/marker-icon.svelte +21 -0
  386. package/src/shadcn/marker/marker.svelte +52 -0
  387. package/src/shadcn/message/index.ts +22 -0
  388. package/src/shadcn/message/message-avatar.svelte +23 -0
  389. package/src/shadcn/message/message-content.svelte +23 -0
  390. package/src/shadcn/message/message-footer.svelte +23 -0
  391. package/src/shadcn/message/message-group.svelte +20 -0
  392. package/src/shadcn/message/message-header.svelte +23 -0
  393. package/src/shadcn/message/message.svelte +27 -0
  394. package/src/shadcn/popover/index.ts +28 -0
  395. package/src/shadcn/popover/popover-close.svelte +7 -0
  396. package/src/shadcn/popover/popover-content.svelte +38 -0
  397. package/src/shadcn/popover/popover-description.svelte +20 -0
  398. package/src/shadcn/popover/popover-header.svelte +20 -0
  399. package/src/shadcn/popover/popover-portal.svelte +7 -0
  400. package/src/shadcn/popover/popover-title.svelte +15 -0
  401. package/src/shadcn/popover/popover-trigger.svelte +17 -0
  402. package/src/shadcn/popover/popover.svelte +7 -0
  403. package/src/shadcn/progress/index.ts +7 -0
  404. package/src/shadcn/progress/progress.svelte +30 -0
  405. package/src/shadcn/radio-group/index.ts +10 -0
  406. package/src/shadcn/radio-group/radio-group-item.svelte +31 -0
  407. package/src/shadcn/radio-group/radio-group.svelte +19 -0
  408. package/src/shadcn/scroll-area/index.ts +10 -0
  409. package/src/shadcn/scroll-area/scroll-area-scrollbar.svelte +30 -0
  410. package/src/shadcn/scroll-area/scroll-area.svelte +43 -0
  411. package/src/shadcn/select/index.ts +37 -0
  412. package/src/shadcn/select/select-content.svelte +45 -0
  413. package/src/shadcn/select/select-group-heading.svelte +21 -0
  414. package/src/shadcn/select/select-group.svelte +17 -0
  415. package/src/shadcn/select/select-item.svelte +38 -0
  416. package/src/shadcn/select/select-label.svelte +20 -0
  417. package/src/shadcn/select/select-portal.svelte +7 -0
  418. package/src/shadcn/select/select-scroll-down-button.svelte +23 -0
  419. package/src/shadcn/select/select-scroll-up-button.svelte +23 -0
  420. package/src/shadcn/select/select-separator.svelte +18 -0
  421. package/src/shadcn/select/select-trigger.svelte +33 -0
  422. package/src/shadcn/select/select.svelte +11 -0
  423. package/src/shadcn/separator/index.ts +7 -0
  424. package/src/shadcn/separator/separator.svelte +23 -0
  425. package/src/shadcn/sheet/index.ts +34 -0
  426. package/src/shadcn/sheet/sheet-close.svelte +7 -0
  427. package/src/shadcn/sheet/sheet-content.svelte +72 -0
  428. package/src/shadcn/sheet/sheet-description.svelte +17 -0
  429. package/src/shadcn/sheet/sheet-footer.svelte +20 -0
  430. package/src/shadcn/sheet/sheet-header.svelte +20 -0
  431. package/src/shadcn/sheet/sheet-overlay.svelte +20 -0
  432. package/src/shadcn/sheet/sheet-portal.svelte +7 -0
  433. package/src/shadcn/sheet/sheet-title.svelte +17 -0
  434. package/src/shadcn/sheet/sheet-trigger.svelte +7 -0
  435. package/src/shadcn/sheet/sheet.svelte +7 -0
  436. package/src/shadcn/sidebar/constants.ts +6 -0
  437. package/src/shadcn/sidebar/context.svelte.ts +81 -0
  438. package/src/shadcn/sidebar/index.ts +75 -0
  439. package/src/shadcn/sidebar/sidebar-content.svelte +24 -0
  440. package/src/shadcn/sidebar/sidebar-footer.svelte +21 -0
  441. package/src/shadcn/sidebar/sidebar-group-action.svelte +33 -0
  442. package/src/shadcn/sidebar/sidebar-group-content.svelte +21 -0
  443. package/src/shadcn/sidebar/sidebar-group-label.svelte +33 -0
  444. package/src/shadcn/sidebar/sidebar-group.svelte +21 -0
  445. package/src/shadcn/sidebar/sidebar-header.svelte +21 -0
  446. package/src/shadcn/sidebar/sidebar-input.svelte +21 -0
  447. package/src/shadcn/sidebar/sidebar-inset.svelte +23 -0
  448. package/src/shadcn/sidebar/sidebar-menu-action.svelte +37 -0
  449. package/src/shadcn/sidebar/sidebar-menu-badge.svelte +24 -0
  450. package/src/shadcn/sidebar/sidebar-menu-button.svelte +103 -0
  451. package/src/shadcn/sidebar/sidebar-menu-item.svelte +21 -0
  452. package/src/shadcn/sidebar/sidebar-menu-skeleton.svelte +36 -0
  453. package/src/shadcn/sidebar/sidebar-menu-sub-button.svelte +39 -0
  454. package/src/shadcn/sidebar/sidebar-menu-sub-item.svelte +21 -0
  455. package/src/shadcn/sidebar/sidebar-menu-sub.svelte +24 -0
  456. package/src/shadcn/sidebar/sidebar-menu.svelte +21 -0
  457. package/src/shadcn/sidebar/sidebar-provider.svelte +62 -0
  458. package/src/shadcn/sidebar/sidebar-rail.svelte +36 -0
  459. package/src/shadcn/sidebar/sidebar-separator.svelte +19 -0
  460. package/src/shadcn/sidebar/sidebar-trigger.svelte +37 -0
  461. package/src/shadcn/sidebar/sidebar.svelte +109 -0
  462. package/src/shadcn/skeleton/index.ts +7 -0
  463. package/src/shadcn/skeleton/skeleton.svelte +17 -0
  464. package/src/shadcn/slider/index.ts +7 -0
  465. package/src/shadcn/slider/slider.svelte +52 -0
  466. package/src/shadcn/sonner/index.ts +1 -0
  467. package/src/shadcn/sonner/sonner.svelte +34 -0
  468. package/src/shadcn/spinner/index.ts +1 -0
  469. package/src/shadcn/spinner/spinner.svelte +26 -0
  470. package/src/shadcn/switch/index.ts +7 -0
  471. package/src/shadcn/switch/switch.svelte +31 -0
  472. package/src/shadcn/table/index.ts +28 -0
  473. package/src/shadcn/table/table-body.svelte +20 -0
  474. package/src/shadcn/table/table-caption.svelte +20 -0
  475. package/src/shadcn/table/table-cell.svelte +20 -0
  476. package/src/shadcn/table/table-footer.svelte +20 -0
  477. package/src/shadcn/table/table-head.svelte +23 -0
  478. package/src/shadcn/table/table-header.svelte +20 -0
  479. package/src/shadcn/table/table-row.svelte +23 -0
  480. package/src/shadcn/table/table.svelte +25 -0
  481. package/src/shadcn/tabs/index.ts +16 -0
  482. package/src/shadcn/tabs/tabs-content.svelte +17 -0
  483. package/src/shadcn/tabs/tabs-list.svelte +25 -0
  484. package/src/shadcn/tabs/tabs-trigger.svelte +20 -0
  485. package/src/shadcn/tabs/tabs.svelte +19 -0
  486. package/src/shadcn/textarea/index.ts +7 -0
  487. package/src/shadcn/textarea/textarea.svelte +23 -0
  488. package/src/shadcn/toggle/index.ts +13 -0
  489. package/src/shadcn/toggle/toggle.svelte +53 -0
  490. package/src/shadcn/toggle-group/index.ts +10 -0
  491. package/src/shadcn/toggle-group/toggle-group-item.svelte +35 -0
  492. package/src/shadcn/toggle-group/toggle-group.svelte +59 -0
  493. package/src/shadcn/tooltip/context.ts +16 -0
  494. package/src/shadcn/tooltip/index.ts +19 -0
  495. package/src/shadcn/tooltip/tooltip-content.svelte +38 -0
  496. package/src/shadcn/tooltip/tooltip-portal.svelte +7 -0
  497. package/src/shadcn/tooltip/tooltip-provider.svelte +16 -0
  498. package/src/shadcn/tooltip/tooltip-trigger.svelte +7 -0
  499. package/src/shadcn/tooltip/tooltip.svelte +19 -0
  500. package/src/shadcn/utilities.css +549 -0
  501. package/src/showcase/AiSection.svelte +157 -0
  502. package/src/showcase/AnimationsSection.svelte +1658 -0
  503. package/src/showcase/ChartsSection.svelte +458 -0
  504. package/src/showcase/EffectsSection.svelte +152 -0
  505. package/src/showcase/ShadcnSection.svelte +27 -0
  506. package/src/showcase/ShowcaseImport.svelte +126 -0
  507. package/src/showcase/ShowcaseList.svelte +132 -0
  508. package/src/showcase/ShowcaseNav.svelte +247 -0
  509. package/src/showcase/ShowcaseSection.svelte +112 -0
  510. package/src/showcase/ShowcaseShell.svelte +55 -0
  511. package/src/showcase/ShowcaseStage.svelte +342 -0
  512. package/src/showcase/ShowcaseVariant.svelte +109 -0
  513. package/src/showcase/assets/image-reveal/art-1.jpg +0 -0
  514. package/src/showcase/assets/image-reveal/art-2.jpg +0 -0
  515. package/src/showcase/assets/image-reveal/art-3.jpg +0 -0
  516. package/src/showcase/check.svg +1 -0
  517. package/src/showcase/chevron-arms.svg +2 -0
  518. package/src/showcase/chevron-down.svg +1 -0
  519. package/src/showcase/copy.svg +2 -0
  520. package/src/showcase/demos/ai/confirmation.svelte +59 -0
  521. package/src/showcase/demos/ai/conversation.svelte +59 -0
  522. package/src/showcase/demos/ai/loading-state.svelte +19 -0
  523. package/src/showcase/demos/ai/prompt-input.svelte +57 -0
  524. package/src/showcase/demos/ai/reasoning.svelte +19 -0
  525. package/src/showcase/demos/ai/thinking-dots.svelte +15 -0
  526. package/src/showcase/demos/ai/voice-waveform.svelte +24 -0
  527. package/src/showcase/demos/effects/animated-beam.svelte +50 -0
  528. package/src/showcase/demos/effects/animated-group.svelte +47 -0
  529. package/src/showcase/demos/effects/border-beam-default.svelte +20 -0
  530. package/src/showcase/demos/effects/border-beam-line.svelte +20 -0
  531. package/src/showcase/demos/effects/border-beam-mono.svelte +20 -0
  532. package/src/showcase/demos/effects/border-beam-sunset.svelte +20 -0
  533. package/src/showcase/demos/effects/image-comparison.svelte +25 -0
  534. package/src/showcase/demos/effects/image-reveal.svelte +49 -0
  535. package/src/showcase/demos/effects/in-view.svelte +41 -0
  536. package/src/showcase/demos/effects/integrations-hub.svelte +82 -0
  537. package/src/showcase/demos/effects/magnetic.svelte +31 -0
  538. package/src/showcase/demos/effects/marquee.svelte +33 -0
  539. package/src/showcase/demos/effects/progressive-blur.svelte +47 -0
  540. package/src/showcase/demos/effects/spotlight.svelte +40 -0
  541. package/src/showcase/demos/effects/text-effect.svelte +55 -0
  542. package/src/showcase/demos/shadcn/accordion.svelte +45 -0
  543. package/src/showcase/demos/shadcn/alert-dialog.svelte +23 -0
  544. package/src/showcase/demos/shadcn/alert.svelte +30 -0
  545. package/src/showcase/demos/shadcn/attachment.svelte +71 -0
  546. package/src/showcase/demos/shadcn/avatar.svelte +30 -0
  547. package/src/showcase/demos/shadcn/badge.svelte +26 -0
  548. package/src/showcase/demos/shadcn/breadcrumb.svelte +34 -0
  549. package/src/showcase/demos/shadcn/bubble.svelte +36 -0
  550. package/src/showcase/demos/shadcn/button.svelte +11 -0
  551. package/src/showcase/demos/shadcn/calendar.svelte +8 -0
  552. package/src/showcase/demos/shadcn/card.svelte +39 -0
  553. package/src/showcase/demos/shadcn/checkbox.svelte +39 -0
  554. package/src/showcase/demos/shadcn/collapsible.svelte +20 -0
  555. package/src/showcase/demos/shadcn/command.svelte +48 -0
  556. package/src/showcase/demos/shadcn/context-menu.svelte +54 -0
  557. package/src/showcase/demos/shadcn/demo-harness.svelte +12 -0
  558. package/src/showcase/demos/shadcn/demos.test.ts +20 -0
  559. package/src/showcase/demos/shadcn/dialog.svelte +38 -0
  560. package/src/showcase/demos/shadcn/dropdown-menu.svelte +59 -0
  561. package/src/showcase/demos/shadcn/empty.svelte +29 -0
  562. package/src/showcase/demos/shadcn/field.svelte +115 -0
  563. package/src/showcase/demos/shadcn/hover-card.svelte +32 -0
  564. package/src/showcase/demos/shadcn/index.ts +358 -0
  565. package/src/showcase/demos/shadcn/input-otp.svelte +19 -0
  566. package/src/showcase/demos/shadcn/input.svelte +5 -0
  567. package/src/showcase/demos/shadcn/label.svelte +11 -0
  568. package/src/showcase/demos/shadcn/marker.svelte +30 -0
  569. package/src/showcase/demos/shadcn/message.svelte +75 -0
  570. package/src/showcase/demos/shadcn/popover.svelte +36 -0
  571. package/src/showcase/demos/shadcn/progress.svelte +13 -0
  572. package/src/showcase/demos/shadcn/radio-group.svelte +19 -0
  573. package/src/showcase/demos/shadcn/scroll-area.svelte +18 -0
  574. package/src/showcase/demos/shadcn/select.svelte +29 -0
  575. package/src/showcase/demos/shadcn/separator.svelte +12 -0
  576. package/src/showcase/demos/shadcn/sheet.svelte +48 -0
  577. package/src/showcase/demos/shadcn/skeleton.svelte +11 -0
  578. package/src/showcase/demos/shadcn/slider.svelte +7 -0
  579. package/src/showcase/demos/shadcn/sonner.svelte +18 -0
  580. package/src/showcase/demos/shadcn/spinner.svelte +11 -0
  581. package/src/showcase/demos/shadcn/switch.svelte +9 -0
  582. package/src/showcase/demos/shadcn/table.svelte +76 -0
  583. package/src/showcase/demos/shadcn/tabs.svelte +62 -0
  584. package/src/showcase/demos/shadcn/textarea.svelte +5 -0
  585. package/src/showcase/demos/shadcn/toggle-group.svelte +18 -0
  586. package/src/showcase/demos/shadcn/toggle.svelte +14 -0
  587. package/src/showcase/demos/shadcn/tooltip.svelte +13 -0
  588. package/src/showcase/heart.svg +1 -0
  589. package/src/showcase/index.ts +38 -0
  590. package/src/showcase/kit.test.ts +72 -0
  591. package/src/showcase/kit.ts +17 -0
  592. package/src/showcase/plus.svg +1 -0
  593. package/src/showcase/showcase-shell.css +91 -0
  594. package/src/showcase/stacked-section.css +15 -0
  595. package/src/showcase/success-check.svg +1 -0
  596. package/src/showcase/types.ts +29 -0
  597. package/src/svg-raw.d.ts +7 -0
  598. package/src/test-setup.ts +34 -0
  599. package/src/tokens.css +993 -0
package/COMPONENTS.md ADDED
@@ -0,0 +1,141 @@
1
+ # Components
2
+
3
+ Every component in `@heyramzi/ui`, one line each. Import a component from its subpath, e.g.
4
+ `import { Button } from "@heyramzi/ui/shadcn/button"`.
5
+
6
+ The style layer lives in [`src/tokens.css`](./src/tokens.css) and the motion CSS in
7
+ [`src/animations`](./src/animations). Components that already exist in
8
+ [shadcn-svelte](https://shadcn-svelte.com) are linked there from the root README.
9
+
10
+ ## shadcn primitives (`src/shadcn`)
11
+
12
+ - `accordion` — Accordion
13
+ - `alert` — alertVariants, AlertVariant
14
+ - `alert-dialog` — AlertDialog
15
+ - `attachment` — Attachment
16
+ - `avatar` — Avatar
17
+ - `badge` — Badge, badgeVariants, BadgeVariant
18
+ - `breadcrumb` — Breadcrumb
19
+ - `bubble` — Bubble
20
+ - `button` — Button
21
+ - `calendar` — Calendar
22
+ - `card` — Card
23
+ - `checkbox` — Checkbox
24
+ - `collapsible` — Collapsible
25
+ - `command` — Command
26
+ - `context-menu` — ContextMenu
27
+ - `dialog` — Dialog
28
+ - `dropdown-menu` — CheckboxGroup, CheckboxItem, Content, Portal, DropdownMenu, DropdownMenuCheckboxGroup
29
+ - `empty` — Empty
30
+ - `field` — Field
31
+ - `hover-card` — HoverCard
32
+ - `input` — Input
33
+ - `input-otp` — InputOtp
34
+ - `label` — Label
35
+ - `marker` — Marker
36
+ - `message` — Message
37
+ - `popover` — Popover
38
+ - `progress` — Progress
39
+ - `radio-group` — RadioGroup
40
+ - `scroll-area` — ScrollArea
41
+ - `select` — Select
42
+ - `separator` — Separator
43
+ - `sheet` — Sheet (`side`: `left`, `right` or `bottom`)
44
+ - `sidebar` — Sidebar
45
+ - `skeleton` — Skeleton
46
+ - `slider` — Slider
47
+ - `sonner` — Toaster
48
+ - `spinner` — Spinner
49
+ - `switch` — Switch
50
+ - `table` — Table
51
+ - `tabs` — Tabs
52
+ - `textarea` — Textarea
53
+ - `toggle` — toggleVariants, ToggleSize, ToggleVariant, ToggleVariants
54
+ - `toggle-group` — ToggleGroup
55
+ - `tooltip` — Tooltip
56
+
57
+ ## Effects (`src/effects`)
58
+
59
+ - `animated-beam` — AnimatedBeam, AnimatedBeamProps, AnchorPosition
60
+ - `border-beam` — BorderBeam
61
+ - `image-comparison` — ImageComparison
62
+ - `image-reveal` — ImageReveal, ImageRevealProps, ImageRevealHandle
63
+ - `magnetic` — magnetic
64
+ - `marquee` — Marquee
65
+ - `progressive-blur` — ProgressiveBlur
66
+ - `reveal` — InView, AnimatedGroup, TextEffect, observeInView, RevealPreset, RevealPer
67
+ - `shader-gradient` — ShaderGradient, ShaderGradientProps, ShaderGradientUniforms
68
+ - `spotlight` — Spotlight
69
+ - `theme-toggle` — ThemeToggle, revealTheme. Props: `isDark`, `mode` (`light`, `dark`, `system`; swaps in the Monitor icon), `onToggle`, `variant` (`outline`, `ghost`, `inverted`; `inverted` boolean is an alias), `size`, `label`, `title`, `skipTransition`, `class`. `revealTheme(event, apply, { skip, duration })` is the circular wipe on its own: `import { revealTheme } from "@heyramzi/ui"` (the `./lib/*` subpath points at `.js` and the source is `.ts`).
70
+
71
+ ## Animations (`src/animations`)
72
+
73
+ - `accordion` — keyframe utilities
74
+ - `avatar-group-hover` — keyframe utilities
75
+ - `card-tilt` — keyframe utilities
76
+ - `digit-pop-in` — keyframe utilities
77
+ - `dropdown` — keyframe utilities
78
+ - `icon-swap` — keyframe utilities
79
+ - `input-clear-dissolve` — keyframe utilities
80
+ - `input-shake` — keyframe utilities
81
+ - `learn-more-hover` — keyframe utilities
82
+ - `like-button` — keyframe utilities
83
+ - `modal` — keyframe utilities
84
+ - `notification-badge` — keyframe utilities
85
+ - `page-side-by-side` — keyframe utilities
86
+ - `panel` — keyframe utilities
87
+ - `plus-menu-morph` — keyframe utilities
88
+ - `reasoning-stream` — keyframe utilities
89
+ - `resize` — keyframe utilities
90
+ - `shimmer-text` — keyframe utilities
91
+ - `skeleton-reveal` — keyframe utilities
92
+ - `spinning-counter` — keyframe utilities
93
+ - `streaming-text` — keyframe utilities
94
+ - `success-check` — keyframe utilities
95
+ - `tabs-sliding` — keyframe utilities
96
+ - `text-swap` — keyframe utilities
97
+ - `texts-reveal` — keyframe utilities
98
+ - `thinking-states` — keyframe utilities
99
+ - `tooltip` — keyframe utilities
100
+
101
+ ## AI and chat (`src/ai`)
102
+
103
+ - `composer` — Composer, ComposerProps
104
+ - `confirmation` — Confirmation, ConfirmationTitle, ConfirmationRequest, ConfirmationAccepted, ConfirmationRejected, ConfirmationActions, ConfirmationAction
105
+ - `conversation` — Conversation, ConversationContent, ConversationEmptyState, ConversationScrollButton
106
+ - `loading-state` — PixelLoader
107
+ - `prompt-input` — PromptInput, PromptInputBody, PromptInputToolbar, PromptInputTextarea, PromptInputSubmit
108
+ - `reasoning` — Reasoning, ReasoningTrigger, ReasoningContent
109
+ - `response` — Response
110
+ - `suggestion` — Suggestion, Suggestions
111
+ - `thinking-dots` — ThinkingDots
112
+ - `typing-dots` — TypingDots
113
+ - `voice-waveform` — VoiceWaveform
114
+
115
+ ## Charts (`src/charts`)
116
+
117
+ - `animated-value` — AnimatedValue
118
+ - `area-chart` — AreaChart
119
+ - `bar-chart` — BarChart
120
+ - `crosshair` — Crosshair
121
+ - `donut-chart` — DonutChart
122
+ - `edge-fade` — EdgeFade
123
+ - `figure` — Figure
124
+ - `gauge-chart` — GaugeChart
125
+ - `hover-focus` — HoverFocus
126
+ - `legend` — Legend
127
+ - `line-chart` — LineChart
128
+ - `number-chart` — NumberChart
129
+ - `reveal` — Reveal
130
+ - `ring-chart` — RingChart
131
+ - `sparkline` — Sparkline
132
+ - `stat-card` — StatCard
133
+ - `time-series-chart` — TimeSeriesChart
134
+ - `trend-pill` — TrendPill
135
+ - `primitives` — ChartContainer, ChartTooltip, ChartStyle, ChartConfig, TooltipSeriesItem, getPayloadConfigFromPayload
136
+
137
+ ---
138
+
139
+ Skipped on purpose: brand assets (logos, marks, brand renderer, language flags,
140
+ locale switch), kanban and status (they live in `@heyramzi/board`). The bot avatars
141
+ are in `src/agents`, imported from `@heyramzi/ui/agents`.
package/README.md CHANGED
@@ -1,3 +1,131 @@
1
- # Temporary Holding Version
1
+ # @heyramzi/ui
2
2
 
3
- This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
3
+ Svelte 5 UI primitives you copy into your project and own. Components, visual
4
+ effects, CSS animations, charts and a small set of chat and AI surfaces. No build step, no runtime wrapper,
5
+ no framework lock-in.
6
+
7
+ The package is a source registry. Every component is a folder under
8
+ `src/` that you can copy into your own `$lib` and edit. The root barrel is
9
+ only a convenience.
10
+
11
+ ## What is inside
12
+
13
+ - `src/shadcn` shadcn-svelte primitives, generalized.
14
+ - `src/effects` animated borders, beams, marquee, spotlight, image reveal,
15
+ image comparison, shimmer gradients and a theme toggle.
16
+ - `src/animations` keyframe CSS for dropdowns, modals, tooltips, text swaps,
17
+ success checks and the rest of the motion vocabulary.
18
+ - `src/ai` chat and AI surfaces: conversation, composer, prompt input, response, reasoning, confirmation and loaders.
19
+ - `src/charts` SVG charts: line, area, bar, donut, ring, gauge, sparkline,
20
+ time series, and stat cards.
21
+ - `src/agents` bot avatars and a cast grid, imported from `@heyramzi/ui/agents`:
22
+ `AgentAvatar` draws an eyes-only face from a name, role, shape and colour, and
23
+ `AgentCast` lays a list of agents out as cards you can pick from.
24
+
25
+ See [COMPONENTS.md](./COMPONENTS.md) for the full list, one line each.
26
+
27
+ ## Setup
28
+
29
+ Import the style layer once, after Tailwind:
30
+
31
+ ```css
32
+ @import "tailwindcss";
33
+ @import "@heyramzi/ui/tokens.css";
34
+ @import "@heyramzi/ui/animations";
35
+ ```
36
+
37
+ `tokens.css` carries the palette, the semantic tokens and the craft layer
38
+ (radius, elevation, focus, motion). `animations` carries the keyframes the
39
+ components reference. If you use the Attachment or Message component, also
40
+ import `@heyramzi/ui/shadcn/utilities.css`.
41
+
42
+ Retheme by overriding any variable on `:root`, for example
43
+ `--color-brand-indigo` or `--radius-lg`. Dark mode keys off a `.dark`
44
+ class on `html`.
45
+
46
+ React and other framework ports are out of scope. The source is Svelte 5
47
+ runes only.
48
+
49
+ ## Using a component
50
+
51
+ Import from a subpath:
52
+
53
+ ```svelte
54
+ <script lang="ts">
55
+ import { Button } from "@heyramzi/ui/shadcn/button";
56
+ import { Card, CardHeader, CardTitle, CardContent } from "@heyramzi/ui/shadcn/card";
57
+ import Marquee from "@heyramzi/ui/effects/marquee/Marquee.svelte";
58
+ </script>
59
+ ```
60
+
61
+ Many components take their content through snippets, so you keep full control:
62
+
63
+ ```svelte
64
+ <Button variant="outline" size="sm" onclick={save}>Save</Button>
65
+ ```
66
+
67
+ ## shadcn-svelte
68
+
69
+ The primitives in `src/shadcn` are copies of
70
+ [shadcn-svelte](https://shadcn-svelte.com), generalized. If a component exists
71
+ there, use its page for props and examples:
72
+
73
+ | Component | Docs |
74
+ | --- | --- |
75
+ | `accordion` | https://shadcn-svelte.com/docs/components/accordion |
76
+ | `alert` | https://shadcn-svelte.com/docs/components/alert |
77
+ | `alert-dialog` | https://shadcn-svelte.com/docs/components/alert-dialog |
78
+ | `attachment` | https://shadcn-svelte.com/docs/components/attachment |
79
+ | `avatar` | https://shadcn-svelte.com/docs/components/avatar |
80
+ | `badge` | https://shadcn-svelte.com/docs/components/badge |
81
+ | `breadcrumb` | https://shadcn-svelte.com/docs/components/breadcrumb |
82
+ | `bubble` | https://shadcn-svelte.com/docs/components/bubble |
83
+ | `button` | https://shadcn-svelte.com/docs/components/button |
84
+ | `calendar` | https://shadcn-svelte.com/docs/components/calendar |
85
+ | `card` | https://shadcn-svelte.com/docs/components/card |
86
+ | `checkbox` | https://shadcn-svelte.com/docs/components/checkbox |
87
+ | `collapsible` | https://shadcn-svelte.com/docs/components/collapsible |
88
+ | `command` | https://shadcn-svelte.com/docs/components/command |
89
+ | `context-menu` | https://shadcn-svelte.com/docs/components/context-menu |
90
+ | `dialog` | https://shadcn-svelte.com/docs/components/dialog |
91
+ | `dropdown-menu` | https://shadcn-svelte.com/docs/components/dropdown-menu |
92
+ | `empty` | https://shadcn-svelte.com/docs/components/empty |
93
+ | `field` | https://shadcn-svelte.com/docs/components/field |
94
+ | `hover-card` | https://shadcn-svelte.com/docs/components/hover-card |
95
+ | `input` | https://shadcn-svelte.com/docs/components/input |
96
+ | `input-otp` | https://shadcn-svelte.com/docs/components/input-otp |
97
+ | `label` | https://shadcn-svelte.com/docs/components/label |
98
+ | `marker` | https://shadcn-svelte.com/docs/components/marker |
99
+ | `message` | https://shadcn-svelte.com/docs/components/message |
100
+ | `popover` | https://shadcn-svelte.com/docs/components/popover |
101
+ | `progress` | https://shadcn-svelte.com/docs/components/progress |
102
+ | `radio-group` | https://shadcn-svelte.com/docs/components/radio-group |
103
+ | `scroll-area` | https://shadcn-svelte.com/docs/components/scroll-area |
104
+ | `select` | https://shadcn-svelte.com/docs/components/select |
105
+ | `separator` | https://shadcn-svelte.com/docs/components/separator |
106
+ | `sheet` | https://shadcn-svelte.com/docs/components/sheet |
107
+ | `sidebar` | https://shadcn-svelte.com/docs/components/sidebar |
108
+ | `skeleton` | https://shadcn-svelte.com/docs/components/skeleton |
109
+ | `slider` | https://shadcn-svelte.com/docs/components/slider |
110
+ | `sonner` | https://shadcn-svelte.com/docs/components/sonner |
111
+ | `spinner` | https://shadcn-svelte.com/docs/components/spinner |
112
+ | `switch` | https://shadcn-svelte.com/docs/components/switch |
113
+ | `table` | https://shadcn-svelte.com/docs/components/table |
114
+ | `tabs` | https://shadcn-svelte.com/docs/components/tabs |
115
+ | `textarea` | https://shadcn-svelte.com/docs/components/textarea |
116
+ | `toggle` | https://shadcn-svelte.com/docs/components/toggle |
117
+ | `toggle-group` | https://shadcn-svelte.com/docs/components/toggle-group |
118
+ | `tooltip` | https://shadcn-svelte.com/docs/components/tooltip |
119
+
120
+ ## Credits
121
+
122
+ Inspired by [shadcn-svelte](https://github.com/huntabyte/shadcn-svelte).
123
+ The reveal, marquee and beam effects are inspired by
124
+ [motion-primitives](https://github.com/ibelick/motion-primitives), and the
125
+ motion vocabulary by [transitions-dev](https://transitions.dev). The agent avatars
126
+ vendor [bot-avatars](https://github.com/jakubantalik/bot-avatars); its licence is in
127
+ `src/agents/vendor/LICENSE`.
128
+
129
+ ## License
130
+
131
+ MIT
package/package.json CHANGED
@@ -1,6 +1,218 @@
1
1
  {
2
2
  "name": "@heyramzi/ui",
3
- "version": "0.0.0-stage",
4
- "stub": true,
5
- "description": "Temporary package placeholder for staged publishing"
3
+ "version": "6.1.0",
4
+ "description": "Svelte 5 UI primitives: effects, animations, and shared component CSS.",
5
+ "license": "MIT",
6
+ "repository": {
7
+ "type": "git",
8
+ "url": "git+https://github.com/heyramzi/ui.git",
9
+ "directory": "packages/ui"
10
+ },
11
+ "homepage": "https://ui.heyramzi.com",
12
+ "type": "module",
13
+ "svelte": "./src/index.ts",
14
+ "files": [
15
+ "src",
16
+ "scripts",
17
+ "package.json",
18
+ "README.md",
19
+ "COMPONENTS.md"
20
+ ],
21
+ "imports": {
22
+ "#scripts/*": "./scripts/*",
23
+ "#src/*": "./src/*"
24
+ },
25
+ "exports": {
26
+ ".": {
27
+ "svelte": "./src/index.ts",
28
+ "types": "./src/index.ts",
29
+ "default": "./src/index.ts"
30
+ },
31
+ "./tokens.css": "./src/tokens.css",
32
+ "./lib/*": "./src/lib/*",
33
+ "./border-beam": {
34
+ "svelte": "./src/effects/border-beam/BorderBeam.svelte",
35
+ "default": "./src/effects/border-beam/BorderBeam.svelte"
36
+ },
37
+ "./effects/border-beam": {
38
+ "svelte": "./src/effects/border-beam/BorderBeam.svelte",
39
+ "default": "./src/effects/border-beam/BorderBeam.svelte"
40
+ },
41
+ "./theme-toggle": {
42
+ "svelte": "./src/effects/theme-toggle/ThemeToggle.svelte",
43
+ "default": "./src/effects/theme-toggle/ThemeToggle.svelte"
44
+ },
45
+ "./effects/theme-toggle": {
46
+ "svelte": "./src/effects/theme-toggle/ThemeToggle.svelte",
47
+ "default": "./src/effects/theme-toggle/ThemeToggle.svelte"
48
+ },
49
+ "./effects/animated-beam": {
50
+ "svelte": "./src/effects/animated-beam/index.ts",
51
+ "types": "./src/effects/animated-beam/index.ts",
52
+ "default": "./src/effects/animated-beam/index.ts"
53
+ },
54
+ "./effects/spotlight": {
55
+ "svelte": "./src/effects/spotlight/Spotlight.svelte",
56
+ "default": "./src/effects/spotlight/Spotlight.svelte"
57
+ },
58
+ "./effects/marquee": {
59
+ "svelte": "./src/effects/marquee/Marquee.svelte",
60
+ "default": "./src/effects/marquee/Marquee.svelte"
61
+ },
62
+ "./effects/image-reveal": {
63
+ "svelte": "./src/effects/image-reveal/index.ts",
64
+ "types": "./src/effects/image-reveal/index.ts",
65
+ "default": "./src/effects/image-reveal/index.ts"
66
+ },
67
+ "./effects/shader-gradient": {
68
+ "svelte": "./src/effects/shader-gradient/index.ts",
69
+ "types": "./src/effects/shader-gradient/index.ts",
70
+ "default": "./src/effects/shader-gradient/index.ts"
71
+ },
72
+ "./effects/reveal": {
73
+ "svelte": "./src/effects/reveal/index.ts",
74
+ "types": "./src/effects/reveal/index.ts",
75
+ "default": "./src/effects/reveal/index.ts"
76
+ },
77
+ "./effects/progressive-blur": {
78
+ "svelte": "./src/effects/progressive-blur/ProgressiveBlur.svelte",
79
+ "default": "./src/effects/progressive-blur/ProgressiveBlur.svelte"
80
+ },
81
+ "./effects/image-comparison": {
82
+ "svelte": "./src/effects/image-comparison/ImageComparison.svelte",
83
+ "default": "./src/effects/image-comparison/ImageComparison.svelte"
84
+ },
85
+ "./effects/magnetic": {
86
+ "svelte": "./src/effects/magnetic/magnetic.ts",
87
+ "types": "./src/effects/magnetic/magnetic.ts",
88
+ "default": "./src/effects/magnetic/magnetic.ts"
89
+ },
90
+ "./icons/sf-symbols": {
91
+ "svelte": "./src/icons/sf-symbols.ts",
92
+ "types": "./src/icons/sf-symbols.ts",
93
+ "default": "./src/icons/sf-symbols.ts"
94
+ },
95
+ "./icons/trades": {
96
+ "svelte": "./src/icons/trades.ts",
97
+ "types": "./src/icons/trades.ts",
98
+ "default": "./src/icons/trades.ts"
99
+ },
100
+ "./icons/TradeIcon": {
101
+ "svelte": "./src/icons/TradeIcon.svelte",
102
+ "default": "./src/icons/TradeIcon.svelte"
103
+ },
104
+ "./design": {
105
+ "style": "./src/design/index.css",
106
+ "default": "./src/design/index.css"
107
+ },
108
+ "./animations": {
109
+ "style": "./src/animations/index.css",
110
+ "default": "./src/animations/index.css"
111
+ },
112
+ "./animations/text-swap": {
113
+ "default": "./src/animations/text-swap.ts"
114
+ },
115
+ "./animations/*": {
116
+ "default": "./src/animations/*"
117
+ },
118
+ "./charts": {
119
+ "svelte": "./src/charts/index.ts",
120
+ "types": "./src/charts/index.ts",
121
+ "default": "./src/charts/index.ts"
122
+ },
123
+ "./showcase": {
124
+ "svelte": "./src/showcase/index.ts",
125
+ "types": "./src/showcase/index.ts",
126
+ "default": "./src/showcase/index.ts"
127
+ },
128
+ "./showcase/kit": {
129
+ "svelte": "./src/showcase/kit.ts",
130
+ "types": "./src/showcase/kit.ts",
131
+ "default": "./src/showcase/kit.ts"
132
+ },
133
+ "./shadcn/hooks/is-mobile.svelte": {
134
+ "svelte": "./src/shadcn/hooks/is-mobile.svelte.ts",
135
+ "types": "./src/shadcn/hooks/is-mobile.svelte.ts",
136
+ "default": "./src/shadcn/hooks/is-mobile.svelte.ts"
137
+ },
138
+ "./shadcn/*": {
139
+ "svelte": "./src/shadcn/*/index.ts",
140
+ "types": "./src/shadcn/*/index.ts",
141
+ "default": "./src/shadcn/*/index.ts"
142
+ },
143
+ "./shadcn/utilities.css": {
144
+ "style": "./src/shadcn/utilities.css",
145
+ "default": "./src/shadcn/utilities.css"
146
+ },
147
+ "./ai": {
148
+ "svelte": "./src/ai/index.ts",
149
+ "types": "./src/ai/index.ts",
150
+ "default": "./src/ai/index.ts"
151
+ },
152
+ "./ai/*": {
153
+ "svelte": "./src/ai/*/index.ts",
154
+ "types": "./src/ai/*/index.ts",
155
+ "default": "./src/ai/*/index.ts"
156
+ },
157
+ "./agents": {
158
+ "svelte": "./src/agents/index.ts",
159
+ "types": "./src/agents/index.ts",
160
+ "default": "./src/agents/index.ts"
161
+ },
162
+ "./agents/demo.svelte": "./src/agents/demo.svelte"
163
+ },
164
+ "dependencies": {
165
+ "@heyramzi/utils": "^1.3.3",
166
+ "@lucide/svelte": "^1.52.0",
167
+ "clsx": "^2.1.1",
168
+ "d3-scale": "^4.0.2",
169
+ "d3-shape": "^3.2.0",
170
+ "layerchart": "^2.5.1",
171
+ "marked": "^18.1.0",
172
+ "phosphor-svelte": "^3.1.0",
173
+ "tailwind-merge": "^3.7.0",
174
+ "tailwind-variants": "^3.3.1"
175
+ },
176
+ "devDependencies": {
177
+ "@internationalized/date": "^3.12.4",
178
+ "@sveltejs/vite-plugin-svelte": "^7.3.1",
179
+ "@types/d3-scale": "^4.0.9",
180
+ "@types/d3-shape": "^3.2.0",
181
+ "bits-ui": "^2.19.5",
182
+ "jsdom": "^30.1.2",
183
+ "mode-watcher": "^1.1.0",
184
+ "svelte": "^5.57.2",
185
+ "svelte-sonner": "^1.2.1",
186
+ "vite-plus": "^1.0.0",
187
+ "vitest": "^5.0.3"
188
+ },
189
+ "peerDependencies": {
190
+ "@internationalized/date": "^3.12.4",
191
+ "@tabler/icons-svelte-runes": "^3.46.0",
192
+ "bits-ui": "^2.19.5",
193
+ "mode-watcher": "^1.1.0",
194
+ "svelte": "^5.57.2",
195
+ "svelte-sonner": "^1.2.1"
196
+ },
197
+ "peerDependenciesMeta": {
198
+ "mode-watcher": {
199
+ "optional": true
200
+ },
201
+ "svelte-sonner": {
202
+ "optional": true
203
+ },
204
+ "@internationalized/date": {
205
+ "optional": true
206
+ },
207
+ "@tabler/icons-svelte-runes": {
208
+ "optional": true
209
+ }
210
+ },
211
+ "scripts": {
212
+ "test": "vp test run",
213
+ "sync:transitions": "node scripts/sync-transitions.mjs",
214
+ "sync:shadcn": "node scripts/sync-shadcn.mjs",
215
+ "sync": "pnpm sync:transitions && pnpm sync:shadcn",
216
+ "sync:check": "node scripts/sync-transitions.mjs --check && node scripts/sync-shadcn.mjs --check"
217
+ }
6
218
  }
@@ -0,0 +1,113 @@
1
+ /* Shared plumbing for the two upstream sync scripts. `.upstream/` holds the
2
+ * pristine copy each one diffs against. See ../../docs/decisions.md. */
3
+
4
+ import { createHash } from "node:crypto";
5
+ import { mkdir, readFile, rm, writeFile } from "node:fs/promises";
6
+ import { dirname } from "node:path";
7
+
8
+ export const CHECK = process.argv.includes("--check");
9
+
10
+ export function sha256(text) {
11
+ return createHash("sha256").update(text).digest("hex").slice(0, 16);
12
+ }
13
+
14
+ const get = (url) => fetch(url, { headers: { "user-agent": "heyramzi-ui-sync" } });
15
+
16
+ export async function fetchText(url) {
17
+ const res = await get(url);
18
+ if (!res.ok) throw new Error(`${res.status} ${res.statusText} — ${url}`);
19
+ return await res.text();
20
+ }
21
+
22
+ /** null instead of a throw, for an upstream file that may not exist. */
23
+ export async function fetchTextIf(url) {
24
+ const res = await get(url);
25
+ return res.ok ? await res.text() : null;
26
+ }
27
+
28
+ export async function fetchJson(url) {
29
+ return JSON.parse(await fetchText(url));
30
+ }
31
+
32
+ /** Resolve the upstream commit a sync pinned, so the lock names a point in history. */
33
+ export async function githubHeadSha(repo, branch = "main") {
34
+ const res = await fetch(`https://api.github.com/repos/${repo}/commits/${branch}`, {
35
+ headers: { accept: "application/vnd.github.sha", "user-agent": "heyramzi-ui-sync" },
36
+ });
37
+ return res.ok ? (await res.text()).trim() : null;
38
+ }
39
+
40
+ /* Formatting is not divergence: oxfmt reflows prettier wraps and adds
41
+ * its missing trailing comma, so norm strips both before comparing. */
42
+ const norm = (text) =>
43
+ text
44
+ .replace(/,(\s*[)\]}>])/g, "$1")
45
+ .replace(/\s+(\/?>)/g, "$1")
46
+ .replace(/\s+/g, " ")
47
+ .trim();
48
+
49
+ /**
50
+ * Where our copy stands against `base`, the content the last sync vendored, and
51
+ * `next`, what upstream ships now. Both already adapted to this package.
52
+ */
53
+ export function classify(local, base, next) {
54
+ if (local === null) return base === null ? "new" : "dropped";
55
+ if (norm(local) === norm(next)) return "current";
56
+ if (base !== null && norm(local) === norm(base)) return "stale";
57
+ return "diverged";
58
+ }
59
+
60
+ export async function readLock(path) {
61
+ try {
62
+ return JSON.parse(await readFile(path, "utf8"));
63
+ } catch {
64
+ return null;
65
+ }
66
+ }
67
+
68
+ export async function writeFileDeep(path, content) {
69
+ await mkdir(dirname(path), { recursive: true });
70
+ await writeFile(path, content);
71
+ }
72
+
73
+ export async function removeDeep(path) {
74
+ await rm(path, { recursive: true, force: true });
75
+ }
76
+
77
+ /** Run `fn` over `items` with at most `limit` in flight. */
78
+ export async function mapLimit(items, limit, fn) {
79
+ const out = Array.from({ length: items.length });
80
+ let next = 0;
81
+ await Promise.all(
82
+ Array.from({ length: Math.min(limit, items.length) }, async () => {
83
+ while (next < items.length) {
84
+ const i = next++;
85
+ out[i] = await fn(items[i], i);
86
+ }
87
+ }),
88
+ );
89
+ return out;
90
+ }
91
+
92
+ const BULLET = { added: "+", changed: "~", removed: "-", unported: "!", synced: "*", port: "!" };
93
+
94
+ /** Print the buckets and exit non-zero under --check when any is non-empty. */
95
+ export function report({ title, buckets, unchanged, footer, trailer }) {
96
+ const lines = [];
97
+ for (const [kind, items] of Object.entries(buckets)) {
98
+ for (const item of items) lines.push(` ${BULLET[kind] ?? "?"} ${kind.padEnd(9)} ${item}`);
99
+ }
100
+ console.log(`\n${title}`);
101
+ console.log(lines.length ? lines.join("\n") : " = in sync");
102
+ console.log(` ${unchanged} unchanged${footer ? `, ${footer}` : ""}`);
103
+
104
+ if (!lines.length) return 0;
105
+ if (CHECK) {
106
+ console.error("\n --check: upstream moved. Run the sync without --check and port the diff.");
107
+ return 1;
108
+ }
109
+ console.log(
110
+ `\n ${trailer ?? "Vendored copies updated. Review `git diff .upstream/` and port by hand."}`,
111
+ );
112
+ return 0;
113
+ }
@@ -0,0 +1,39 @@
1
+ // Rewrites every `#src/` and `#scripts/` specifier to a relative path, in place, before publish.
2
+ // WHY: Vite cannot resolve a package's own `#` imports inside node_modules (ai-doc/references/publishing-packages.md).
3
+ // It edits the source tree, so only scripts/release.sh runs it, right before `pnpm publish`, and restores the tree after.
4
+ // It is not a `build` script: `pnpm -r build` would rewrite the working tree.
5
+ import { readdir, readFile, writeFile } from "node:fs/promises";
6
+ import { dirname, join, relative, resolve } from "node:path";
7
+
8
+ const root = resolve(import.meta.dirname, "..");
9
+ const targets = { src: join(root, "src"), scripts: join(root, "scripts") };
10
+ const TEXT = /\.(ts|js|mjs|svelte|css)$/;
11
+ const SPECIFIER = /(["'`])#(src|scripts)\/([^"'`]+)\1/g;
12
+
13
+ async function* walk(dir) {
14
+ for (const entry of await readdir(dir, { withFileTypes: true })) {
15
+ if (entry.name === "node_modules") continue;
16
+ const full = join(dir, entry.name);
17
+ if (entry.isDirectory()) yield* walk(full);
18
+ else if (TEXT.test(entry.name)) yield full;
19
+ }
20
+ }
21
+
22
+ let files = 0;
23
+ let specifiers = 0;
24
+ for (const dir of Object.values(targets)) {
25
+ for await (const file of walk(dir)) {
26
+ const text = await readFile(file, "utf8");
27
+ const next = text.replace(SPECIFIER, (_, quote, base, rest) => {
28
+ specifiers++;
29
+ let rel = relative(dirname(file), join(targets[base], rest));
30
+ if (!rel.startsWith(".")) rel = `./${rel}`;
31
+ return `${quote}${rel}${quote}`;
32
+ });
33
+ if (next !== text) {
34
+ await writeFile(file, next);
35
+ files++;
36
+ }
37
+ }
38
+ }
39
+ console.log(`relative-imports: ${specifiers} specifiers in ${files} files`);