xertica-ui 2.3.0 → 2.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (534) hide show
  1. package/CHANGELOG.md +564 -552
  2. package/README.md +417 -406
  3. package/assets/xertica-logo.svg +37 -37
  4. package/assets/xertica-x-logo.svg +20 -20
  5. package/bin/cli.ts +1244 -1155
  6. package/bin/language-config.ts +358 -361
  7. package/components/assistant/code-block/CodeBlock.tsx +268 -268
  8. package/components/assistant/formatted-document/FormattedDocument.tsx +147 -147
  9. package/components/assistant/modern-chat-input/ModernChatInput.tsx +564 -554
  10. package/components/assistant/xertica-assistant/parts/AssistantCollapsedView.tsx +99 -99
  11. package/components/assistant/xertica-assistant/parts/AssistantConversationList.tsx +104 -106
  12. package/components/assistant/xertica-assistant/parts/AssistantDocumentEditor.tsx +81 -81
  13. package/components/assistant/xertica-assistant/parts/AssistantFeedbackDialog.tsx +88 -78
  14. package/components/assistant/xertica-assistant/parts/AssistantHeader.tsx +75 -75
  15. package/components/assistant/xertica-assistant/parts/AssistantMessageBubble.tsx +564 -560
  16. package/components/assistant/xertica-assistant/parts/AssistantTabBar.tsx +67 -67
  17. package/components/assistant/xertica-assistant/parts/AssistantWelcomeScreen.tsx +103 -103
  18. package/components/assistant/xertica-assistant/use-assistant.ts +615 -615
  19. package/components/assistant/xertica-assistant/xertica-assistant.tsx +611 -613
  20. package/components/blocks/card-patterns/ActivityCard.tsx +100 -100
  21. package/components/blocks/card-patterns/ActivityCardSkeleton.tsx +56 -56
  22. package/components/blocks/card-patterns/FeatureCardSkeleton.tsx +58 -63
  23. package/components/blocks/card-patterns/NotificationCard.tsx +140 -140
  24. package/components/blocks/card-patterns/NotificationCardSkeleton.tsx +81 -81
  25. package/components/blocks/card-patterns/ProfileCard.tsx +112 -114
  26. package/components/blocks/card-patterns/ProfileCardSkeleton.tsx +69 -69
  27. package/components/blocks/card-patterns/ProjectCard.tsx +123 -123
  28. package/components/blocks/card-patterns/ProjectCardSkeleton.tsx +67 -72
  29. package/components/blocks/card-patterns/QuickActionCardSkeleton.tsx +44 -44
  30. package/components/blocks/card-patterns/card-patterns.stories.tsx +594 -594
  31. package/components/blocks/card-patterns/index.ts +29 -29
  32. package/components/brand/language-selector/LanguageSelector.tsx +102 -102
  33. package/components/brand/language-selector/language-selector.stories.tsx +111 -114
  34. package/components/brand/language-selector/language-selector.test.tsx +101 -101
  35. package/components/brand/theme-toggle/ThemeToggle.tsx +74 -70
  36. package/components/brand/xertica-provider/XerticaProvider.tsx +109 -112
  37. package/components/brand/xertica-provider/xertica-provider.mdx +61 -61
  38. package/components/index.ts +86 -90
  39. package/components/layout/sidebar/sidebar.mdx +1 -1
  40. package/components/layout/sidebar/sidebar.tsx +1079 -1073
  41. package/components/media/FloatingMediaWrapper.tsx +371 -371
  42. package/components/media/audio-player/AudioPlayer.tsx +768 -766
  43. package/components/media/video-player/VideoPlayer.tsx +310 -310
  44. package/components/pages/forgot-password-page/ForgotPasswordPage.tsx +1 -1
  45. package/components/pages/home-content/HomeContent.tsx +120 -120
  46. package/components/pages/home-content/home-content.mdx +62 -62
  47. package/components/pages/home-page/HomePage.tsx +78 -74
  48. package/components/pages/home-page/home-page.mdx +53 -53
  49. package/components/pages/login-page/LoginPage.tsx +218 -216
  50. package/components/pages/reset-password-page/ResetPasswordPage.tsx +243 -239
  51. package/components/pages/template-content/TemplateContent.tsx +1354 -1235
  52. package/components/pages/template-content/template-content.mdx +61 -61
  53. package/components/pages/template-page/template-page.mdx +53 -53
  54. package/components/pages/verify-email-page/VerifyEmailPage.tsx +206 -206
  55. package/components/shared/error-boundary.stories.tsx +4 -22
  56. package/components/shared/error-boundary.tsx +1 -5
  57. package/components/shared/error-fallbacks.tsx +4 -8
  58. package/components/ui/accordion/accordion.mdx +8 -8
  59. package/components/ui/alert/alert.mdx +8 -8
  60. package/components/ui/alert-dialog/alert-dialog.mdx +8 -8
  61. package/components/ui/aspect-ratio/aspect-ratio.mdx +8 -8
  62. package/components/ui/assistant-chart/assistant-chart.mdx +8 -8
  63. package/components/ui/avatar/avatar.mdx +8 -8
  64. package/components/ui/badge/badge.mdx +8 -8
  65. package/components/ui/breadcrumb/breadcrumb.mdx +8 -8
  66. package/components/ui/button/button.mdx +8 -8
  67. package/components/ui/calendar/calendar.mdx +8 -8
  68. package/components/ui/card/card.mdx +8 -8
  69. package/components/ui/carousel/carousel.mdx +8 -8
  70. package/components/ui/chart/chart.mdx +8 -8
  71. package/components/ui/checkbox/checkbox.mdx +8 -8
  72. package/components/ui/collapsible/collapsible.mdx +8 -8
  73. package/components/ui/command/command.mdx +8 -8
  74. package/components/ui/context-menu/context-menu.mdx +8 -8
  75. package/components/ui/dialog/dialog.mdx +8 -8
  76. package/components/ui/drawer/drawer.mdx +8 -8
  77. package/components/ui/dropdown-menu/dropdown-menu.mdx +8 -8
  78. package/components/ui/empty/empty.mdx +8 -8
  79. package/components/ui/file-upload/file-upload.mdx +8 -8
  80. package/components/ui/hover-card/hover-card.mdx +8 -8
  81. package/components/ui/input/input.mdx +8 -8
  82. package/components/ui/input-otp/input-otp.mdx +8 -8
  83. package/components/ui/label/label.mdx +8 -8
  84. package/components/ui/map/map.mdx +8 -8
  85. package/components/ui/menubar/menubar.mdx +8 -8
  86. package/components/ui/navigation-menu/navigation-menu.mdx +8 -8
  87. package/components/ui/notification-badge/notification-badge.mdx +8 -8
  88. package/components/ui/pagination/pagination.mdx +8 -8
  89. package/components/ui/popover/popover.mdx +8 -8
  90. package/components/ui/progress/progress.mdx +8 -8
  91. package/components/ui/radio-group/radio-group.mdx +8 -8
  92. package/components/ui/rating/rating.mdx +8 -8
  93. package/components/ui/resizable/resizable.mdx +8 -8
  94. package/components/ui/route-map/route-map.mdx +8 -8
  95. package/components/ui/scroll-area/scroll-area.mdx +8 -8
  96. package/components/ui/search/search.mdx +8 -8
  97. package/components/ui/select/select.mdx +8 -8
  98. package/components/ui/separator/separator.mdx +8 -8
  99. package/components/ui/sheet/sheet.mdx +8 -8
  100. package/components/ui/simple-map/simple-map.mdx +8 -8
  101. package/components/ui/skeleton/skeleton.mdx +8 -8
  102. package/components/ui/slider/slider.mdx +8 -8
  103. package/components/ui/sonner/sonner.mdx +8 -8
  104. package/components/ui/stats-card/index.ts +2 -2
  105. package/components/ui/stats-card/stats-card-skeleton.tsx +60 -62
  106. package/components/ui/stats-card/stats-card.mdx +8 -8
  107. package/components/ui/stats-card/stats-card.stories.tsx +99 -99
  108. package/components/ui/stepper/stepper.mdx +8 -8
  109. package/components/ui/switch/switch.mdx +8 -8
  110. package/components/ui/table/table.mdx +8 -8
  111. package/components/ui/tabs/tabs.mdx +8 -8
  112. package/components/ui/textarea/textarea.mdx +8 -8
  113. package/components/ui/timeline/timeline.mdx +8 -8
  114. package/components/ui/toggle/toggle.mdx +8 -8
  115. package/components/ui/toggle-group/toggle-group.mdx +8 -8
  116. package/components/ui/tooltip/tooltip.mdx +8 -8
  117. package/components/ui/tree-view/tree-view.mdx +8 -8
  118. package/components.json +892 -892
  119. package/contexts/AuthContext.tsx +11 -8
  120. package/contexts/LanguageContext.test.tsx +121 -121
  121. package/contexts/LanguageContext.tsx +250 -251
  122. package/dist/{AssistantChart-DoZCyS5r.cjs → AssistantChart-9w31gdAb.cjs} +4 -4
  123. package/dist/{AssistantChart-CldVCVDe.cjs → AssistantChart-BAudAfne.cjs} +5 -5
  124. package/dist/{AssistantChart-Bdd44uBn.cjs → AssistantChart-BAx9VQvb.cjs} +127 -388
  125. package/dist/{AssistantChart-Cu3m7RBo.js → AssistantChart-BP8upjMk.js} +5 -5
  126. package/dist/{AssistantChart-CFhDdGyU.js → AssistantChart-CVko2A1W.js} +130 -391
  127. package/dist/{AssistantChart-C_hwFRRr.js → AssistantChart-CVzmmhx4.js} +4 -4
  128. package/dist/{AudioPlayer-IAU5q5T1.cjs → AudioPlayer-1ypwE2Wh.cjs} +1 -1
  129. package/dist/{AudioPlayer-CGRUtUdN.js → AudioPlayer-DuKXrCfy.js} +1 -1
  130. package/dist/{LanguageContext-CS14yCpi.js → LanguageContext-BwhwC3G2.js} +2 -2
  131. package/dist/{LanguageContext-B_KFTCzT.cjs → LanguageContext-DvUt5jBg.cjs} +2 -2
  132. package/dist/{ThemeContext-C2EwAPDt.js → ThemeContext-BbBNoFTG.js} +2 -2
  133. package/dist/{ThemeContext-Bmod0Cg2.cjs → ThemeContext-BblcjQup.cjs} +13 -8
  134. package/dist/{ThemeContext-BWq9ACPo.js → ThemeContext-Bo-W2WZH.js} +13 -8
  135. package/dist/{ThemeContext-j5aGtPky.cjs → ThemeContext-CP3a0jxy.cjs} +193 -262
  136. package/dist/{ThemeContext-vTjumZeM.cjs → ThemeContext-Cmr8Ex8H.cjs} +2 -2
  137. package/dist/ThemeContext-CpqYShLq.cjs +324 -0
  138. package/dist/{ThemeContext-CQSo4Iwc.js → ThemeContext-D3LzacmG.js} +8 -1
  139. package/dist/ThemeContext-Du2nE1PL.js +325 -0
  140. package/dist/ThemeContext-GeEBTJ3q.cjs +1621 -0
  141. package/dist/ThemeContext-JyLK9B1o.js +1622 -0
  142. package/dist/{ThemeContext-CGk3KK0k.cjs → ThemeContext-U4dEYc6C.cjs} +8 -1
  143. package/dist/{ThemeContext-BXjrgUjW.js → ThemeContext-ept8jhXI.js} +200 -261
  144. package/dist/{VerifyEmailPage-C0c2e5n0.js → VerifyEmailPage-BE-L9mB7.js} +7 -7
  145. package/dist/{VerifyEmailPage-DSBMRHtl.js → VerifyEmailPage-BIBOKV7Z.js} +41 -36
  146. package/dist/{VerifyEmailPage-DgIid028.js → VerifyEmailPage-BJjAMUTW.js} +4 -4
  147. package/dist/{VerifyEmailPage--1Vurewl.cjs → VerifyEmailPage-BRSP-Pwt.cjs} +3 -3
  148. package/dist/{VerifyEmailPage-Cwi3kbol.cjs → VerifyEmailPage-Bae2cBXT.cjs} +7 -7
  149. package/dist/{VerifyEmailPage-De6bQjrz.cjs → VerifyEmailPage-BiRm7Nh4.cjs} +41 -36
  150. package/dist/{VerifyEmailPage-ByerOcm4.cjs → VerifyEmailPage-Bv8Ah_TK.cjs} +23 -20
  151. package/dist/VerifyEmailPage-Bvfv8HVQ.js +3214 -0
  152. package/dist/{VerifyEmailPage-BComraR7.cjs → VerifyEmailPage-CR7kb5df.cjs} +22 -12
  153. package/dist/{VerifyEmailPage-MTD7AG1Z.js → VerifyEmailPage-C_ihbcth.js} +4 -4
  154. package/dist/{VerifyEmailPage-1WwWczAn.js → VerifyEmailPage-CbgjOF0v.js} +22 -12
  155. package/dist/{VerifyEmailPage-DvMLZgFt.js → VerifyEmailPage-CdYPSJoO.js} +1 -1
  156. package/dist/{VerifyEmailPage-By3Jf__L.cjs → VerifyEmailPage-CkBYfsNy.cjs} +4 -4
  157. package/dist/{VerifyEmailPage-CJLz3jrn.js → VerifyEmailPage-Cyl55sJb.js} +23 -20
  158. package/dist/VerifyEmailPage-D-FRj5TU.cjs +3213 -0
  159. package/dist/VerifyEmailPage-DF2ilhum.cjs +3210 -0
  160. package/dist/{VerifyEmailPage-CYXtbKi3.cjs → VerifyEmailPage-DMBh4NM9.cjs} +1 -1
  161. package/dist/{VerifyEmailPage-CgMxRb4z.js → VerifyEmailPage-DTtFfC-J.js} +3 -3
  162. package/dist/{VerifyEmailPage-CFLMls1p.cjs → VerifyEmailPage-Dt7zgA4w.cjs} +4 -4
  163. package/dist/VerifyEmailPage-EhudUdqF.js +3211 -0
  164. package/dist/{VerifyEmailPage-C5TNQTBa.js → VerifyEmailPage-X14vhdyl.js} +148 -75
  165. package/dist/VerifyEmailPage-hdB8JQGv.cjs +3213 -0
  166. package/dist/{VerifyEmailPage-B4peJjAT.cjs → VerifyEmailPage-u_Dn7t1U.cjs} +148 -75
  167. package/dist/VerifyEmailPage-vYHbYK3q.js +3214 -0
  168. package/dist/{XerticaProvider-CBGc4EMA.cjs → XerticaProvider-AChwphCO.cjs} +4 -4
  169. package/dist/{XerticaProvider-BIrqfZ-i.cjs → XerticaProvider-AbWlr7Af.cjs} +8 -11
  170. package/dist/{XerticaProvider-D-yNhF94.cjs → XerticaProvider-B8CaV7xu.cjs} +1 -1
  171. package/dist/{XerticaProvider-DDuiIcKo.js → XerticaProvider-BErr83Bg.js} +14 -11
  172. package/dist/{XerticaProvider-CEoWMTxu.js → XerticaProvider-BITjgC5p.js} +2 -2
  173. package/dist/{XerticaProvider-CllrbMEJ.cjs → XerticaProvider-By8q3Roe.cjs} +2 -2
  174. package/dist/{XerticaProvider-C1DKnvLh.js → XerticaProvider-CUYJZc32.js} +4 -4
  175. package/dist/{XerticaProvider-ET0ihewn.cjs → XerticaProvider-CW9hpCdF.cjs} +2 -2
  176. package/dist/{XerticaProvider-Dt5HEzbQ.js → XerticaProvider-CWgby5mY.js} +10 -10
  177. package/dist/XerticaProvider-CWs6EwNa.js +49 -0
  178. package/dist/XerticaProvider-CjQAQPcn.cjs +48 -0
  179. package/dist/XerticaProvider-CwOkHxiT.cjs +44 -0
  180. package/dist/XerticaProvider-D5lLumH-.js +49 -0
  181. package/dist/{XerticaProvider-DYq4JWtg.js → XerticaProvider-DQtvJU7m.js} +1 -1
  182. package/dist/XerticaProvider-qQUDop71.cjs +48 -0
  183. package/dist/{XerticaProvider-B7EVH-NF.js → XerticaProvider-siSt9uG2.js} +2 -2
  184. package/dist/{XerticaXLogo-Zw2B276b.cjs → XerticaXLogo-8TTzBjHw.cjs} +1 -1
  185. package/dist/{XerticaXLogo-B7xQ5dhi.js → XerticaXLogo-BWaag64t.js} +1 -1
  186. package/dist/{XerticaXLogo-DZbo4vOE.js → XerticaXLogo-BX3ueACh.js} +5 -2
  187. package/dist/XerticaXLogo-CFuIlYFH.js +252 -0
  188. package/dist/XerticaXLogo-CU-U-GP4.cjs +251 -0
  189. package/dist/XerticaXLogo-ChryA6xj.js +252 -0
  190. package/dist/{XerticaXLogo-CQUUjXoH.cjs → XerticaXLogo-CziKMQil.cjs} +8 -8
  191. package/dist/XerticaXLogo-DHz5SugF.js +252 -0
  192. package/dist/XerticaXLogo-DTee_y8X.cjs +251 -0
  193. package/dist/{XerticaXLogo-Cmsp-Eey.js → XerticaXLogo-DfUvz-lD.js} +9 -9
  194. package/dist/XerticaXLogo-kslQ8Tk_.cjs +251 -0
  195. package/dist/{XerticaXLogo-bvZSgwGF.cjs → XerticaXLogo-qBPhwK3g.cjs} +5 -2
  196. package/dist/{alert-dialog-s-vmNkJ_.js → alert-dialog-iDe5VE5o.js} +3 -3
  197. package/dist/{alert-dialog-DSKByiKZ.cjs → alert-dialog-yckpaOpy.cjs} +3 -3
  198. package/dist/assistant.cjs.js +1 -1
  199. package/dist/assistant.es.js +1 -1
  200. package/dist/brand.cjs.js +2 -2
  201. package/dist/brand.es.js +2 -2
  202. package/dist/cli.js +90 -37
  203. package/dist/components/brand/theme-toggle/ThemeToggle.d.ts +1 -1
  204. package/dist/components/index.d.ts +1 -1
  205. package/dist/{google-maps-loader-Y-QkD-Li.cjs → google-maps-loader-BqsYL48U.cjs} +0 -5
  206. package/dist/{google-maps-loader-CTYySAun.js → google-maps-loader-t2IlYBzw.js} +0 -4
  207. package/dist/index-CkTUgOwX.js +8 -0
  208. package/dist/{index-COtD8bRW.cjs → index-D3RLKRAs.cjs} +1 -1
  209. package/dist/index.cjs.js +5 -5
  210. package/dist/index.es.js +5 -5
  211. package/dist/index.umd.js +454 -1027
  212. package/dist/layout.cjs.js +1 -1
  213. package/dist/layout.es.js +1 -1
  214. package/dist/pages.cjs.js +1 -1
  215. package/dist/pages.es.js +1 -1
  216. package/dist/{sidebar-DAaY8bRU.cjs → sidebar-B3EYhli0.cjs} +33 -24
  217. package/dist/{sidebar-B6SlKZYN.js → sidebar-B4ZWaMrE.js} +1 -1
  218. package/dist/{sidebar-DQj1z3jG.cjs → sidebar-B9NR0lCe.cjs} +269 -227
  219. package/dist/{sidebar-nzPoVHBQ.cjs → sidebar-BS1p2V7t.cjs} +1 -1
  220. package/dist/sidebar-BvF5I2Ue.cjs +800 -0
  221. package/dist/{sidebar-q7P2Godd.cjs → sidebar-C5B_LHek.cjs} +1 -1
  222. package/dist/{sidebar-CrQDDdcz.js → sidebar-CA6_ek3f.js} +33 -24
  223. package/dist/{sidebar-BxGXsDAd.cjs → sidebar-CVUGHOS_.cjs} +8 -16
  224. package/dist/{sidebar-BViy8Eeu.js → sidebar-CmvwjnVb.js} +9 -17
  225. package/dist/sidebar-CplprZpM.js +801 -0
  226. package/dist/{sidebar-BbVIQvlP.js → sidebar-Dz7bd3zP.js} +1 -1
  227. package/dist/sidebar-KIS0C2JH.js +801 -0
  228. package/dist/sidebar-OTO_up7Z.js +801 -0
  229. package/dist/sidebar-zowjejT2.cjs +800 -0
  230. package/dist/{use-audio-player-nv8ZSGa1.js → use-audio-player-Bkh23vQ3.js} +3 -7
  231. package/dist/{use-audio-player-NKsWyjWu.cjs → use-audio-player-Dn1NR9xN.cjs} +3 -7
  232. package/dist/{xertica-assistant-dyP7KHM5.cjs → xertica-assistant-B1IaHXnB.cjs} +388 -529
  233. package/dist/{xertica-assistant-DCsnQyi5.js → xertica-assistant-B1NaSFFj.js} +46 -29
  234. package/dist/{xertica-assistant-ciJaWqm1.js → xertica-assistant-BMqdyRVi.js} +10 -28
  235. package/dist/{xertica-assistant-V_IdW4WF.cjs → xertica-assistant-Bj3vBCq_.cjs} +9 -27
  236. package/dist/{xertica-assistant-CrgTb6Hs.cjs → xertica-assistant-CIaUlbIt.cjs} +47 -22
  237. package/dist/{xertica-assistant-yX1CFBBo.js → xertica-assistant-DPsESB6t.js} +390 -531
  238. package/dist/{CodeBlock-BgfYL_rD.cjs → xertica-assistant-Qp3ydksa.cjs} +51 -263
  239. package/dist/{CodeBlock-BeSt1h5P.js → xertica-assistant-gnCJdcZY.js} +7 -219
  240. package/dist/xertica-ui.css +2 -2
  241. package/docs/architecture-improvements.md +456 -456
  242. package/docs/architecture.md +312 -306
  243. package/docs/components/assistant.md +428 -428
  244. package/docs/components/branding.md +252 -252
  245. package/docs/components/card-patterns.md +447 -445
  246. package/docs/components/error-boundary.md +32 -22
  247. package/docs/components/hooks.md +432 -430
  248. package/docs/components/language-selector.md +176 -172
  249. package/docs/components/pages.md +20 -6
  250. package/docs/doc-audit.md +244 -243
  251. package/docs/getting-started.md +616 -603
  252. package/docs/guidelines.md +330 -328
  253. package/docs/i18n.md +480 -476
  254. package/docs/installation.md +7 -6
  255. package/docs/llms.md +295 -295
  256. package/docs/state-management.md +289 -289
  257. package/guidelines/Guidelines.md +409 -406
  258. package/llms-compact.txt +1 -1
  259. package/llms.txt +1 -1
  260. package/package.json +219 -219
  261. package/styles/xertica/base.css +6 -0
  262. package/templates/.prettierignore +4 -4
  263. package/templates/.prettierrc +10 -10
  264. package/templates/CLAUDE.md +180 -165
  265. package/templates/guidelines/Guidelines.md +577 -553
  266. package/templates/package.json +69 -69
  267. package/templates/src/app/App.tsx +46 -46
  268. package/templates/src/app/components/AuthGuard.tsx +57 -8
  269. package/templates/src/features/assistant/data/mock.ts +75 -75
  270. package/templates/src/features/assistant/hooks/useAssistantConfig.ts +20 -20
  271. package/templates/src/features/assistant/index.ts +5 -5
  272. package/templates/src/features/auth/ui/AuthPageShell.tsx +1 -1
  273. package/templates/src/features/auth/ui/ForgotPasswordContent.tsx +70 -72
  274. package/templates/src/features/auth/ui/LoginContent.tsx +92 -92
  275. package/templates/src/features/auth/ui/ResetPasswordContent.tsx +183 -179
  276. package/templates/src/features/auth/ui/SocialLoginButtons.tsx +78 -78
  277. package/templates/src/features/auth/ui/VerifyEmailContent.tsx +80 -84
  278. package/templates/src/features/home/data/mock.ts +6 -0
  279. package/templates/src/features/home/hooks/useFeatureCards.ts +20 -20
  280. package/templates/src/features/home/index.ts +11 -11
  281. package/templates/src/features/home/ui/HomeContent.tsx +117 -119
  282. package/templates/src/features/template/ui/CrudTemplate.tsx +112 -115
  283. package/templates/src/features/template/ui/DashboardTemplate.tsx +110 -110
  284. package/templates/src/features/template/ui/FormTemplate.tsx +117 -117
  285. package/templates/src/features/template/ui/LoginTemplate.tsx +59 -59
  286. package/templates/src/features/template/ui/TemplateContent.tsx +1322 -1314
  287. package/templates/src/i18n.ts +124 -124
  288. package/templates/src/locales/en/common.json +21 -21
  289. package/templates/src/locales/en/components/activityCard.json +10 -10
  290. package/templates/src/locales/en/components/assistant.json +119 -119
  291. package/templates/src/locales/en/components/media.json +29 -29
  292. package/templates/src/locales/en/components/notificationCard.json +5 -5
  293. package/templates/src/locales/en/components/profileCard.json +8 -8
  294. package/templates/src/locales/en/components/projectCard.json +10 -10
  295. package/templates/src/locales/en/components/sidebar.json +14 -14
  296. package/templates/src/locales/en/components/stats.json +8 -8
  297. package/templates/src/locales/en/components/team.json +14 -14
  298. package/templates/src/locales/en/errors.json +9 -9
  299. package/templates/src/locales/en/languageSelector.json +7 -7
  300. package/templates/src/locales/en/nav.json +6 -6
  301. package/templates/src/locales/en/pages/crudTemplate.json +25 -25
  302. package/templates/src/locales/en/pages/dashboardTemplate.json +20 -20
  303. package/templates/src/locales/en/pages/forgotPassword.json +10 -10
  304. package/templates/src/locales/en/pages/formTemplate.json +16 -16
  305. package/templates/src/locales/en/pages/home.json +7 -7
  306. package/templates/src/locales/en/pages/login.json +15 -15
  307. package/templates/src/locales/en/pages/loginTemplate.json +9 -9
  308. package/templates/src/locales/en/pages/resetPassword.json +18 -18
  309. package/templates/src/locales/en/pages/templates.json +317 -317
  310. package/templates/src/locales/en/pages/verifyEmail.json +12 -12
  311. package/templates/src/locales/en/themeToggle.json +6 -6
  312. package/templates/src/locales/es/common.json +21 -21
  313. package/templates/src/locales/es/components/activityCard.json +10 -10
  314. package/templates/src/locales/es/components/assistant.json +119 -119
  315. package/templates/src/locales/es/components/media.json +29 -29
  316. package/templates/src/locales/es/components/notificationCard.json +5 -5
  317. package/templates/src/locales/es/components/profileCard.json +8 -8
  318. package/templates/src/locales/es/components/projectCard.json +10 -10
  319. package/templates/src/locales/es/components/sidebar.json +14 -14
  320. package/templates/src/locales/es/components/stats.json +8 -8
  321. package/templates/src/locales/es/components/team.json +14 -14
  322. package/templates/src/locales/es/errors.json +9 -9
  323. package/templates/src/locales/es/languageSelector.json +7 -7
  324. package/templates/src/locales/es/nav.json +6 -6
  325. package/templates/src/locales/es/pages/crudTemplate.json +25 -25
  326. package/templates/src/locales/es/pages/dashboardTemplate.json +20 -20
  327. package/templates/src/locales/es/pages/forgotPassword.json +10 -10
  328. package/templates/src/locales/es/pages/formTemplate.json +16 -16
  329. package/templates/src/locales/es/pages/home.json +7 -7
  330. package/templates/src/locales/es/pages/login.json +15 -15
  331. package/templates/src/locales/es/pages/loginTemplate.json +9 -9
  332. package/templates/src/locales/es/pages/resetPassword.json +18 -18
  333. package/templates/src/locales/es/pages/templates.json +317 -317
  334. package/templates/src/locales/es/pages/verifyEmail.json +12 -12
  335. package/templates/src/locales/es/themeToggle.json +6 -6
  336. package/templates/src/locales/pt-BR/common.json +21 -21
  337. package/templates/src/locales/pt-BR/components/activityCard.json +10 -10
  338. package/templates/src/locales/pt-BR/components/assistant.json +119 -119
  339. package/templates/src/locales/pt-BR/components/media.json +29 -29
  340. package/templates/src/locales/pt-BR/components/notificationCard.json +5 -5
  341. package/templates/src/locales/pt-BR/components/profileCard.json +8 -8
  342. package/templates/src/locales/pt-BR/components/projectCard.json +10 -10
  343. package/templates/src/locales/pt-BR/components/sidebar.json +14 -14
  344. package/templates/src/locales/pt-BR/components/stats.json +8 -8
  345. package/templates/src/locales/pt-BR/components/team.json +14 -14
  346. package/templates/src/locales/pt-BR/errors.json +9 -9
  347. package/templates/src/locales/pt-BR/languageSelector.json +7 -7
  348. package/templates/src/locales/pt-BR/nav.json +6 -6
  349. package/templates/src/locales/pt-BR/pages/crudTemplate.json +25 -25
  350. package/templates/src/locales/pt-BR/pages/dashboardTemplate.json +20 -20
  351. package/templates/src/locales/pt-BR/pages/forgotPassword.json +10 -10
  352. package/templates/src/locales/pt-BR/pages/formTemplate.json +16 -16
  353. package/templates/src/locales/pt-BR/pages/home.json +7 -7
  354. package/templates/src/locales/pt-BR/pages/login.json +15 -15
  355. package/templates/src/locales/pt-BR/pages/loginTemplate.json +9 -9
  356. package/templates/src/locales/pt-BR/pages/resetPassword.json +18 -18
  357. package/templates/src/locales/pt-BR/pages/templates.json +317 -317
  358. package/templates/src/locales/pt-BR/pages/verifyEmail.json +12 -12
  359. package/templates/src/locales/pt-BR/themeToggle.json +6 -6
  360. package/templates/src/pages/AssistantPage.tsx +470 -464
  361. package/templates/src/pages/HomePage.tsx +53 -49
  362. package/templates/src/shared/error-boundary.tsx +1 -5
  363. package/templates/src/shared/error-fallbacks.tsx +4 -8
  364. package/templates/vite.config.js +20 -20
  365. package/templates/vite.config.ts +55 -52
  366. package/dist/AssistantChart-CxGjH7Qk.js +0 -3477
  367. package/dist/AssistantChart-DIpshm3i.js +0 -4784
  368. package/dist/AssistantChart-D_PTeu8P.cjs +0 -3503
  369. package/dist/AssistantChart-zjsy2GaZ.cjs +0 -4810
  370. package/dist/AudioPlayer-B1lt5cPl.cjs +0 -989
  371. package/dist/AudioPlayer-BZ7bibzU.cjs +0 -982
  372. package/dist/AudioPlayer-BpRPS4-1.cjs +0 -1277
  373. package/dist/AudioPlayer-C12BjQBV.cjs +0 -997
  374. package/dist/AudioPlayer-CFeV8t-5.cjs +0 -936
  375. package/dist/AudioPlayer-Coly3q5R.js +0 -1278
  376. package/dist/AudioPlayer-CySJIyvL.js +0 -937
  377. package/dist/AudioPlayer-DMcG_c7L.js +0 -990
  378. package/dist/AudioPlayer-DcFKRJE_.js +0 -998
  379. package/dist/AudioPlayer-e8LfNoqO.js +0 -983
  380. package/dist/BrandColorsContext-565dDHd5.js +0 -660
  381. package/dist/BrandColorsContext-BcJbtkqn.cjs +0 -659
  382. package/dist/CodeBlock-7TTgmdGG.cjs +0 -2094
  383. package/dist/CodeBlock-BlcqlA9M.cjs +0 -2094
  384. package/dist/CodeBlock-Bnmeu5ez.cjs +0 -2094
  385. package/dist/CodeBlock-BtfPlbAI.js +0 -2078
  386. package/dist/CodeBlock-CIySIuYr.js +0 -2078
  387. package/dist/CodeBlock-CuPtUM-7.cjs +0 -2094
  388. package/dist/CodeBlock-D6ffWXgc.js +0 -2078
  389. package/dist/CodeBlock-D8dcwbit.cjs +0 -2094
  390. package/dist/CodeBlock-DMZrFnlw.cjs +0 -2094
  391. package/dist/CodeBlock-DlBehYN8.js +0 -2078
  392. package/dist/CodeBlock-DnYNI8rQ.js +0 -2078
  393. package/dist/CodeBlock-DvKWbSnE.cjs +0 -2094
  394. package/dist/CodeBlock-DwMCfkFY.js +0 -2078
  395. package/dist/CodeBlock-Dy6CNYyj.js +0 -2078
  396. package/dist/CodeBlock-U1pPOQI7.cjs +0 -2094
  397. package/dist/CodeBlock-f_GpNhEB.js +0 -2078
  398. package/dist/CodeBlock-oB6u8nI1.js +0 -2078
  399. package/dist/CodeBlock-tZC31B73.cjs +0 -2094
  400. package/dist/FeatureCard-CxC-7C-C.cjs +0 -300
  401. package/dist/FeatureCard-DbHWCb4E.js +0 -301
  402. package/dist/ImageWithFallback-CGtidP6B.cjs +0 -4542
  403. package/dist/ImageWithFallback-lsg3pdFg.js +0 -4508
  404. package/dist/LanguageSelector-B5YfbHra.js +0 -231
  405. package/dist/LanguageSelector-D6uacAIM.cjs +0 -230
  406. package/dist/LayoutContext-B45-e9DI.cjs +0 -93
  407. package/dist/LayoutContext-BAql6ZRY.js +0 -97
  408. package/dist/LayoutContext-Bav3UMEA.js +0 -94
  409. package/dist/LayoutContext-BvK-ggDa.cjs +0 -96
  410. package/dist/ThemeContext-BoH4NLfN.js +0 -734
  411. package/dist/ThemeContext-r69W20Xg.cjs +0 -733
  412. package/dist/VerifyEmailPage-COiyNl1y.js +0 -2825
  413. package/dist/VerifyEmailPage-CqKsR2v8.js +0 -2827
  414. package/dist/VerifyEmailPage-DjQKRlUS.cjs +0 -2824
  415. package/dist/VerifyEmailPage-s-1X3LDJ.cjs +0 -2826
  416. package/dist/XerticaOrbe-KL1RBHzw.cjs +0 -1354
  417. package/dist/XerticaOrbe-zwS1p2a8.js +0 -1355
  418. package/dist/XerticaProvider-6btlAlzc.js +0 -17
  419. package/dist/XerticaProvider-BNoNOxQ5.cjs +0 -16
  420. package/dist/XerticaProvider-BlY2limY.cjs +0 -38
  421. package/dist/XerticaProvider-cI9hSs27.cjs +0 -38
  422. package/dist/XerticaProvider-hSwhNQex.js +0 -39
  423. package/dist/alert-dialog-BOje--vD.js +0 -847
  424. package/dist/alert-dialog-BtEuQqrg.cjs +0 -870
  425. package/dist/breadcrumb-CqJ7bHY5.js +0 -161
  426. package/dist/breadcrumb-m9Hb2_XN.cjs +0 -177
  427. package/dist/components/assistant/xertica-assistant/hooks/index.d.ts +0 -6
  428. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-conversations.d.ts +0 -21
  429. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-messages.d.ts +0 -49
  430. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-suggestions.d.ts +0 -16
  431. package/dist/components/blocks/audio-player/AudioPlayer.d.ts +0 -35
  432. package/dist/components/blocks/audio-player/index.d.ts +0 -1
  433. package/dist/components/blocks/document-editor/DocumentEditor.d.ts +0 -26
  434. package/dist/components/blocks/document-editor/index.d.ts +0 -1
  435. package/dist/components/blocks/podcast-player/PodcastPlayer.d.ts +0 -41
  436. package/dist/components/blocks/podcast-player/index.d.ts +0 -1
  437. package/dist/components/ui/chart/parts/chart-dashboard.d.ts +0 -113
  438. package/dist/components/ui/chart/parts/chart-metric.d.ts +0 -118
  439. package/dist/components/ui/chart/parts/chart-primitives.d.ts +0 -101
  440. package/dist/components/ui/chart/parts/chart-shared.d.ts +0 -20
  441. package/dist/components/ui/chart/parts/chart-utils.d.ts +0 -12
  442. package/dist/components/ui/chart/parts/index.d.ts +0 -5
  443. package/dist/dropdown-menu-BDB5CmQs.cjs +0 -247
  444. package/dist/dropdown-menu-DQidbKBD.js +0 -231
  445. package/dist/google-maps-loader-BFWp6VPd.js +0 -287
  446. package/dist/google-maps-loader-BKcdgFbu.cjs +0 -312
  447. package/dist/google-maps-loader-CumCNXeG.js +0 -312
  448. package/dist/google-maps-loader-eS3uQ5TA.cjs +0 -287
  449. package/dist/header-Cgy6vYPk.cjs +0 -731
  450. package/dist/header-DRlT4jgI.js +0 -715
  451. package/dist/header-Dux00SI4.cjs +0 -731
  452. package/dist/header-EkGKXPsD.js +0 -715
  453. package/dist/header-WfEywpyc.cjs +0 -731
  454. package/dist/header-tifNQn2U.js +0 -715
  455. package/dist/index-BhapVLVj.js +0 -8
  456. package/dist/index-D6fxYEY8.cjs +0 -7
  457. package/dist/index-DAIp0_HK.js +0 -8
  458. package/dist/index-DW5tYe26.js +0 -8
  459. package/dist/index-GA__GvnG.cjs +0 -7
  460. package/dist/input-2R4loU86.js +0 -127
  461. package/dist/input-DWANSKGb.cjs +0 -145
  462. package/dist/progress-DPtzoVV8.js +0 -175
  463. package/dist/progress-EeaoqqUs.cjs +0 -191
  464. package/dist/rich-text-editor-0mraWT5y.cjs +0 -2376
  465. package/dist/rich-text-editor-B-IkcPD0.js +0 -2874
  466. package/dist/rich-text-editor-B6jMRLzk.cjs +0 -1939
  467. package/dist/rich-text-editor-B8_oYcIR.js +0 -1730
  468. package/dist/rich-text-editor-B9UbSXNb.js +0 -1203
  469. package/dist/rich-text-editor-BYuRBNBU.js +0 -2373
  470. package/dist/rich-text-editor-Bb9pySTs.cjs +0 -2374
  471. package/dist/rich-text-editor-BcL6L3cm.cjs +0 -2374
  472. package/dist/rich-text-editor-BoVZYtTs.cjs +0 -2391
  473. package/dist/rich-text-editor-Bp3zQqMC.js +0 -2954
  474. package/dist/rich-text-editor-CMgSN_w2.js +0 -1189
  475. package/dist/rich-text-editor-CPV1lEPH.cjs +0 -1748
  476. package/dist/rich-text-editor-CeucBdIv.cjs +0 -2971
  477. package/dist/rich-text-editor-CoKqbCtu.cjs +0 -1799
  478. package/dist/rich-text-editor-Cw56T_mB.js +0 -2356
  479. package/dist/rich-text-editor-Cyt8qs2b.js +0 -1921
  480. package/dist/rich-text-editor-D6H84OcX.cjs +0 -1220
  481. package/dist/rich-text-editor-D76gD-QI.js +0 -2328
  482. package/dist/rich-text-editor-DKkokOnA.js +0 -1781
  483. package/dist/rich-text-editor-DNsdpN64.cjs +0 -2359
  484. package/dist/rich-text-editor-DfG8bCyY.js +0 -2358
  485. package/dist/rich-text-editor-Dxjw31Z4.js +0 -2341
  486. package/dist/rich-text-editor-DzP0Epmb.js +0 -2356
  487. package/dist/rich-text-editor-bRkNoeZY.cjs +0 -2891
  488. package/dist/rich-text-editor-lyYE2ZG5.cjs +0 -1207
  489. package/dist/rich-text-editor-skplNlBM.cjs +0 -2345
  490. package/dist/select-Bkbr0f-Z.cjs +0 -162
  491. package/dist/select-CvIVdX2n.js +0 -145
  492. package/dist/sidebar-CK_0ZQHj.cjs +0 -803
  493. package/dist/sidebar-CUuOvYhK.js +0 -787
  494. package/dist/sidebar-Djn5syhi.cjs +0 -786
  495. package/dist/sidebar-LluMXfam.js +0 -759
  496. package/dist/sidebar-_rT7rBMk.js +0 -787
  497. package/dist/slider-Bc5Hd0y1.js +0 -56
  498. package/dist/slider-N7hFFj6X.cjs +0 -73
  499. package/dist/tooltip-Ded96neP.cjs +0 -137
  500. package/dist/tooltip-HDOoD2-0.js +0 -120
  501. package/dist/use-audio-player-B31J-aqh.cjs +0 -187
  502. package/dist/use-audio-player-BkmEmj8Q.js +0 -185
  503. package/dist/use-audio-player-CLFTWFW1.cjs +0 -184
  504. package/dist/use-audio-player-CLLn00I6.js +0 -188
  505. package/dist/use-file-upload-BcjEo2S5.js +0 -404
  506. package/dist/use-file-upload-CRJR68Tj.cjs +0 -403
  507. package/dist/use-mobile-B0hNy_Y6.cjs +0 -4303
  508. package/dist/use-mobile-BXuYROXM.js +0 -4202
  509. package/dist/use-mobile-Bbd51ASU.cjs +0 -4392
  510. package/dist/use-mobile-Bk6CX-TC.js +0 -4359
  511. package/dist/use-mobile-BvYdisLP.js +0 -4202
  512. package/dist/use-mobile-BzuxjzNX.cjs +0 -4392
  513. package/dist/use-mobile-CG2-SdXV.cjs +0 -4235
  514. package/dist/use-mobile-CKb5pqTs.js +0 -4269
  515. package/dist/use-mobile-CYuAuGDl.js +0 -4202
  516. package/dist/use-mobile-CaENcqm-.js +0 -4508
  517. package/dist/use-mobile-CbrYgJGJ.js +0 -4203
  518. package/dist/use-mobile-Cd4xPrKq.cjs +0 -46
  519. package/dist/use-mobile-DMOvImGQ.cjs +0 -4542
  520. package/dist/use-mobile-DRB3BQgD.cjs +0 -4235
  521. package/dist/use-mobile-DZvv7QMR.js +0 -4359
  522. package/dist/use-mobile-DdI_TXam.cjs +0 -4235
  523. package/dist/use-mobile-DlceKf8a.js +0 -4359
  524. package/dist/use-mobile-DsOnow1o.cjs +0 -4236
  525. package/dist/use-mobile-Kcj6jSnK.cjs +0 -4392
  526. package/dist/use-mobile-bnKcua_i.js +0 -4202
  527. package/dist/use-mobile-j4w2Jrf1.js +0 -30
  528. package/dist/use-mobile-ncXBeE2z.cjs +0 -4235
  529. package/dist/use-rich-text-editor-DjiddBGv.js +0 -282
  530. package/dist/use-rich-text-editor-lpeswbCs.cjs +0 -281
  531. package/dist/xertica-assistant-BdiZag0h.js +0 -2187
  532. package/dist/xertica-assistant-DUBpmEgo.cjs +0 -2186
  533. package/dist/{rich-text-editor-DgF8s7xW.js → rich-text-editor-BmsjY03B.js} +26 -26
  534. package/dist/{rich-text-editor-mWoaSCE4.cjs → rich-text-editor-GS2kpTAK.cjs} +26 -26
