xertica-ui 2.5.1 → 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 (535) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +14 -16
  3. package/assets/xertica-logo.svg +37 -37
  4. package/assets/xertica-x-logo.svg +20 -20
  5. package/bin/generate-tokens.ts +262 -262
  6. package/bin/language-config.ts +359 -358
  7. package/components/assistant/code-block/CodeBlock.tsx +268 -268
  8. package/components/assistant/formatted-document/FormattedDocument.tsx +147 -147
  9. package/components/assistant/modern-chat-input/ModernChatInput.tsx +564 -564
  10. package/components/assistant/xertica-assistant/parts/AssistantCollapsedView.tsx +99 -99
  11. package/components/assistant/xertica-assistant/parts/AssistantConversationList.tsx +104 -104
  12. package/components/assistant/xertica-assistant/parts/AssistantDocumentEditor.tsx +81 -81
  13. package/components/assistant/xertica-assistant/parts/AssistantFeedbackDialog.tsx +88 -88
  14. package/components/assistant/xertica-assistant/parts/AssistantHeader.tsx +75 -75
  15. package/components/assistant/xertica-assistant/parts/AssistantMessageBubble.tsx +564 -564
  16. package/components/assistant/xertica-assistant/parts/AssistantTabBar.tsx +67 -67
  17. package/components/assistant/xertica-assistant/parts/AssistantWelcomeScreen.tsx +103 -103
  18. package/components/assistant/xertica-assistant/use-assistant.ts +615 -615
  19. package/components/assistant/xertica-assistant/xertica-assistant.tsx +611 -611
  20. package/components/blocks/card-patterns/ActivityCard.tsx +100 -100
  21. package/components/blocks/card-patterns/ActivityCardSkeleton.tsx +56 -56
  22. package/components/blocks/card-patterns/FeatureCardSkeleton.tsx +58 -58
  23. package/components/blocks/card-patterns/NotificationCard.tsx +140 -140
  24. package/components/blocks/card-patterns/NotificationCardSkeleton.tsx +81 -81
  25. package/components/blocks/card-patterns/ProfileCard.tsx +112 -112
  26. package/components/blocks/card-patterns/ProfileCardSkeleton.tsx +69 -69
  27. package/components/blocks/card-patterns/ProjectCard.tsx +123 -123
  28. package/components/blocks/card-patterns/ProjectCardSkeleton.tsx +67 -67
  29. package/components/blocks/card-patterns/QuickActionCardSkeleton.tsx +44 -44
  30. package/components/blocks/card-patterns/card-patterns.stories.tsx +594 -594
  31. package/components/blocks/card-patterns/index.ts +29 -29
  32. package/components/brand/language-selector/LanguageSelector.tsx +102 -102
  33. package/components/brand/language-selector/language-selector.stories.tsx +111 -111
  34. package/components/brand/language-selector/language-selector.test.tsx +101 -101
  35. package/components/brand/theme-toggle/ThemeToggle.tsx +74 -74
  36. package/components/brand/xertica-provider/xertica-provider.mdx +61 -61
  37. package/components/index.ts +86 -86
  38. package/components/layout/sidebar/sidebar.mdx +1 -1
  39. package/components/layout/sidebar/sidebar.stories.tsx +1033 -787
  40. package/components/layout/sidebar/sidebar.tsx +338 -1
  41. package/components/media/FloatingMediaWrapper.tsx +371 -371
  42. package/components/media/audio-player/AudioPlayer.tsx +768 -768
  43. package/components/media/video-player/VideoPlayer.tsx +310 -310
  44. package/components/pages/home-content/HomeContent.tsx +120 -120
  45. package/components/pages/home-content/home-content.mdx +62 -62
  46. package/components/pages/home-page/HomePage.tsx +78 -78
  47. package/components/pages/home-page/home-page.mdx +53 -53
  48. package/components/pages/template-content/TemplateContent.tsx +1354 -1354
  49. package/components/pages/template-content/template-content.mdx +61 -61
  50. package/components/pages/template-page/TemplatePage.stories.tsx +32 -32
  51. package/components/pages/template-page/template-page.mdx +53 -53
  52. package/components/shared/error-boundary.stories.tsx +114 -114
  53. package/components/shared/error-boundary.tsx +150 -150
  54. package/components/shared/error-fallbacks.tsx +222 -222
  55. package/components/ui/accordion/accordion.mdx +8 -8
  56. package/components/ui/alert/alert.mdx +8 -8
  57. package/components/ui/alert-dialog/alert-dialog.mdx +8 -8
  58. package/components/ui/aspect-ratio/aspect-ratio.mdx +8 -8
  59. package/components/ui/assistant-chart/assistant-chart.mdx +8 -8
  60. package/components/ui/avatar/avatar.mdx +8 -8
  61. package/components/ui/badge/badge.mdx +8 -8
  62. package/components/ui/breadcrumb/breadcrumb.mdx +8 -8
  63. package/components/ui/button/button.mdx +8 -8
  64. package/components/ui/calendar/calendar.mdx +8 -8
  65. package/components/ui/card/card.mdx +8 -8
  66. package/components/ui/carousel/carousel.mdx +8 -8
  67. package/components/ui/chart/chart.mdx +8 -8
  68. package/components/ui/chart/chart.test.tsx +178 -178
  69. package/components/ui/chart/chart.tsx +2245 -2239
  70. package/components/ui/checkbox/checkbox.mdx +8 -8
  71. package/components/ui/collapsible/collapsible.mdx +8 -8
  72. package/components/ui/command/command.mdx +8 -8
  73. package/components/ui/context-menu/context-menu.mdx +8 -8
  74. package/components/ui/dialog/dialog.mdx +8 -8
  75. package/components/ui/drawer/drawer.mdx +8 -8
  76. package/components/ui/dropdown-menu/dropdown-menu.mdx +8 -8
  77. package/components/ui/empty/empty.mdx +8 -8
  78. package/components/ui/file-upload/file-upload.mdx +8 -8
  79. package/components/ui/hover-card/hover-card.mdx +8 -8
  80. package/components/ui/input/input.mdx +8 -8
  81. package/components/ui/input-otp/input-otp.mdx +8 -8
  82. package/components/ui/label/label.mdx +8 -8
  83. package/components/ui/map/map.mdx +8 -8
  84. package/components/ui/menubar/menubar.mdx +8 -8
  85. package/components/ui/navigation-menu/navigation-menu.mdx +8 -8
  86. package/components/ui/notification-badge/notification-badge.mdx +8 -8
  87. package/components/ui/pagination/pagination.mdx +8 -8
  88. package/components/ui/popover/popover.mdx +8 -8
  89. package/components/ui/progress/progress.mdx +8 -8
  90. package/components/ui/radio-group/radio-group.mdx +8 -8
  91. package/components/ui/rating/rating.mdx +8 -8
  92. package/components/ui/resizable/resizable.mdx +8 -8
  93. package/components/ui/route-map/route-map.mdx +8 -8
  94. package/components/ui/scroll-area/scroll-area.mdx +8 -8
  95. package/components/ui/search/search.mdx +8 -8
  96. package/components/ui/select/select.mdx +8 -8
  97. package/components/ui/separator/separator.mdx +8 -8
  98. package/components/ui/sheet/sheet.mdx +8 -8
  99. package/components/ui/simple-map/simple-map.mdx +8 -8
  100. package/components/ui/skeleton/skeleton.mdx +8 -8
  101. package/components/ui/slider/slider.mdx +8 -8
  102. package/components/ui/sonner/sonner.mdx +8 -8
  103. package/components/ui/stats-card/index.ts +2 -2
  104. package/components/ui/stats-card/stats-card-skeleton.tsx +60 -60
  105. package/components/ui/stats-card/stats-card.mdx +8 -8
  106. package/components/ui/stats-card/stats-card.tsx +109 -109
  107. package/components/ui/stepper/stepper.mdx +8 -8
  108. package/components/ui/switch/switch.mdx +8 -8
  109. package/components/ui/table/table.mdx +8 -8
  110. package/components/ui/tabs/tabs.mdx +8 -8
  111. package/components/ui/textarea/textarea.mdx +8 -8
  112. package/components/ui/timeline/timeline.mdx +8 -8
  113. package/components/ui/toggle/toggle.mdx +8 -8
  114. package/components/ui/toggle-group/toggle-group.mdx +8 -8
  115. package/components/ui/tooltip/tooltip.mdx +8 -8
  116. package/components/ui/tree-view/tree-view.mdx +8 -8
  117. package/components.json +511 -511
  118. package/contexts/AuthContext.tsx +121 -121
  119. package/contexts/BrandColorsContext.tsx +282 -282
  120. package/contexts/LanguageContext.test.tsx +121 -121
  121. package/contexts/LanguageContext.tsx +250 -250
  122. package/contexts/theme-data.ts +391 -391
  123. package/dist/{AssistantChart-DoZCyS5r.cjs → AssistantChart-9w31gdAb.cjs} +4 -4
  124. package/dist/{AssistantChart-CldVCVDe.cjs → AssistantChart-BAudAfne.cjs} +5 -5
  125. package/dist/{AssistantChart-Bdd44uBn.cjs → AssistantChart-BAx9VQvb.cjs} +127 -388
  126. package/dist/{AssistantChart-Cu3m7RBo.js → AssistantChart-BP8upjMk.js} +5 -5
  127. package/dist/{AssistantChart-CFhDdGyU.js → AssistantChart-CVko2A1W.js} +130 -391
  128. package/dist/{AssistantChart-C_hwFRRr.js → AssistantChart-CVzmmhx4.js} +4 -4
  129. package/dist/{AudioPlayer-IAU5q5T1.cjs → AudioPlayer-1ypwE2Wh.cjs} +1 -1
  130. package/dist/{AudioPlayer-CGRUtUdN.js → AudioPlayer-DuKXrCfy.js} +1 -1
  131. package/dist/{LanguageContext-CS14yCpi.js → LanguageContext-BwhwC3G2.js} +2 -2
  132. package/dist/{LanguageContext-B_KFTCzT.cjs → LanguageContext-DvUt5jBg.cjs} +2 -2
  133. package/dist/{ThemeContext-C2EwAPDt.js → ThemeContext-BbBNoFTG.js} +2 -2
  134. package/dist/{ThemeContext-Bmod0Cg2.cjs → ThemeContext-BblcjQup.cjs} +13 -8
  135. package/dist/{ThemeContext-BWq9ACPo.js → ThemeContext-Bo-W2WZH.js} +13 -8
  136. package/dist/{ThemeContext-j5aGtPky.cjs → ThemeContext-CP3a0jxy.cjs} +193 -262
  137. package/dist/{ThemeContext-vTjumZeM.cjs → ThemeContext-Cmr8Ex8H.cjs} +2 -2
  138. package/dist/ThemeContext-CpqYShLq.cjs +324 -0
  139. package/dist/{ThemeContext-CQSo4Iwc.js → ThemeContext-D3LzacmG.js} +8 -1
  140. package/dist/ThemeContext-Du2nE1PL.js +325 -0
  141. package/dist/ThemeContext-GeEBTJ3q.cjs +1621 -0
  142. package/dist/ThemeContext-JyLK9B1o.js +1622 -0
  143. package/dist/{ThemeContext-CGk3KK0k.cjs → ThemeContext-U4dEYc6C.cjs} +8 -1
  144. package/dist/{ThemeContext-BXjrgUjW.js → ThemeContext-ept8jhXI.js} +200 -261
  145. package/dist/{VerifyEmailPage-CGIwmWrm.js → VerifyEmailPage-B31mCrMc.js} +1 -1
  146. package/dist/{VerifyEmailPage-C0c2e5n0.js → VerifyEmailPage-BE-L9mB7.js} +7 -7
  147. package/dist/{VerifyEmailPage-DSBMRHtl.js → VerifyEmailPage-BIBOKV7Z.js} +41 -36
  148. package/dist/{VerifyEmailPage-DgIid028.js → VerifyEmailPage-BJjAMUTW.js} +4 -4
  149. package/dist/{VerifyEmailPage--1Vurewl.cjs → VerifyEmailPage-BRSP-Pwt.cjs} +3 -3
  150. package/dist/{VerifyEmailPage-Cwi3kbol.cjs → VerifyEmailPage-Bae2cBXT.cjs} +7 -7
  151. package/dist/{VerifyEmailPage-De6bQjrz.cjs → VerifyEmailPage-BiRm7Nh4.cjs} +41 -36
  152. package/dist/{VerifyEmailPage-ByerOcm4.cjs → VerifyEmailPage-Bv8Ah_TK.cjs} +23 -20
  153. package/dist/VerifyEmailPage-Bvfv8HVQ.js +3214 -0
  154. package/dist/{VerifyEmailPage-BComraR7.cjs → VerifyEmailPage-CR7kb5df.cjs} +22 -12
  155. package/dist/{VerifyEmailPage-CpqqpLpo.cjs → VerifyEmailPage-C_Zk6Gen.cjs} +1 -1
  156. package/dist/{VerifyEmailPage-MTD7AG1Z.js → VerifyEmailPage-C_ihbcth.js} +4 -4
  157. package/dist/{VerifyEmailPage-1WwWczAn.js → VerifyEmailPage-CbgjOF0v.js} +22 -12
  158. package/dist/{VerifyEmailPage-DvMLZgFt.js → VerifyEmailPage-CdYPSJoO.js} +1 -1
  159. package/dist/{VerifyEmailPage-By3Jf__L.cjs → VerifyEmailPage-CkBYfsNy.cjs} +4 -4
  160. package/dist/{VerifyEmailPage-CJLz3jrn.js → VerifyEmailPage-Cyl55sJb.js} +23 -20
  161. package/dist/VerifyEmailPage-D-FRj5TU.cjs +3213 -0
  162. package/dist/{VerifyEmailPage-B4peJjAT.cjs → VerifyEmailPage-DF2ilhum.cjs} +334 -356
  163. package/dist/{VerifyEmailPage-CYXtbKi3.cjs → VerifyEmailPage-DMBh4NM9.cjs} +1 -1
  164. package/dist/{VerifyEmailPage-CgMxRb4z.js → VerifyEmailPage-DTtFfC-J.js} +3 -3
  165. package/dist/{VerifyEmailPage-CFLMls1p.cjs → VerifyEmailPage-Dt7zgA4w.cjs} +4 -4
  166. package/dist/{VerifyEmailPage-C5TNQTBa.js → VerifyEmailPage-EhudUdqF.js} +343 -355
  167. package/dist/{VerifyEmailPage-DGhuIqkb.js → VerifyEmailPage-X14vhdyl.js} +4 -4
  168. package/dist/VerifyEmailPage-hdB8JQGv.cjs +3213 -0
  169. package/dist/{VerifyEmailPage-Bp1XXl3H.cjs → VerifyEmailPage-u_Dn7t1U.cjs} +4 -4
  170. package/dist/VerifyEmailPage-vYHbYK3q.js +3214 -0
  171. package/dist/{XerticaProvider-CBGc4EMA.cjs → XerticaProvider-AChwphCO.cjs} +4 -4
  172. package/dist/{XerticaProvider-BIrqfZ-i.cjs → XerticaProvider-AbWlr7Af.cjs} +8 -11
  173. package/dist/{XerticaProvider-D-yNhF94.cjs → XerticaProvider-B8CaV7xu.cjs} +1 -1
  174. package/dist/{XerticaProvider-CEoWMTxu.js → XerticaProvider-BITjgC5p.js} +2 -2
  175. package/dist/{XerticaProvider-CllrbMEJ.cjs → XerticaProvider-By8q3Roe.cjs} +2 -2
  176. package/dist/{XerticaProvider-C1DKnvLh.js → XerticaProvider-CUYJZc32.js} +4 -4
  177. package/dist/{XerticaProvider-ET0ihewn.cjs → XerticaProvider-CW9hpCdF.cjs} +2 -2
  178. package/dist/{XerticaProvider-Dt5HEzbQ.js → XerticaProvider-CWgby5mY.js} +10 -10
  179. package/dist/XerticaProvider-CWs6EwNa.js +49 -0
  180. package/dist/XerticaProvider-CjQAQPcn.cjs +48 -0
  181. package/dist/XerticaProvider-D5lLumH-.js +49 -0
  182. package/dist/{XerticaProvider-DYq4JWtg.js → XerticaProvider-DQtvJU7m.js} +1 -1
  183. package/dist/XerticaProvider-qQUDop71.cjs +48 -0
  184. package/dist/{XerticaProvider-B7EVH-NF.js → XerticaProvider-siSt9uG2.js} +2 -2
  185. package/dist/{XerticaXLogo-Zw2B276b.cjs → XerticaXLogo-8TTzBjHw.cjs} +1 -1
  186. package/dist/{XerticaXLogo-B7xQ5dhi.js → XerticaXLogo-BWaag64t.js} +1 -1
  187. package/dist/{XerticaXLogo-DZbo4vOE.js → XerticaXLogo-CFuIlYFH.js} +12 -12
  188. package/dist/{XerticaXLogo-bvZSgwGF.cjs → XerticaXLogo-CU-U-GP4.cjs} +7 -13
  189. package/dist/XerticaXLogo-ChryA6xj.js +252 -0
  190. package/dist/{XerticaXLogo-CQUUjXoH.cjs → XerticaXLogo-CziKMQil.cjs} +8 -8
  191. package/dist/XerticaXLogo-DHz5SugF.js +252 -0
  192. package/dist/XerticaXLogo-DTee_y8X.cjs +251 -0
  193. package/dist/{XerticaXLogo-Cmsp-Eey.js → XerticaXLogo-DfUvz-lD.js} +9 -9
  194. package/dist/XerticaXLogo-kslQ8Tk_.cjs +251 -0
  195. package/dist/{alert-dialog-s-vmNkJ_.js → alert-dialog-iDe5VE5o.js} +3 -3
  196. package/dist/{alert-dialog-DSKByiKZ.cjs → alert-dialog-yckpaOpy.cjs} +3 -3
  197. package/dist/cli.js +2 -1
  198. package/dist/components/ui/chart/chart.d.ts +7 -5
  199. package/dist/{google-maps-loader-Y-QkD-Li.cjs → google-maps-loader-BqsYL48U.cjs} +0 -5
  200. package/dist/{google-maps-loader-CTYySAun.js → google-maps-loader-t2IlYBzw.js} +0 -4
  201. package/dist/index-CkTUgOwX.js +8 -0
  202. package/dist/{index-COtD8bRW.cjs → index-D3RLKRAs.cjs} +1 -1
  203. package/dist/index.cjs.js +2 -2
  204. package/dist/index.es.js +2 -2
  205. package/dist/index.umd.js +454 -1027
  206. package/dist/layout.cjs.js +1 -1
  207. package/dist/layout.es.js +1 -1
  208. package/dist/pages.cjs.js +1 -1
  209. package/dist/pages.es.js +1 -1
  210. package/dist/{sidebar-DAaY8bRU.cjs → sidebar-B3EYhli0.cjs} +33 -24
  211. package/dist/{sidebar-nzPoVHBQ.cjs → sidebar-B9NR0lCe.cjs} +46 -41
  212. package/dist/{sidebar-CeTMuzOx.cjs → sidebar-BvF5I2Ue.cjs} +47 -128
  213. package/dist/{sidebar-q7P2Godd.cjs → sidebar-C5B_LHek.cjs} +1 -1
  214. package/dist/{sidebar-CrQDDdcz.js → sidebar-CA6_ek3f.js} +33 -24
  215. package/dist/sidebar-CLmIjgNd.cjs +1136 -0
  216. package/dist/{sidebar-BxGXsDAd.cjs → sidebar-CVUGHOS_.cjs} +8 -16
  217. package/dist/{sidebar-BViy8Eeu.js → sidebar-CmvwjnVb.js} +9 -17
  218. package/dist/{sidebar-B6SlKZYN.js → sidebar-CplprZpM.js} +49 -40
  219. package/dist/sidebar-Duermn32.js +1133 -0
  220. package/dist/{sidebar-BbVIQvlP.js → sidebar-Dz7bd3zP.js} +1 -1
  221. package/dist/{sidebar-0ocFLSks.js → sidebar-KIS0C2JH.js} +50 -127
  222. package/dist/sidebar-OTO_up7Z.js +801 -0
  223. package/dist/sidebar-zowjejT2.cjs +800 -0
  224. package/dist/{use-audio-player-nv8ZSGa1.js → use-audio-player-Bkh23vQ3.js} +3 -7
  225. package/dist/{use-audio-player-NKsWyjWu.cjs → use-audio-player-Dn1NR9xN.cjs} +3 -7
  226. package/dist/{xertica-assistant-dyP7KHM5.cjs → xertica-assistant-B1IaHXnB.cjs} +388 -529
  227. package/dist/{xertica-assistant-ciJaWqm1.js → xertica-assistant-BMqdyRVi.js} +10 -28
  228. package/dist/{xertica-assistant-V_IdW4WF.cjs → xertica-assistant-Bj3vBCq_.cjs} +9 -27
  229. package/dist/{xertica-assistant-yX1CFBBo.js → xertica-assistant-DPsESB6t.js} +390 -531
  230. package/dist/{CodeBlock-7TTgmdGG.cjs → xertica-assistant-Qp3ydksa.cjs} +51 -263
  231. package/dist/{CodeBlock-BeSt1h5P.js → xertica-assistant-gnCJdcZY.js} +7 -219
  232. package/dist/xertica-ui.css +2 -2
  233. package/docs/architecture-improvements.md +456 -456
  234. package/docs/architecture.md +312 -312
  235. package/docs/components/assistant.md +428 -428
  236. package/docs/components/branding.md +252 -252
  237. package/docs/components/card-patterns.md +447 -447
  238. package/docs/components/error-boundary.md +201 -201
  239. package/docs/components/hooks.md +432 -432
  240. package/docs/components/language-selector.md +176 -176
  241. package/docs/components/pages.md +323 -323
  242. package/docs/components/sidebar.md +331 -331
  243. package/docs/components/stats-card.md +138 -138
  244. package/docs/doc-audit.md +244 -244
  245. package/docs/getting-started.md +616 -616
  246. package/docs/guidelines.md +330 -330
  247. package/docs/i18n.md +480 -480
  248. package/docs/installation.md +268 -268
  249. package/docs/llms.md +295 -295
  250. package/docs/state-management.md +289 -289
  251. package/guidelines/Guidelines.md +409 -409
  252. package/llms-compact.txt +1 -1
  253. package/llms-full.txt +10688 -10688
  254. package/llms.txt +1 -1
  255. package/package.json +1 -1
  256. package/styles/xertica/base.css +90 -90
  257. package/styles/xertica/tokens.css +240 -240
  258. package/templates/.prettierignore +4 -4
  259. package/templates/.prettierrc +10 -10
  260. package/templates/CLAUDE.md +180 -180
  261. package/templates/package.json +2 -2
  262. package/templates/src/app/App.tsx +46 -46
  263. package/templates/src/app/components/AuthGuard.tsx +131 -131
  264. package/templates/src/features/assistant/data/mock.ts +75 -75
  265. package/templates/src/features/assistant/hooks/useAssistantConfig.ts +20 -20
  266. package/templates/src/features/assistant/index.ts +5 -5
  267. package/templates/src/features/auth/ui/ForgotPasswordContent.tsx +70 -70
  268. package/templates/src/features/auth/ui/LoginContent.tsx +92 -92
  269. package/templates/src/features/auth/ui/ResetPasswordContent.tsx +183 -183
  270. package/templates/src/features/auth/ui/SocialLoginButtons.tsx +78 -78
  271. package/templates/src/features/auth/ui/VerifyEmailContent.tsx +80 -80
  272. package/templates/src/features/home/data/mock.ts +41 -41
  273. package/templates/src/features/home/hooks/useFeatureCards.ts +20 -20
  274. package/templates/src/features/home/index.ts +11 -11
  275. package/templates/src/features/home/ui/HomeContent.tsx +117 -117
  276. package/templates/src/features/template/ui/CrudTemplate.tsx +112 -112
  277. package/templates/src/features/template/ui/DashboardTemplate.tsx +110 -110
  278. package/templates/src/features/template/ui/FormTemplate.tsx +117 -117
  279. package/templates/src/features/template/ui/LoginTemplate.tsx +59 -59
  280. package/templates/src/features/template/ui/TemplateContent.tsx +1322 -1322
  281. package/templates/src/i18n.ts +124 -124
  282. package/templates/src/locales/en/common.json +21 -21
  283. package/templates/src/locales/en/components/activityCard.json +10 -10
  284. package/templates/src/locales/en/components/assistant.json +119 -119
  285. package/templates/src/locales/en/components/media.json +29 -29
  286. package/templates/src/locales/en/components/notificationCard.json +5 -5
  287. package/templates/src/locales/en/components/profileCard.json +8 -8
  288. package/templates/src/locales/en/components/projectCard.json +10 -10
  289. package/templates/src/locales/en/components/sidebar.json +14 -14
  290. package/templates/src/locales/en/components/stats.json +8 -8
  291. package/templates/src/locales/en/components/team.json +14 -14
  292. package/templates/src/locales/en/errors.json +9 -9
  293. package/templates/src/locales/en/languageSelector.json +7 -7
  294. package/templates/src/locales/en/nav.json +6 -6
  295. package/templates/src/locales/en/pages/crudTemplate.json +25 -25
  296. package/templates/src/locales/en/pages/dashboardTemplate.json +20 -20
  297. package/templates/src/locales/en/pages/forgotPassword.json +10 -10
  298. package/templates/src/locales/en/pages/formTemplate.json +16 -16
  299. package/templates/src/locales/en/pages/home.json +7 -7
  300. package/templates/src/locales/en/pages/login.json +15 -15
  301. package/templates/src/locales/en/pages/loginTemplate.json +9 -9
  302. package/templates/src/locales/en/pages/resetPassword.json +18 -18
  303. package/templates/src/locales/en/pages/templates.json +317 -317
  304. package/templates/src/locales/en/pages/verifyEmail.json +12 -12
  305. package/templates/src/locales/en/themeToggle.json +6 -6
  306. package/templates/src/locales/es/common.json +21 -21
  307. package/templates/src/locales/es/components/activityCard.json +10 -10
  308. package/templates/src/locales/es/components/assistant.json +119 -119
  309. package/templates/src/locales/es/components/media.json +29 -29
  310. package/templates/src/locales/es/components/notificationCard.json +5 -5
  311. package/templates/src/locales/es/components/profileCard.json +8 -8
  312. package/templates/src/locales/es/components/projectCard.json +10 -10
  313. package/templates/src/locales/es/components/sidebar.json +14 -14
  314. package/templates/src/locales/es/components/stats.json +8 -8
  315. package/templates/src/locales/es/components/team.json +14 -14
  316. package/templates/src/locales/es/errors.json +9 -9
  317. package/templates/src/locales/es/languageSelector.json +7 -7
  318. package/templates/src/locales/es/nav.json +6 -6
  319. package/templates/src/locales/es/pages/crudTemplate.json +25 -25
  320. package/templates/src/locales/es/pages/dashboardTemplate.json +20 -20
  321. package/templates/src/locales/es/pages/forgotPassword.json +10 -10
  322. package/templates/src/locales/es/pages/formTemplate.json +16 -16
  323. package/templates/src/locales/es/pages/home.json +7 -7
  324. package/templates/src/locales/es/pages/login.json +15 -15
  325. package/templates/src/locales/es/pages/loginTemplate.json +9 -9
  326. package/templates/src/locales/es/pages/resetPassword.json +18 -18
  327. package/templates/src/locales/es/pages/templates.json +317 -317
  328. package/templates/src/locales/es/pages/verifyEmail.json +12 -12
  329. package/templates/src/locales/es/themeToggle.json +6 -6
  330. package/templates/src/locales/pt-BR/common.json +21 -21
  331. package/templates/src/locales/pt-BR/components/activityCard.json +10 -10
  332. package/templates/src/locales/pt-BR/components/assistant.json +119 -119
  333. package/templates/src/locales/pt-BR/components/media.json +29 -29
  334. package/templates/src/locales/pt-BR/components/notificationCard.json +5 -5
  335. package/templates/src/locales/pt-BR/components/profileCard.json +8 -8
  336. package/templates/src/locales/pt-BR/components/projectCard.json +10 -10
  337. package/templates/src/locales/pt-BR/components/sidebar.json +14 -14
  338. package/templates/src/locales/pt-BR/components/stats.json +8 -8
  339. package/templates/src/locales/pt-BR/components/team.json +14 -14
  340. package/templates/src/locales/pt-BR/errors.json +9 -9
  341. package/templates/src/locales/pt-BR/languageSelector.json +7 -7
  342. package/templates/src/locales/pt-BR/nav.json +6 -6
  343. package/templates/src/locales/pt-BR/pages/crudTemplate.json +25 -25
  344. package/templates/src/locales/pt-BR/pages/dashboardTemplate.json +20 -20
  345. package/templates/src/locales/pt-BR/pages/forgotPassword.json +10 -10
  346. package/templates/src/locales/pt-BR/pages/formTemplate.json +16 -16
  347. package/templates/src/locales/pt-BR/pages/home.json +7 -7
  348. package/templates/src/locales/pt-BR/pages/login.json +15 -15
  349. package/templates/src/locales/pt-BR/pages/loginTemplate.json +9 -9
  350. package/templates/src/locales/pt-BR/pages/resetPassword.json +18 -18
  351. package/templates/src/locales/pt-BR/pages/templates.json +317 -317
  352. package/templates/src/locales/pt-BR/pages/verifyEmail.json +12 -12
  353. package/templates/src/locales/pt-BR/themeToggle.json +6 -6
  354. package/templates/src/pages/AssistantPage.tsx +470 -470
  355. package/templates/src/pages/HomePage.tsx +53 -53
  356. package/templates/src/shared/error-boundary.tsx +150 -150
  357. package/templates/src/shared/error-fallbacks.tsx +222 -222
  358. package/templates/src/styles/xertica/tokens.css +240 -240
  359. package/templates/vite.config.js +20 -20
  360. package/templates/vite.config.ts +55 -55
  361. package/dist/AssistantChart-BKVtGUKF.js +0 -3383
  362. package/dist/AssistantChart-CxGjH7Qk.js +0 -3477
  363. package/dist/AssistantChart-DIpshm3i.js +0 -4784
  364. package/dist/AssistantChart-D_PTeu8P.cjs +0 -3503
  365. package/dist/AssistantChart-WeycT5Pd.cjs +0 -3551
  366. package/dist/AssistantChart-zjsy2GaZ.cjs +0 -4810
  367. package/dist/AudioPlayer-B1lt5cPl.cjs +0 -989
  368. package/dist/AudioPlayer-BZ7bibzU.cjs +0 -982
  369. package/dist/AudioPlayer-BpRPS4-1.cjs +0 -1277
  370. package/dist/AudioPlayer-C12BjQBV.cjs +0 -997
  371. package/dist/AudioPlayer-CFeV8t-5.cjs +0 -936
  372. package/dist/AudioPlayer-Coly3q5R.js +0 -1278
  373. package/dist/AudioPlayer-CySJIyvL.js +0 -937
  374. package/dist/AudioPlayer-DMcG_c7L.js +0 -990
  375. package/dist/AudioPlayer-DcFKRJE_.js +0 -998
  376. package/dist/AudioPlayer-e8LfNoqO.js +0 -983
  377. package/dist/BrandColorsContext-565dDHd5.js +0 -660
  378. package/dist/BrandColorsContext-BcJbtkqn.cjs +0 -659
  379. package/dist/CodeBlock-BgfYL_rD.cjs +0 -2094
  380. package/dist/CodeBlock-BlcqlA9M.cjs +0 -2094
  381. package/dist/CodeBlock-Bnmeu5ez.cjs +0 -2094
  382. package/dist/CodeBlock-BtfPlbAI.js +0 -2078
  383. package/dist/CodeBlock-CIySIuYr.js +0 -2078
  384. package/dist/CodeBlock-CuPtUM-7.cjs +0 -2094
  385. package/dist/CodeBlock-D6ffWXgc.js +0 -2078
  386. package/dist/CodeBlock-D8dcwbit.cjs +0 -2094
  387. package/dist/CodeBlock-DMZrFnlw.cjs +0 -2094
  388. package/dist/CodeBlock-DlBehYN8.js +0 -2078
  389. package/dist/CodeBlock-DnYNI8rQ.js +0 -2078
  390. package/dist/CodeBlock-DvKWbSnE.cjs +0 -2094
  391. package/dist/CodeBlock-DwMCfkFY.js +0 -2078
  392. package/dist/CodeBlock-Dy6CNYyj.js +0 -2078
  393. package/dist/CodeBlock-U1pPOQI7.cjs +0 -2094
  394. package/dist/CodeBlock-f_GpNhEB.js +0 -2078
  395. package/dist/CodeBlock-oB6u8nI1.js +0 -2078
  396. package/dist/CodeBlock-tZC31B73.cjs +0 -2094
  397. package/dist/FeatureCard-CxC-7C-C.cjs +0 -300
  398. package/dist/FeatureCard-DbHWCb4E.js +0 -301
  399. package/dist/ImageWithFallback-CGtidP6B.cjs +0 -4542
  400. package/dist/ImageWithFallback-lsg3pdFg.js +0 -4508
  401. package/dist/LanguageSelector-B5YfbHra.js +0 -231
  402. package/dist/LanguageSelector-D6uacAIM.cjs +0 -230
  403. package/dist/LayoutContext-B45-e9DI.cjs +0 -93
  404. package/dist/LayoutContext-BAql6ZRY.js +0 -97
  405. package/dist/LayoutContext-Bav3UMEA.js +0 -94
  406. package/dist/LayoutContext-BvK-ggDa.cjs +0 -96
  407. package/dist/ThemeContext-BoH4NLfN.js +0 -734
  408. package/dist/ThemeContext-r69W20Xg.cjs +0 -733
  409. package/dist/VerifyEmailPage-COiyNl1y.js +0 -2825
  410. package/dist/VerifyEmailPage-CqKsR2v8.js +0 -2827
  411. package/dist/VerifyEmailPage-DjQKRlUS.cjs +0 -2824
  412. package/dist/VerifyEmailPage-s-1X3LDJ.cjs +0 -2826
  413. package/dist/XerticaOrbe-KL1RBHzw.cjs +0 -1354
  414. package/dist/XerticaOrbe-zwS1p2a8.js +0 -1355
  415. package/dist/XerticaProvider-6btlAlzc.js +0 -17
  416. package/dist/XerticaProvider-BNoNOxQ5.cjs +0 -16
  417. package/dist/XerticaProvider-BlY2limY.cjs +0 -38
  418. package/dist/XerticaProvider-DDuiIcKo.js +0 -39
  419. package/dist/XerticaProvider-cI9hSs27.cjs +0 -38
  420. package/dist/XerticaProvider-hSwhNQex.js +0 -39
  421. package/dist/alert-dialog-BOje--vD.js +0 -847
  422. package/dist/alert-dialog-BtEuQqrg.cjs +0 -870
  423. package/dist/breadcrumb-CqJ7bHY5.js +0 -161
  424. package/dist/breadcrumb-m9Hb2_XN.cjs +0 -177
  425. package/dist/components/assistant/xertica-assistant/hooks/index.d.ts +0 -6
  426. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-conversations.d.ts +0 -21
  427. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-messages.d.ts +0 -49
  428. package/dist/components/assistant/xertica-assistant/hooks/use-assistant-suggestions.d.ts +0 -16
  429. package/dist/components/blocks/audio-player/AudioPlayer.d.ts +0 -35
  430. package/dist/components/blocks/audio-player/index.d.ts +0 -1
  431. package/dist/components/blocks/document-editor/DocumentEditor.d.ts +0 -26
  432. package/dist/components/blocks/document-editor/index.d.ts +0 -1
  433. package/dist/components/blocks/podcast-player/PodcastPlayer.d.ts +0 -41
  434. package/dist/components/blocks/podcast-player/index.d.ts +0 -1
  435. package/dist/components/ui/chart/parts/chart-dashboard.d.ts +0 -113
  436. package/dist/components/ui/chart/parts/chart-metric.d.ts +0 -118
  437. package/dist/components/ui/chart/parts/chart-primitives.d.ts +0 -101
  438. package/dist/components/ui/chart/parts/chart-shared.d.ts +0 -20
  439. package/dist/components/ui/chart/parts/chart-utils.d.ts +0 -12
  440. package/dist/components/ui/chart/parts/index.d.ts +0 -5
  441. package/dist/dropdown-menu-BDB5CmQs.cjs +0 -247
  442. package/dist/dropdown-menu-DQidbKBD.js +0 -231
  443. package/dist/google-maps-loader-BFWp6VPd.js +0 -287
  444. package/dist/google-maps-loader-BKcdgFbu.cjs +0 -312
  445. package/dist/google-maps-loader-CumCNXeG.js +0 -312
  446. package/dist/google-maps-loader-eS3uQ5TA.cjs +0 -287
  447. package/dist/header-Cgy6vYPk.cjs +0 -731
  448. package/dist/header-DRlT4jgI.js +0 -715
  449. package/dist/header-Dux00SI4.cjs +0 -731
  450. package/dist/header-EkGKXPsD.js +0 -715
  451. package/dist/header-WfEywpyc.cjs +0 -731
  452. package/dist/header-tifNQn2U.js +0 -715
  453. package/dist/index-BhapVLVj.js +0 -8
  454. package/dist/index-D6fxYEY8.cjs +0 -7
  455. package/dist/index-DAIp0_HK.js +0 -8
  456. package/dist/index-DW5tYe26.js +0 -8
  457. package/dist/index-GA__GvnG.cjs +0 -7
  458. package/dist/input-2R4loU86.js +0 -127
  459. package/dist/input-DWANSKGb.cjs +0 -145
  460. package/dist/progress-DPtzoVV8.js +0 -175
  461. package/dist/progress-EeaoqqUs.cjs +0 -191
  462. package/dist/rich-text-editor-0mraWT5y.cjs +0 -2376
  463. package/dist/rich-text-editor-B-IkcPD0.js +0 -2874
  464. package/dist/rich-text-editor-B6jMRLzk.cjs +0 -1939
  465. package/dist/rich-text-editor-B8_oYcIR.js +0 -1730
  466. package/dist/rich-text-editor-B9UbSXNb.js +0 -1203
  467. package/dist/rich-text-editor-BYuRBNBU.js +0 -2373
  468. package/dist/rich-text-editor-Bb9pySTs.cjs +0 -2374
  469. package/dist/rich-text-editor-BcL6L3cm.cjs +0 -2374
  470. package/dist/rich-text-editor-BoVZYtTs.cjs +0 -2391
  471. package/dist/rich-text-editor-Bp3zQqMC.js +0 -2954
  472. package/dist/rich-text-editor-CMgSN_w2.js +0 -1189
  473. package/dist/rich-text-editor-CPV1lEPH.cjs +0 -1748
  474. package/dist/rich-text-editor-CeucBdIv.cjs +0 -2971
  475. package/dist/rich-text-editor-CoKqbCtu.cjs +0 -1799
  476. package/dist/rich-text-editor-Cw56T_mB.js +0 -2356
  477. package/dist/rich-text-editor-Cyt8qs2b.js +0 -1921
  478. package/dist/rich-text-editor-D6H84OcX.cjs +0 -1220
  479. package/dist/rich-text-editor-D76gD-QI.js +0 -2328
  480. package/dist/rich-text-editor-DKkokOnA.js +0 -1781
  481. package/dist/rich-text-editor-DNsdpN64.cjs +0 -2359
  482. package/dist/rich-text-editor-DfG8bCyY.js +0 -2358
  483. package/dist/rich-text-editor-Dxjw31Z4.js +0 -2341
  484. package/dist/rich-text-editor-DzP0Epmb.js +0 -2356
  485. package/dist/rich-text-editor-bRkNoeZY.cjs +0 -2891
  486. package/dist/rich-text-editor-lyYE2ZG5.cjs +0 -1207
  487. package/dist/rich-text-editor-skplNlBM.cjs +0 -2345
  488. package/dist/select-Bkbr0f-Z.cjs +0 -162
  489. package/dist/select-CvIVdX2n.js +0 -145
  490. package/dist/sidebar-CK_0ZQHj.cjs +0 -803
  491. package/dist/sidebar-CUuOvYhK.js +0 -787
  492. package/dist/sidebar-DQj1z3jG.cjs +0 -758
  493. package/dist/sidebar-Djn5syhi.cjs +0 -786
  494. package/dist/sidebar-LluMXfam.js +0 -759
  495. package/dist/sidebar-_rT7rBMk.js +0 -787
  496. package/dist/slider-Bc5Hd0y1.js +0 -56
  497. package/dist/slider-N7hFFj6X.cjs +0 -73
  498. package/dist/tooltip-Ded96neP.cjs +0 -137
  499. package/dist/tooltip-HDOoD2-0.js +0 -120
  500. package/dist/use-audio-player-B31J-aqh.cjs +0 -187
  501. package/dist/use-audio-player-BkmEmj8Q.js +0 -185
  502. package/dist/use-audio-player-CLFTWFW1.cjs +0 -184
  503. package/dist/use-audio-player-CLLn00I6.js +0 -188
  504. package/dist/use-file-upload-BcjEo2S5.js +0 -404
  505. package/dist/use-file-upload-CRJR68Tj.cjs +0 -403
  506. package/dist/use-mobile-B0hNy_Y6.cjs +0 -4303
  507. package/dist/use-mobile-BXuYROXM.js +0 -4202
  508. package/dist/use-mobile-Bbd51ASU.cjs +0 -4392
  509. package/dist/use-mobile-Bk6CX-TC.js +0 -4359
  510. package/dist/use-mobile-BvYdisLP.js +0 -4202
  511. package/dist/use-mobile-BzuxjzNX.cjs +0 -4392
  512. package/dist/use-mobile-CG2-SdXV.cjs +0 -4235
  513. package/dist/use-mobile-CKb5pqTs.js +0 -4269
  514. package/dist/use-mobile-CYuAuGDl.js +0 -4202
  515. package/dist/use-mobile-CaENcqm-.js +0 -4508
  516. package/dist/use-mobile-CbrYgJGJ.js +0 -4203
  517. package/dist/use-mobile-Cd4xPrKq.cjs +0 -46
  518. package/dist/use-mobile-DMOvImGQ.cjs +0 -4542
  519. package/dist/use-mobile-DRB3BQgD.cjs +0 -4235
  520. package/dist/use-mobile-DZvv7QMR.js +0 -4359
  521. package/dist/use-mobile-DdI_TXam.cjs +0 -4235
  522. package/dist/use-mobile-DlceKf8a.js +0 -4359
  523. package/dist/use-mobile-DsOnow1o.cjs +0 -4236
  524. package/dist/use-mobile-Kcj6jSnK.cjs +0 -4392
  525. package/dist/use-mobile-bnKcua_i.js +0 -4202
  526. package/dist/use-mobile-j4w2Jrf1.js +0 -30
  527. package/dist/use-mobile-ncXBeE2z.cjs +0 -4235
  528. package/dist/use-rich-text-editor-DjiddBGv.js +0 -282
  529. package/dist/use-rich-text-editor-lpeswbCs.cjs +0 -281
  530. package/dist/xertica-assistant-BdiZag0h.js +0 -2187
  531. package/dist/xertica-assistant-CrgTb6Hs.cjs +0 -2155
  532. package/dist/xertica-assistant-DCsnQyi5.js +0 -2156
  533. package/dist/xertica-assistant-DUBpmEgo.cjs +0 -2186
  534. package/dist/{rich-text-editor-DgF8s7xW.js → rich-text-editor-BmsjY03B.js} +26 -26
  535. 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
- };