@rimelight/ui 0.0.31 → 0.0.33

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 (462) hide show
  1. package/README.md +157 -30
  2. package/package.json +105 -108
  3. package/src/components/TableOfContents.astro +44 -43
  4. package/src/components/astro/RLA3dHover.astro +23 -0
  5. package/src/components/astro/RLAAlert.astro +93 -60
  6. package/src/components/astro/RLAApp.astro +23 -0
  7. package/src/components/astro/RLAAspectRatio.astro +27 -23
  8. package/src/components/astro/RLAAudio.astro +23 -0
  9. package/src/components/astro/RLAAvatar.astro +68 -56
  10. package/src/components/astro/RLAAvatarGroup.astro +23 -19
  11. package/src/components/astro/RLABadge.astro +34 -31
  12. package/src/components/astro/RLABanner.astro +23 -0
  13. package/src/components/astro/RLABlogPost.astro +7 -0
  14. package/src/components/astro/RLABlogPosts.astro +9 -0
  15. package/src/components/astro/RLABreadcrumb.astro +48 -44
  16. package/src/components/astro/RLABrowserMockup.astro +23 -0
  17. package/src/components/astro/RLAButton.astro +54 -3
  18. package/src/components/astro/RLACalendar.astro +23 -0
  19. package/src/components/astro/RLACard.astro +78 -74
  20. package/src/components/astro/RLACarousel.astro +75 -71
  21. package/src/components/astro/RLAChangelog.astro +23 -0
  22. package/src/components/astro/RLAChart.astro +33 -9
  23. package/src/components/astro/RLAChat.astro +23 -0
  24. package/src/components/astro/RLAChatMessage.astro +23 -0
  25. package/src/components/astro/RLAChatMessages.astro +23 -0
  26. package/src/components/astro/RLAChatPalette.astro +23 -0
  27. package/src/components/astro/RLAChatPrompt.astro +23 -0
  28. package/src/components/astro/RLAChatPromptSubmit.astro +23 -0
  29. package/src/components/astro/RLAChatReasoning.astro +23 -0
  30. package/src/components/astro/RLAChatShimmer.astro +23 -0
  31. package/src/components/astro/RLAChatTool.astro +23 -0
  32. package/src/components/astro/RLACheckbox.astro +3 -1
  33. package/src/components/astro/RLAChip.astro +51 -0
  34. package/src/components/astro/RLAColorPicker.astro +23 -0
  35. package/src/components/astro/RLACommandPalette.astro +23 -0
  36. package/src/components/astro/RLACompare.astro +23 -0
  37. package/src/components/astro/{RLAAlertDialog.astro → RLAConfirm.astro} +117 -86
  38. package/src/components/astro/RLAContainer.astro +23 -0
  39. package/src/components/astro/RLAContextMenu.astro +23 -0
  40. package/src/components/astro/RLADashboardGroup.astro +23 -0
  41. package/src/components/astro/RLADashboardNavbar.astro +23 -0
  42. package/src/components/astro/RLADashboardPanel.astro +23 -0
  43. package/src/components/astro/RLADashboardResizeHandle.astro +23 -0
  44. package/src/components/astro/RLADashboardSearch.astro +23 -0
  45. package/src/components/astro/RLADashboardSearchButton.astro +23 -0
  46. package/src/components/astro/RLADashboardSidebar.astro +23 -0
  47. package/src/components/astro/RLADashboardSidebarCollapse.astro +23 -0
  48. package/src/components/astro/RLADashboardSidebarToggle.astro +23 -0
  49. package/src/components/astro/RLADashboardToolbar.astro +23 -0
  50. package/src/components/astro/RLADock.astro +23 -0
  51. package/src/{plugins/starlightAddons/components/Gamepad.astro → components/astro/RLADocsGamepad.astro} +178 -180
  52. package/src/{plugins/starlightAddons/components/Keyboard.astro → components/astro/RLADocsKeyboard.astro} +1 -3
  53. package/src/{plugins/starlightAddons/PackageManagers.astro → components/astro/RLADocsPackageManagers.astro} +28 -14
  54. package/src/components/astro/RLADrawer.astro +78 -74
  55. package/src/components/astro/RLADropdownMenu.astro +1 -1
  56. package/src/components/astro/RLAEditor.astro +23 -0
  57. package/src/components/astro/RLAEmpty.astro +23 -0
  58. package/src/components/astro/RLAError.astro +23 -0
  59. package/src/components/astro/{RLAInputGroup.astro → RLAFieldGroup.astro} +7 -7
  60. package/src/components/astro/RLAFieldset.astro +23 -0
  61. package/src/components/astro/{RLADropzone.astro → RLAFileUpload.astro} +14 -14
  62. package/src/components/astro/RLAFloatingAction.astro +23 -0
  63. package/src/components/astro/RLAFooter.astro +39 -35
  64. package/src/components/astro/RLAForm.astro +23 -0
  65. package/src/components/astro/{RLAField.astro → RLAFormField.astro} +7 -7
  66. package/src/components/astro/RLAGallery.astro +23 -0
  67. package/src/components/astro/RLAGrid.astro +39 -0
  68. package/src/components/astro/RLAHead.astro +25 -9
  69. package/src/components/astro/RLAHeader.astro +59 -107
  70. package/src/components/astro/RLAHoverCard.astro +35 -31
  71. package/src/components/astro/RLAIcon.astro +31 -27
  72. package/src/components/astro/RLAImage.astro +209 -0
  73. package/src/components/astro/RLAInput.astro +3 -1
  74. package/src/components/astro/RLAInputDate.astro +23 -0
  75. package/src/components/astro/{RLACombobox.astro → RLAInputMenu.astro} +22 -22
  76. package/src/components/astro/RLAInputNumber.astro +23 -0
  77. package/src/components/astro/RLAInputTags.astro +23 -0
  78. package/src/components/astro/RLAInputTime.astro +23 -0
  79. package/src/components/astro/RLAKbd.astro +32 -22
  80. package/src/components/astro/RLAKnob.astro +23 -0
  81. package/src/components/astro/RLALabel.astro +27 -23
  82. package/src/components/astro/RLALink.astro +23 -0
  83. package/src/components/astro/RLALinkGroup.astro +38 -0
  84. package/src/components/astro/RLAListbox.astro +23 -0
  85. package/src/components/astro/RLALocaleSelector.astro +5 -1
  86. package/src/components/astro/RLALogo.astro +90 -56
  87. package/src/components/astro/RLAMain.astro +8 -2
  88. package/src/components/astro/RLAMarquee.astro +36 -32
  89. package/src/components/astro/RLAMegamenu.astro +23 -0
  90. package/src/components/astro/RLAMeter.astro +23 -0
  91. package/src/components/astro/{RLADialog.astro → RLAModal.astro} +99 -95
  92. package/src/components/astro/RLANavigationMenu.astro +137 -136
  93. package/src/components/astro/RLAPage.astro +23 -0
  94. package/src/components/astro/RLAPageAside.astro +23 -0
  95. package/src/components/astro/RLAPageBody.astro +23 -0
  96. package/src/components/astro/RLAPageHeader.astro +23 -0
  97. package/src/components/astro/{RLASection.astro → RLAPageSection.astro} +10 -6
  98. package/src/components/astro/RLAPagination.astro +98 -94
  99. package/src/components/astro/RLAPassword.astro +23 -0
  100. package/src/components/astro/RLAPhoneMockup.astro +23 -0
  101. package/src/components/astro/RLAPinInput.astro +23 -0
  102. package/src/components/astro/RLAPlaceholder.astro +45 -41
  103. package/src/components/astro/RLAPopover.astro +35 -31
  104. package/src/components/astro/RLAPost.astro +65 -0
  105. package/src/components/astro/RLAPosts.astro +23 -0
  106. package/src/components/astro/RLAPricingPlan.astro +23 -0
  107. package/src/components/astro/RLAPricingTable.astro +23 -0
  108. package/src/components/astro/RLAProgress.astro +3 -1
  109. package/src/components/astro/RLAProse.astro +23 -0
  110. package/src/components/astro/RLAQrCode.astro +23 -0
  111. package/src/components/astro/RLARadioGroup.astro +23 -0
  112. package/src/components/astro/RLARating.astro +23 -0
  113. package/src/components/astro/RLAScrollArea.astro +1 -1
  114. package/src/components/astro/RLAScrollToTop.astro +172 -159
  115. package/src/components/astro/RLASeparator.astro +78 -27
  116. package/src/components/astro/RLASidebar.astro +212 -135
  117. package/src/components/astro/RLASkeleton.astro +24 -20
  118. package/src/components/astro/{RLASheet.astro → RLASlideover.astro} +76 -72
  119. package/src/components/astro/RLASlider.astro +8 -3
  120. package/src/components/astro/RLASpeedDial.astro +23 -0
  121. package/src/components/astro/RLASpinner.astro +3 -1
  122. package/src/components/astro/{RLAResizable.astro → RLASplitter.astro} +7 -7
  123. package/src/components/astro/RLASpoiler.astro +23 -0
  124. package/src/components/astro/RLAStepper.astro +23 -0
  125. package/src/components/astro/RLASteps.astro +71 -0
  126. package/src/components/astro/RLAStickySurface.astro +31 -27
  127. package/src/components/astro/RLASwitch.astro +3 -1
  128. package/src/components/astro/RLATableOfContents.astro +23 -0
  129. package/src/components/astro/RLATabs.astro +133 -92
  130. package/src/components/astro/RLAThemeSelector.astro +5 -1
  131. package/src/components/astro/RLATimeline.astro +23 -0
  132. package/src/components/astro/RLATooltip.astro +35 -31
  133. package/src/components/astro/RLATour.astro +23 -0
  134. package/src/components/astro/RLATree.astro +23 -0
  135. package/src/components/astro/RLAUser.astro +23 -0
  136. package/src/components/astro/{RLAEmbedYoutube.astro → RLAVideo.astro} +200 -196
  137. package/src/components/astro/RLAWatermark.astro +23 -0
  138. package/src/components/astro/RLAWindowMockup.astro +23 -0
  139. package/src/components/vue/RLVCheckbox.vue +68 -0
  140. package/src/components/vue/RLVForm.vue +44 -0
  141. package/src/components/vue/RLVFormField.vue +58 -0
  142. package/src/components/vue/RLVInput.vue +93 -0
  143. package/src/components/vue/RLVPost.vue +63 -0
  144. package/src/components/vue/RLVPosts.vue +21 -0
  145. package/src/components/vue/RLVSection.vue +5 -4
  146. package/src/components/vue/RLVToast.vue +68 -0
  147. package/src/components/vue/RLVToaster.vue +29 -0
  148. package/src/composables/index.ts +3 -1
  149. package/src/composables/useHeaderStore.ts +14 -0
  150. package/src/composables/useScrollToTop.ts +62 -62
  151. package/src/composables/useToast.ts +42 -0
  152. package/src/env.d.ts +0 -13
  153. package/src/integrations/ui.ts +199 -143
  154. package/src/plugins/index.ts +2 -5
  155. package/src/plugins/starlightDocsApi/index.ts +272 -265
  156. package/src/presets/defaults.ts +297 -0
  157. package/src/presets/index.ts +637 -256
  158. package/src/styles/index.css +160 -156
  159. package/src/themes/3d-hover.theme.ts +13 -0
  160. package/src/themes/accordion.theme.ts +13 -0
  161. package/src/themes/alert.theme.ts +125 -51
  162. package/src/themes/app.theme.ts +13 -0
  163. package/src/themes/aspect-ratio.theme.ts +13 -0
  164. package/src/themes/audio.theme.ts +13 -0
  165. package/src/themes/avatar-group.theme.ts +12 -0
  166. package/src/themes/avatar.theme.ts +84 -28
  167. package/src/themes/badge.theme.ts +163 -61
  168. package/src/themes/banner.theme.ts +13 -0
  169. package/src/themes/breadcrumb.theme.ts +14 -12
  170. package/src/themes/browser-mockup.theme.ts +13 -0
  171. package/src/themes/button.theme.ts +202 -190
  172. package/src/themes/calendar.theme.ts +13 -0
  173. package/src/themes/card.theme.ts +42 -34
  174. package/src/themes/carousel.theme.ts +30 -28
  175. package/src/themes/changelog.theme.ts +13 -0
  176. package/src/themes/chart.theme.ts +22 -21
  177. package/src/themes/chat-message.theme.ts +13 -0
  178. package/src/themes/chat-messages.theme.ts +13 -0
  179. package/src/themes/chat-palette.theme.ts +13 -0
  180. package/src/themes/chat-prompt-submit.theme.ts +13 -0
  181. package/src/themes/chat-prompt.theme.ts +13 -0
  182. package/src/themes/chat-reasoning.theme.ts +13 -0
  183. package/src/themes/chat-shimmer.theme.ts +13 -0
  184. package/src/themes/chat-tool.theme.ts +13 -0
  185. package/src/themes/chat.theme.ts +13 -0
  186. package/src/themes/checkbox.theme.ts +50 -42
  187. package/src/themes/chip.theme.ts +74 -0
  188. package/src/themes/color-picker.theme.ts +13 -0
  189. package/src/themes/command-palette.theme.ts +13 -0
  190. package/src/themes/compare.theme.ts +13 -0
  191. package/src/themes/confirm.theme.ts +48 -0
  192. package/src/themes/container.theme.ts +13 -0
  193. package/src/themes/context-menu.theme.ts +13 -0
  194. package/src/themes/dashboard-group.theme.ts +13 -0
  195. package/src/themes/dashboard-navbar.theme.ts +13 -0
  196. package/src/themes/dashboard-panel.theme.ts +13 -0
  197. package/src/themes/dashboard-resize-handle.theme.ts +13 -0
  198. package/src/themes/dashboard-search-button.theme.ts +13 -0
  199. package/src/themes/dashboard-search.theme.ts +13 -0
  200. package/src/themes/dashboard-sidebar-collapse.theme.ts +13 -0
  201. package/src/themes/dashboard-sidebar-toggle.theme.ts +13 -0
  202. package/src/themes/dashboard-sidebar.theme.ts +13 -0
  203. package/src/themes/dashboard-toolbar.theme.ts +13 -0
  204. package/src/themes/dock.theme.ts +13 -0
  205. package/src/themes/drawer.theme.ts +61 -44
  206. package/src/themes/{dropdownMenu.theme.ts → dropdown-menu.theme.ts} +29 -27
  207. package/src/themes/editor.theme.ts +13 -0
  208. package/src/themes/empty.theme.ts +13 -0
  209. package/src/themes/error.theme.ts +13 -0
  210. package/src/themes/{inputGroup.theme.ts → field-group.theme.ts} +24 -23
  211. package/src/themes/fieldset.theme.ts +13 -0
  212. package/src/themes/{dropzone.theme.ts → file-upload.theme.ts} +2 -2
  213. package/src/themes/floating-action.theme.ts +13 -0
  214. package/src/themes/footer.theme.ts +30 -27
  215. package/src/themes/{field.theme.ts → form-field.theme.ts} +2 -2
  216. package/src/themes/form.theme.ts +13 -0
  217. package/src/themes/gallery.theme.ts +13 -0
  218. package/src/themes/head.theme.ts +13 -0
  219. package/src/themes/header.theme.ts +46 -43
  220. package/src/themes/hover-card.theme.ts +29 -0
  221. package/src/themes/icon.theme.ts +23 -20
  222. package/src/themes/image.theme.ts +19 -0
  223. package/src/themes/input-date.theme.ts +13 -0
  224. package/src/themes/input-menu.theme.ts +35 -0
  225. package/src/themes/input-number.theme.ts +13 -0
  226. package/src/themes/input-tags.theme.ts +13 -0
  227. package/src/themes/input-time.theme.ts +13 -0
  228. package/src/themes/input.theme.ts +42 -36
  229. package/src/themes/kbd.theme.ts +89 -24
  230. package/src/themes/knob.theme.ts +13 -0
  231. package/src/themes/label.theme.ts +18 -16
  232. package/src/themes/link-group.theme.ts +32 -0
  233. package/src/themes/link.theme.ts +13 -0
  234. package/src/themes/listbox.theme.ts +13 -0
  235. package/src/themes/locale-selector.theme.ts +49 -0
  236. package/src/themes/logo.theme.ts +13 -10
  237. package/src/themes/main.theme.ts +7 -6
  238. package/src/themes/marquee.theme.ts +24 -22
  239. package/src/themes/megamenu.theme.ts +13 -0
  240. package/src/themes/meter.theme.ts +13 -0
  241. package/src/themes/modal.theme.ts +49 -0
  242. package/src/themes/navigation-menu.theme.ts +27 -0
  243. package/src/themes/page-aside.theme.ts +13 -0
  244. package/src/themes/page-body.theme.ts +13 -0
  245. package/src/themes/page-header.theme.ts +13 -0
  246. package/src/themes/page-section.theme.ts +187 -0
  247. package/src/themes/page.theme.ts +13 -0
  248. package/src/themes/pagination.theme.ts +24 -22
  249. package/src/themes/password.theme.ts +13 -0
  250. package/src/themes/phone-mockup.theme.ts +13 -0
  251. package/src/themes/pin-input.theme.ts +14 -0
  252. package/src/themes/placeholder.theme.ts +15 -12
  253. package/src/themes/popover.theme.ts +26 -24
  254. package/src/themes/post.theme.ts +33 -0
  255. package/src/themes/posts.theme.ts +13 -0
  256. package/src/themes/pricing-plan.theme.ts +13 -0
  257. package/src/themes/pricing-table.theme.ts +13 -0
  258. package/src/themes/progress.theme.ts +38 -26
  259. package/src/themes/prose.theme.ts +13 -0
  260. package/src/themes/qr-code.theme.ts +13 -0
  261. package/src/themes/quote.theme.ts +13 -0
  262. package/src/themes/radio-group.theme.ts +13 -0
  263. package/src/themes/rating.theme.ts +13 -0
  264. package/src/themes/{scrollArea.theme.ts → scroll-area.theme.ts} +26 -24
  265. package/src/themes/scroll-to-top.theme.ts +52 -46
  266. package/src/themes/select.theme.ts +29 -27
  267. package/src/themes/separator.theme.ts +147 -19
  268. package/src/themes/sidebar.theme.ts +38 -33
  269. package/src/themes/skeleton.theme.ts +21 -20
  270. package/src/themes/slideover.theme.ts +59 -0
  271. package/src/themes/slider.theme.ts +36 -28
  272. package/src/themes/speed-dial.theme.ts +13 -0
  273. package/src/themes/spinner.theme.ts +34 -30
  274. package/src/themes/{resizable.theme.ts → splitter.theme.ts} +23 -22
  275. package/src/themes/spoiler.theme.ts +13 -0
  276. package/src/themes/stepper.theme.ts +13 -0
  277. package/src/themes/sticky-surface.theme.ts +12 -0
  278. package/src/themes/switch.theme.ts +67 -59
  279. package/src/themes/table-of-contents.theme.ts +48 -0
  280. package/src/themes/tabs.theme.ts +52 -44
  281. package/src/themes/textarea.theme.ts +27 -26
  282. package/src/themes/theme-selector.theme.ts +15 -0
  283. package/src/themes/timeline.theme.ts +13 -0
  284. package/src/themes/toast.theme.ts +31 -25
  285. package/src/themes/tooltip.theme.ts +28 -27
  286. package/src/themes/tour.theme.ts +13 -0
  287. package/src/themes/tree.theme.ts +13 -0
  288. package/src/themes/user.theme.ts +13 -0
  289. package/src/themes/video.theme.ts +17 -0
  290. package/src/themes/watermark.theme.ts +13 -0
  291. package/src/themes/window-mockup.theme.ts +13 -0
  292. package/src/types/components/3d-hover.ts +11 -0
  293. package/src/types/components/accordion.ts +1 -1
  294. package/src/types/components/alert.ts +7 -1
  295. package/src/types/components/app.ts +11 -0
  296. package/src/types/components/aspect-ratio.ts +2 -2
  297. package/src/types/components/audio.ts +11 -0
  298. package/src/types/components/avatar-group.ts +11 -0
  299. package/src/types/components/avatar.ts +60 -47
  300. package/src/types/components/badge.ts +8 -2
  301. package/src/types/components/banner.ts +11 -0
  302. package/src/types/components/breadcrumb.ts +2 -2
  303. package/src/types/components/browser-mockup.ts +11 -0
  304. package/src/types/components/button.ts +81 -71
  305. package/src/types/components/calendar.ts +11 -0
  306. package/src/types/components/card.ts +2 -2
  307. package/src/types/components/carousel.ts +2 -2
  308. package/src/types/components/changelog.ts +11 -0
  309. package/src/types/components/chart.ts +2 -2
  310. package/src/types/components/chat-message.ts +11 -0
  311. package/src/types/components/chat-messages.ts +11 -0
  312. package/src/types/components/chat-palette.ts +11 -0
  313. package/src/types/components/chat-prompt-submit.ts +11 -0
  314. package/src/types/components/chat-prompt.ts +11 -0
  315. package/src/types/components/chat-reasoning.ts +11 -0
  316. package/src/types/components/chat-shimmer.ts +11 -0
  317. package/src/types/components/chat-tool.ts +11 -0
  318. package/src/types/components/chat.ts +11 -0
  319. package/src/types/components/checkbox.ts +8 -2
  320. package/src/types/components/chip.ts +17 -0
  321. package/src/types/components/collapsible.ts +2 -2
  322. package/src/types/components/color-picker.ts +11 -0
  323. package/src/types/components/command-palette.ts +11 -0
  324. package/src/types/components/compare.ts +11 -0
  325. package/src/types/components/{alert-dialog.ts → confirm.ts} +2 -2
  326. package/src/types/components/container.ts +17 -0
  327. package/src/types/components/context-menu.ts +11 -0
  328. package/src/types/components/dashboard-group.ts +11 -0
  329. package/src/types/components/dashboard-navbar.ts +11 -0
  330. package/src/types/components/dashboard-panel.ts +11 -0
  331. package/src/types/components/dashboard-resize-handle.ts +11 -0
  332. package/src/types/components/dashboard-search-button.ts +11 -0
  333. package/src/types/components/dashboard-search.ts +11 -0
  334. package/src/types/components/dashboard-sidebar-collapse.ts +11 -0
  335. package/src/types/components/dashboard-sidebar-toggle.ts +11 -0
  336. package/src/types/components/dashboard-sidebar.ts +11 -0
  337. package/src/types/components/dashboard-toolbar.ts +11 -0
  338. package/src/types/components/dock.ts +11 -0
  339. package/src/types/components/drawer.ts +2 -2
  340. package/src/types/components/dropdown-menu.ts +2 -2
  341. package/src/types/components/editor.ts +11 -0
  342. package/src/types/components/empty.ts +11 -0
  343. package/src/types/components/error.ts +11 -0
  344. package/src/types/components/{input-group.ts → field-group.ts} +3 -3
  345. package/src/types/components/fieldset.ts +11 -0
  346. package/src/types/components/{dropzone.ts → file-upload.ts} +4 -4
  347. package/src/types/components/floating-action.ts +11 -0
  348. package/src/types/components/footer.ts +1 -1
  349. package/src/types/components/{field.ts → form-field.ts} +3 -3
  350. package/src/types/components/form.ts +19 -0
  351. package/src/types/components/gallery.ts +11 -0
  352. package/src/types/components/header.ts +1 -1
  353. package/src/types/components/hover-card.ts +2 -2
  354. package/src/types/components/icon.ts +19 -19
  355. package/src/types/components/image.ts +28 -0
  356. package/src/types/components/index.ts +135 -60
  357. package/src/types/components/input-date.ts +11 -0
  358. package/src/types/components/{combobox.ts → input-menu.ts} +43 -43
  359. package/src/types/components/input-number.ts +11 -0
  360. package/src/types/components/{native-select.ts → input-pin.ts} +35 -39
  361. package/src/types/components/input-tags.ts +11 -0
  362. package/src/types/components/input-time.ts +11 -0
  363. package/src/types/components/input.ts +8 -2
  364. package/src/types/components/kbd.ts +2 -2
  365. package/src/types/components/knob.ts +11 -0
  366. package/src/types/components/label.ts +2 -2
  367. package/src/types/components/link-group.ts +23 -0
  368. package/src/types/components/link.ts +1 -1
  369. package/src/types/components/listbox.ts +11 -0
  370. package/src/types/components/locale-selector.ts +33 -0
  371. package/src/types/components/logo.ts +31 -27
  372. package/src/types/components/main.ts +15 -15
  373. package/src/types/components/marquee.ts +2 -2
  374. package/src/types/components/megamenu.ts +11 -0
  375. package/src/types/components/meter.ts +11 -0
  376. package/src/types/components/{dialog.ts → modal.ts} +39 -39
  377. package/src/types/components/navigation-menu.ts +54 -27
  378. package/src/types/components/page-aside.ts +11 -0
  379. package/src/types/components/page-body.ts +11 -0
  380. package/src/types/components/page-header.ts +11 -0
  381. package/src/types/components/{section.ts → page-section.ts} +2 -2
  382. package/src/types/components/page.ts +11 -0
  383. package/src/types/components/pagination.ts +2 -2
  384. package/src/types/components/password.ts +11 -0
  385. package/src/types/components/phone-mockup.ts +5 -0
  386. package/src/types/components/pin-input.ts +11 -0
  387. package/src/types/components/placeholder.ts +1 -1
  388. package/src/types/components/popover.ts +23 -23
  389. package/src/types/components/post.ts +35 -0
  390. package/src/types/components/posts.ts +11 -0
  391. package/src/types/components/pricing-plan.ts +11 -0
  392. package/src/types/components/pricing-table.ts +11 -0
  393. package/src/types/components/progress.ts +33 -27
  394. package/src/types/components/prose.ts +11 -0
  395. package/src/types/components/qr-code.ts +11 -0
  396. package/src/types/components/quote.ts +11 -0
  397. package/src/types/components/radio-group.ts +11 -0
  398. package/src/types/components/rating.ts +11 -0
  399. package/src/types/components/scroll-area.ts +23 -23
  400. package/src/types/components/scroll-to-top.ts +7 -1
  401. package/src/types/components/select.ts +2 -2
  402. package/src/types/components/separator.ts +19 -19
  403. package/src/types/components/sidebar.ts +72 -36
  404. package/src/types/components/skeleton.ts +2 -2
  405. package/src/types/components/{sheet.ts → slideover.ts} +31 -31
  406. package/src/types/components/slider.ts +8 -2
  407. package/src/types/components/speed-dial.ts +11 -0
  408. package/src/types/components/spinner.ts +25 -19
  409. package/src/types/components/{resizable.ts → splitter.ts} +19 -19
  410. package/src/types/components/spoiler.ts +11 -0
  411. package/src/types/components/stepper.ts +11 -0
  412. package/src/types/components/sticky-surface.ts +19 -19
  413. package/src/types/components/switch.ts +41 -35
  414. package/src/types/components/table-of-contents.ts +17 -0
  415. package/src/types/components/table.ts +2 -2
  416. package/src/types/components/tabs.ts +2 -2
  417. package/src/types/components/textarea.ts +2 -2
  418. package/src/types/components/theme-selector.ts +15 -0
  419. package/src/types/components/timeline.ts +11 -0
  420. package/src/types/components/toast.ts +2 -2
  421. package/src/types/components/tooltip.ts +23 -23
  422. package/src/types/components/tour.ts +11 -0
  423. package/src/types/components/tree.ts +11 -0
  424. package/src/types/components/user.ts +11 -0
  425. package/src/types/components/{embed-youtube.ts → video.ts} +2 -2
  426. package/src/types/components/watermark.ts +11 -0
  427. package/src/types/components/window-mockup.ts +11 -0
  428. package/src/types/index.ts +2 -1
  429. package/src/types/theme.ts +1 -0
  430. package/src/utils/docs.ts +189 -0
  431. package/src/utils/headerStack.ts +95 -88
  432. package/src/utils/index.ts +5 -4
  433. package/src/components/astro/RLANativeSelect.astro +0 -51
  434. package/src/components/astro/RLAToggle.astro +0 -38
  435. package/src/components/astro/RLAToggleGroup.astro +0 -30
  436. package/src/integrations/vue-entrypoint.ts +0 -6
  437. package/src/nuxt.ts +0 -125
  438. package/src/plugins/starlightAddons/PageTitle.astro +0 -113
  439. package/src/plugins/starlightAddons/index.ts +0 -58
  440. package/src/plugins/starlightAddons/starlight.d.ts +0 -6
  441. package/src/preset.ts +0 -393
  442. package/src/themes/alertDialog.theme.ts +0 -33
  443. package/src/themes/aspectRatio.theme.ts +0 -11
  444. package/src/themes/avatarGroup.theme.ts +0 -10
  445. package/src/themes/combobox.theme.ts +0 -28
  446. package/src/themes/dialog.theme.ts +0 -37
  447. package/src/themes/embedYoutube.theme.ts +0 -14
  448. package/src/themes/hoverCard.theme.ts +0 -27
  449. package/src/themes/localeSelector.theme.ts +0 -50
  450. package/src/themes/nativeSelect.theme.ts +0 -24
  451. package/src/themes/navigationMenu.theme.ts +0 -19
  452. package/src/themes/section.theme.ts +0 -186
  453. package/src/themes/sheet.theme.ts +0 -43
  454. package/src/themes/stickySurface.theme.ts +0 -10
  455. package/src/themes/themeSelector.theme.ts +0 -16
  456. package/src/themes/toggle.theme.ts +0 -42
  457. package/src/themes/toggleGroup.theme.ts +0 -21
  458. package/src/types/components/localeSelector.ts +0 -33
  459. package/src/types/components/navigation.ts +0 -34
  460. package/src/types/components/themeSelector.ts +0 -15
  461. package/src/types/components/toggle-group.ts +0 -23
  462. package/src/types/components/toggle.ts +0 -27