@@ -1,2891 +0,0 @@
1
- "use strict";
2
- const jsxRuntime = require("react/jsx-runtime");
3
- const React = require("react");
4
- const RechartsPrimitive = require("recharts");
5
- const button = require("./button-Bnv9SvYK.cjs");
6
- const classVarianceAuthority = require("class-variance-authority");
7
- const lucideReact = require("lucide-react");
8
- const skeleton = require("./skeleton-4zoHiFJ_.cjs");
9
- const select = require("./select-Cmb8zF7w.cjs");
10
- const DialogPrimitive = require("@radix-ui/react-dialog");
11
- const dropdownMenu = require("./dropdown-menu-B_uEXNc4.cjs");
12
- const input = require("./input-CNFHVKvo.cjs");
13
- function _interopNamespaceDefault(e) {
14
- const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
15
- if (e) {
16
- for (const k in e) {
17
- if (k !== "default") {
18
- const d = Object.getOwnPropertyDescriptor(e, k);
19
- Object.defineProperty(n, k, d.get ? d : {
20
- enumerable: true,
21
- get: () => e[k]
22
- });
23
- }
24
- }
25
- }
26
- n.default = e;
27
- return Object.freeze(n);
28
- }
29
- const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
30
- const RechartsPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(RechartsPrimitive);
31
- const DialogPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(DialogPrimitive);
32
- const alertVariants = classVarianceAuthority.cva(
33
- "relative w-full rounded-[var(--radius)] border-l-4 px-4 py-3 grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-5 [&>svg]:translate-y-0.5 [&>svg]:text-current",
34
- {
35
- variants: {
36
- variant: {
37
- default: "bg-muted/50 border-l-border text-foreground [&>svg]:text-muted-foreground",
38
- success: "bg-[color:var(--success)]/10 dark:bg-[color:var(--success)]/20 border-l-[color:var(--success)] text-foreground [&>svg]:text-[color:var(--success)]",
39
- info: "bg-[color:var(--info)]/10 dark:bg-[color:var(--info)]/20 border-l-[color:var(--info)] text-foreground [&>svg]:text-[color:var(--info)]",
40
- warning: "bg-[color:var(--warning)]/10 dark:bg-[color:var(--warning)]/20 border-l-[color:var(--warning)] text-foreground [&>svg]:text-[color:var(--warning)]",
41
- destructive: "bg-[color:var(--destructive)]/10 dark:bg-[color:var(--destructive)]/20 border-l-[color:var(--destructive)] text-foreground [&>svg]:text-[color:var(--destructive)]"
42
- }
43
- },
44
- defaultVariants: {
45
- variant: "default"
46
- }
47
- }
48
- );
49
- const alertIcons = {
50
- default: lucideReact.Info,
51
- success: lucideReact.CheckCircle,
52
- info: lucideReact.Info,
53
- warning: lucideReact.AlertTriangle,
54
- destructive: lucideReact.XCircle
55
- };
56
- function Alert({ className, variant, icon, children, ...props }) {
57
- const alertVariant = variant && variant in alertIcons ? variant : "default";
58
- const DefaultIcon = alertIcons[alertVariant];
59
- return /* @__PURE__ */ jsxRuntime.jsxs(
60
- "div",
61
- {
62
- "data-slot": "alert",
63
- role: "alert",
64
- className: button.cn(alertVariants({ variant }), className),
65
- ...props,
66
- children: [
67
- icon !== void 0 ? icon : /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, { className: "flex-shrink-0" }),
68
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children })
69
- ]
70
- }
71
- );
72
- }
73
- function AlertTitle({ className, ...props }) {
74
- return /* @__PURE__ */ jsxRuntime.jsx(
75
- "div",
76
- {
77
- "data-slot": "alert-title",
78
- className: button.cn("font-medium mb-1 leading-tight", className),
79
- ...props
80
- }
81
- );
82
- }
83
- function AlertDescription({ className, ...props }) {
84
- return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "alert-description", className: button.cn("leading-relaxed", className), ...props });
85
- }
86
- const Empty = React__namespace.forwardRef(
87
- ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
88
- "div",
89
- {
90
- ref,
91
- className: button.cn(
92
- "flex min-h-[400px] flex-col items-center justify-center rounded-[var(--radius-card)] border border-dashed border-border p-8 text-center animate-in fade-in-50",
93
- className
94
- ),
95
- ...props
96
- }
97
- )
98
- );
99
- Empty.displayName = "Empty";
100
- const EmptyIcon = React__namespace.forwardRef(
101
- ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
102
- "div",
103
- {
104
- ref,
105
- className: button.cn(
106
- "mx-auto flex h-20 w-20 items-center justify-center rounded-full bg-muted",
107
- className
108
- ),
109
- ...props
110
- }
111
- )
112
- );
113
- EmptyIcon.displayName = "EmptyIcon";
114
- const EmptyImage = React__namespace.forwardRef(
115
- ({ className, alt, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
116
- "img",
117
- {
118
- ref,
119
- alt,
120
- className: button.cn("mx-auto mb-4 h-48 w-48 object-contain opacity-50", className),
121
- ...props
122
- }
123
- )
124
- );
125
- EmptyImage.displayName = "EmptyImage";
126
- const EmptyTitle = React__namespace.forwardRef(
127
- ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h3", { ref, className: button.cn("mt-4 font-semibold text-foreground", className), ...props })
128
- );
129
- EmptyTitle.displayName = "EmptyTitle";
130
- const EmptyDescription = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
131
- "p",
132
- {
133
- ref,
134
- className: button.cn("mt-2 text-sm text-muted-foreground max-w-sm mx-auto", className),
135
- ...props
136
- }
137
- ));
138
- EmptyDescription.displayName = "EmptyDescription";
139
- const EmptyAction = React__namespace.forwardRef(
140
- ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
141
- "div",
142
- {
143
- ref,
144
- className: button.cn("mt-6 flex flex-col gap-2 sm:flex-row sm:gap-4", className),
145
- ...props
146
- }
147
- )
148
- );
149
- EmptyAction.displayName = "EmptyAction";
150
- const THEMES = { light: "", dark: ".dark" };
151
- const defaultPeriods = [
152
- { value: "7d", label: "7 days" },
153
- { value: "30d", label: "30 days" },
154
- { value: "90d", label: "90 days" }
155
- ];
156
- const defaultChartColors = [
157
- "var(--chart-1)",
158
- "var(--chart-2)",
159
- "var(--chart-3)",
160
- "var(--chart-4)",
161
- "var(--chart-5)",
162
- "var(--chart-6)",
163
- "var(--chart-7)",
164
- "var(--chart-8)"
165
- ];
166
- const chartBarSizes = {
167
- sm: 8,
168
- md: 14,
169
- lg: 22,
170
- xl: 32
171
- };
172
- const ChartContext = React__namespace.createContext(null);
173
- function useChart() {
174
- const context = React__namespace.useContext(ChartContext);
175
- if (!context) {
176
- throw new Error("useChart must be used within a <ChartContainer />");
177
- }
178
- return context;
179
- }
180
- function ChartContainer({
181
- id,
182
- className,
183
- children,
184
- config,
185
- ...props
186
- }) {
187
- const uniqueId = React__namespace.useId();
188
- const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
189
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxRuntime.jsxs(
190
- "div",
191
- {
192
- "data-slot": "chart",
193
- "data-chart": chartId,
194
- className: button.cn(
195
- "[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border relative h-[300px] min-h-[200px] w-full min-w-0 overflow-hidden text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden",
196
- className
197
- ),
198
- ...props,
199
- children: [
200
- /* @__PURE__ */ jsxRuntime.jsx(ChartStyle, { id: chartId, config }),
201
- /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.ResponsiveContainer, { width: "100%", height: "100%", children })
202
- ]
203
- }
204
- ) });
205
- }
206
- const ChartStyle = ({ id, config }) => {
207
- const colorConfig = Object.entries(config).filter(([, config2]) => config2.theme || config2.color);
208
- if (!colorConfig.length) {
209
- return null;
210
- }
211
- return /* @__PURE__ */ jsxRuntime.jsx(
212
- "style",
213
- {
214
- dangerouslySetInnerHTML: {
215
- __html: Object.entries(THEMES).map(
216
- ([theme, prefix]) => `
217
- ${prefix} [data-chart=${id}] {
218
- ${colorConfig.map(([key, itemConfig]) => {
219
- const color = itemConfig.theme?.[theme] || itemConfig.color;
220
- return color ? ` --color-${key}: ${color};` : null;
221
- }).join("\n")}
222
- }
223
- `
224
- ).join("\n")
225
- }
226
- }
227
- );
228
- };
229
- const ChartTooltip = RechartsPrimitive__namespace.Tooltip;
230
- function ChartTooltipContent({
231
- active,
232
- payload,
233
- className,
234
- indicator = "dot",
235
- hideLabel = false,
236
- hideIndicator = false,
237
- label,
238
- labelFormatter,
239
- labelClassName,
240
- formatter,
241
- color,
242
- nameKey,
243
- labelKey
244
- }) {
245
- const { config } = useChart();
246
- const tooltipLabel = React__namespace.useMemo(() => {
247
- if (hideLabel || !payload?.length) {
248
- return null;
249
- }
250
- const [item] = payload;
251
- const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
252
- const itemConfig = getPayloadConfigFromPayload(config, item, key);
253
- const value = !labelKey && typeof label === "string" ? config[label]?.label || label : itemConfig?.label;
254
- if (labelFormatter) {
255
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: button.cn("font-medium", labelClassName), children: labelFormatter(value, payload) });
256
- }
257
- if (!value) {
258
- return null;
259
- }
260
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: button.cn("font-medium", labelClassName), children: value });
261
- }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
262
- if (!active || !payload?.length) {
263
- return null;
264
- }
265
- const nestLabel = payload.length === 1 && indicator !== "dot";
266
- return /* @__PURE__ */ jsxRuntime.jsxs(
267
- "div",
268
- {
269
- className: button.cn(
270
- "border-border/50 bg-background/95 backdrop-blur-sm grid min-w-[8rem] items-start gap-1.5 rounded-xl border px-3 py-2 text-xs shadow-xl",
271
- className
272
- ),
273
- children: [
274
- !nestLabel ? tooltipLabel : null,
275
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-1.5", children: payload.map((item, index) => {
276
- const key = `${nameKey || item.name || item.dataKey || "value"}`;
277
- const itemConfig = getPayloadConfigFromPayload(config, item, key);
278
- const indicatorColor = color || item.payload?.fill || item.color;
279
- return /* @__PURE__ */ jsxRuntime.jsx(
280
- "div",
281
- {
282
- className: button.cn(
283
- "[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5",
284
- indicator === "dot" && "items-center"
285
- ),
286
- children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
287
- itemConfig?.icon ? /* @__PURE__ */ jsxRuntime.jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsxRuntime.jsx(
288
- "div",
289
- {
290
- className: button.cn(
291
- "shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)",
292
- {
293
- "h-2.5 w-2.5": indicator === "dot",
294
- "w-1": indicator === "line",
295
- "w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
296
- "my-0.5": nestLabel && indicator === "dashed"
297
- }
298
- ),
299
- style: {
300
- "--color-bg": indicatorColor,
301
- "--color-border": indicatorColor
302
- }
303
- }
304
- ),
305
- /* @__PURE__ */ jsxRuntime.jsxs(
306
- "div",
307
- {
308
- className: button.cn(
309
- "flex flex-1 justify-between leading-none",
310
- nestLabel ? "items-end" : "items-center"
311
- ),
312
- children: [
313
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-1.5", children: [
314
- nestLabel ? tooltipLabel : null,
315
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: itemConfig?.label || item.name })
316
- ] }),
317
- item.value && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground font-mono font-semibold tabular-nums", children: item.value.toLocaleString() })
318
- ]
319
- }
320
- )
321
- ] })
322
- },
323
- item.dataKey
324
- );
325
- }) })
326
- ]
327
- }
328
- );
329
- }
330
- const ChartLegend = RechartsPrimitive__namespace.Legend;
331
- function ChartLegendContent({
332
- className,
333
- hideIcon = false,
334
- payload,
335
- verticalAlign = "bottom",
336
- nameKey
337
- }) {
338
- const { config } = useChart();
339
- if (!payload?.length) {
340
- return null;
341
- }
342
- return /* @__PURE__ */ jsxRuntime.jsx(
343
- "div",
344
- {
345
- className: button.cn(
346
- "flex items-center justify-center gap-4",
347
- verticalAlign === "top" ? "pb-3" : "pt-3",
348
- className
349
- ),
350
- children: payload.map((item) => {
351
- const key = `${nameKey ? item.value : item.dataKey || item.value || "value"}`;
352
- const itemConfig = getPayloadConfigFromPayload(config, item, key);
353
- return /* @__PURE__ */ jsxRuntime.jsxs(
354
- "div",
355
- {
356
- className: button.cn(
357
- "[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"
358
- ),
359
- children: [
360
- itemConfig?.icon && !hideIcon ? /* @__PURE__ */ jsxRuntime.jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsxRuntime.jsx(
361
- "div",
362
- {
363
- className: "h-2 w-2 shrink-0 rounded-full bg-(--color-bg)",
364
- style: {
365
- "--color-bg": item.color || `var(--color-${key})`
366
- }
367
- }
368
- ),
369
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-xs", children: itemConfig?.label || item.value })
370
- ]
371
- },
372
- item.value
373
- );
374
- })
375
- }
376
- );
377
- }
378
- function getPayloadConfigFromPayload(config, payload, key) {
379
- if (typeof payload !== "object" || payload === null) {
380
- return void 0;
381
- }
382
- const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
383
- let configLabelKey = key;
384
- if (key in payload && typeof payload[key] === "string") {
385
- configLabelKey = payload[key];
386
- } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
387
- configLabelKey = payloadPayload[key];
388
- }
389
- return configLabelKey in config ? config[configLabelKey] : config[key];
390
- }
391
- function getChartSeries(config, series) {
392
- if (series?.length) {
393
- return series;
394
- }
395
- return Object.entries(config).map(([key, item]) => ({
396
- key,
397
- label: item.label
398
- }));
399
- }
400
- function getSeriesColor(key, index, colors) {
401
- if (Array.isArray(colors)) {
402
- return colors[index] || defaultChartColors[index % defaultChartColors.length];
403
- }
404
- return colors?.[key] || defaultChartColors[index % defaultChartColors.length];
405
- }
406
- function getChartConfigWithColors(config, keys, colors) {
407
- return keys.reduce((nextConfig, key, index) => {
408
- const item = config[key];
409
- if (item?.theme && !colors) {
410
- nextConfig[key] = item;
411
- return nextConfig;
412
- }
413
- nextConfig[key] = {
414
- label: item?.label || key,
415
- icon: item?.icon,
416
- color: colors ? getSeriesColor(key, index, colors) : item?.color || getSeriesColor(key, index)
417
- };
418
- return nextConfig;
419
- }, {});
420
- }
421
- function buildChartConfig(keys, colors) {
422
- return keys.reduce((cfg, key, index) => {
423
- cfg[key] = {
424
- label: key,
425
- color: getSeriesColor(key, index, colors)
426
- };
427
- return cfg;
428
- }, {});
429
- }
430
- function formatTick(value) {
431
- if (typeof value !== "number") {
432
- return value;
433
- }
434
- return Intl.NumberFormat("en", {
435
- notation: "compact",
436
- maximumFractionDigits: 1
437
- }).format(value);
438
- }
439
- function defaultFilterData(data, period) {
440
- const match = period.match(/^(\d+)/);
441
- if (!match) {
442
- return data;
443
- }
444
- const limit = Number(match[1]);
445
- return data.slice(Math.max(data.length - limit, 0));
446
- }
447
- function getErrorDescription(error) {
448
- if (typeof error === "string") {
449
- return error;
450
- }
451
- if (error instanceof Error) {
452
- return error.message;
453
- }
454
- return void 0;
455
- }
456
- function getBarSize(barSize = "md") {
457
- return typeof barSize === "number" ? barSize : chartBarSizes[barSize];
458
- }
459
- function hasChartData(data, series) {
460
- if (!data.length || !series.length) {
461
- return false;
462
- }
463
- return data.some(
464
- (item) => series.some((serie) => {
465
- const value = item[serie.key];
466
- return value !== null && value !== void 0 && value !== "";
467
- })
468
- );
469
- }
470
- function hasPieData(data, nameKey, valueKey) {
471
- return data.some((item) => {
472
- const name = item[nameKey];
473
- const value = item[valueKey];
474
- return name !== null && name !== void 0 && name !== "" && value !== null && value !== void 0 && value !== "";
475
- });
476
- }
477
- function ChartState({
478
- type,
479
- className,
480
- error,
481
- onRetry,
482
- retryLabel = "Try again",
483
- emptyTitle = "No data available",
484
- emptyDescription = "There is no data available for this chart yet.",
485
- errorTitle = "Connection error",
486
- errorDescription,
487
- loadingLabel = "Loading chart data"
488
- }) {
489
- if (type === "loading") {
490
- return /* @__PURE__ */ jsxRuntime.jsxs(
491
- "div",
492
- {
493
- className: button.cn(
494
- "flex min-h-[240px] flex-col justify-end gap-3 rounded-[var(--radius-card)] border border-border p-6",
495
- className
496
- ),
497
- "aria-label": typeof loadingLabel === "string" ? loadingLabel : void 0,
498
- children: [
499
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-8 w-2/5" }),
500
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-14 w-3/5" }),
501
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-24 w-4/5" }),
502
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-36 w-full" })
503
- ]
504
- }
505
- );
506
- }
507
- if (type === "error") {
508
- return /* @__PURE__ */ jsxRuntime.jsx(
509
- "div",
510
- {
511
- className: button.cn(
512
- "flex min-h-[240px] items-center justify-center rounded-[var(--radius-card)] border border-border p-6",
513
- className
514
- ),
515
- children: /* @__PURE__ */ jsxRuntime.jsxs(Alert, { variant: "destructive", className: "max-w-xl", children: [
516
- /* @__PURE__ */ jsxRuntime.jsx(AlertTitle, { children: errorTitle }),
517
- /* @__PURE__ */ jsxRuntime.jsx(AlertDescription, { children: errorDescription || getErrorDescription(error) || "Unable to load chart data. Check your connection and try again." }),
518
- onRetry ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3", children: /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { size: "sm", variant: "outline", onClick: onRetry, children: [
519
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.RefreshCw, { className: "size-4" }),
520
- retryLabel
521
- ] }) }) : null
522
- ] })
523
- }
524
- );
525
- }
526
- return /* @__PURE__ */ jsxRuntime.jsxs(Empty, { className: button.cn("min-h-[240px]", className), children: [
527
- /* @__PURE__ */ jsxRuntime.jsx(EmptyIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BarChart3, { className: "size-10 text-muted-foreground" }) }),
528
- /* @__PURE__ */ jsxRuntime.jsx(EmptyTitle, { children: emptyTitle }),
529
- /* @__PURE__ */ jsxRuntime.jsx(EmptyDescription, { children: emptyDescription }),
530
- onRetry ? /* @__PURE__ */ jsxRuntime.jsx(EmptyAction, { children: /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { size: "sm", variant: "outline", onClick: onRetry, children: [
531
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.WifiOff, { className: "size-4" }),
532
- retryLabel
533
- ] }) }) : null
534
- ] });
535
- }
536
- function getChartState(state, hasData, className) {
537
- if (state.isLoading) {
538
- return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "loading", className });
539
- }
540
- if (state.error) {
541
- return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "error", className });
542
- }
543
- if (!hasData) {
544
- return /* @__PURE__ */ jsxRuntime.jsx(ChartState, { ...state, type: "empty", className });
545
- }
546
- return null;
547
- }
548
- function ChartCard({
549
- title,
550
- description,
551
- action,
552
- footer,
553
- children,
554
- className,
555
- contentClassName,
556
- ...props
557
- }) {
558
- return /* @__PURE__ */ jsxRuntime.jsxs(skeleton.Card, { className: button.cn("w-full min-w-0 overflow-hidden", className), ...props, children: [
559
- /* @__PURE__ */ jsxRuntime.jsxs(skeleton.CardHeader, { children: [
560
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardTitle, { children: title }),
561
- description ? /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardDescription, { children: description }) : null,
562
- action ? /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardAction, { children: action }) : null
563
- ] }),
564
- /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardContent, { className: contentClassName, children }),
565
- footer ? /* @__PURE__ */ jsxRuntime.jsx(skeleton.CardFooter, { children: footer }) : null
566
- ] });
567
- }
568
- function AreaGradientDefs({
569
- seriesKeys,
570
- opacity = 0.3
571
- }) {
572
- return /* @__PURE__ */ jsxRuntime.jsx("defs", { children: seriesKeys.map((key) => /* @__PURE__ */ jsxRuntime.jsxs("linearGradient", { id: `gradient-${key}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
573
- /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "5%", stopColor: `var(--color-${key})`, stopOpacity: opacity }),
574
- /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "95%", stopColor: `var(--color-${key})`, stopOpacity: 0 })
575
- ] }, key)) });
576
- }
577
- function DashboardBarChart({
578
- data,
579
- config,
580
- indexKey = "name",
581
- series,
582
- colors,
583
- barSize = "md",
584
- stacked = false,
585
- showGrid = true,
586
- showLegend = true,
587
- valueFormatter = formatTick,
588
- isLoading,
589
- error,
590
- onRetry,
591
- retryLabel,
592
- emptyTitle,
593
- emptyDescription,
594
- errorTitle,
595
- errorDescription,
596
- loadingLabel,
597
- stateClassName,
598
- className,
599
- ...props
600
- }) {
601
- const chartSeries = getChartSeries(config, series);
602
- const chartConfig = getChartConfigWithColors(
603
- config,
604
- chartSeries.map((item) => item.key),
605
- colors
606
- );
607
- const chartState = getChartState(
608
- {
609
- isLoading,
610
- error,
611
- onRetry,
612
- retryLabel,
613
- emptyTitle,
614
- emptyDescription,
615
- errorTitle,
616
- errorDescription,
617
- loadingLabel
618
- },
619
- hasChartData(data, chartSeries),
620
- button.cn("h-[320px] w-full", stateClassName)
621
- );
622
- const barElements = React__namespace.useMemo(() => {
623
- const topOfStack = /* @__PURE__ */ new Set();
624
- if (stacked) {
625
- const lastByStack = /* @__PURE__ */ new Map();
626
- chartSeries.forEach((s) => lastByStack.set(s.stackId || "total", s.key));
627
- lastByStack.forEach((key) => topOfStack.add(key));
628
- }
629
- return chartSeries.map((item) => {
630
- const isTop = !stacked || topOfStack.has(item.key);
631
- return /* @__PURE__ */ jsxRuntime.jsx(
632
- RechartsPrimitive__namespace.Bar,
633
- {
634
- dataKey: item.key,
635
- fill: `var(--color-${item.key})`,
636
- radius: isTop ? [4, 4, 0, 0] : [0, 0, 0, 0],
637
- barSize: getBarSize(barSize),
638
- stackId: stacked ? item.stackId || "total" : item.stackId,
639
- isAnimationActive: true,
640
- animationDuration: 600,
641
- animationEasing: "ease-out"
642
- },
643
- item.key
644
- );
645
- });
646
- }, [stacked, chartSeries]);
647
- if (chartState) {
648
- return chartState;
649
- }
650
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[320px] w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.BarChart, { data, accessibilityLayer: true, barGap: 4, children: [
651
- showGrid ? /* @__PURE__ */ jsxRuntime.jsx(
652
- RechartsPrimitive__namespace.CartesianGrid,
653
- {
654
- vertical: false,
655
- strokeDasharray: "3 3",
656
- stroke: "var(--border)",
657
- strokeOpacity: 0.5
658
- }
659
- ) : null,
660
- /* @__PURE__ */ jsxRuntime.jsx(
661
- RechartsPrimitive__namespace.XAxis,
662
- {
663
- dataKey: indexKey,
664
- tickLine: false,
665
- axisLine: false,
666
- tickMargin: 8
667
- }
668
- ),
669
- /* @__PURE__ */ jsxRuntime.jsx(
670
- RechartsPrimitive__namespace.YAxis,
671
- {
672
- tickLine: false,
673
- axisLine: false,
674
- tickMargin: 8,
675
- tickFormatter: valueFormatter
676
- }
677
- ),
678
- /* @__PURE__ */ jsxRuntime.jsx(
679
- ChartTooltip,
680
- {
681
- cursor: { fill: "var(--muted)", opacity: 0.4, radius: 4 },
682
- content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {})
683
- }
684
- ),
685
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
686
- barElements
687
- ] }) });
688
- }
689
- function DashboardLineChart({
690
- data,
691
- config,
692
- indexKey = "name",
693
- series,
694
- colors,
695
- showDots = false,
696
- showGrid = true,
697
- showLegend = true,
698
- curveType = "monotone",
699
- strokeWidth = 2,
700
- valueFormatter = formatTick,
701
- isLoading,
702
- error,
703
- onRetry,
704
- retryLabel,
705
- emptyTitle,
706
- emptyDescription,
707
- errorTitle,
708
- errorDescription,
709
- loadingLabel,
710
- stateClassName,
711
- className,
712
- ...props
713
- }) {
714
- const chartSeries = getChartSeries(config, series);
715
- const chartConfig = getChartConfigWithColors(
716
- config,
717
- chartSeries.map((item) => item.key),
718
- colors
719
- );
720
- const chartState = getChartState(
721
- {
722
- isLoading,
723
- error,
724
- onRetry,
725
- retryLabel,
726
- emptyTitle,
727
- emptyDescription,
728
- errorTitle,
729
- errorDescription,
730
- loadingLabel
731
- },
732
- hasChartData(data, chartSeries),
733
- button.cn("h-[320px] w-full", stateClassName)
734
- );
735
- if (chartState) {
736
- return chartState;
737
- }
738
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[320px] w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.LineChart, { data, accessibilityLayer: true, children: [
739
- showGrid ? /* @__PURE__ */ jsxRuntime.jsx(
740
- RechartsPrimitive__namespace.CartesianGrid,
741
- {
742
- vertical: false,
743
- strokeDasharray: "3 3",
744
- stroke: "var(--border)",
745
- strokeOpacity: 0.5
746
- }
747
- ) : null,
748
- /* @__PURE__ */ jsxRuntime.jsx(
749
- RechartsPrimitive__namespace.XAxis,
750
- {
751
- dataKey: indexKey,
752
- tickLine: false,
753
- axisLine: false,
754
- tickMargin: 8
755
- }
756
- ),
757
- /* @__PURE__ */ jsxRuntime.jsx(
758
- RechartsPrimitive__namespace.YAxis,
759
- {
760
- tickLine: false,
761
- axisLine: false,
762
- tickMargin: 8,
763
- tickFormatter: valueFormatter
764
- }
765
- ),
766
- /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { indicator: "line" }) }),
767
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
768
- chartSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
769
- RechartsPrimitive__namespace.Line,
770
- {
771
- type: curveType,
772
- dataKey: item.key,
773
- stroke: `var(--color-${item.key})`,
774
- strokeWidth,
775
- dot: showDots ? { r: 3, fill: `var(--color-${item.key})`, strokeWidth: 0 } : false,
776
- activeDot: { r: 5, strokeWidth: 0 },
777
- yAxisId: item.yAxisId,
778
- isAnimationActive: true,
779
- animationDuration: 600,
780
- animationEasing: "ease-out"
781
- },
782
- item.key
783
- ))
784
- ] }) });
785
- }
786
- function HorizontalBarChart({
787
- data,
788
- config,
789
- indexKey = "name",
790
- series,
791
- colors,
792
- barSize = "md",
793
- stacked = false,
794
- categoryWidth = 96,
795
- showGrid = true,
796
- showLegend = true,
797
- valueFormatter = formatTick,
798
- isLoading,
799
- error,
800
- onRetry,
801
- retryLabel,
802
- emptyTitle,
803
- emptyDescription,
804
- errorTitle,
805
- errorDescription,
806
- loadingLabel,
807
- stateClassName,
808
- className,
809
- ...props
810
- }) {
811
- const chartSeries = getChartSeries(config, series);
812
- const chartConfig = getChartConfigWithColors(
813
- config,
814
- chartSeries.map((item) => item.key),
815
- colors
816
- );
817
- const chartState = getChartState(
818
- {
819
- isLoading,
820
- error,
821
- onRetry,
822
- retryLabel,
823
- emptyTitle,
824
- emptyDescription,
825
- errorTitle,
826
- errorDescription,
827
- loadingLabel
828
- },
829
- hasChartData(data, chartSeries),
830
- button.cn("h-[320px] w-full", stateClassName)
831
- );
832
- if (chartState) {
833
- return chartState;
834
- }
835
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[320px] w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(
836
- RechartsPrimitive__namespace.BarChart,
837
- {
838
- data,
839
- layout: "vertical",
840
- accessibilityLayer: true,
841
- margin: { left: 8, right: 16 },
842
- children: [
843
- showGrid ? /* @__PURE__ */ jsxRuntime.jsx(
844
- RechartsPrimitive__namespace.CartesianGrid,
845
- {
846
- horizontal: false,
847
- strokeDasharray: "3 3",
848
- stroke: "var(--border)",
849
- strokeOpacity: 0.5
850
- }
851
- ) : null,
852
- /* @__PURE__ */ jsxRuntime.jsx(
853
- RechartsPrimitive__namespace.XAxis,
854
- {
855
- type: "number",
856
- tickLine: false,
857
- axisLine: false,
858
- tickMargin: 8,
859
- tickFormatter: valueFormatter
860
- }
861
- ),
862
- /* @__PURE__ */ jsxRuntime.jsx(
863
- RechartsPrimitive__namespace.YAxis,
864
- {
865
- dataKey: indexKey,
866
- type: "category",
867
- tickLine: false,
868
- axisLine: false,
869
- tickMargin: 8,
870
- width: categoryWidth
871
- }
872
- ),
873
- /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {}) }),
874
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
875
- chartSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
876
- RechartsPrimitive__namespace.Bar,
877
- {
878
- dataKey: item.key,
879
- fill: `var(--color-${item.key})`,
880
- radius: [0, 4, 4, 0],
881
- barSize: getBarSize(barSize),
882
- stackId: stacked ? item.stackId || "total" : item.stackId,
883
- isAnimationActive: true,
884
- animationDuration: 600,
885
- animationEasing: "ease-out"
886
- },
887
- item.key
888
- ))
889
- ]
890
- }
891
- ) });
892
- }
893
- function InteractiveTimeSeriesChart({
894
- data,
895
- config,
896
- indexKey = "date",
897
- series,
898
- colors,
899
- periods = defaultPeriods,
900
- defaultPeriod = periods[1]?.value || periods[0]?.value || "30d",
901
- defaultSeries,
902
- filterData = defaultFilterData,
903
- showGrid = true,
904
- showLegend = false,
905
- showDots = false,
906
- gradientFill = true,
907
- curveType = "monotone",
908
- strokeWidth = 2,
909
- valueFormatter = formatTick,
910
- isLoading,
911
- error,
912
- onRetry,
913
- retryLabel,
914
- emptyTitle,
915
- emptyDescription,
916
- errorTitle,
917
- errorDescription,
918
- loadingLabel,
919
- stateClassName,
920
- className,
921
- ...props
922
- }) {
923
- const chartSeries = getChartSeries(config, series);
924
- const chartConfig = getChartConfigWithColors(
925
- config,
926
- chartSeries.map((item) => item.key),
927
- colors
928
- );
929
- const [period, setPeriod] = React__namespace.useState(defaultPeriod);
930
- const [activeSeries, setActiveSeries] = React__namespace.useState(
931
- defaultSeries || chartSeries[0]?.key || ""
932
- );
933
- const filteredData = React__namespace.useMemo(() => filterData(data, period), [data, filterData, period]);
934
- const visibleSeries = chartSeries.length > 1 ? chartSeries.filter((item) => item.key === activeSeries) : chartSeries;
935
- const chartState = getChartState(
936
- {
937
- isLoading,
938
- error,
939
- onRetry,
940
- retryLabel,
941
- emptyTitle,
942
- emptyDescription,
943
- errorTitle,
944
- errorDescription,
945
- loadingLabel
946
- },
947
- hasChartData(filteredData, visibleSeries),
948
- button.cn("h-[320px] w-full", stateClassName)
949
- );
950
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full space-y-4", children: [
951
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
952
- chartSeries.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx(
953
- "div",
954
- {
955
- className: "inline-flex h-10 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground",
956
- role: "group",
957
- "aria-label": "Selecionar metrica do grafico",
958
- children: chartSeries.map((item) => {
959
- const label = item.label || config[item.key]?.label || item.key;
960
- return /* @__PURE__ */ jsxRuntime.jsx(
961
- button.Button,
962
- {
963
- type: "button",
964
- variant: "ghost",
965
- size: "sm",
966
- "aria-pressed": activeSeries === item.key,
967
- onClick: () => setActiveSeries(item.key),
968
- className: button.cn(
969
- "h-8 px-3 text-sm font-medium transition-all",
970
- activeSeries === item.key ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
971
- ),
972
- children: label
973
- },
974
- item.key
975
- );
976
- })
977
- }
978
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", {}),
979
- /* @__PURE__ */ jsxRuntime.jsxs(select.Select, { value: period, onValueChange: setPeriod, children: [
980
- /* @__PURE__ */ jsxRuntime.jsx(
981
- select.SelectTrigger,
982
- {
983
- className: "w-full sm:w-[160px]",
984
- size: "sm",
985
- "aria-label": "Selecionar periodo do grafico",
986
- children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder: "Period" })
987
- }
988
- ),
989
- /* @__PURE__ */ jsxRuntime.jsx(select.SelectContent, { children: periods.map((item) => /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: item.value, children: item.label }, item.value)) })
990
- ] })
991
- ] }),
992
- chartState || /* @__PURE__ */ jsxRuntime.jsx(
993
- ChartContainer,
994
- {
995
- config: chartConfig,
996
- className: button.cn("h-[320px] w-full", className),
997
- ...props,
998
- children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.AreaChart, { data: filteredData, accessibilityLayer: true, children: [
999
- gradientFill && /* @__PURE__ */ jsxRuntime.jsx(AreaGradientDefs, { seriesKeys: visibleSeries.map((s) => s.key), opacity: 0.4 }),
1000
- showGrid ? /* @__PURE__ */ jsxRuntime.jsx(
1001
- RechartsPrimitive__namespace.CartesianGrid,
1002
- {
1003
- vertical: false,
1004
- strokeDasharray: "3 3",
1005
- stroke: "var(--border)",
1006
- strokeOpacity: 0.5
1007
- }
1008
- ) : null,
1009
- /* @__PURE__ */ jsxRuntime.jsx(
1010
- RechartsPrimitive__namespace.XAxis,
1011
- {
1012
- dataKey: indexKey,
1013
- tickLine: false,
1014
- axisLine: false,
1015
- tickMargin: 8
1016
- }
1017
- ),
1018
- /* @__PURE__ */ jsxRuntime.jsx(
1019
- RechartsPrimitive__namespace.YAxis,
1020
- {
1021
- tickLine: false,
1022
- axisLine: false,
1023
- tickMargin: 8,
1024
- tickFormatter: valueFormatter
1025
- }
1026
- ),
1027
- /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { indicator: "line" }) }),
1028
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
1029
- visibleSeries.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
1030
- RechartsPrimitive__namespace.Area,
1031
- {
1032
- type: curveType,
1033
- dataKey: item.key,
1034
- stroke: `var(--color-${item.key})`,
1035
- fill: gradientFill ? `url(#gradient-${item.key})` : `var(--color-${item.key})`,
1036
- fillOpacity: gradientFill ? 1 : 0.16,
1037
- strokeWidth,
1038
- dot: showDots ? { r: 3, fill: `var(--color-${item.key})`, strokeWidth: 0 } : false,
1039
- activeDot: { r: 5, strokeWidth: 0 },
1040
- isAnimationActive: true,
1041
- animationDuration: 600,
1042
- animationEasing: "ease-out"
1043
- },
1044
- item.key
1045
- ))
1046
- ] })
1047
- }
1048
- )
1049
- ] });
1050
- }
1051
- function ComboMetricChart({
1052
- data,
1053
- config,
1054
- indexKey = "name",
1055
- series,
1056
- colors,
1057
- barSize = "md",
1058
- showGrid = true,
1059
- showLegend = true,
1060
- gradientFill = false,
1061
- curveType = "monotone",
1062
- valueFormatter = formatTick,
1063
- isLoading,
1064
- error,
1065
- onRetry,
1066
- retryLabel,
1067
- emptyTitle,
1068
- emptyDescription,
1069
- errorTitle,
1070
- errorDescription,
1071
- loadingLabel,
1072
- stateClassName,
1073
- className,
1074
- ...props
1075
- }) {
1076
- const chartSeries = getChartSeries(config, series);
1077
- const chartConfig = getChartConfigWithColors(
1078
- config,
1079
- chartSeries.map((item) => item.key),
1080
- colors
1081
- );
1082
- const chartState = getChartState(
1083
- {
1084
- isLoading,
1085
- error,
1086
- onRetry,
1087
- retryLabel,
1088
- emptyTitle,
1089
- emptyDescription,
1090
- errorTitle,
1091
- errorDescription,
1092
- loadingLabel
1093
- },
1094
- hasChartData(data, chartSeries),
1095
- button.cn("h-[340px] w-full", stateClassName)
1096
- );
1097
- if (chartState) {
1098
- return chartState;
1099
- }
1100
- const areaSeries = gradientFill ? chartSeries.filter((s) => s.type === "area").map((s) => s.key) : [];
1101
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[340px] w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.ComposedChart, { data, accessibilityLayer: true, children: [
1102
- gradientFill && areaSeries.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(AreaGradientDefs, { seriesKeys: areaSeries, opacity: 0.35 }),
1103
- showGrid ? /* @__PURE__ */ jsxRuntime.jsx(
1104
- RechartsPrimitive__namespace.CartesianGrid,
1105
- {
1106
- vertical: false,
1107
- strokeDasharray: "3 3",
1108
- stroke: "var(--border)",
1109
- strokeOpacity: 0.5
1110
- }
1111
- ) : null,
1112
- /* @__PURE__ */ jsxRuntime.jsx(
1113
- RechartsPrimitive__namespace.XAxis,
1114
- {
1115
- dataKey: indexKey,
1116
- tickLine: false,
1117
- axisLine: false,
1118
- tickMargin: 8
1119
- }
1120
- ),
1121
- /* @__PURE__ */ jsxRuntime.jsx(
1122
- RechartsPrimitive__namespace.YAxis,
1123
- {
1124
- tickLine: false,
1125
- axisLine: false,
1126
- tickMargin: 8,
1127
- tickFormatter: valueFormatter
1128
- }
1129
- ),
1130
- /* @__PURE__ */ jsxRuntime.jsx(ChartTooltip, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, {}) }),
1131
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }) : null,
1132
- chartSeries.map(
1133
- (item) => item.type === "line" ? /* @__PURE__ */ jsxRuntime.jsx(
1134
- RechartsPrimitive__namespace.Line,
1135
- {
1136
- type: curveType,
1137
- dataKey: item.key,
1138
- stroke: `var(--color-${item.key})`,
1139
- strokeWidth: 2,
1140
- dot: false,
1141
- activeDot: { r: 5, strokeWidth: 0 },
1142
- yAxisId: item.yAxisId,
1143
- isAnimationActive: true,
1144
- animationDuration: 600,
1145
- animationEasing: "ease-out"
1146
- },
1147
- item.key
1148
- ) : item.type === "area" ? /* @__PURE__ */ jsxRuntime.jsx(
1149
- RechartsPrimitive__namespace.Area,
1150
- {
1151
- type: curveType,
1152
- dataKey: item.key,
1153
- stroke: `var(--color-${item.key})`,
1154
- fill: gradientFill ? `url(#gradient-${item.key})` : `var(--color-${item.key})`,
1155
- fillOpacity: gradientFill ? 1 : 0.12,
1156
- strokeWidth: 2,
1157
- dot: false,
1158
- activeDot: { r: 5, strokeWidth: 0 },
1159
- yAxisId: item.yAxisId,
1160
- isAnimationActive: true,
1161
- animationDuration: 600,
1162
- animationEasing: "ease-out"
1163
- },
1164
- item.key
1165
- ) : /* @__PURE__ */ jsxRuntime.jsx(
1166
- RechartsPrimitive__namespace.Bar,
1167
- {
1168
- dataKey: item.key,
1169
- fill: `var(--color-${item.key})`,
1170
- radius: [4, 4, 0, 0],
1171
- barSize: getBarSize(barSize),
1172
- yAxisId: item.yAxisId,
1173
- isAnimationActive: true,
1174
- animationDuration: 600,
1175
- animationEasing: "ease-out"
1176
- },
1177
- item.key
1178
- )
1179
- )
1180
- ] }) });
1181
- }
1182
- function DonutBreakdownChart({
1183
- data,
1184
- config,
1185
- nameKey = "name",
1186
- valueKey = "value",
1187
- colors,
1188
- centerLabel,
1189
- centerValue,
1190
- showLegend = true,
1191
- innerRadius = "58%",
1192
- outerRadius = "82%",
1193
- isLoading,
1194
- error,
1195
- onRetry,
1196
- retryLabel,
1197
- emptyTitle,
1198
- emptyDescription,
1199
- errorTitle,
1200
- errorDescription,
1201
- loadingLabel,
1202
- stateClassName,
1203
- className,
1204
- ...props
1205
- }) {
1206
- const [activeIndex, setActiveIndex] = React__namespace.useState(0);
1207
- const chartKeys = data.map((entry, index) => String(entry[nameKey] || `segment-${index}`));
1208
- const chartConfig = getChartConfigWithColors(config, chartKeys, colors);
1209
- const chartState = getChartState(
1210
- {
1211
- isLoading,
1212
- error,
1213
- onRetry,
1214
- retryLabel,
1215
- emptyTitle,
1216
- emptyDescription,
1217
- errorTitle,
1218
- errorDescription,
1219
- loadingLabel
1220
- },
1221
- hasPieData(data, nameKey, valueKey),
1222
- button.cn("h-[320px] w-full", stateClassName)
1223
- );
1224
- if (chartState) {
1225
- return chartState;
1226
- }
1227
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[320px] w-full", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.PieChart, { accessibilityLayer: true, children: [
1228
- /* @__PURE__ */ jsxRuntime.jsx(
1229
- ChartTooltip,
1230
- {
1231
- cursor: false,
1232
- content: /* @__PURE__ */ jsxRuntime.jsx(ChartTooltipContent, { hideLabel: true, nameKey })
1233
- }
1234
- ),
1235
- showLegend ? /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, { nameKey }), verticalAlign: "bottom" }) : null,
1236
- /* @__PURE__ */ jsxRuntime.jsxs(
1237
- RechartsPrimitive__namespace.Pie,
1238
- {
1239
- data,
1240
- dataKey: valueKey,
1241
- nameKey,
1242
- innerRadius,
1243
- outerRadius,
1244
- paddingAngle: 3,
1245
- activeIndex,
1246
- onMouseEnter: (_, index) => setActiveIndex(index),
1247
- isAnimationActive: true,
1248
- animationDuration: 600,
1249
- animationEasing: "ease-out",
1250
- children: [
1251
- data.map((entry, index) => {
1252
- const key = String(entry[nameKey] || `segment-${index}`);
1253
- return /* @__PURE__ */ jsxRuntime.jsx(
1254
- RechartsPrimitive__namespace.Cell,
1255
- {
1256
- fill: `var(--color-${key})`,
1257
- opacity: index === activeIndex ? 1 : 0.7,
1258
- stroke: "transparent"
1259
- },
1260
- key
1261
- );
1262
- }),
1263
- centerValue || centerLabel ? /* @__PURE__ */ jsxRuntime.jsx(
1264
- RechartsPrimitive__namespace.Label,
1265
- {
1266
- position: "center",
1267
- content: ({ viewBox }) => {
1268
- if (!viewBox || !("cx" in viewBox) || !("cy" in viewBox)) {
1269
- return null;
1270
- }
1271
- return /* @__PURE__ */ jsxRuntime.jsxs("text", { x: viewBox.cx, y: viewBox.cy, textAnchor: "middle", dominantBaseline: "middle", children: [
1272
- centerValue ? /* @__PURE__ */ jsxRuntime.jsx(
1273
- "tspan",
1274
- {
1275
- x: viewBox.cx,
1276
- y: viewBox.cy,
1277
- className: "fill-foreground text-2xl font-semibold",
1278
- children: centerValue
1279
- }
1280
- ) : null,
1281
- centerLabel ? /* @__PURE__ */ jsxRuntime.jsx(
1282
- "tspan",
1283
- {
1284
- x: viewBox.cx,
1285
- y: Number(viewBox.cy) + 22,
1286
- className: "fill-muted-foreground text-xs",
1287
- children: centerLabel
1288
- }
1289
- ) : null
1290
- ] });
1291
- }
1292
- }
1293
- ) : null
1294
- ]
1295
- }
1296
- )
1297
- ] }) });
1298
- }
1299
- function SparklineChart({
1300
- data,
1301
- dataKey,
1302
- color = "var(--chart-1)",
1303
- filled = true,
1304
- showEndDot = true,
1305
- curveType = "monotone",
1306
- strokeWidth = 2,
1307
- className
1308
- }) {
1309
- const sparkId = React__namespace.useId().replace(/:/g, "");
1310
- const lastPoint = data[data.length - 1];
1311
- const lastValue = lastPoint ? lastPoint[dataKey] : void 0;
1312
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: button.cn("relative h-12 w-full min-w-0", className), children: [
1313
- /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(
1314
- RechartsPrimitive__namespace.AreaChart,
1315
- {
1316
- data,
1317
- margin: { top: 4, right: showEndDot ? 8 : 0, bottom: 0, left: 0 },
1318
- children: [
1319
- filled && /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs("linearGradient", { id: `spark-gradient-${sparkId}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
1320
- /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "5%", stopColor: color, stopOpacity: 0.3 }),
1321
- /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "95%", stopColor: color, stopOpacity: 0 })
1322
- ] }) }),
1323
- /* @__PURE__ */ jsxRuntime.jsx(
1324
- RechartsPrimitive__namespace.Area,
1325
- {
1326
- type: curveType,
1327
- dataKey,
1328
- stroke: color,
1329
- strokeWidth,
1330
- fill: filled ? `url(#spark-gradient-${sparkId})` : "none",
1331
- fillOpacity: 1,
1332
- dot: false,
1333
- activeDot: false,
1334
- isAnimationActive: true,
1335
- animationDuration: 600,
1336
- animationEasing: "ease-out"
1337
- }
1338
- )
1339
- ]
1340
- }
1341
- ) }),
1342
- showEndDot && lastValue !== void 0 && lastValue !== null && /* @__PURE__ */ jsxRuntime.jsx(
1343
- "div",
1344
- {
1345
- className: "pointer-events-none absolute right-0 top-1/2 h-2.5 w-2.5 -translate-y-1/2 rounded-full ring-2 ring-background",
1346
- style: { backgroundColor: color }
1347
- }
1348
- )
1349
- ] });
1350
- }
1351
- function RadarMetricChart({
1352
- data,
1353
- labelKey,
1354
- series,
1355
- colors,
1356
- filled = true,
1357
- fillOpacity = 0.25,
1358
- showDots = false,
1359
- showGrid = true,
1360
- showLegend,
1361
- valueFormatter,
1362
- isLoading,
1363
- error,
1364
- onRetry,
1365
- retryLabel,
1366
- emptyTitle,
1367
- emptyDescription,
1368
- errorTitle,
1369
- errorDescription,
1370
- loadingLabel,
1371
- stateClassName,
1372
- className
1373
- }) {
1374
- const chartConfig = React__namespace.useMemo(
1375
- () => buildChartConfig(
1376
- series.map((s) => s.key),
1377
- colors
1378
- ),
1379
- [series, colors]
1380
- );
1381
- const hasData = data.length > 0 && series.length > 0;
1382
- const chartState = getChartState(
1383
- {
1384
- isLoading,
1385
- error,
1386
- emptyTitle,
1387
- emptyDescription,
1388
- errorTitle,
1389
- errorDescription,
1390
- loadingLabel,
1391
- stateClassName,
1392
- onRetry,
1393
- retryLabel
1394
- },
1395
- hasData
1396
- );
1397
- const displayLegend = showLegend ?? series.length > 1;
1398
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[300px] w-full", className), children: chartState ?? /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.RadarChart, { data, accessibilityLayer: true, children: [
1399
- showGrid && /* @__PURE__ */ jsxRuntime.jsx(RechartsPrimitive__namespace.PolarGrid, { stroke: "var(--border)", strokeOpacity: 0.6 }),
1400
- /* @__PURE__ */ jsxRuntime.jsx(
1401
- RechartsPrimitive__namespace.PolarAngleAxis,
1402
- {
1403
- dataKey: labelKey,
1404
- tick: { fill: "var(--muted-foreground)", fontSize: 12 }
1405
- }
1406
- ),
1407
- /* @__PURE__ */ jsxRuntime.jsx(
1408
- RechartsPrimitive__namespace.PolarRadiusAxis,
1409
- {
1410
- tick: false,
1411
- axisLine: false,
1412
- tickFormatter: valueFormatter
1413
- }
1414
- ),
1415
- /* @__PURE__ */ jsxRuntime.jsx(
1416
- ChartTooltip,
1417
- {
1418
- content: /* @__PURE__ */ jsxRuntime.jsx(
1419
- ChartTooltipContent,
1420
- {
1421
- formatter: valueFormatter ? (v) => valueFormatter(v) : void 0
1422
- }
1423
- )
1424
- }
1425
- ),
1426
- displayLegend && /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, {}) }),
1427
- series.map((s) => /* @__PURE__ */ jsxRuntime.jsx(
1428
- RechartsPrimitive__namespace.Radar,
1429
- {
1430
- name: s.label ?? s.key,
1431
- dataKey: s.key,
1432
- stroke: `var(--color-${s.key})`,
1433
- fill: filled ? `var(--color-${s.key})` : "none",
1434
- fillOpacity: filled ? fillOpacity : 0,
1435
- dot: showDots ? { r: 3, fill: `var(--color-${s.key})` } : false,
1436
- isAnimationActive: true,
1437
- animationDuration: 600,
1438
- animationEasing: "ease-out"
1439
- },
1440
- s.key
1441
- ))
1442
- ] }) });
1443
- }
1444
- function PieMetricChart({
1445
- data,
1446
- nameKey,
1447
- valueKey,
1448
- colors,
1449
- outerRadius = "80%",
1450
- innerRadius = 0,
1451
- showLabels = false,
1452
- showLegend = true,
1453
- explodeIndex,
1454
- explodeOffset = 12,
1455
- valueFormatter,
1456
- isLoading,
1457
- error,
1458
- onRetry,
1459
- retryLabel,
1460
- emptyTitle,
1461
- emptyDescription,
1462
- errorTitle,
1463
- errorDescription,
1464
- loadingLabel,
1465
- stateClassName,
1466
- className
1467
- }) {
1468
- const names = React__namespace.useMemo(() => data.map((d) => String(d[nameKey] ?? "")), [data, nameKey]);
1469
- const chartConfig = React__namespace.useMemo(() => buildChartConfig(names, colors), [names, colors]);
1470
- const hasData = hasPieData(data, nameKey, valueKey);
1471
- const chartState = getChartState(
1472
- {
1473
- isLoading,
1474
- error,
1475
- emptyTitle,
1476
- emptyDescription,
1477
- errorTitle,
1478
- errorDescription,
1479
- loadingLabel,
1480
- stateClassName,
1481
- onRetry,
1482
- retryLabel
1483
- },
1484
- hasData
1485
- );
1486
- return /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: button.cn("h-[300px] w-full", className), children: chartState ?? /* @__PURE__ */ jsxRuntime.jsxs(RechartsPrimitive__namespace.PieChart, { accessibilityLayer: true, children: [
1487
- /* @__PURE__ */ jsxRuntime.jsx(
1488
- ChartTooltip,
1489
- {
1490
- content: /* @__PURE__ */ jsxRuntime.jsx(
1491
- ChartTooltipContent,
1492
- {
1493
- nameKey,
1494
- formatter: valueFormatter ? (v) => valueFormatter(v) : void 0
1495
- }
1496
- )
1497
- }
1498
- ),
1499
- showLegend && /* @__PURE__ */ jsxRuntime.jsx(ChartLegend, { content: /* @__PURE__ */ jsxRuntime.jsx(ChartLegendContent, { nameKey }) }),
1500
- /* @__PURE__ */ jsxRuntime.jsx(
1501
- RechartsPrimitive__namespace.Pie,
1502
- {
1503
- data,
1504
- dataKey: valueKey,
1505
- nameKey,
1506
- outerRadius,
1507
- innerRadius,
1508
- paddingAngle: 2,
1509
- label: showLabels ? ({ cx, cy, midAngle, innerRadius: ir, outerRadius: or, percent }) => {
1510
- const RADIAN = Math.PI / 180;
1511
- const radius = Number(ir) + (Number(or) - Number(ir)) * 1.35;
1512
- const x = Number(cx) + radius * Math.cos(-midAngle * RADIAN);
1513
- const y = Number(cy) + radius * Math.sin(-midAngle * RADIAN);
1514
- return percent > 0.04 ? /* @__PURE__ */ jsxRuntime.jsx(
1515
- "text",
1516
- {
1517
- x,
1518
- y,
1519
- fill: "var(--foreground)",
1520
- textAnchor: x > Number(cx) ? "start" : "end",
1521
- dominantBaseline: "central",
1522
- fontSize: 12,
1523
- fontWeight: 500,
1524
- children: `${(percent * 100).toFixed(0)}%`
1525
- }
1526
- ) : null;
1527
- } : false,
1528
- labelLine: false,
1529
- isAnimationActive: true,
1530
- animationDuration: 600,
1531
- animationEasing: "ease-out",
1532
- children: data.map((entry, index) => {
1533
- const name = String(entry[nameKey] ?? "");
1534
- const isExploded = index === explodeIndex;
1535
- return /* @__PURE__ */ jsxRuntime.jsx(
1536
- RechartsPrimitive__namespace.Cell,
1537
- {
1538
- fill: chartConfig[name]?.color ?? `var(--chart-${index % 8 + 1})`,
1539
- stroke: "var(--background)",
1540
- strokeWidth: 2,
1541
- style: isExploded ? {
1542
- filter: `drop-shadow(0 4px 8px color-mix(in srgb, ${chartConfig[name]?.color ?? "var(--chart-1)"} 40%, transparent))`
1543
- } : void 0
1544
- },
1545
- `cell-${index}`
1546
- );
1547
- })
1548
- }
1549
- )
1550
- ] }) });
1551
- }
1552
- function RadialBarMetricChart({
1553
- data,
1554
- dataKey = "value",
1555
- nameKey = "name",
1556
- colors,
1557
- innerRadius = "30%",
1558
- outerRadius = "100%",
1559
- startAngle = 90,
1560
- endAngle = -270,
1561
- showBackground = true,
1562
- showLegend = true,
1563
- valueFormatter,
1564
- isLoading,
1565
- error,
1566
- onRetry,
1567
- retryLabel,
1568
- emptyTitle,
1569
- emptyDescription,
1570
- errorTitle,
1571
- errorDescription,
1572
- loadingLabel,
1573
- stateClassName,
1574
- className
1575
- }) {
1576
- const names = React__namespace.useMemo(() => data.map((d) => String(d[nameKey] ?? "")), [data, nameKey]);
1577
- const chartConfig = React__namespace.useMemo(() => buildChartConfig(names, colors), [names, colors]);
1578
- const hasData = data.length > 0;
1579
- const chartState = getChartState(
1580
- {
1581
- isLoading,
1582
- error,
1583
- emptyTitle,
1584
- emptyDescription,
1585
- errorTitle,
1586
- errorDescription,
1587
- loadingLabel,
1588
- stateClassName,
1589
- onRetry,
1590
- retryLabel
1591
- },
1592
- hasData
1593
- );
1594
- const coloredData = React__namespace.useMemo(
1595
- () => data.map((item, index) => {
1596
- const name = String(item[nameKey] ?? "");
1597
- return {
1598
- ...item,
1599
- fill: chartConfig[name]?.color ?? `var(--chart-${index % 8 + 1})`
1600
- };
1601
- }),
1602
- [data, nameKey, chartConfig]
1603
- );
1604
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: button.cn("flex w-full flex-col gap-3", className), children: [
1605
- /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { config: chartConfig, className: "h-[260px] w-full", children: chartState ?? /* @__PURE__ */ jsxRuntime.jsxs(
1606
- RechartsPrimitive__namespace.RadialBarChart,
1607
- {
1608
- data: coloredData,
1609
- innerRadius,
1610
- outerRadius,
1611
- startAngle,
1612
- endAngle,
1613
- accessibilityLayer: true,
1614
- children: [
1615
- /* @__PURE__ */ jsxRuntime.jsx(
1616
- ChartTooltip,
1617
- {
1618
- cursor: false,
1619
- content: /* @__PURE__ */ jsxRuntime.jsx(
1620
- ChartTooltipContent,
1621
- {
1622
- nameKey,
1623
- formatter: valueFormatter ? (v) => valueFormatter(v) : void 0
1624
- }
1625
- )
1626
- }
1627
- ),
1628
- /* @__PURE__ */ jsxRuntime.jsx(
1629
- RechartsPrimitive__namespace.RadialBar,
1630
- {
1631
- dataKey,
1632
- background: showBackground ? { fill: "var(--muted)" } : false,
1633
- cornerRadius: 6,
1634
- isAnimationActive: true,
1635
- animationDuration: 700,
1636
- animationEasing: "ease-out"
1637
- }
1638
- )
1639
- ]
1640
- }
1641
- ) }),
1642
- showLegend && !chartState && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-center gap-x-4 gap-y-1.5 px-2", children: coloredData.map((item, index) => {
1643
- const d = item;
1644
- const name = String(d[nameKey] ?? "");
1645
- const fillColor = d.fill ?? `var(--chart-${index % 8 + 1})`;
1646
- const val = d[dataKey];
1647
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
1648
- /* @__PURE__ */ jsxRuntime.jsx(
1649
- "span",
1650
- {
1651
- className: "inline-block h-2.5 w-2.5 shrink-0 rounded-full",
1652
- style: { backgroundColor: fillColor }
1653
- }
1654
- ),
1655
- /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
1656
- name,
1657
- val !== void 0 && val !== null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 font-medium text-foreground", children: valueFormatter ? valueFormatter(val) : String(val) })
1658
- ] })
1659
- ] }, name);
1660
- }) })
1661
- ] });
1662
- }
1663
- function GaugeChart({
1664
- value,
1665
- min = 0,
1666
- max = 100,
1667
- thresholds,
1668
- label,
1669
- valueFormatter,
1670
- showNeedle = true,
1671
- className
1672
- }) {
1673
- const percent = Math.min(1, Math.max(0, (value - min) / (max - min)));
1674
- const percentInt = Math.round(percent * 100);
1675
- const activeColor = React__namespace.useMemo(() => {
1676
- if (!thresholds || thresholds.length === 0) return "var(--chart-1)";
1677
- for (const t of thresholds) {
1678
- if (percentInt <= t.value) return t.color;
1679
- }
1680
- return thresholds[thresholds.length - 1].color;
1681
- }, [thresholds, percentInt]);
1682
- const displayText = valueFormatter ? valueFormatter(value, percentInt) : `${percentInt}%`;
1683
- const cx = 100;
1684
- const cy = 100;
1685
- const R = 80;
1686
- const r = 54;
1687
- const polar = (angleDeg, radius) => {
1688
- const rad = angleDeg * Math.PI / 180;
1689
- return {
1690
- x: cx + radius * Math.cos(rad),
1691
- y: cy - radius * Math.sin(rad)
1692
- };
1693
- };
1694
- const trackStart = polar(180, R);
1695
- const trackEnd = polar(0, R);
1696
- const trackStartI = polar(180, r);
1697
- const trackEndI = polar(0, r);
1698
- const trackPath = [
1699
- `M ${trackStart.x} ${trackStart.y}`,
1700
- `A ${R} ${R} 0 0 1 ${trackEnd.x} ${trackEnd.y}`,
1701
- `L ${trackEndI.x} ${trackEndI.y}`,
1702
- `A ${r} ${r} 0 0 0 ${trackStartI.x} ${trackStartI.y}`,
1703
- "Z"
1704
- ].join(" ");
1705
- const valueAngle = 180 - percent * 180;
1706
- const valueEnd = polar(valueAngle, R);
1707
- const valueEndI = polar(valueAngle, r);
1708
- const valuePath = percent <= 0 ? "" : percent >= 1 ? trackPath : [
1709
- `M ${trackStart.x} ${trackStart.y}`,
1710
- `A ${R} ${R} 0 0 1 ${valueEnd.x} ${valueEnd.y}`,
1711
- `L ${valueEndI.x} ${valueEndI.y}`,
1712
- `A ${r} ${r} 0 0 0 ${trackStartI.x} ${trackStartI.y}`,
1713
- "Z"
1714
- ].join(" ");
1715
- const needleAngle = 180 - percent * 180;
1716
- const needleTip = polar(needleAngle, r - 6);
1717
- const needleBase1 = polar(needleAngle + 90, 5);
1718
- const needleBase2 = polar(needleAngle - 90, 5);
1719
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: button.cn("flex flex-col items-center gap-2", className), children: [
1720
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-full max-w-[260px]", children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 200 130", className: "w-full", "aria-label": `Gauge: ${displayText}`, children: [
1721
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: trackPath, fill: "var(--muted)" }),
1722
- valuePath && /* @__PURE__ */ jsxRuntime.jsx("path", { d: valuePath, fill: activeColor }),
1723
- showNeedle && /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
1724
- /* @__PURE__ */ jsxRuntime.jsx(
1725
- "polygon",
1726
- {
1727
- points: `${needleTip.x},${needleTip.y} ${needleBase1.x},${needleBase1.y} ${needleBase2.x},${needleBase2.y}`,
1728
- fill: "var(--foreground)",
1729
- opacity: 0.85
1730
- }
1731
- ),
1732
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx, cy, r: 5, fill: "var(--foreground)" })
1733
- ] }),
1734
- /* @__PURE__ */ jsxRuntime.jsx(
1735
- "text",
1736
- {
1737
- x: cx,
1738
- y: cy + 18,
1739
- textAnchor: "middle",
1740
- dominantBaseline: "middle",
1741
- fontSize: 22,
1742
- fontWeight: 700,
1743
- fill: "currentColor",
1744
- className: "fill-foreground",
1745
- children: displayText
1746
- }
1747
- ),
1748
- label && /* @__PURE__ */ jsxRuntime.jsx(
1749
- "text",
1750
- {
1751
- x: cx,
1752
- y: cy + 36,
1753
- textAnchor: "middle",
1754
- dominantBaseline: "middle",
1755
- fontSize: 10,
1756
- fill: "currentColor",
1757
- className: "fill-muted-foreground",
1758
- children: label
1759
- }
1760
- )
1761
- ] }) }),
1762
- thresholds && thresholds.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-center gap-x-3 gap-y-1", children: thresholds.map((t, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1.5", children: [
1763
- /* @__PURE__ */ jsxRuntime.jsx(
1764
- "span",
1765
- {
1766
- className: "inline-block h-2 w-2 shrink-0 rounded-full",
1767
- style: { backgroundColor: t.color }
1768
- }
1769
- ),
1770
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: t.label })
1771
- ] }, i)) })
1772
- ] });
1773
- }
1774
- function Table({ className, ...props }) {
1775
- return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "table-container", className: "relative w-full overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
1776
- "table",
1777
- {
1778
- "data-slot": "table",
1779
- className: button.cn("w-full caption-bottom text-sm", className),
1780
- ...props
1781
- }
1782
- ) });
1783
- }
1784
- function TableHeader({ className, ...props }) {
1785
- return /* @__PURE__ */ jsxRuntime.jsx("thead", { "data-slot": "table-header", className: button.cn("[&_tr]:border-b", className), ...props });
1786
- }
1787
- function TableBody({ className, ...props }) {
1788
- return /* @__PURE__ */ jsxRuntime.jsx(
1789
- "tbody",
1790
- {
1791
- "data-slot": "table-body",
1792
- className: button.cn("[&_tr:last-child]:border-0", className),
1793
- ...props
1794
- }
1795
- );
1796
- }
1797
- function TableFooter({ className, ...props }) {
1798
- return /* @__PURE__ */ jsxRuntime.jsx(
1799
- "tfoot",
1800
- {
1801
- "data-slot": "table-footer",
1802
- className: button.cn("bg-muted/50 border-t font-medium [&>tr]:last:border-b-0", className),
1803
- ...props
1804
- }
1805
- );
1806
- }
1807
- function TableRow({ className, ...props }) {
1808
- return /* @__PURE__ */ jsxRuntime.jsx(
1809
- "tr",
1810
- {
1811
- "data-slot": "table-row",
1812
- className: button.cn(
1813
- "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
1814
- className
1815
- ),
1816
- ...props
1817
- }
1818
- );
1819
- }
1820
- function TableHead({ className, ...props }) {
1821
- return /* @__PURE__ */ jsxRuntime.jsx(
1822
- "th",
1823
- {
1824
- "data-slot": "table-head",
1825
- className: button.cn(
1826
- "text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
1827
- className
1828
- ),
1829
- ...props
1830
- }
1831
- );
1832
- }
1833
- function TableCell({ className, ...props }) {
1834
- return /* @__PURE__ */ jsxRuntime.jsx(
1835
- "td",
1836
- {
1837
- "data-slot": "table-cell",
1838
- className: button.cn(
1839
- "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
1840
- className
1841
- ),
1842
- ...props
1843
- }
1844
- );
1845
- }
1846
- function TableCaption({ className, ...props }) {
1847
- return /* @__PURE__ */ jsxRuntime.jsx(
1848
- "caption",
1849
- {
1850
- "data-slot": "table-caption",
1851
- className: button.cn("text-muted-foreground mt-4 text-sm", className),
1852
- ...props
1853
- }
1854
- );
1855
- }
1856
- const Textarea = React__namespace.forwardRef(
1857
- ({ className, size = "md", ...props }, ref) => {
1858
- const sizeClasses = {
1859
- sm: "px-2 py-1 text-sm",
1860
- md: "px-3 py-2 text-base",
1861
- lg: "px-4 py-3 text-base"
1862
- };
1863
- return /* @__PURE__ */ jsxRuntime.jsx(
1864
- "textarea",
1865
- {
1866
- "data-slot": "textarea",
1867
- className: button.cn(
1868
- "flex min-h-16 w-full bg-background rounded-[var(--radius)] border border-border transition-colors outline-none resize-none text-foreground",
1869
- "placeholder:text-muted-foreground",
1870
- "focus:ring-2 focus:ring-primary focus:border-transparent",
1871
- "disabled:cursor-not-allowed disabled:opacity-50",
1872
- sizeClasses[size],
1873
- className
1874
- ),
1875
- ref,
1876
- ...props
1877
- }
1878
- );
1879
- }
1880
- );
1881
- Textarea.displayName = "Textarea";
1882
- function Dialog({ ...props }) {
1883
- return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { "data-slot": "dialog", ...props });
1884
- }
1885
- function DialogTrigger({ ...props }) {
1886
- return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Trigger, { "data-slot": "dialog-trigger", ...props });
1887
- }
1888
- function DialogPortal({ ...props }) {
1889
- return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { "data-slot": "dialog-portal", ...props });
1890
- }
1891
- function DialogClose({ ...props }) {
1892
- return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { "data-slot": "dialog-close", ...props });
1893
- }
1894
- const DialogOverlay = React__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
1895
- DialogPrimitive__namespace.Overlay,
1896
- {
1897
- ref,
1898
- "data-slot": "dialog-overlay",
1899
- className: button.cn(
1900
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/40 backdrop-blur-sm",
1901
- className
1902
- ),
1903
- ...props
1904
- }
1905
- ));
1906
- DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
1907
- const dialogVariants = classVarianceAuthority.cva(
1908
- "bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 flex flex-col w-full translate-x-[-50%] translate-y-[-50%] border shadow-elevation-sm duration-200 rounded-[var(--radius-card)] overflow-hidden max-h-[calc(100dvh-2rem)]",
1909
- {
1910
- variants: {
1911
- size: {
1912
- sm: "max-w-sm",
1913
- md: "max-w-md",
1914
- lg: "max-w-lg",
1915
- xl: "max-w-xl",
1916
- "2xl": "max-w-2xl",
1917
- "3xl": "max-w-3xl",
1918
- "4xl": "max-w-4xl",
1919
- "5xl": "max-w-5xl",
1920
- full: "max-w-[calc(100vw-2rem)] h-[calc(100dvh-2rem)]"
1921
- }
1922
- },
1923
- defaultVariants: {
1924
- size: "lg"
1925
- }
1926
- }
1927
- );
1928
- const DialogContent = React__namespace.forwardRef(({ className, children, size, showClose = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
1929
- /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
1930
- /* @__PURE__ */ jsxRuntime.jsxs(
1931
- DialogPrimitive__namespace.Content,
1932
- {
1933
- ref,
1934
- "data-slot": "dialog-content",
1935
- className: button.cn(dialogVariants({ size }), className),
1936
- ...props,
1937
- children: [
1938
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 p-6 overflow-y-auto flex-1 min-h-0", children }),
1939
- showClose && /* @__PURE__ */ jsxRuntime.jsxs(DialogPrimitive__namespace.Close, { className: "absolute top-4 right-4 z-10 rounded-full p-2 opacity-70 transition-all hover:opacity-100 hover:bg-accent focus:ring-2 focus:ring-primary focus:ring-offset-2 focus:outline-none disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", children: [
1940
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XIcon, {}),
1941
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
1942
- ] })
1943
- ]
1944
- }
1945
- )
1946
- ] }));
1947
- DialogContent.displayName = DialogPrimitive__namespace.Content.displayName;
1948
- function DialogHeader({ className, ...props }) {
1949
- return /* @__PURE__ */ jsxRuntime.jsx(
1950
- "div",
1951
- {
1952
- "data-slot": "dialog-header",
1953
- className: button.cn("flex flex-col gap-2 text-left shrink-0", className),
1954
- ...props
1955
- }
1956
- );
1957
- }
1958
- function DialogBody({ className, ...props }) {
1959
- return /* @__PURE__ */ jsxRuntime.jsx(
1960
- "div",
1961
- {
1962
- "data-slot": "dialog-body",
1963
- className: button.cn("flex-1 overflow-y-auto min-h-0 -mx-6 px-6", className),
1964
- ...props
1965
- }
1966
- );
1967
- }
1968
- function DialogFooter({ className, ...props }) {
1969
- return /* @__PURE__ */ jsxRuntime.jsx(
1970
- "div",
1971
- {
1972
- "data-slot": "dialog-footer",
1973
- className: button.cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end shrink-0", className),
1974
- ...props
1975
- }
1976
- );
1977
- }
1978
- function DialogTitle({ className, ...props }) {
1979
- return /* @__PURE__ */ jsxRuntime.jsx(
1980
- DialogPrimitive__namespace.Title,
1981
- {
1982
- "data-slot": "dialog-title",
1983
- className: button.cn(
1984
- "text-foreground font-semibold leading-tight text-[length:var(--text-h4)]",
1985
- className
1986
- ),
1987
- ...props
1988
- }
1989
- );
1990
- }
1991
- function DialogDescription({
1992
- className,
1993
- ...props
1994
- }) {
1995
- return /* @__PURE__ */ jsxRuntime.jsx(
1996
- DialogPrimitive__namespace.Description,
1997
- {
1998
- "data-slot": "dialog-description",
1999
- className: button.cn("text-muted-foreground", className),
2000
- ...props
2001
- }
2002
- );
2003
- }
2004
- function useRichTextEditor({
2005
- value,
2006
- onChange
2007
- }) {
2008
- const editorRef = React.useRef(null);
2009
- const searchInputRef = React.useRef(null);
2010
- const linkInputRef = React.useRef(null);
2011
- const savedSelection = React.useRef(null);
2012
- const [wordCount, setWordCount] = React.useState(0);
2013
- const [characterCount, setCharacterCount] = React.useState(0);
2014
- const [activeFormats, setActiveFormats] = React.useState({
2015
- bold: false,
2016
- italic: false,
2017
- underline: false,
2018
- justifyLeft: false,
2019
- justifyCenter: false,
2020
- justifyRight: false,
2021
- insertUnorderedList: false,
2022
- insertOrderedList: false,
2023
- link: false,
2024
- h1: false,
2025
- h2: false,
2026
- h3: false,
2027
- p: true
2028
- });
2029
- const [isSearchOpen, setIsSearchOpen] = React.useState(false);
2030
- const [searchQuery, setSearchQuery] = React.useState("");
2031
- const [linkUrl, setLinkUrl] = React.useState("https://");
2032
- const [isLinkOpen, setIsLinkOpen] = React.useState(false);
2033
- const [hasSavedSelection, setHasSavedSelection] = React.useState(false);
2034
- const findParentTag = React.useCallback((node, tagName) => {
2035
- let current = node;
2036
- while (current && current !== editorRef.current) {
2037
- if (current.nodeName === tagName) return current;
2038
- current = current.parentNode;
2039
- }
2040
- return null;
2041
- }, []);
2042
- const updateActiveFormats = React.useCallback(() => {
2043
- let formatBlock = "";
2044
- try {
2045
- formatBlock = document.queryCommandValue("formatBlock");
2046
- } catch (_e) {
2047
- }
2048
- const selection = window.getSelection();
2049
- const anchorNode = selection?.anchorNode;
2050
- const focusNode = selection?.focusNode;
2051
- setActiveFormats({
2052
- bold: document.queryCommandState("bold"),
2053
- italic: document.queryCommandState("italic"),
2054
- underline: document.queryCommandState("underline"),
2055
- justifyLeft: document.queryCommandState("justifyLeft"),
2056
- justifyCenter: document.queryCommandState("justifyCenter"),
2057
- justifyRight: document.queryCommandState("justifyRight"),
2058
- insertUnorderedList: document.queryCommandState("insertUnorderedList"),
2059
- insertOrderedList: document.queryCommandState("insertOrderedList"),
2060
- link: !!(findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A")),
2061
- h1: formatBlock === "h1" || formatBlock === "H1",
2062
- h2: formatBlock === "h2" || formatBlock === "H2",
2063
- h3: formatBlock === "h3" || formatBlock === "H3",
2064
- p: formatBlock === "p" || formatBlock === "P" || formatBlock === "div" || formatBlock === "DIV" || formatBlock === ""
2065
- });
2066
- }, [findParentTag]);
2067
- const updateActiveFormatsRef = React.useRef(updateActiveFormats);
2068
- React.useEffect(() => {
2069
- updateActiveFormatsRef.current = updateActiveFormats;
2070
- }, [updateActiveFormats]);
2071
- React.useEffect(() => {
2072
- if (editorRef.current && editorRef.current.innerHTML !== value) {
2073
- editorRef.current.innerHTML = value;
2074
- }
2075
- const handleSelectionChange = () => {
2076
- if (document.activeElement === editorRef.current) {
2077
- updateActiveFormatsRef.current();
2078
- }
2079
- };
2080
- document.addEventListener("selectionchange", handleSelectionChange);
2081
- return () => document.removeEventListener("selectionchange", handleSelectionChange);
2082
- }, []);
2083
- React.useEffect(() => {
2084
- const text = editorRef.current?.innerText || "";
2085
- setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
2086
- setCharacterCount(text.trim() ? text.length : 0);
2087
- }, [value]);
2088
- const handleInput = React.useCallback(() => {
2089
- if (editorRef.current) {
2090
- onChange?.(editorRef.current.innerHTML);
2091
- updateActiveFormats();
2092
- const text = editorRef.current.innerText || "";
2093
- setWordCount(text.trim() ? text.trim().split(/\s+/).length : 0);
2094
- setCharacterCount(text.trim() ? text.length : 0);
2095
- }
2096
- }, [onChange, updateActiveFormats]);
2097
- const execCommand = React.useCallback(
2098
- (command, val = "") => {
2099
- document.execCommand(command, false, val);
2100
- updateActiveFormats();
2101
- editorRef.current?.focus();
2102
- if (editorRef.current) {
2103
- onChange?.(editorRef.current.innerHTML);
2104
- }
2105
- },
2106
- [onChange, updateActiveFormats]
2107
- );
2108
- const performSearch = React.useCallback((text, backward = false) => {
2109
- if (!text || !editorRef.current) return;
2110
- const editor = editorRef.current;
2111
- const selection = window.getSelection();
2112
- if (!selection) return;
2113
- const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT);
2114
- const segments = [];
2115
- let offset = 0;
2116
- let node;
2117
- while (node = walker.nextNode()) {
2118
- segments.push({ node, start: offset });
2119
- offset += node.length;
2120
- }
2121
- const fullText = segments.reduce((acc, s) => acc + (s.node.textContent ?? ""), "");
2122
- let searchFrom = 0;
2123
- if (selection.rangeCount > 0) {
2124
- const range2 = selection.getRangeAt(0);
2125
- if (editor.contains(range2.startContainer)) {
2126
- const seg = segments.find((s) => s.node === range2.startContainer);
2127
- if (seg) {
2128
- searchFrom = backward ? seg.start + range2.startOffset - 1 : seg.start + range2.endOffset;
2129
- }
2130
- }
2131
- }
2132
- const lowerFull = fullText.toLowerCase();
2133
- const lowerQuery = text.toLowerCase();
2134
- let matchStart = -1;
2135
- if (backward) {
2136
- matchStart = lowerFull.lastIndexOf(lowerQuery, Math.max(0, searchFrom));
2137
- if (matchStart === -1) matchStart = lowerFull.lastIndexOf(lowerQuery);
2138
- } else {
2139
- matchStart = lowerFull.indexOf(lowerQuery, searchFrom);
2140
- if (matchStart === -1) matchStart = lowerFull.indexOf(lowerQuery);
2141
- }
2142
- if (matchStart === -1) return;
2143
- const matchEnd = matchStart + text.length;
2144
- const range = document.createRange();
2145
- let startSet = false;
2146
- let endSet = false;
2147
- for (let i = 0; i < segments.length && !endSet; i++) {
2148
- const seg = segments[i];
2149
- const segEnd = seg.start + seg.node.length;
2150
- if (!startSet && matchStart < segEnd && matchStart >= seg.start) {
2151
- range.setStart(seg.node, matchStart - seg.start);
2152
- startSet = true;
2153
- }
2154
- if (startSet && matchEnd <= segEnd) {
2155
- range.setEnd(seg.node, matchEnd - seg.start);
2156
- endSet = true;
2157
- }
2158
- }
2159
- if (startSet && endSet) {
2160
- selection.removeAllRanges();
2161
- selection.addRange(range);
2162
- range.startContainer.parentElement?.scrollIntoView?.({ block: "nearest" });
2163
- }
2164
- }, []);
2165
- const handleCreateLink = React.useCallback(() => {
2166
- if (savedSelection.current) {
2167
- const selection2 = window.getSelection();
2168
- selection2?.removeAllRanges();
2169
- selection2?.addRange(savedSelection.current);
2170
- }
2171
- const selection = window.getSelection();
2172
- const anchorNode = selection?.anchorNode;
2173
- const existingLink = findParentTag(anchorNode || null, "A");
2174
- if (existingLink) {
2175
- if (linkUrl) {
2176
- existingLink.setAttribute("href", linkUrl);
2177
- existingLink.setAttribute("target", "_blank");
2178
- existingLink.setAttribute("rel", "noopener noreferrer");
2179
- existingLink.style.color = "hsl(var(--primary))";
2180
- existingLink.style.textDecoration = "underline";
2181
- existingLink.style.cursor = "pointer";
2182
- }
2183
- handleInput();
2184
- setIsLinkOpen(false);
2185
- savedSelection.current = null;
2186
- return;
2187
- }
2188
- if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
2189
- return;
2190
- }
2191
- if (linkUrl) {
2192
- document.execCommand("createLink", false, linkUrl);
2193
- setTimeout(() => {
2194
- const anchor = findParentTag(window.getSelection()?.anchorNode || null, "A");
2195
- if (anchor) {
2196
- anchor.setAttribute("target", "_blank");
2197
- anchor.setAttribute("rel", "noopener noreferrer");
2198
- anchor.style.color = "hsl(var(--primary))";
2199
- anchor.style.textDecoration = "underline";
2200
- anchor.style.cursor = "pointer";
2201
- }
2202
- handleInput();
2203
- }, 10);
2204
- setIsLinkOpen(false);
2205
- savedSelection.current = null;
2206
- }
2207
- }, [linkUrl, findParentTag, handleInput]);
2208
- const handleUnlink = React.useCallback(() => {
2209
- const selection = window.getSelection();
2210
- const anchorNode = selection?.anchorNode;
2211
- const existingLink = findParentTag(anchorNode || null, "A");
2212
- if (existingLink) {
2213
- const parent = existingLink.parentNode;
2214
- while (existingLink.firstChild) {
2215
- parent?.insertBefore(existingLink.firstChild, existingLink);
2216
- }
2217
- parent?.removeChild(existingLink);
2218
- handleInput();
2219
- } else {
2220
- document.execCommand("unlink", false, "");
2221
- }
2222
- }, [findParentTag, handleInput]);
2223
- const onLinkPopoverOpenChange = React.useCallback(
2224
- (open) => {
2225
- if (open) {
2226
- const selection = window.getSelection();
2227
- const anchorNode = selection?.anchorNode;
2228
- const focusNode = selection?.focusNode;
2229
- const existingLink = findParentTag(anchorNode || null, "A") || findParentTag(focusNode || null, "A");
2230
- if (existingLink) {
2231
- setLinkUrl(existingLink.getAttribute("href") || "https://");
2232
- } else {
2233
- setLinkUrl("https://");
2234
- }
2235
- if (selection && selection.rangeCount > 0 && (!selection.isCollapsed || existingLink)) {
2236
- savedSelection.current = selection.getRangeAt(0).cloneRange();
2237
- setHasSavedSelection(true);
2238
- } else {
2239
- savedSelection.current = null;
2240
- setHasSavedSelection(false);
2241
- }
2242
- setTimeout(() => linkInputRef.current?.focus(), 100);
2243
- } else {
2244
- setHasSavedSelection(false);
2245
- }
2246
- setIsLinkOpen(open);
2247
- },
2248
- [findParentTag]
2249
- );
2250
- return {
2251
- // Refs
2252
- editorRef,
2253
- searchInputRef,
2254
- linkInputRef,
2255
- // State
2256
- activeFormats,
2257
- isSearchOpen,
2258
- setIsSearchOpen,
2259
- searchQuery,
2260
- setSearchQuery,
2261
- linkUrl,
2262
- setLinkUrl,
2263
- isLinkOpen,
2264
- hasSavedSelection,
2265
- // Computed
2266
- wordCount,
2267
- characterCount,
2268
- // Handlers
2269
- updateActiveFormats,
2270
- execCommand,
2271
- handleInput,
2272
- performSearch,
2273
- handleCreateLink,
2274
- handleUnlink,
2275
- onLinkPopoverOpenChange
2276
- };
2277
- }
2278
- function RichTextEditor({
2279
- value,
2280
- onChange,
2281
- placeholder,
2282
- className,
2283
- actionButton,
2284
- allowSearch = true,
2285
- allowLinks = true,
2286
- allowUndoRedo = true,
2287
- allowHeadings = true,
2288
- allowFormatting = true,
2289
- allowAlignment = true,
2290
- allowLists = true,
2291
- showWordCount = true,
2292
- showCharacterCount = true,
2293
- disabled = false,
2294
- readOnly = false,
2295
- onFocus,
2296
- onBlur,
2297
- minHeight,
2298
- maxHeight
2299
- }) {
2300
- const isEditable = !disabled && !readOnly;
2301
- const showToolbar = isEditable;
2302
- const {
2303
- editorRef,
2304
- searchInputRef,
2305
- linkInputRef,
2306
- activeFormats,
2307
- isSearchOpen,
2308
- setIsSearchOpen,
2309
- searchQuery,
2310
- setSearchQuery,
2311
- linkUrl,
2312
- setLinkUrl,
2313
- isLinkOpen,
2314
- hasSavedSelection,
2315
- wordCount,
2316
- characterCount,
2317
- updateActiveFormats,
2318
- execCommand,
2319
- handleInput,
2320
- performSearch,
2321
- handleCreateLink,
2322
- handleUnlink,
2323
- onLinkPopoverOpenChange
2324
- } = useRichTextEditor({ value, onChange });
2325
- const getCurrentBlockLabel = () => {
2326
- if (activeFormats.h1)
2327
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2328
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading1, { className: "w-4 h-4 mr-1 shrink-0" }),
2329
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 1" })
2330
- ] });
2331
- if (activeFormats.h2)
2332
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2333
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading2, { className: "w-4 h-4 mr-1 shrink-0" }),
2334
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 2" })
2335
- ] });
2336
- if (activeFormats.h3)
2337
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2338
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading3, { className: "w-4 h-4 mr-1 shrink-0" }),
2339
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Título 3" })
2340
- ] });
2341
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2342
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4 mr-1 shrink-0" }),
2343
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: "Parágrafo" })
2344
- ] });
2345
- };
2346
- return /* @__PURE__ */ jsxRuntime.jsxs(
2347
- "div",
2348
- {
2349
- className: button.cn(
2350
- "flex flex-col h-full w-full bg-background sm:border border-border sm:shadow-sm sm:rounded-lg overflow-hidden",
2351
- disabled && "opacity-50 pointer-events-none",
2352
- className
2353
- ),
2354
- children: [
2355
- /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
2356
- [contenteditable]:empty:before {
2357
- content: attr(data-placeholder);
2358
- color: hsl(var(--muted-foreground));
2359
- pointer-events: none;
2360
- display: block;
2361
- }
2362
- .prose-editor ul {
2363
- list-style-type: disc !important;
2364
- padding-left: 1.5rem !important;
2365
- margin-top: 0.5rem !important;
2366
- margin-bottom: 0.5rem !important;
2367
- }
2368
- .prose-editor ol {
2369
- list-style-type: decimal !important;
2370
- padding-left: 1.5rem !important;
2371
- margin-top: 0.5rem !important;
2372
- margin-bottom: 0.5rem !important;
2373
- }
2374
- .prose-editor b, .prose-editor strong {
2375
- font-weight: 600 !important;
2376
- }
2377
- .prose-editor i, .prose-editor em {
2378
- font-style: italic !important;
2379
- }
2380
- .prose-editor u {
2381
- text-decoration: underline !important;
2382
- }
2383
- .prose-editor h1 {
2384
- font-size: 2.25rem !important;
2385
- font-weight: 700 !important;
2386
- margin-bottom: 1.25rem !important;
2387
- line-height: 1.2 !important;
2388
- margin-top: 2rem !important;
2389
- color: hsl(var(--foreground));
2390
- }
2391
- .prose-editor h2 {
2392
- font-size: 1.75rem !important;
2393
- font-weight: 600 !important;
2394
- margin-bottom: 1rem !important;
2395
- margin-top: 1.5rem !important;
2396
- color: hsl(var(--foreground));
2397
- }
2398
- .prose-editor h3 {
2399
- font-size: 1.35rem !important;
2400
- font-weight: 600 !important;
2401
- margin-bottom: 0.75rem !important;
2402
- margin-top: 1.25rem !important;
2403
- color: hsl(var(--foreground));
2404
- }
2405
- .prose-editor p {
2406
- margin-bottom: 1rem !important;
2407
- line-height: 1.6 !important;
2408
- }
2409
- .prose-editor a {
2410
- color: var(--info) !important;
2411
- text-decoration: underline !important;
2412
- cursor: pointer !important;
2413
- }
2414
- .prose-editor h1:first-child, .prose-editor h2:first-child, .prose-editor h3:first-child, .prose-editor p:first-child {
2415
- margin-top: 0 !important;
2416
- }
2417
- .prose-editor {
2418
- outline: none !important;
2419
- }
2420
- ` }),
2421
- showToolbar && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2 border-b border-border bg-muted/30 flex items-center gap-1 flex-wrap shrink-0", children: [
2422
- allowUndoRedo && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2423
- /* @__PURE__ */ jsxRuntime.jsx(
2424
- button.Button,
2425
- {
2426
- variant: "ghost",
2427
- size: "icon",
2428
- className: "h-8 w-8 text-muted-foreground",
2429
- onClick: () => execCommand("undo"),
2430
- title: "Desfazer",
2431
- "aria-label": "Desfazer",
2432
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Undo, { className: "w-4 h-4" })
2433
- }
2434
- ),
2435
- /* @__PURE__ */ jsxRuntime.jsx(
2436
- button.Button,
2437
- {
2438
- variant: "ghost",
2439
- size: "icon",
2440
- className: "h-8 w-8 text-muted-foreground",
2441
- onClick: () => execCommand("redo"),
2442
- title: "Refazer",
2443
- "aria-label": "Refazer",
2444
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Redo, { className: "w-4 h-4" })
2445
- }
2446
- ),
2447
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2448
- ] }),
2449
- allowHeadings && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2450
- /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { modal: false, children: [
2451
- /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
2452
- button.Button,
2453
- {
2454
- variant: "ghost",
2455
- size: "sm",
2456
- className: "h-8 gap-0 text-muted-foreground w-[120px] justify-start px-2",
2457
- children: [
2458
- getCurrentBlockLabel(),
2459
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "w-3 h-3 ml-auto opacity-50 shrink-0" })
2460
- ]
2461
- }
2462
- ) }),
2463
- /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent, { align: "start", className: "w-[160px]", style: { zIndex: 9999 }, children: [
2464
- /* @__PURE__ */ jsxRuntime.jsxs(
2465
- dropdownMenu.DropdownMenuItem,
2466
- {
2467
- onPointerDown: (e) => e.preventDefault(),
2468
- onClick: () => execCommand("formatBlock", "P"),
2469
- className: "gap-2",
2470
- children: [
2471
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4 text-muted-foreground" }),
2472
- " Parágrafo"
2473
- ]
2474
- }
2475
- ),
2476
- /* @__PURE__ */ jsxRuntime.jsxs(
2477
- dropdownMenu.DropdownMenuItem,
2478
- {
2479
- onPointerDown: (e) => e.preventDefault(),
2480
- onClick: () => execCommand("formatBlock", "H1"),
2481
- className: "gap-2",
2482
- children: [
2483
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading1, { className: "w-4 h-4 text-muted-foreground" }),
2484
- " Título 1"
2485
- ]
2486
- }
2487
- ),
2488
- /* @__PURE__ */ jsxRuntime.jsxs(
2489
- dropdownMenu.DropdownMenuItem,
2490
- {
2491
- onPointerDown: (e) => e.preventDefault(),
2492
- onClick: () => execCommand("formatBlock", "H2"),
2493
- className: "gap-2",
2494
- children: [
2495
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading2, { className: "w-4 h-4 text-muted-foreground" }),
2496
- " Título 2"
2497
- ]
2498
- }
2499
- ),
2500
- /* @__PURE__ */ jsxRuntime.jsxs(
2501
- dropdownMenu.DropdownMenuItem,
2502
- {
2503
- onPointerDown: (e) => e.preventDefault(),
2504
- onClick: () => execCommand("formatBlock", "H3"),
2505
- className: "gap-2",
2506
- children: [
2507
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Heading3, { className: "w-4 h-4 text-muted-foreground" }),
2508
- " Título 3"
2509
- ]
2510
- }
2511
- )
2512
- ] })
2513
- ] }),
2514
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2515
- ] }),
2516
- allowFormatting && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2517
- /* @__PURE__ */ jsxRuntime.jsx(
2518
- button.Button,
2519
- {
2520
- variant: "ghost",
2521
- size: "icon",
2522
- className: button.cn(
2523
- "h-8 w-8 text-muted-foreground",
2524
- activeFormats.bold && "bg-muted text-foreground"
2525
- ),
2526
- onClick: () => execCommand("bold"),
2527
- title: "Negrito",
2528
- "aria-label": "Negrito",
2529
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Bold, { className: "w-4 h-4" })
2530
- }
2531
- ),
2532
- /* @__PURE__ */ jsxRuntime.jsx(
2533
- button.Button,
2534
- {
2535
- variant: "ghost",
2536
- size: "icon",
2537
- className: button.cn(
2538
- "h-8 w-8 text-muted-foreground",
2539
- activeFormats.italic && "bg-muted text-foreground"
2540
- ),
2541
- onClick: () => execCommand("italic"),
2542
- title: "Itálico",
2543
- "aria-label": "Itálico",
2544
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Italic, { className: "w-4 h-4" })
2545
- }
2546
- ),
2547
- /* @__PURE__ */ jsxRuntime.jsx(
2548
- button.Button,
2549
- {
2550
- variant: "ghost",
2551
- size: "icon",
2552
- className: button.cn(
2553
- "h-8 w-8 text-muted-foreground",
2554
- activeFormats.underline && "bg-muted text-foreground"
2555
- ),
2556
- onClick: () => execCommand("underline"),
2557
- title: "Sublinhado",
2558
- "aria-label": "Sublinhado",
2559
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Underline, { className: "w-4 h-4" })
2560
- }
2561
- ),
2562
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2563
- ] }),
2564
- allowAlignment && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2565
- /* @__PURE__ */ jsxRuntime.jsx(
2566
- button.Button,
2567
- {
2568
- variant: "ghost",
2569
- size: "icon",
2570
- className: button.cn(
2571
- "h-8 w-8 text-muted-foreground",
2572
- activeFormats.justifyLeft && "bg-muted text-foreground"
2573
- ),
2574
- onClick: () => execCommand("justifyLeft"),
2575
- title: "Alinhar à esquerda",
2576
- "aria-label": "Alinhar à esquerda",
2577
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignLeft, { className: "w-4 h-4" })
2578
- }
2579
- ),
2580
- /* @__PURE__ */ jsxRuntime.jsx(
2581
- button.Button,
2582
- {
2583
- variant: "ghost",
2584
- size: "icon",
2585
- className: button.cn(
2586
- "h-8 w-8 text-muted-foreground",
2587
- activeFormats.justifyCenter && "bg-muted text-foreground"
2588
- ),
2589
- onClick: () => execCommand("justifyCenter"),
2590
- title: "Centralizar",
2591
- "aria-label": "Centralizar",
2592
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignCenter, { className: "w-4 h-4" })
2593
- }
2594
- ),
2595
- /* @__PURE__ */ jsxRuntime.jsx(
2596
- button.Button,
2597
- {
2598
- variant: "ghost",
2599
- size: "icon",
2600
- className: button.cn(
2601
- "h-8 w-8 text-muted-foreground",
2602
- activeFormats.justifyRight && "bg-muted text-foreground"
2603
- ),
2604
- onClick: () => execCommand("justifyRight"),
2605
- title: "Alinhar à direita",
2606
- "aria-label": "Alinhar à direita",
2607
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlignRight, { className: "w-4 h-4" })
2608
- }
2609
- ),
2610
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2611
- ] }),
2612
- allowLists && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2613
- /* @__PURE__ */ jsxRuntime.jsx(
2614
- button.Button,
2615
- {
2616
- variant: "ghost",
2617
- size: "icon",
2618
- className: button.cn(
2619
- "h-8 w-8 text-muted-foreground",
2620
- activeFormats.insertUnorderedList && "bg-muted text-foreground"
2621
- ),
2622
- onClick: () => execCommand("insertUnorderedList"),
2623
- title: "Lista com marcadores",
2624
- "aria-label": "Lista com marcadores",
2625
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.List, { className: "w-4 h-4" })
2626
- }
2627
- ),
2628
- /* @__PURE__ */ jsxRuntime.jsx(
2629
- button.Button,
2630
- {
2631
- variant: "ghost",
2632
- size: "icon",
2633
- className: button.cn(
2634
- "h-8 w-8 text-muted-foreground",
2635
- activeFormats.insertOrderedList && "bg-muted text-foreground"
2636
- ),
2637
- onClick: () => execCommand("insertOrderedList"),
2638
- title: "Lista numerada",
2639
- "aria-label": "Lista numerada",
2640
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ListOrdered, { className: "w-4 h-4" })
2641
- }
2642
- ),
2643
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2644
- ] }),
2645
- allowLinks && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2646
- /* @__PURE__ */ jsxRuntime.jsxs(input.Popover, { open: isLinkOpen, onOpenChange: onLinkPopoverOpenChange, modal: false, children: [
2647
- /* @__PURE__ */ jsxRuntime.jsx(input.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
2648
- button.Button,
2649
- {
2650
- variant: "ghost",
2651
- size: "icon",
2652
- className: button.cn(
2653
- "h-8 w-8 text-muted-foreground",
2654
- (activeFormats.link || isLinkOpen) && "bg-muted text-foreground"
2655
- ),
2656
- title: "Inserir link",
2657
- "aria-label": "Inserir link",
2658
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Link, { className: "w-4 h-4" })
2659
- }
2660
- ) }),
2661
- /* @__PURE__ */ jsxRuntime.jsx(input.PopoverContent, { className: "w-80 p-3", align: "start", style: { zIndex: 9999 }, children: !activeFormats.link && !hasSavedSelection ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground py-1", children: "Selecione um texto para criar um link." }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
2662
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium", children: activeFormats.link ? "Editar Link" : "Inserir Link" }),
2663
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
2664
- /* @__PURE__ */ jsxRuntime.jsx(
2665
- input.Input,
2666
- {
2667
- ref: linkInputRef,
2668
- placeholder: "https://...",
2669
- value: linkUrl,
2670
- onChange: (e) => setLinkUrl(e.target.value),
2671
- onKeyDown: (e) => {
2672
- if (e.key === "Enter") {
2673
- e.preventDefault();
2674
- e.stopPropagation();
2675
- handleCreateLink();
2676
- }
2677
- },
2678
- className: "h-8 text-xs"
2679
- }
2680
- ),
2681
- /* @__PURE__ */ jsxRuntime.jsx(button.Button, { size: "sm", className: "h-8", onClick: handleCreateLink, children: "Aplicar" })
2682
- ] })
2683
- ] }) })
2684
- ] }),
2685
- /* @__PURE__ */ jsxRuntime.jsx(
2686
- button.Button,
2687
- {
2688
- variant: "ghost",
2689
- size: "icon",
2690
- className: "h-8 w-8 text-muted-foreground",
2691
- onClick: handleUnlink,
2692
- title: "Remover link",
2693
- "aria-label": "Remover link",
2694
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-4 h-4" })
2695
- }
2696
- ),
2697
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-6 bg-border mx-1 hidden sm:block" })
2698
- ] }),
2699
- (allowFormatting || allowHeadings || allowAlignment || allowLists || allowLinks) && /* @__PURE__ */ jsxRuntime.jsx(
2700
- button.Button,
2701
- {
2702
- variant: "ghost",
2703
- size: "icon",
2704
- className: "h-8 w-8 text-muted-foreground",
2705
- onClick: () => execCommand("removeFormat"),
2706
- title: "Limpar formatação",
2707
- "aria-label": "Limpar formatação",
2708
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Type, { className: "w-4 h-4" })
2709
- }
2710
- ),
2711
- allowSearch && /* @__PURE__ */ jsxRuntime.jsx(
2712
- button.Button,
2713
- {
2714
- variant: "ghost",
2715
- size: "icon",
2716
- className: button.cn(
2717
- "h-8 w-8 text-muted-foreground",
2718
- isSearchOpen && "bg-muted text-foreground"
2719
- ),
2720
- onClick: () => {
2721
- setIsSearchOpen(!isSearchOpen);
2722
- if (!isSearchOpen) setTimeout(() => searchInputRef.current?.focus(), 100);
2723
- },
2724
- title: "Buscar",
2725
- "aria-label": "Buscar",
2726
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "w-4 h-4" })
2727
- }
2728
- ),
2729
- actionButton && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2730
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
2731
- actionButton
2732
- ] })
2733
- ] }),
2734
- isSearchOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-1.5 border-b border-border bg-muted/20 flex items-center gap-2", children: [
2735
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 max-w-sm", children: [
2736
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2.5 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground" }),
2737
- /* @__PURE__ */ jsxRuntime.jsx(
2738
- input.Input,
2739
- {
2740
- ref: searchInputRef,
2741
- placeholder: "Buscar no texto...",
2742
- value: searchQuery,
2743
- onChange: (e) => setSearchQuery(e.target.value),
2744
- onKeyDown: (e) => {
2745
- if (e.key === "Enter") {
2746
- e.preventDefault();
2747
- performSearch(searchQuery, e.shiftKey);
2748
- }
2749
- if (e.key === "Escape") {
2750
- setIsSearchOpen(false);
2751
- }
2752
- },
2753
- className: "h-8 pl-8 text-xs bg-background"
2754
- }
2755
- )
2756
- ] }),
2757
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
2758
- /* @__PURE__ */ jsxRuntime.jsx(
2759
- button.Button,
2760
- {
2761
- variant: "ghost",
2762
- size: "icon",
2763
- className: "h-7 w-7",
2764
- onMouseDown: (e) => e.preventDefault(),
2765
- onClick: () => performSearch(searchQuery, true),
2766
- title: "Anterior",
2767
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "w-4 h-4" })
2768
- }
2769
- ),
2770
- /* @__PURE__ */ jsxRuntime.jsx(
2771
- button.Button,
2772
- {
2773
- variant: "ghost",
2774
- size: "icon",
2775
- className: "h-7 w-7",
2776
- onMouseDown: (e) => e.preventDefault(),
2777
- onClick: () => performSearch(searchQuery, false),
2778
- title: "Próximo",
2779
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "w-4 h-4" })
2780
- }
2781
- ),
2782
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-px h-4 bg-border mx-1" }),
2783
- /* @__PURE__ */ jsxRuntime.jsx(
2784
- button.Button,
2785
- {
2786
- variant: "ghost",
2787
- size: "icon",
2788
- className: "h-7 w-7 text-muted-foreground hover:text-foreground",
2789
- onClick: () => setIsSearchOpen(false),
2790
- title: "Fechar busca",
2791
- children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-4 h-4" })
2792
- }
2793
- )
2794
- ] }),
2795
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden sm:block text-[10px] text-muted-foreground ml-auto uppercase tracking-wider font-medium", children: "Pressione Enter para buscar" })
2796
- ] }),
2797
- /* @__PURE__ */ jsxRuntime.jsx(
2798
- "div",
2799
- {
2800
- className: "flex-1 overflow-y-auto p-4 sm:p-8 bg-background scrollbar-thin",
2801
- style: { minHeight, maxHeight },
2802
- children: /* @__PURE__ */ jsxRuntime.jsx(
2803
- "div",
2804
- {
2805
- ref: editorRef,
2806
- contentEditable: isEditable,
2807
- role: "textbox",
2808
- "aria-multiline": "true",
2809
- "aria-label": placeholder || "Editor de texto",
2810
- "aria-readonly": readOnly,
2811
- "aria-disabled": disabled,
2812
- onInput: handleInput,
2813
- onSelect: isEditable ? updateActiveFormats : void 0,
2814
- onFocus: () => {
2815
- updateActiveFormats();
2816
- onFocus?.();
2817
- },
2818
- onBlur,
2819
- className: "prose-editor min-h-full max-w-none focus:outline-none",
2820
- "data-placeholder": placeholder
2821
- }
2822
- )
2823
- }
2824
- ),
2825
- (showWordCount || showCharacterCount) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 py-2 border-t border-border bg-muted/20 flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-[10px] sm:text-xs text-muted-foreground font-medium uppercase tracking-wider flex items-center gap-2", children: [
2826
- showWordCount && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
2827
- wordCount,
2828
- " ",
2829
- wordCount === 1 ? "palavra" : "palavras"
2830
- ] }),
2831
- showWordCount && showCharacterCount && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "•" }),
2832
- showCharacterCount && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
2833
- characterCount,
2834
- " ",
2835
- characterCount === 1 ? "caractere" : "caracteres"
2836
- ] })
2837
- ] }) })
2838
- ]
2839
- }
2840
- );
2841
- }
2842
- exports.Alert = Alert;
2843
- exports.AlertDescription = AlertDescription;
2844
- exports.AlertTitle = AlertTitle;
2845
- exports.ChartCard = ChartCard;
2846
- exports.ChartContainer = ChartContainer;
2847
- exports.ChartLegend = ChartLegend;
2848
- exports.ChartLegendContent = ChartLegendContent;
2849
- exports.ChartStyle = ChartStyle;
2850
- exports.ChartTooltip = ChartTooltip;
2851
- exports.ChartTooltipContent = ChartTooltipContent;
2852
- exports.ComboMetricChart = ComboMetricChart;
2853
- exports.DashboardBarChart = DashboardBarChart;
2854
- exports.DashboardLineChart = DashboardLineChart;
2855
- exports.Dialog = Dialog;
2856
- exports.DialogBody = DialogBody;
2857
- exports.DialogClose = DialogClose;
2858
- exports.DialogContent = DialogContent;
2859
- exports.DialogDescription = DialogDescription;
2860
- exports.DialogFooter = DialogFooter;
2861
- exports.DialogHeader = DialogHeader;
2862
- exports.DialogOverlay = DialogOverlay;
2863
- exports.DialogPortal = DialogPortal;
2864
- exports.DialogTitle = DialogTitle;
2865
- exports.DialogTrigger = DialogTrigger;
2866
- exports.DonutBreakdownChart = DonutBreakdownChart;
2867
- exports.Empty = Empty;
2868
- exports.EmptyAction = EmptyAction;
2869
- exports.EmptyDescription = EmptyDescription;
2870
- exports.EmptyIcon = EmptyIcon;
2871
- exports.EmptyImage = EmptyImage;
2872
- exports.EmptyTitle = EmptyTitle;
2873
- exports.GaugeChart = GaugeChart;
2874
- exports.HorizontalBarChart = HorizontalBarChart;
2875
- exports.InteractiveTimeSeriesChart = InteractiveTimeSeriesChart;
2876
- exports.PieMetricChart = PieMetricChart;
2877
- exports.RadarMetricChart = RadarMetricChart;
2878
- exports.RadialBarMetricChart = RadialBarMetricChart;
2879
- exports.RichTextEditor = RichTextEditor;
2880
- exports.SparklineChart = SparklineChart;
2881
- exports.Table = Table;
2882
- exports.TableBody = TableBody;
2883
- exports.TableCaption = TableCaption;
2884
- exports.TableCell = TableCell;
2885
- exports.TableFooter = TableFooter;
2886
- exports.TableHead = TableHead;
2887
- exports.TableHeader = TableHeader;
2888
- exports.TableRow = TableRow;
2889
- exports.Textarea = Textarea;
2890
- exports.useChart = useChart;
2891
- exports.useRichTextEditor = useRichTextEditor;