xertica-ui 2.5.0 → 2.5.2

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