@@ -1,22 +1,23 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- export const createResizableTheme = () =>
4
- defineTheme({
5
- slots: ["root", "panel", "handle"],
6
- base: {
7
- root: "flex w-full h-full",
8
- panel: "overflow-auto transition-all",
9
- handle: "flex items-center justify-center bg-border hover:bg-primary/50 transition-colors cursor-col-resize select-none"
10
- },
11
- variants: {
12
- direction: {
13
- horizontal: { root: "flex-row", handle: "w-1.5 h-full cursor-col-resize" },
14
- vertical: { root: "flex-col", handle: "h-1.5 w-full cursor-row-resize" }
15
- }
16
- },
17
- defaultVariants: {
18
- direction: "horizontal"
19
- }
20
- })
21
-
22
- export default createResizableTheme()
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createSplitterTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "panel", "handle"],
6
+ base: {
7
+ root: "flex w-full h-full",
8
+ panel: "overflow-auto transition-all",
9
+ handle:
10
+ "flex items-center justify-center bg-border hover:bg-primary/50 transition-colors cursor-col-resize select-none"
11
+ },
12
+ variants: {
13
+ direction: {
14
+ horizontal: { root: "flex-row", handle: "w-1.5 h-full cursor-col-resize" },
15
+ vertical: { root: "flex-col", handle: "h-1.5 w-full cursor-row-resize" }
16
+ }
17
+ },
18
+ defaultVariants: {
19
+ direction: "horizontal"
20
+ }
21
+ })
22
+
23
+ export default createSplitterTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createSpoilerTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createSpoilerTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createStepperTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createStepperTheme()
@@ -0,0 +1,12 @@
1
+ import { defaultColors } from "../presets/defaults"
2
+ import { defineTheme } from "../utils/defineTheme"
3
+
4
+ export const createStickySurfaceTheme = (colors: string[] = defaultColors) =>
5
+ defineTheme({
6
+ slots: ["root"],
7
+ base: {
8
+ root: "sticky top-0 self-start transition-all duration-300"
9
+ }
10
+ })
11
+
12
+ export default createStickySurfaceTheme()
@@ -1,59 +1,67 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- const defaultColors = ["primary", "secondary", "info", "success", "warning", "error"]
4
-
5
- export const createSwitchTheme = (colors: string[] = defaultColors) =>
6
- defineTheme({
7
- slots: ["root", "input", "track", "thumb", "label"],
8
- base: {
9
- root: "inline-flex items-center gap-2 cursor-pointer select-none",
10
- input: "absolute opacity-0 size-0 pointer-events-none peer",
11
- track: [
12
- "inline-flex h-5 w-9 shrink-0 items-center rounded-full border-2 border-transparent bg-muted transition-all focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
13
- "peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
14
- ],
15
- thumb: "pointer-events-none block size-4 rounded-full bg-background shadow-lg ring-0 transition-transform duration-200 translate-x-0",
16
- label: "text-sm text-foreground leading-none"
17
- },
18
- variants: {
19
- color: Object.fromEntries(colors.map((color) => [
20
- color,
21
- {
22
- track: `peer-checked:bg-${color}-500 focus-within:ring-${color}-500/50`
23
- }
24
- ])),
25
- size: {
26
- sm: { track: "h-4 w-7", thumb: "size-3", label: "text-xs" },
27
- md: { track: "h-5 w-9", thumb: "size-4", label: "text-sm" },
28
- lg: { track: "h-6 w-11", thumb: "size-5", label: "text-base" }
29
- },
30
- checked: {
31
- true: { thumb: "translate-x-full" },
32
- false: { thumb: "translate-x-0" }
33
- }
34
- },
35
- compoundVariants: [
36
- {
37
- size: "sm",
38
- checked: true,
39
- classNames: { thumb: "translate-x-3" }
40
- },
41
- {
42
- size: "md",
43
- checked: true,
44
- classNames: { thumb: "translate-x-4" }
45
- },
46
- {
47
- size: "lg",
48
- checked: true,
49
- classNames: { thumb: "translate-x-5" }
50
- }
51
- ],
52
- defaultVariants: {
53
- color: "primary",
54
- size: "md",
55
- checked: false
56
- }
57
- })
58
-
59
- export default createSwitchTheme()
1
+ import { defaultColors } from "../presets/defaults"
2
+ import { defineTheme } from "../utils/defineTheme"
3
+
4
+ export const createSwitchTheme = (colors: string[] = defaultColors) =>
5
+ defineTheme({
6
+ slots: ["root", "input", "track", "thumb", "label"],
7
+ base: {
8
+ root: "inline-flex items-center gap-2 cursor-pointer select-none",
9
+ input: "absolute opacity-0 size-0 pointer-events-none peer",
10
+ track: [
11
+ "inline-flex h-5 w-9 shrink-0 items-center rounded-full border-2 border-transparent bg-muted transition-all focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
12
+ "peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
13
+ ],
14
+ thumb:
15
+ "pointer-events-none block size-4 rounded-full bg-background shadow-lg ring-0 transition-transform duration-200 translate-x-0",
16
+ label: "text-sm text-foreground leading-none"
17
+ },
18
+ variants: {
19
+ color: Object.fromEntries(
20
+ colors.map((color) => [
21
+ color,
22
+ {
23
+ root: "rl-color-" + color,
24
+ track: `peer-checked:bg-[var(--rl-bg)] focus-within:ring-[var(--rl-ring)]/50`
25
+ }
26
+ ])
27
+ ),
28
+ size: {
29
+ sm: { track: "h-4 w-7", thumb: "size-3", label: "text-xs" },
30
+ md: { track: "h-5 w-9", thumb: "size-4", label: "text-sm" },
31
+ lg: { track: "h-6 w-11", thumb: "size-5", label: "text-base" }
32
+ },
33
+ checked: {
34
+ true: { thumb: "translate-x-full" },
35
+ false: { thumb: "translate-x-0" }
36
+ },
37
+ theme: {
38
+ flat: { root: "rl-flat" },
39
+ light: { root: "rl-light" },
40
+ dark: { root: "rl-dark" }
41
+ }
42
+ },
43
+ compoundVariants: [
44
+ {
45
+ size: "sm",
46
+ checked: true,
47
+ classNames: { thumb: "translate-x-3" }
48
+ },
49
+ {
50
+ size: "md",
51
+ checked: true,
52
+ classNames: { thumb: "translate-x-4" }
53
+ },
54
+ {
55
+ size: "lg",
56
+ checked: true,
57
+ classNames: { thumb: "translate-x-5" }
58
+ }
59
+ ],
60
+ defaultVariants: {
61
+ color: "primary",
62
+ size: "md",
63
+ checked: false
64
+ }
65
+ })
66
+
67
+ export default createSwitchTheme()
@@ -0,0 +1,48 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTableOfContentsTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "media", "header", "title", "description", "content", "footer", "overlay"],
6
+ base: {
7
+ root: "sticky top-(--ui-header-height) z-10 bg-default/75 lg:bg-[initial] backdrop-blur -mx-4 px-4 sm:px-6 sm:-mx-6 lg:ms-0 overflow-y-auto max-h-[calc(100vh-var(--ui-header-height))]",
8
+ container:
9
+ "pt-4 sm:pt-6 pb-2.5 sm:pb-4.5 lg:py-8 border-b border-dashed border-default lg:border-0 flex flex-col",
10
+ top: "",
11
+ bottom: "hidden lg:flex lg:flex-col gap-6",
12
+ trigger:
13
+ "group text-sm font-semibold flex-1 flex items-center gap-1.5 py-1.5 -mt-1.5 focus-visible:outline-primary",
14
+ title: "truncate",
15
+ trailing: "ms-auto inline-flex gap-1.5 items-center",
16
+ trailingIcon:
17
+ "size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-180 lg:hidden",
18
+ content:
19
+ "relative data-[state=open]:animate-[collapsible-down_200ms_ease-out] data-[state=closed]:animate-[collapsible-up_200ms_ease-out] overflow-hidden focus:outline-none",
20
+ list: "min-w-0",
21
+ listWithChildren: "ms-3",
22
+ item: "min-w-0",
23
+ itemWithChildren: "",
24
+ link: "group relative text-sm flex items-center focus-visible:outline-primary py-1",
25
+ linkText: "truncate",
26
+ indicator: "",
27
+ indicatorLine: "",
28
+ indicatorActive: ""
29
+ },
30
+ variants: {
31
+ interactive: {
32
+ true: {
33
+ root: "hover:shadow-md hover:-translate-y-0.5 cursor-pointer hover:border-primary/30"
34
+ },
35
+ false: { root: "" }
36
+ },
37
+ overlay: {
38
+ true: { root: "relative aspect-square", content: "absolute inset-0 z-10" },
39
+ false: { root: "" }
40
+ }
41
+ },
42
+ defaultVariants: {
43
+ interactive: false,
44
+ overlay: false
45
+ }
46
+ })
47
+
48
+ export default createTableOfContentsTheme()
@@ -1,44 +1,52 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- export const createTabsTheme = () =>
4
- defineTheme({
5
- slots: ["root", "list", "trigger", "content"],
6
- base: {
7
- root: "w-full flex flex-col gap-4",
8
- list: "inline-flex items-center justify-start rounded-md bg-muted p-1 text-muted-foreground",
9
- trigger: "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:text-foreground cursor-pointer",
10
- content: "mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
11
- },
12
- variants: {
13
- variant: {
14
- solid: {
15
- list: "bg-muted p-1 rounded-lg",
16
- trigger: "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm"
17
- },
18
- underline: {
19
- list: "bg-transparent border-b border-border rounded-none p-0 gap-4",
20
- trigger: "rounded-none border-b-2 border-transparent px-1 pb-3 pt-2 data-[state=active]:border-primary data-[state=active]:text-foreground hover:border-muted-foreground/30"
21
- },
22
- pills: {
23
- list: "bg-transparent p-0 gap-2",
24
- trigger: "rounded-full px-4 py-1.5 data-[state=active]:bg-primary data-[state=active]:text-white"
25
- }
26
- },
27
- orientation: {
28
- horizontal: { root: "flex-col", list: "w-full" },
29
- vertical: { root: "flex-row gap-6", list: "flex-col items-stretch h-full w-48 border-r border-border rounded-none bg-transparent" }
30
- },
31
- size: {
32
- sm: { trigger: "text-xs px-2.5 py-1" },
33
- md: { trigger: "text-sm px-3.5 py-1.5" },
34
- lg: { trigger: "text-base px-4.5 py-2" }
35
- }
36
- },
37
- defaultVariants: {
38
- variant: "solid",
39
- orientation: "horizontal",
40
- size: "md"
41
- }
42
- })
43
-
44
- export default createTabsTheme()
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTabsTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "list", "trigger", "content"],
6
+ base: {
7
+ root: "w-full flex flex-col gap-4",
8
+ list: "inline-flex items-center justify-start rounded-md bg-muted p-1 text-muted-foreground",
9
+ trigger:
10
+ "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 hover:text-foreground cursor-pointer",
11
+ content:
12
+ "mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
13
+ },
14
+ variants: {
15
+ variant: {
16
+ solid: {
17
+ list: "bg-muted p-1 rounded-lg",
18
+ trigger:
19
+ "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm"
20
+ },
21
+ underline: {
22
+ list: "bg-transparent border-b border-border rounded-none p-0 gap-4",
23
+ trigger:
24
+ "rounded-none border-b-2 border-transparent px-1 pb-3 pt-2 data-[state=active]:border-primary data-[state=active]:text-foreground hover:border-muted-foreground/30"
25
+ },
26
+ pills: {
27
+ list: "bg-transparent p-0 gap-2",
28
+ trigger:
29
+ "rounded-full px-4 py-1.5 data-[state=active]:bg-primary data-[state=active]:text-white"
30
+ }
31
+ },
32
+ orientation: {
33
+ horizontal: { root: "flex-col", list: "w-full" },
34
+ vertical: {
35
+ root: "flex-row gap-6",
36
+ list: "flex-col items-stretch h-full w-48 border-r border-border rounded-none bg-transparent"
37
+ }
38
+ },
39
+ size: {
40
+ sm: { trigger: "text-xs px-2.5 py-1" },
41
+ md: { trigger: "text-sm px-3.5 py-1.5" },
42
+ lg: { trigger: "text-base px-4.5 py-2" }
43
+ }
44
+ },
45
+ defaultVariants: {
46
+ variant: "solid",
47
+ orientation: "horizontal",
48
+ size: "md"
49
+ }
50
+ })
51
+
52
+ export default createTabsTheme()
@@ -1,26 +1,27 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- export const createTextareaTheme = () =>
4
- defineTheme({
5
- slots: ["root", "textarea"],
6
- base: {
7
- root: "relative flex items-center w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
8
- textarea: "w-full bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 min-h-[80px]"
9
- },
10
- variants: {
11
- size: {
12
- sm: { textarea: "py-1.5 text-xs min-h-[60px]" },
13
- md: { textarea: "py-2 text-sm min-h-[80px]" },
14
- lg: { textarea: "py-2.5 text-base min-h-[100px]" }
15
- },
16
- error: {
17
- true: { root: "border-error-500 focus-within:ring-error-500/50" }
18
- }
19
- },
20
- defaultVariants: {
21
- size: "md",
22
- error: false
23
- }
24
- })
25
-
26
- export default createTextareaTheme()
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTextareaTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "textarea"],
6
+ base: {
7
+ root: "relative flex items-center w-full rounded-md border border-input bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
8
+ textarea:
9
+ "w-full bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 min-h-[80px]"
10
+ },
11
+ variants: {
12
+ size: {
13
+ sm: { textarea: "py-1.5 text-xs min-h-[60px]" },
14
+ md: { textarea: "py-2 text-sm min-h-[80px]" },
15
+ lg: { textarea: "py-2.5 text-base min-h-[100px]" }
16
+ },
17
+ error: {
18
+ true: { root: "border-error-500 focus-within:ring-error-500/50" }
19
+ }
20
+ },
21
+ defaultVariants: {
22
+ size: "md",
23
+ error: false
24
+ }
25
+ })
26
+
27
+ export default createTextareaTheme()
@@ -0,0 +1,15 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createThemeSelectorTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "sun", "moon"],
6
+ base: {
7
+ root: "group rounded-full hover:bg-neutral-900/50 transition-colors inline-flex items-center justify-center text-neutral-400 hover:text-white cursor-pointer",
8
+ sun: "hidden dark:block i-lucide-sun w-5 h-5 text-current",
9
+ moon: "dark:hidden i-lucide-moon w-5 h-5 text-current"
10
+ },
11
+ variants: {},
12
+ defaultVariants: {}
13
+ })
14
+
15
+ export default createThemeSelectorTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTimelineTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createTimelineTheme()
@@ -1,25 +1,31 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- export const createToastTheme = () =>
4
- defineTheme({
5
- slots: ["root", "title", "description", "action", "close"],
6
- base: {
7
- root: "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all border-border bg-background text-foreground",
8
- title: "text-sm font-semibold",
9
- description: "text-xs opacity-90",
10
- action: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
11
- close: "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100"
12
- },
13
- variants: {
14
- variant: {
15
- default: { root: "bg-background border-border" },
16
- destructive: { root: "destructive group border-error-500/20 bg-error-500/10 text-error-700 dark:text-error-400" },
17
- success: { root: "border-success-500/20 bg-success-500/10 text-success-700 dark:text-success-400" }
18
- }
19
- },
20
- defaultVariants: {
21
- variant: "default"
22
- }
23
- })
24
-
25
- export default createToastTheme()
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createToastTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "title", "description", "action", "close"],
6
+ base: {
7
+ root: "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all border-border bg-background text-foreground",
8
+ title: "text-sm font-semibold",
9
+ description: "text-xs opacity-90",
10
+ action:
11
+ "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
12
+ close:
13
+ "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100"
14
+ },
15
+ variants: {
16
+ variant: {
17
+ default: { root: "bg-background border-border" },
18
+ destructive: {
19
+ root: "destructive group border-error-500/20 bg-error-500/10 text-error-700 dark:text-error-400"
20
+ },
21
+ success: {
22
+ root: "border-success-500/20 bg-success-500/10 text-success-700 dark:text-success-400"
23
+ }
24
+ }
25
+ },
26
+ defaultVariants: {
27
+ variant: "default"
28
+ }
29
+ })
30
+
31
+ export default createToastTheme()
@@ -1,27 +1,28 @@
1
- import { defineTheme } from "../utils/defineTheme"
2
-
3
- export const tooltipTheme = defineTheme({
4
- slots: ["root", "trigger", "content"],
5
- base: {
6
- root: "relative inline-block group/tooltip",
7
- trigger: "",
8
- content: [
9
- "absolute z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground shadow-md animate-in fade-in-0 zoom-in-95",
10
- "transition-all duration-150 invisible opacity-0 scale-95 origin-center pointer-events-none",
11
- "group-hover/tooltip:visible group-hover/tooltip:opacity-100 group-hover/tooltip:scale-100"
12
- ]
13
- },
14
- variants: {
15
- placement: {
16
- top: { content: "bottom-full left-1/2 -translate-x-1/2 mb-1.5" },
17
- bottom: { content: "top-full left-1/2 -translate-x-1/2 mt-1.5" },
18
- left: { content: "right-full top-1/2 -translate-y-1/2 mr-1.5" },
19
- right: { content: "left-full top-1/2 -translate-y-1/2 ml-1.5" }
20
- }
21
- },
22
- defaultVariants: {
23
- placement: "top"
24
- }
25
- })
26
-
27
- export default tooltipTheme
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTooltipTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "trigger", "content"],
6
+ base: {
7
+ root: "relative inline-block group/tooltip",
8
+ trigger: "",
9
+ content: [
10
+ "absolute z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground shadow-md animate-in fade-in-0 zoom-in-95",
11
+ "transition-all duration-150 invisible opacity-0 scale-95 origin-center pointer-events-none",
12
+ "group-hover/tooltip:visible group-hover/tooltip:opacity-100 group-hover/tooltip:scale-100"
13
+ ]
14
+ },
15
+ variants: {
16
+ placement: {
17
+ top: { content: "bottom-full left-1/2 -translate-x-1/2 mb-1.5" },
18
+ bottom: { content: "top-full left-1/2 -translate-x-1/2 mt-1.5" },
19
+ left: { content: "right-full top-1/2 -translate-y-1/2 mr-1.5" },
20
+ right: { content: "left-full top-1/2 -translate-y-1/2 ml-1.5" }
21
+ }
22
+ },
23
+ defaultVariants: {
24
+ placement: "top"
25
+ }
26
+ })
27
+
28
+ export default createTooltipTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTourTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createTourTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createTreeTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createTreeTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createUserTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createUserTheme()
@@ -0,0 +1,17 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createVideoTheme = () =>
4
+ defineTheme({
5
+ slots: ["root", "trigger", "image", "icon"],
6
+ base: {
7
+ root: "relative aspect-video h-full w-full cursor-pointer overflow-hidden",
8
+ trigger: "group absolute inset-0 aspect-video h-full w-full overflow-hidden",
9
+ image: "h-full w-full object-cover",
10
+ icon: "absolute inset-0 m-auto h-24 w-24 text-white opacity-75 transition-opacity group-hover:opacity-100"
11
+ },
12
+ variants: {},
13
+ compoundVariants: [],
14
+ defaultVariants: {}
15
+ })
16
+
17
+ export default createVideoTheme()
@@ -0,0 +1,13 @@
1
+ import { defineTheme } from "../utils/defineTheme"
2
+
3
+ export const createWatermarkTheme = () =>
4
+ defineTheme({
5
+ slots: ["root"],
6
+ base: {
7
+ root: ""
8
+ },
9
+ variants: {},
10
+ defaultVariants: {}
11
+ })
12
+
13
+ export default createWatermarkTheme()