@arolariu/components 0.0.38 → 0.0.39
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.
- package/CHANGELOG.md +94 -0
- package/CONTRIBUTING.md +371 -0
- package/DEBUGGING.md +401 -0
- package/EXAMPLES.md +1035 -0
- package/LICENSE +21 -21
- package/README.md +627 -0
- package/dist/cjs/components/ui/accordion.cjs +2 -2
- package/dist/cjs/components/ui/accordion.cjs.map +1 -1
- package/dist/cjs/components/ui/alert-dialog.cjs +7 -7
- package/dist/cjs/components/ui/alert-dialog.cjs.map +1 -1
- package/dist/cjs/components/ui/alert.cjs +2 -2
- package/dist/cjs/components/ui/alert.cjs.map +1 -1
- package/dist/cjs/components/ui/aspect-ratio.cjs.map +1 -1
- package/dist/cjs/components/ui/avatar.cjs +2 -2
- package/dist/cjs/components/ui/avatar.cjs.map +1 -1
- package/dist/cjs/components/ui/background-beams.cjs.map +1 -1
- package/dist/cjs/components/ui/badge.cjs +2 -2
- package/dist/cjs/components/ui/badge.cjs.map +1 -1
- package/dist/cjs/components/ui/breadcrumb.cjs +5 -5
- package/dist/cjs/components/ui/breadcrumb.cjs.map +1 -1
- package/dist/cjs/components/ui/bubble-background.cjs.map +1 -1
- package/dist/cjs/components/ui/button.cjs.map +1 -1
- package/dist/cjs/components/ui/calendar.cjs +89 -35
- package/dist/cjs/components/ui/calendar.cjs.map +1 -1
- package/dist/cjs/components/ui/card.cjs +5 -5
- package/dist/cjs/components/ui/card.cjs.map +1 -1
- package/dist/cjs/components/ui/carousel.cjs +3 -3
- package/dist/cjs/components/ui/carousel.cjs.map +1 -1
- package/dist/cjs/components/ui/chart.cjs +14 -14
- package/dist/cjs/components/ui/chart.cjs.map +1 -1
- package/dist/cjs/components/ui/checkbox.cjs.map +1 -1
- package/dist/cjs/components/ui/collapsible.cjs +2 -2
- package/dist/cjs/components/ui/collapsible.cjs.map +1 -1
- package/dist/cjs/components/ui/command.cjs +8 -7
- package/dist/cjs/components/ui/command.cjs.map +1 -1
- package/dist/cjs/components/ui/context-menu.cjs +9 -9
- package/dist/cjs/components/ui/context-menu.cjs.map +1 -1
- package/dist/cjs/components/ui/counting-number.cjs.map +1 -1
- package/dist/cjs/components/ui/dialog.cjs +8 -7
- package/dist/cjs/components/ui/dialog.cjs.map +1 -1
- package/dist/cjs/components/ui/dot-background.cjs.map +1 -1
- package/dist/cjs/components/ui/drawer.cjs +6 -6
- package/dist/cjs/components/ui/drawer.cjs.map +1 -1
- package/dist/cjs/components/ui/dropdown-menu.cjs +10 -10
- package/dist/cjs/components/ui/dropdown-menu.cjs.map +1 -1
- package/dist/cjs/components/ui/dropdrawer.cjs +8 -8
- package/dist/cjs/components/ui/dropdrawer.cjs.map +1 -1
- package/dist/cjs/components/ui/fireworks-background.cjs.map +1 -1
- package/dist/cjs/components/ui/flip-button.cjs.map +1 -1
- package/dist/cjs/components/ui/form.cjs +5 -5
- package/dist/cjs/components/ui/form.cjs.map +1 -1
- package/dist/cjs/components/ui/gradient-background.cjs.map +1 -1
- package/dist/cjs/components/ui/gradient-text.cjs.map +1 -1
- package/dist/cjs/components/ui/highlight-text.cjs.map +1 -1
- package/dist/cjs/components/ui/hole-background.cjs.map +1 -1
- package/dist/cjs/components/ui/hover-card.cjs +2 -2
- package/dist/cjs/components/ui/hover-card.cjs.map +1 -1
- package/dist/cjs/components/ui/input-otp.cjs +3 -3
- package/dist/cjs/components/ui/input-otp.cjs.map +1 -1
- package/dist/cjs/components/ui/input.cjs.map +1 -1
- package/dist/cjs/components/ui/label.cjs.map +1 -1
- package/dist/cjs/components/ui/menubar.cjs +9 -9
- package/dist/cjs/components/ui/menubar.cjs.map +1 -1
- package/dist/cjs/components/ui/navigation-menu.cjs +4 -4
- package/dist/cjs/components/ui/navigation-menu.cjs.map +1 -1
- package/dist/cjs/components/ui/pagination.cjs +3 -3
- package/dist/cjs/components/ui/pagination.cjs.map +1 -1
- package/dist/cjs/components/ui/popover.cjs.map +1 -1
- package/dist/cjs/components/ui/progress.cjs.map +1 -1
- package/dist/cjs/components/ui/radio-group.cjs.map +1 -1
- package/dist/cjs/components/ui/resizable.cjs +1 -1
- package/dist/cjs/components/ui/resizable.cjs.map +1 -1
- package/dist/cjs/components/ui/ripple-button.cjs.map +1 -1
- package/dist/cjs/components/ui/scratcher.cjs.map +1 -1
- package/dist/cjs/components/ui/scroll-area.cjs.map +1 -1
- package/dist/cjs/components/ui/select.cjs +5 -5
- package/dist/cjs/components/ui/select.cjs.map +1 -1
- package/dist/cjs/components/ui/separator.cjs +1 -1
- package/dist/cjs/components/ui/separator.cjs.map +1 -1
- package/dist/cjs/components/ui/sheet.cjs +5 -5
- package/dist/cjs/components/ui/sheet.cjs.map +1 -1
- package/dist/cjs/components/ui/sidebar.cjs +19 -19
- package/dist/cjs/components/ui/sidebar.cjs.map +1 -1
- package/dist/cjs/components/ui/skeleton.cjs.map +1 -1
- package/dist/cjs/components/ui/slider.cjs.map +1 -1
- package/dist/cjs/components/ui/sonner.cjs.map +1 -1
- package/dist/cjs/components/ui/switch.cjs.map +1 -1
- package/dist/cjs/components/ui/table.cjs +6 -6
- package/dist/cjs/components/ui/table.cjs.map +1 -1
- package/dist/cjs/components/ui/tabs.cjs +2 -2
- package/dist/cjs/components/ui/tabs.cjs.map +1 -1
- package/dist/cjs/components/ui/textarea.cjs.map +1 -1
- package/dist/cjs/components/ui/toggle-group.cjs +2 -2
- package/dist/cjs/components/ui/toggle-group.cjs.map +1 -1
- package/dist/cjs/components/ui/toggle.cjs +2 -2
- package/dist/cjs/components/ui/toggle.cjs.map +1 -1
- package/dist/cjs/components/ui/tooltip.cjs +2 -2
- package/dist/cjs/components/ui/tooltip.cjs.map +1 -1
- package/dist/cjs/hooks/use-mobile.cjs.map +1 -1
- package/dist/cjs/index.cjs +244 -242
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/cjs/index.css +399 -149
- package/dist/cjs/index.css.map +1 -0
- package/dist/cjs/lib/utils.cjs.map +1 -1
- package/dist/esm/components/ui/accordion.js +14 -14
- package/dist/esm/components/ui/accordion.js.map +1 -1
- package/dist/esm/components/ui/alert-dialog.js +25 -25
- package/dist/esm/components/ui/alert-dialog.js.map +1 -1
- package/dist/esm/components/ui/alert.js +10 -10
- package/dist/esm/components/ui/alert.js.map +1 -1
- package/dist/esm/components/ui/aspect-ratio.js +3 -3
- package/dist/esm/components/ui/aspect-ratio.js.map +1 -1
- package/dist/esm/components/ui/avatar.js +9 -9
- package/dist/esm/components/ui/avatar.js.map +1 -1
- package/dist/esm/components/ui/background-beams.js +20 -20
- package/dist/esm/components/ui/background-beams.js.map +1 -1
- package/dist/esm/components/ui/badge.js +8 -8
- package/dist/esm/components/ui/badge.js.map +1 -1
- package/dist/esm/components/ui/breadcrumb.js +21 -21
- package/dist/esm/components/ui/breadcrumb.js.map +1 -1
- package/dist/esm/components/ui/bubble-background.js +31 -31
- package/dist/esm/components/ui/bubble-background.js.map +1 -1
- package/dist/esm/components/ui/button.js +8 -8
- package/dist/esm/components/ui/button.js.map +1 -1
- package/dist/esm/components/ui/calendar.js +93 -42
- package/dist/esm/components/ui/calendar.js.map +1 -1
- package/dist/esm/components/ui/card.js +16 -16
- package/dist/esm/components/ui/card.js.map +1 -1
- package/dist/esm/components/ui/carousel.js +33 -33
- package/dist/esm/components/ui/carousel.js.map +1 -1
- package/dist/esm/components/ui/chart.js +45 -45
- package/dist/esm/components/ui/chart.js.map +1 -1
- package/dist/esm/components/ui/checkbox.js +8 -8
- package/dist/esm/components/ui/checkbox.js.map +1 -1
- package/dist/esm/components/ui/collapsible.js +8 -8
- package/dist/esm/components/ui/collapsible.js.map +1 -1
- package/dist/esm/components/ui/command.js +33 -32
- package/dist/esm/components/ui/command.js.map +1 -1
- package/dist/esm/components/ui/context-menu.js +36 -36
- package/dist/esm/components/ui/context-menu.js.map +1 -1
- package/dist/esm/components/ui/counting-number.js +12 -12
- package/dist/esm/components/ui/counting-number.js.map +1 -1
- package/dist/esm/components/ui/dialog.js +27 -26
- package/dist/esm/components/ui/dialog.js.map +1 -1
- package/dist/esm/components/ui/dot-background.js +15 -15
- package/dist/esm/components/ui/dot-background.js.map +1 -1
- package/dist/esm/components/ui/drawer.js +24 -24
- package/dist/esm/components/ui/drawer.js.map +1 -1
- package/dist/esm/components/ui/dropdown-menu.js +36 -36
- package/dist/esm/components/ui/dropdown-menu.js.map +1 -1
- package/dist/esm/components/ui/dropdrawer.js +104 -104
- package/dist/esm/components/ui/dropdrawer.js.map +1 -1
- package/dist/esm/components/ui/fireworks-background.js +12 -12
- package/dist/esm/components/ui/fireworks-background.js.map +1 -1
- package/dist/esm/components/ui/flip-button.js +12 -12
- package/dist/esm/components/ui/flip-button.js.map +1 -1
- package/dist/esm/components/ui/form.js +26 -26
- package/dist/esm/components/ui/form.js.map +1 -1
- package/dist/esm/components/ui/gradient-background.js +7 -7
- package/dist/esm/components/ui/gradient-background.js.map +1 -1
- package/dist/esm/components/ui/gradient-text.js +9 -9
- package/dist/esm/components/ui/gradient-text.js.map +1 -1
- package/dist/esm/components/ui/highlight-text.js +10 -10
- package/dist/esm/components/ui/highlight-text.js.map +1 -1
- package/dist/esm/components/ui/hole-background.js +30 -30
- package/dist/esm/components/ui/hole-background.js.map +1 -1
- package/dist/esm/components/ui/hover-card.js +8 -8
- package/dist/esm/components/ui/hover-card.js.map +1 -1
- package/dist/esm/components/ui/input-otp.js +17 -17
- package/dist/esm/components/ui/input-otp.js.map +1 -1
- package/dist/esm/components/ui/input.js +4 -4
- package/dist/esm/components/ui/input.js.map +1 -1
- package/dist/esm/components/ui/label.js +5 -5
- package/dist/esm/components/ui/label.js.map +1 -1
- package/dist/esm/components/ui/menubar.js +39 -39
- package/dist/esm/components/ui/menubar.js.map +1 -1
- package/dist/esm/components/ui/navigation-menu.js +27 -27
- package/dist/esm/components/ui/navigation-menu.js.map +1 -1
- package/dist/esm/components/ui/pagination.js +23 -23
- package/dist/esm/components/ui/pagination.js.map +1 -1
- package/dist/esm/components/ui/popover.js +9 -9
- package/dist/esm/components/ui/popover.js.map +1 -1
- package/dist/esm/components/ui/progress.js +6 -6
- package/dist/esm/components/ui/progress.js.map +1 -1
- package/dist/esm/components/ui/radio-group.js +10 -10
- package/dist/esm/components/ui/radio-group.js.map +1 -1
- package/dist/esm/components/ui/resizable.js +11 -11
- package/dist/esm/components/ui/resizable.js.map +1 -1
- package/dist/esm/components/ui/ripple-button.js +14 -14
- package/dist/esm/components/ui/ripple-button.js.map +1 -1
- package/dist/esm/components/ui/scratcher.js +13 -13
- package/dist/esm/components/ui/scratcher.js.map +1 -1
- package/dist/esm/components/ui/scroll-area.js +11 -11
- package/dist/esm/components/ui/scroll-area.js.map +1 -1
- package/dist/esm/components/ui/select.js +34 -34
- package/dist/esm/components/ui/select.js.map +1 -1
- package/dist/esm/components/ui/separator.js +6 -6
- package/dist/esm/components/ui/separator.js.map +1 -1
- package/dist/esm/components/ui/sheet.js +25 -25
- package/dist/esm/components/ui/sheet.js.map +1 -1
- package/dist/esm/components/ui/sidebar.js +96 -96
- package/dist/esm/components/ui/sidebar.js.map +1 -1
- package/dist/esm/components/ui/skeleton.js +4 -4
- package/dist/esm/components/ui/skeleton.js.map +1 -1
- package/dist/esm/components/ui/slider.js +12 -12
- package/dist/esm/components/ui/slider.js.map +1 -1
- package/dist/esm/components/ui/sonner.js +7 -8
- package/dist/esm/components/ui/sonner.js.map +1 -1
- package/dist/esm/components/ui/switch.js +7 -7
- package/dist/esm/components/ui/switch.js.map +1 -1
- package/dist/esm/components/ui/table.js +19 -19
- package/dist/esm/components/ui/table.js.map +1 -1
- package/dist/esm/components/ui/tabs.js +11 -11
- package/dist/esm/components/ui/tabs.js.map +1 -1
- package/dist/esm/components/ui/textarea.js +4 -4
- package/dist/esm/components/ui/textarea.js.map +1 -1
- package/dist/esm/components/ui/toggle-group.js +12 -12
- package/dist/esm/components/ui/toggle-group.js.map +1 -1
- package/dist/esm/components/ui/toggle.js +7 -7
- package/dist/esm/components/ui/toggle.js.map +1 -1
- package/dist/esm/components/ui/tooltip.js +11 -11
- package/dist/esm/components/ui/tooltip.js.map +1 -1
- package/dist/esm/hooks/use-mobile.js +3 -3
- package/dist/esm/hooks/use-mobile.js.map +1 -1
- package/dist/esm/index.css +399 -149
- package/dist/esm/index.css.map +1 -0
- package/dist/esm/index.js +62 -332
- package/dist/esm/lib/utils.js +3 -3
- package/dist/esm/lib/utils.js.map +1 -1
- package/dist/index.css +399 -149
- package/dist/index.js +62 -332
- package/dist/types/components/ui/accordion.d.ts +1 -0
- package/dist/types/components/ui/accordion.d.ts.map +1 -0
- package/dist/types/components/ui/alert-dialog.d.ts +1 -0
- package/dist/types/components/ui/alert-dialog.d.ts.map +1 -0
- package/dist/types/components/ui/alert.d.ts +1 -0
- package/dist/types/components/ui/alert.d.ts.map +1 -0
- package/dist/types/components/ui/aspect-ratio.d.ts +1 -0
- package/dist/types/components/ui/aspect-ratio.d.ts.map +1 -0
- package/dist/types/components/ui/avatar.d.ts +1 -0
- package/dist/types/components/ui/avatar.d.ts.map +1 -0
- package/dist/types/components/ui/background-beams.d.ts +1 -0
- package/dist/types/components/ui/background-beams.d.ts.map +1 -0
- package/dist/types/components/ui/badge.d.ts +1 -0
- package/dist/types/components/ui/badge.d.ts.map +1 -0
- package/dist/types/components/ui/breadcrumb.d.ts +1 -0
- package/dist/types/components/ui/breadcrumb.d.ts.map +1 -0
- package/dist/types/components/ui/bubble-background.d.ts +1 -0
- package/dist/types/components/ui/bubble-background.d.ts.map +1 -0
- package/dist/types/components/ui/button.d.ts +1 -0
- package/dist/types/components/ui/button.d.ts.map +1 -0
- package/dist/types/components/ui/calendar.d.ts +8 -3
- package/dist/types/components/ui/calendar.d.ts.map +1 -0
- package/dist/types/components/ui/card.d.ts +1 -0
- package/dist/types/components/ui/card.d.ts.map +1 -0
- package/dist/types/components/ui/carousel.d.ts +1 -0
- package/dist/types/components/ui/carousel.d.ts.map +1 -0
- package/dist/types/components/ui/chart.d.ts +19 -4
- package/dist/types/components/ui/chart.d.ts.map +1 -0
- package/dist/types/components/ui/checkbox.d.ts +1 -0
- package/dist/types/components/ui/checkbox.d.ts.map +1 -0
- package/dist/types/components/ui/collapsible.d.ts +1 -0
- package/dist/types/components/ui/collapsible.d.ts.map +1 -0
- package/dist/types/components/ui/command.d.ts +4 -1
- package/dist/types/components/ui/command.d.ts.map +1 -0
- package/dist/types/components/ui/context-menu.d.ts +1 -0
- package/dist/types/components/ui/context-menu.d.ts.map +1 -0
- package/dist/types/components/ui/counting-number.d.ts +1 -0
- package/dist/types/components/ui/counting-number.d.ts.map +1 -0
- package/dist/types/components/ui/dialog.d.ts +4 -1
- package/dist/types/components/ui/dialog.d.ts.map +1 -0
- package/dist/types/components/ui/dot-background.d.ts +1 -0
- package/dist/types/components/ui/dot-background.d.ts.map +1 -0
- package/dist/types/components/ui/drawer.d.ts +1 -0
- package/dist/types/components/ui/drawer.d.ts.map +1 -0
- package/dist/types/components/ui/dropdown-menu.d.ts +1 -0
- package/dist/types/components/ui/dropdown-menu.d.ts.map +1 -0
- package/dist/types/components/ui/dropdrawer.d.ts +1 -0
- package/dist/types/components/ui/dropdrawer.d.ts.map +1 -0
- package/dist/types/components/ui/fireworks-background.d.ts +1 -0
- package/dist/types/components/ui/fireworks-background.d.ts.map +1 -0
- package/dist/types/components/ui/flip-button.d.ts +1 -0
- package/dist/types/components/ui/flip-button.d.ts.map +1 -0
- package/dist/types/components/ui/form.d.ts +1 -0
- package/dist/types/components/ui/form.d.ts.map +1 -0
- package/dist/types/components/ui/gradient-background.d.ts +1 -0
- package/dist/types/components/ui/gradient-background.d.ts.map +1 -0
- package/dist/types/components/ui/gradient-text.d.ts +1 -0
- package/dist/types/components/ui/gradient-text.d.ts.map +1 -0
- package/dist/types/components/ui/highlight-text.d.ts +1 -0
- package/dist/types/components/ui/highlight-text.d.ts.map +1 -0
- package/dist/types/components/ui/hole-background.d.ts +1 -0
- package/dist/types/components/ui/hole-background.d.ts.map +1 -0
- package/dist/types/components/ui/hover-card.d.ts +1 -0
- package/dist/types/components/ui/hover-card.d.ts.map +1 -0
- package/dist/types/components/ui/input-otp.d.ts +1 -0
- package/dist/types/components/ui/input-otp.d.ts.map +1 -0
- package/dist/types/components/ui/input.d.ts +1 -0
- package/dist/types/components/ui/input.d.ts.map +1 -0
- package/dist/types/components/ui/label.d.ts +1 -0
- package/dist/types/components/ui/label.d.ts.map +1 -0
- package/dist/types/components/ui/menubar.d.ts +1 -0
- package/dist/types/components/ui/menubar.d.ts.map +1 -0
- package/dist/types/components/ui/navigation-menu.d.ts +1 -0
- package/dist/types/components/ui/navigation-menu.d.ts.map +1 -0
- package/dist/types/components/ui/pagination.d.ts +1 -0
- package/dist/types/components/ui/pagination.d.ts.map +1 -0
- package/dist/types/components/ui/popover.d.ts +1 -0
- package/dist/types/components/ui/popover.d.ts.map +1 -0
- package/dist/types/components/ui/progress.d.ts +1 -0
- package/dist/types/components/ui/progress.d.ts.map +1 -0
- package/dist/types/components/ui/radio-group.d.ts +1 -0
- package/dist/types/components/ui/radio-group.d.ts.map +1 -0
- package/dist/types/components/ui/resizable.d.ts +1 -0
- package/dist/types/components/ui/resizable.d.ts.map +1 -0
- package/dist/types/components/ui/ripple-button.d.ts +1 -0
- package/dist/types/components/ui/ripple-button.d.ts.map +1 -0
- package/dist/types/components/ui/scratcher.d.ts +1 -0
- package/dist/types/components/ui/scratcher.d.ts.map +1 -0
- package/dist/types/components/ui/scroll-area.d.ts +1 -0
- package/dist/types/components/ui/scroll-area.d.ts.map +1 -0
- package/dist/types/components/ui/select.d.ts +1 -0
- package/dist/types/components/ui/select.d.ts.map +1 -0
- package/dist/types/components/ui/separator.d.ts +1 -0
- package/dist/types/components/ui/separator.d.ts.map +1 -0
- package/dist/types/components/ui/sheet.d.ts +1 -0
- package/dist/types/components/ui/sheet.d.ts.map +1 -0
- package/dist/types/components/ui/sidebar.d.ts +1 -0
- package/dist/types/components/ui/sidebar.d.ts.map +1 -0
- package/dist/types/components/ui/skeleton.d.ts +1 -0
- package/dist/types/components/ui/skeleton.d.ts.map +1 -0
- package/dist/types/components/ui/slider.d.ts +1 -0
- package/dist/types/components/ui/slider.d.ts.map +1 -0
- package/dist/types/components/ui/sonner.d.ts +1 -0
- package/dist/types/components/ui/sonner.d.ts.map +1 -0
- package/dist/types/components/ui/switch.d.ts +1 -0
- package/dist/types/components/ui/switch.d.ts.map +1 -0
- package/dist/types/components/ui/table.d.ts +1 -0
- package/dist/types/components/ui/table.d.ts.map +1 -0
- package/dist/types/components/ui/tabs.d.ts +1 -0
- package/dist/types/components/ui/tabs.d.ts.map +1 -0
- package/dist/types/components/ui/textarea.d.ts +1 -0
- package/dist/types/components/ui/textarea.d.ts.map +1 -0
- package/dist/types/components/ui/toggle-group.d.ts +1 -0
- package/dist/types/components/ui/toggle-group.d.ts.map +1 -0
- package/dist/types/components/ui/toggle.d.ts +1 -0
- package/dist/types/components/ui/toggle.d.ts.map +1 -0
- package/dist/types/components/ui/tooltip.d.ts +1 -0
- package/dist/types/components/ui/tooltip.d.ts.map +1 -0
- package/dist/types/hooks/use-mobile.d.ts +1 -0
- package/dist/types/hooks/use-mobile.d.ts.map +1 -0
- package/dist/types/index.d.ts +1 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/lib/utils.d.ts +1 -0
- package/dist/types/lib/utils.d.ts.map +1 -0
- package/package.json +95 -76
- package/src/components/ui/accordion.tsx +1 -1
- package/src/components/ui/alert-dialog.tsx +4 -4
- package/src/components/ui/alert.tsx +3 -3
- package/src/components/ui/avatar.tsx +2 -2
- package/src/components/ui/badge.tsx +1 -1
- package/src/components/ui/breadcrumb.tsx +3 -3
- package/src/components/ui/bubble-background.tsx +4 -4
- package/src/components/ui/button.tsx +1 -1
- package/src/components/ui/calendar.tsx +213 -75
- package/src/components/ui/card.tsx +4 -4
- package/src/components/ui/carousel.tsx +6 -6
- package/src/components/ui/chart.tsx +66 -39
- package/src/components/ui/checkbox.tsx +1 -1
- package/src/components/ui/command.tsx +14 -7
- package/src/components/ui/context-menu.tsx +9 -9
- package/src/components/ui/counting-number.tsx +4 -4
- package/src/components/ui/dialog.tsx +17 -9
- package/src/components/ui/dot-background.tsx +2 -2
- package/src/components/ui/drawer.tsx +4 -1
- package/src/components/ui/dropdrawer.tsx +973 -973
- package/src/components/ui/fireworks-background.tsx +12 -12
- package/src/components/ui/flip-button.tsx +6 -6
- package/src/components/ui/form.tsx +6 -6
- package/src/components/ui/gradient-background.tsx +3 -3
- package/src/components/ui/gradient-text.tsx +2 -2
- package/src/components/ui/highlight-text.tsx +3 -3
- package/src/components/ui/hole-background.tsx +9 -9
- package/src/components/ui/hover-card.tsx +1 -1
- package/src/components/ui/input-otp.tsx +2 -2
- package/src/components/ui/input.tsx +5 -6
- package/src/components/ui/label.tsx +1 -1
- package/src/components/ui/menubar.tsx +11 -11
- package/src/components/ui/navigation-menu.tsx +8 -8
- package/src/components/ui/pagination.tsx +1 -1
- package/src/components/ui/popover.tsx +1 -1
- package/src/components/ui/progress.tsx +1 -1
- package/src/components/ui/radio-group.tsx +1 -1
- package/src/components/ui/resizable.tsx +3 -3
- package/src/components/ui/ripple-button.tsx +7 -7
- package/src/components/ui/scratcher.tsx +1 -1
- package/src/components/ui/scroll-area.tsx +1 -1
- package/src/components/ui/select.tsx +8 -8
- package/src/components/ui/separator.tsx +2 -2
- package/src/components/ui/sheet.tsx +4 -4
- package/src/components/ui/sidebar.tsx +18 -18
- package/src/components/ui/skeleton.tsx +1 -1
- package/src/components/ui/slider.tsx +6 -6
- package/src/components/ui/switch.tsx +2 -2
- package/src/components/ui/table.tsx +5 -5
- package/src/components/ui/tabs.tsx +2 -2
- package/src/components/ui/textarea.tsx +1 -1
- package/src/components/ui/toggle-group.tsx +2 -2
- package/src/components/ui/toggle.tsx +1 -1
- package/src/components/ui/tooltip.tsx +1 -1
- package/src/hooks/use-mobile.tsx +44 -44
- package/src/index.css +68 -68
- package/src/index.ts +400 -400
- package/src/lib/utils.ts +10 -10
- package/tailwind.config.mjs +65 -65
- package/tsconfig.json +8 -0
- package/changelog.md +0 -45
- package/readme.md +0 -215
|
@@ -1,53 +1,53 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
4
|
+
import { cn } from "../../lib/utils.js";
|
|
5
5
|
function Card({ className, ...props }) {
|
|
6
|
-
return /*#__PURE__*/
|
|
6
|
+
return /*#__PURE__*/ jsx("div", {
|
|
7
7
|
"data-slot": "card",
|
|
8
|
-
className:
|
|
8
|
+
className: cn("bg-white text-neutral-950 flex flex-col gap-6 rounded-xl border border-neutral-200 py-6 shadow-sm dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800", className),
|
|
9
9
|
...props
|
|
10
10
|
});
|
|
11
11
|
}
|
|
12
12
|
function CardHeader({ className, ...props }) {
|
|
13
|
-
return /*#__PURE__*/
|
|
13
|
+
return /*#__PURE__*/ jsx("div", {
|
|
14
14
|
"data-slot": "card-header",
|
|
15
|
-
className:
|
|
15
|
+
className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className),
|
|
16
16
|
...props
|
|
17
17
|
});
|
|
18
18
|
}
|
|
19
19
|
function CardTitle({ className, ...props }) {
|
|
20
|
-
return /*#__PURE__*/
|
|
20
|
+
return /*#__PURE__*/ jsx("div", {
|
|
21
21
|
"data-slot": "card-title",
|
|
22
|
-
className:
|
|
22
|
+
className: cn("leading-none font-semibold", className),
|
|
23
23
|
...props
|
|
24
24
|
});
|
|
25
25
|
}
|
|
26
26
|
function CardDescription({ className, ...props }) {
|
|
27
|
-
return /*#__PURE__*/
|
|
27
|
+
return /*#__PURE__*/ jsx("div", {
|
|
28
28
|
"data-slot": "card-description",
|
|
29
|
-
className:
|
|
29
|
+
className: cn("text-neutral-500 text-sm dark:text-neutral-400", className),
|
|
30
30
|
...props
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
33
|
function CardAction({ className, ...props }) {
|
|
34
|
-
return /*#__PURE__*/
|
|
34
|
+
return /*#__PURE__*/ jsx("div", {
|
|
35
35
|
"data-slot": "card-action",
|
|
36
|
-
className:
|
|
36
|
+
className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
|
|
37
37
|
...props
|
|
38
38
|
});
|
|
39
39
|
}
|
|
40
40
|
function CardContent({ className, ...props }) {
|
|
41
|
-
return /*#__PURE__*/
|
|
41
|
+
return /*#__PURE__*/ jsx("div", {
|
|
42
42
|
"data-slot": "card-content",
|
|
43
|
-
className:
|
|
43
|
+
className: cn("px-6", className),
|
|
44
44
|
...props
|
|
45
45
|
});
|
|
46
46
|
}
|
|
47
47
|
function CardFooter({ className, ...props }) {
|
|
48
|
-
return /*#__PURE__*/
|
|
48
|
+
return /*#__PURE__*/ jsx("div", {
|
|
49
49
|
"data-slot": "card-footer",
|
|
50
|
-
className:
|
|
50
|
+
className: cn("flex items-center px-6 [.border-t]:pt-6", className),
|
|
51
51
|
...props
|
|
52
52
|
});
|
|
53
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\card.js","sources":["webpack://@arolariu/components/./src/components/ui/card.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n \"bg-white text-neutral-950 flex flex-col gap-6 rounded-xl border border-neutral-200 py-6 shadow-sm dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\card.js","sources":["webpack://@arolariu/components/./src/components/ui/card.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n \"bg-white text-neutral-950 flex flex-col gap-6 rounded-xl border border-neutral-200 py-6 shadow-sm dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n \"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn(\"leading-none font-semibold\", className)}\n {...props}\n />\n );\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn(\n \"text-neutral-500 text-sm dark:text-neutral-400\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn(\n \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn(\"px-6\", className)}\n {...props}\n />\n );\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn(\"flex items-center px-6 [.border-t]:pt-6\", className)}\n {...props}\n />\n );\n}\n\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardAction,\n CardDescription,\n CardContent,\n};\n"],"names":["Card","className","props","cn","CardHeader","CardTitle","CardDescription","CardAction","CardContent","CardFooter"],"mappings":";;;;AAMA,SAASA,KAAK,EAAEC,SAAS,EAAE,GAAGC,OAAoC;IAChE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GACT,sKACAF;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASE,WAAW,EAAEH,SAAS,EAAE,GAAGC,OAAoC;IACtE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GACT,8JACAF;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASG,UAAU,EAAEJ,SAAS,EAAE,GAAGC,OAAoC;IACrE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GAAG,8BAA8BF;QAC3C,GAAGC,KAAK;;AAGf;AAEA,SAASI,gBAAgB,EAAEL,SAAS,EAAE,GAAGC,OAAoC;IAC3E,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GACT,kDACAF;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASK,WAAW,EAAEN,SAAS,EAAE,GAAGC,OAAoC;IACtE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GACT,kEACAF;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASM,YAAY,EAAEP,SAAS,EAAE,GAAGC,OAAoC;IACvE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GAAG,QAAQF;QACrB,GAAGC,KAAK;;AAGf;AAEA,SAASO,WAAW,EAAER,SAAS,EAAE,GAAGC,OAAoC;IACtE,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GAAG,2CAA2CF;QACxD,GAAGC,KAAK;;AAGf"}
|
|
@@ -1,39 +1,39 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
const CarouselContext = /*#__PURE__*/
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { createContext, useCallback, useContext, useEffect, useState } from "react";
|
|
4
|
+
import embla_carousel_react from "embla-carousel-react";
|
|
5
|
+
import { ArrowLeft, ArrowRight } from "lucide-react";
|
|
6
|
+
import { cn } from "../../lib/utils.js";
|
|
7
|
+
import { Button } from "./button.js";
|
|
8
|
+
const CarouselContext = /*#__PURE__*/ createContext(null);
|
|
9
9
|
function useCarousel() {
|
|
10
|
-
const context =
|
|
10
|
+
const context = useContext(CarouselContext);
|
|
11
11
|
if (!context) throw new Error("useCarousel must be used within a <Carousel />");
|
|
12
12
|
return context;
|
|
13
13
|
}
|
|
14
14
|
function Carousel({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) {
|
|
15
|
-
const [carouselRef, api] = (
|
|
15
|
+
const [carouselRef, api] = embla_carousel_react({
|
|
16
16
|
...opts,
|
|
17
17
|
axis: "horizontal" === orientation ? "x" : "y"
|
|
18
18
|
}, plugins);
|
|
19
|
-
const [canScrollPrev, setCanScrollPrev] =
|
|
20
|
-
const [canScrollNext, setCanScrollNext] =
|
|
21
|
-
const onSelect =
|
|
19
|
+
const [canScrollPrev, setCanScrollPrev] = useState(false);
|
|
20
|
+
const [canScrollNext, setCanScrollNext] = useState(false);
|
|
21
|
+
const onSelect = useCallback((api)=>{
|
|
22
22
|
if (!api) return;
|
|
23
23
|
setCanScrollPrev(api.canScrollPrev());
|
|
24
24
|
setCanScrollNext(api.canScrollNext());
|
|
25
25
|
}, []);
|
|
26
|
-
const scrollPrev =
|
|
26
|
+
const scrollPrev = useCallback(()=>{
|
|
27
27
|
api?.scrollPrev();
|
|
28
28
|
}, [
|
|
29
29
|
api
|
|
30
30
|
]);
|
|
31
|
-
const scrollNext =
|
|
31
|
+
const scrollNext = useCallback(()=>{
|
|
32
32
|
api?.scrollNext();
|
|
33
33
|
}, [
|
|
34
34
|
api
|
|
35
35
|
]);
|
|
36
|
-
const handleKeyDown =
|
|
36
|
+
const handleKeyDown = useCallback((event)=>{
|
|
37
37
|
if ("ArrowLeft" === event.key) {
|
|
38
38
|
event.preventDefault();
|
|
39
39
|
scrollPrev();
|
|
@@ -45,14 +45,14 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
45
45
|
scrollPrev,
|
|
46
46
|
scrollNext
|
|
47
47
|
]);
|
|
48
|
-
|
|
48
|
+
useEffect(()=>{
|
|
49
49
|
if (!api || !setApi) return;
|
|
50
50
|
setApi(api);
|
|
51
51
|
}, [
|
|
52
52
|
api,
|
|
53
53
|
setApi
|
|
54
54
|
]);
|
|
55
|
-
|
|
55
|
+
useEffect(()=>{
|
|
56
56
|
if (!api) return;
|
|
57
57
|
onSelect(api);
|
|
58
58
|
api.on("reInit", onSelect);
|
|
@@ -64,7 +64,7 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
64
64
|
api,
|
|
65
65
|
onSelect
|
|
66
66
|
]);
|
|
67
|
-
return /*#__PURE__*/
|
|
67
|
+
return /*#__PURE__*/ jsx(CarouselContext.Provider, {
|
|
68
68
|
value: {
|
|
69
69
|
carouselRef,
|
|
70
70
|
api: api,
|
|
@@ -75,9 +75,9 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
75
75
|
canScrollPrev,
|
|
76
76
|
canScrollNext
|
|
77
77
|
},
|
|
78
|
-
children: /*#__PURE__*/
|
|
78
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
79
79
|
onKeyDownCapture: handleKeyDown,
|
|
80
|
-
className:
|
|
80
|
+
className: cn("relative", className),
|
|
81
81
|
role: "region",
|
|
82
82
|
"aria-roledescription": "carousel",
|
|
83
83
|
"data-slot": "carousel",
|
|
@@ -88,39 +88,39 @@ function Carousel({ orientation = "horizontal", opts, setApi, plugins, className
|
|
|
88
88
|
}
|
|
89
89
|
function CarouselContent({ className, ...props }) {
|
|
90
90
|
const { carouselRef, orientation } = useCarousel();
|
|
91
|
-
return /*#__PURE__*/
|
|
91
|
+
return /*#__PURE__*/ jsx("div", {
|
|
92
92
|
ref: carouselRef,
|
|
93
93
|
className: "overflow-hidden",
|
|
94
94
|
"data-slot": "carousel-content",
|
|
95
|
-
children: /*#__PURE__*/
|
|
96
|
-
className:
|
|
95
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
96
|
+
className: cn("flex", "horizontal" === orientation ? "-ml-4" : "-mt-4 flex-col", className),
|
|
97
97
|
...props
|
|
98
98
|
})
|
|
99
99
|
});
|
|
100
100
|
}
|
|
101
101
|
function CarouselItem({ className, ...props }) {
|
|
102
102
|
const { orientation } = useCarousel();
|
|
103
|
-
return /*#__PURE__*/
|
|
103
|
+
return /*#__PURE__*/ jsx("div", {
|
|
104
104
|
role: "group",
|
|
105
105
|
"aria-roledescription": "slide",
|
|
106
106
|
"data-slot": "carousel-item",
|
|
107
|
-
className:
|
|
107
|
+
className: cn("min-w-0 shrink-0 grow-0 basis-full", "horizontal" === orientation ? "pl-4" : "pt-4", className),
|
|
108
108
|
...props
|
|
109
109
|
});
|
|
110
110
|
}
|
|
111
111
|
function CarouselPrevious({ className, variant = "outline", size = "icon", ...props }) {
|
|
112
112
|
const { orientation, scrollPrev, canScrollPrev } = useCarousel();
|
|
113
|
-
return /*#__PURE__*/
|
|
113
|
+
return /*#__PURE__*/ jsxs(Button, {
|
|
114
114
|
"data-slot": "carousel-previous",
|
|
115
115
|
variant: variant,
|
|
116
116
|
size: size,
|
|
117
|
-
className:
|
|
117
|
+
className: cn("absolute size-8 rounded-full", "horizontal" === orientation ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
118
118
|
disabled: !canScrollPrev,
|
|
119
119
|
onClick: scrollPrev,
|
|
120
120
|
...props,
|
|
121
121
|
children: [
|
|
122
|
-
/*#__PURE__*/
|
|
123
|
-
/*#__PURE__*/
|
|
122
|
+
/*#__PURE__*/ jsx(ArrowLeft, {}),
|
|
123
|
+
/*#__PURE__*/ jsx("span", {
|
|
124
124
|
className: "sr-only",
|
|
125
125
|
children: "Previous slide"
|
|
126
126
|
})
|
|
@@ -129,17 +129,17 @@ function CarouselPrevious({ className, variant = "outline", size = "icon", ...pr
|
|
|
129
129
|
}
|
|
130
130
|
function CarouselNext({ className, variant = "outline", size = "icon", ...props }) {
|
|
131
131
|
const { orientation, scrollNext, canScrollNext } = useCarousel();
|
|
132
|
-
return /*#__PURE__*/
|
|
132
|
+
return /*#__PURE__*/ jsxs(Button, {
|
|
133
133
|
"data-slot": "carousel-next",
|
|
134
134
|
variant: variant,
|
|
135
135
|
size: size,
|
|
136
|
-
className:
|
|
136
|
+
className: cn("absolute size-8 rounded-full", "horizontal" === orientation ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
137
137
|
disabled: !canScrollNext,
|
|
138
138
|
onClick: scrollNext,
|
|
139
139
|
...props,
|
|
140
140
|
children: [
|
|
141
|
-
/*#__PURE__*/
|
|
142
|
-
/*#__PURE__*/
|
|
141
|
+
/*#__PURE__*/ jsx(ArrowRight, {}),
|
|
142
|
+
/*#__PURE__*/ jsx("span", {
|
|
143
143
|
className: "sr-only",
|
|
144
144
|
children: "Next slide"
|
|
145
145
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\carousel.js","sources":["webpack://@arolariu/components/./src/components/ui/carousel.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport useEmblaCarousel, {\n type UseEmblaCarouselType,\n} from \"embla-carousel-react\";\nimport { ArrowLeft, ArrowRight } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: \"horizontal\" | \"vertical\";\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error(\"useCarousel must be used within a <Carousel />\");\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = \"horizontal\",\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<\"div\"> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n },\n plugins
|
|
1
|
+
{"version":3,"file":"components\\ui\\carousel.js","sources":["webpack://@arolariu/components/./src/components/ui/carousel.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport useEmblaCarousel, {\n type UseEmblaCarouselType,\n} from \"embla-carousel-react\";\nimport { ArrowLeft, ArrowRight } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: \"horizontal\" | \"vertical\";\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error(\"useCarousel must be used within a <Carousel />\");\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = \"horizontal\",\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<\"div\"> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === \"horizontal\" ? \"x\" : \"y\",\n },\n plugins,\n );\n const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n const onSelect = React.useCallback((api: CarouselApi) => {\n if (!api) return;\n setCanScrollPrev(api.canScrollPrev());\n setCanScrollNext(api.canScrollNext());\n }, []);\n\n const scrollPrev = React.useCallback(() => {\n api?.scrollPrev();\n }, [api]);\n\n const scrollNext = React.useCallback(() => {\n api?.scrollNext();\n }, [api]);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === \"ArrowLeft\") {\n event.preventDefault();\n scrollPrev();\n } else if (event.key === \"ArrowRight\") {\n event.preventDefault();\n scrollNext();\n }\n },\n [scrollPrev, scrollNext],\n );\n\n React.useEffect(() => {\n if (!api || !setApi) return;\n setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\n onSelect(api);\n api.on(\"reInit\", onSelect);\n api.on(\"select\", onSelect);\n\n return () => {\n api?.off(\"select\", onSelect);\n };\n }, [api, onSelect]);\n\n return (\n <CarouselContext.Provider\n value={{\n carouselRef,\n api: api,\n opts,\n orientation:\n orientation || (opts?.axis === \"y\" ? \"vertical\" : \"horizontal\"),\n scrollPrev,\n scrollNext,\n canScrollPrev,\n canScrollNext,\n }}\n >\n <div\n onKeyDownCapture={handleKeyDown}\n className={cn(\"relative\", className)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n data-slot=\"carousel\"\n {...props}\n >\n {children}\n </div>\n </CarouselContext.Provider>\n );\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<\"div\">) {\n const { carouselRef, orientation } = useCarousel();\n\n return (\n <div\n ref={carouselRef}\n className=\"overflow-hidden\"\n data-slot=\"carousel-content\"\n >\n <div\n className={cn(\n \"flex\",\n orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\",\n className,\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const { orientation } = useCarousel();\n\n return (\n <div\n role=\"group\"\n aria-roledescription=\"slide\"\n data-slot=\"carousel-item\"\n className={cn(\n \"min-w-0 shrink-0 grow-0 basis-full\",\n orientation === \"horizontal\" ? \"pl-4\" : \"pt-4\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CarouselPrevious({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-previous\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -left-12 -translate-y-1/2\"\n : \"-top-12 left-1/2 -translate-x-1/2 rotate-90\",\n className,\n )}\n disabled={!canScrollPrev}\n onClick={scrollPrev}\n {...props}\n >\n <ArrowLeft />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = \"outline\",\n size = \"icon\",\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-next\"\n variant={variant}\n size={size}\n className={cn(\n \"absolute size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -right-12 -translate-y-1/2\"\n : \"-bottom-12 left-1/2 -translate-x-1/2 rotate-90\",\n className,\n )}\n disabled={!canScrollNext}\n onClick={scrollNext}\n {...props}\n >\n <ArrowRight />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n};\n"],"names":["CarouselContext","React","useCarousel","context","Error","Carousel","orientation","opts","setApi","plugins","className","children","props","carouselRef","api","useEmblaCarousel","canScrollPrev","setCanScrollPrev","canScrollNext","setCanScrollNext","onSelect","scrollPrev","scrollNext","handleKeyDown","event","cn","CarouselContent","CarouselItem","CarouselPrevious","variant","size","Button","ArrowLeft","CarouselNext","ArrowRight"],"mappings":";;;;;;;AAgCA,MAAMA,kBAAkB,WAAlBA,GAAkBC,cAAiD;AAEzE,SAASC;IACP,MAAMC,UAAUF,WAAiBD;IAEjC,IAAI,CAACG,SACH,MAAM,IAAIC,MAAM;IAGlB,OAAOD;AACT;AAEA,SAASE,SAAS,EAChBC,cAAc,YAAY,EAC1BC,IAAI,EACJC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,QAAQ,EACR,GAAGC,OACyC;IAC5C,MAAM,CAACC,aAAaC,IAAI,GAAGC,qBACzB;QACE,GAAGR,IAAI;QACP,MAAMD,iBAAAA,cAA+B,MAAM;IAC7C,GACAG;IAEF,MAAM,CAACO,eAAeC,iBAAiB,GAAGhB,SAAe;IACzD,MAAM,CAACiB,eAAeC,iBAAiB,GAAGlB,SAAe;IAEzD,MAAMmB,WAAWnB,YAAkB,CAACa;QAClC,IAAI,CAACA,KAAK;QACVG,iBAAiBH,IAAI,aAAa;QAClCK,iBAAiBL,IAAI,aAAa;IACpC,GAAG,EAAE;IAEL,MAAMO,aAAapB,YAAkB;QACnCa,KAAK;IACP,GAAG;QAACA;KAAI;IAER,MAAMQ,aAAarB,YAAkB;QACnCa,KAAK;IACP,GAAG;QAACA;KAAI;IAER,MAAMS,gBAAgBtB,YACpB,CAACuB;QACC,IAAIA,gBAAAA,MAAM,GAAG,EAAkB;YAC7BA,MAAM,cAAc;YACpBH;QACF,OAAO,IAAIG,iBAAAA,MAAM,GAAG,EAAmB;YACrCA,MAAM,cAAc;YACpBF;QACF;IACF,GACA;QAACD;QAAYC;KAAW;IAG1BrB,UAAgB;QACd,IAAI,CAACa,OAAO,CAACN,QAAQ;QACrBA,OAAOM;IACT,GAAG;QAACA;QAAKN;KAAO;IAEhBP,UAAgB;QACd,IAAI,CAACa,KAAK;QACVM,SAASN;QACTA,IAAI,EAAE,CAAC,UAAUM;QACjBN,IAAI,EAAE,CAAC,UAAUM;QAEjB,OAAO;YACLN,KAAK,IAAI,UAAUM;QACrB;IACF,GAAG;QAACN;QAAKM;KAAS;IAElB,OAAO,WAAP,GACE,IAACpB,gBAAgB,QAAQ;QACvB,OAAO;YACLa;YACA,KAAKC;YACLP;YACA,aACED,eAAgBC,CAAAA,MAAM,SAAS,MAAM,aAAa,YAAW;YAC/Dc;YACAC;YACAN;YACAE;QACF;kBAEA,kBAAC;YACC,kBAAkBK;YAClB,WAAWE,GAAG,YAAYf;YAC1B,MAAK;YACL,wBAAqB;YACrB,aAAU;YACT,GAAGE,KAAK;sBAERD;;;AAIT;AAEA,SAASe,gBAAgB,EAAEhB,SAAS,EAAE,GAAGE,OAAoC;IAC3E,MAAM,EAAEC,WAAW,EAAEP,WAAW,EAAE,GAAGJ;IAErC,OAAO,WAAP,GACE,IAAC;QACC,KAAKW;QACL,WAAU;QACV,aAAU;kBAEV,kBAAC;YACC,WAAWY,GACT,QACAnB,iBAAAA,cAA+B,UAAU,kBACzCI;YAED,GAAGE,KAAK;;;AAIjB;AAEA,SAASe,aAAa,EAAEjB,SAAS,EAAE,GAAGE,OAAoC;IACxE,MAAM,EAAEN,WAAW,EAAE,GAAGJ;IAExB,OAAO,WAAP,GACE,IAAC;QACC,MAAK;QACL,wBAAqB;QACrB,aAAU;QACV,WAAWuB,GACT,sCACAnB,iBAAAA,cAA+B,SAAS,QACxCI;QAED,GAAGE,KAAK;;AAGf;AAEA,SAASgB,iBAAiB,EACxBlB,SAAS,EACTmB,UAAU,SAAS,EACnBC,OAAO,MAAM,EACb,GAAGlB,OACiC;IACpC,MAAM,EAAEN,WAAW,EAAEe,UAAU,EAAEL,aAAa,EAAE,GAAGd;IAEnD,OAAO,WAAP,GACE,KAAC6B,QAAMA;QACL,aAAU;QACV,SAASF;QACT,MAAMC;QACN,WAAWL,GACT,gCACAnB,iBAAAA,cACI,sCACA,+CACJI;QAEF,UAAU,CAACM;QACX,SAASK;QACR,GAAGT,KAAK;;0BAET,IAACoB,WAASA,CAAAA;0BACV,IAAC;gBAAK,WAAU;0BAAU;;;;AAGhC;AAEA,SAASC,aAAa,EACpBvB,SAAS,EACTmB,UAAU,SAAS,EACnBC,OAAO,MAAM,EACb,GAAGlB,OACiC;IACpC,MAAM,EAAEN,WAAW,EAAEgB,UAAU,EAAEJ,aAAa,EAAE,GAAGhB;IAEnD,OAAO,WAAP,GACE,KAAC6B,QAAMA;QACL,aAAU;QACV,SAASF;QACT,MAAMC;QACN,WAAWL,GACT,gCACAnB,iBAAAA,cACI,uCACA,kDACJI;QAEF,UAAU,CAACQ;QACX,SAASI;QACR,GAAGV,KAAK;;0BAET,IAACsB,YAAUA,CAAAA;0BACX,IAAC;gBAAK,WAAU;0BAAU;;;;AAGhC"}
|
|
@@ -1,36 +1,36 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
2
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { createContext, useContext, useId, useMemo } from "react";
|
|
4
|
+
import { Legend, ResponsiveContainer, Tooltip } from "recharts";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
6
|
const THEMES = {
|
|
7
7
|
light: "",
|
|
8
8
|
dark: ".dark"
|
|
9
9
|
};
|
|
10
|
-
const ChartContext = /*#__PURE__*/
|
|
10
|
+
const ChartContext = /*#__PURE__*/ createContext(null);
|
|
11
11
|
function useChart() {
|
|
12
|
-
const context =
|
|
12
|
+
const context = useContext(ChartContext);
|
|
13
13
|
if (!context) throw new Error("useChart must be used within a <ChartContainer />");
|
|
14
14
|
return context;
|
|
15
15
|
}
|
|
16
16
|
function ChartContainer({ id, className, children, config, ...props }) {
|
|
17
|
-
const uniqueId =
|
|
17
|
+
const uniqueId = useId();
|
|
18
18
|
const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
|
|
19
|
-
return /*#__PURE__*/
|
|
19
|
+
return /*#__PURE__*/ jsx(ChartContext.Provider, {
|
|
20
20
|
value: {
|
|
21
21
|
config
|
|
22
22
|
},
|
|
23
|
-
children: /*#__PURE__*/
|
|
23
|
+
children: /*#__PURE__*/ jsxs("div", {
|
|
24
24
|
"data-slot": "chart",
|
|
25
25
|
"data-chart": chartId,
|
|
26
|
-
className:
|
|
26
|
+
className: cn("[&_.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 flex aspect-video justify-center 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", className),
|
|
27
27
|
...props,
|
|
28
28
|
children: [
|
|
29
|
-
/*#__PURE__*/
|
|
29
|
+
/*#__PURE__*/ jsx(ChartStyle, {
|
|
30
30
|
id: chartId,
|
|
31
31
|
config: config
|
|
32
32
|
}),
|
|
33
|
-
/*#__PURE__*/
|
|
33
|
+
/*#__PURE__*/ jsx(ResponsiveContainer, {
|
|
34
34
|
children: children
|
|
35
35
|
})
|
|
36
36
|
]
|
|
@@ -40,35 +40,35 @@ function ChartContainer({ id, className, children, config, ...props }) {
|
|
|
40
40
|
const ChartStyle = ({ id, config })=>{
|
|
41
41
|
const colorConfig = Object.entries(config).filter(([, config])=>config.theme || config.color);
|
|
42
42
|
if (!colorConfig.length) return null;
|
|
43
|
-
return /*#__PURE__*/
|
|
43
|
+
return /*#__PURE__*/ jsx("style", {
|
|
44
44
|
dangerouslySetInnerHTML: {
|
|
45
45
|
__html: Object.entries(THEMES).map(([theme, prefix])=>`
|
|
46
|
-
${prefix} [data-chart=${id}] {
|
|
47
|
-
${colorConfig.map(([key, itemConfig])=>{
|
|
46
|
+
${prefix} [data-chart=${id}] {
|
|
47
|
+
${colorConfig.map(([key, itemConfig])=>{
|
|
48
48
|
const color = itemConfig.theme?.[theme] || itemConfig.color;
|
|
49
49
|
return color ? ` --color-${key}: ${color};` : null;
|
|
50
50
|
}).join("\n")}
|
|
51
|
-
}
|
|
52
|
-
`).join("\n")
|
|
51
|
+
}
|
|
52
|
+
`).join("\n")
|
|
53
53
|
}
|
|
54
54
|
});
|
|
55
55
|
};
|
|
56
|
-
const ChartTooltip =
|
|
57
|
-
function ChartTooltipContent({ active, payload, className, indicator = "dot", hideLabel = false, hideIndicator = false,
|
|
56
|
+
const ChartTooltip = Tooltip;
|
|
57
|
+
function ChartTooltipContent({ active, payload, label, className, indicator = "dot", hideLabel = false, hideIndicator = false, labelFormatter, formatter, labelClassName, color, nameKey, labelKey }) {
|
|
58
58
|
const { config } = useChart();
|
|
59
|
-
const tooltipLabel =
|
|
59
|
+
const tooltipLabel = useMemo(()=>{
|
|
60
60
|
if (hideLabel || !payload?.length) return null;
|
|
61
61
|
const [item] = payload;
|
|
62
62
|
const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
|
|
63
63
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
64
64
|
const value = labelKey || "string" != typeof label ? itemConfig?.label : config[label]?.label || label;
|
|
65
|
-
if (labelFormatter) return /*#__PURE__*/
|
|
66
|
-
className:
|
|
65
|
+
if (labelFormatter) return /*#__PURE__*/ jsx("div", {
|
|
66
|
+
className: cn("font-medium", labelClassName),
|
|
67
67
|
children: labelFormatter(value, payload)
|
|
68
68
|
});
|
|
69
69
|
if (!value) return null;
|
|
70
|
-
return /*#__PURE__*/
|
|
71
|
-
className:
|
|
70
|
+
return /*#__PURE__*/ jsx("div", {
|
|
71
|
+
className: cn("font-medium", labelClassName),
|
|
72
72
|
children: value
|
|
73
73
|
});
|
|
74
74
|
}, [
|
|
@@ -82,22 +82,22 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
|
|
|
82
82
|
]);
|
|
83
83
|
if (!active || !payload?.length) return null;
|
|
84
84
|
const nestLabel = 1 === payload.length && "dot" !== indicator;
|
|
85
|
-
return /*#__PURE__*/
|
|
86
|
-
className:
|
|
85
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
86
|
+
className: cn("border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl", className),
|
|
87
87
|
children: [
|
|
88
88
|
nestLabel ? null : tooltipLabel,
|
|
89
|
-
/*#__PURE__*/
|
|
89
|
+
/*#__PURE__*/ jsx("div", {
|
|
90
90
|
className: "grid gap-1.5",
|
|
91
91
|
children: payload.map((item, index)=>{
|
|
92
92
|
const key = `${nameKey || item.name || item.dataKey || "value"}`;
|
|
93
93
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
94
94
|
const indicatorColor = color || item.payload.fill || item.color;
|
|
95
|
-
return /*#__PURE__*/
|
|
96
|
-
className:
|
|
97
|
-
children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /*#__PURE__*/
|
|
95
|
+
return /*#__PURE__*/ jsx("div", {
|
|
96
|
+
className: cn("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", "dot" === indicator && "items-center"),
|
|
97
|
+
children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /*#__PURE__*/ jsxs(Fragment, {
|
|
98
98
|
children: [
|
|
99
|
-
itemConfig?.icon ? /*#__PURE__*/
|
|
100
|
-
className:
|
|
99
|
+
itemConfig?.icon ? /*#__PURE__*/ jsx(itemConfig.icon, {}) : !hideIndicator && /*#__PURE__*/ jsx("div", {
|
|
100
|
+
className: cn("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
|
|
101
101
|
"h-2.5 w-2.5": "dot" === indicator,
|
|
102
102
|
"w-1": "line" === indicator,
|
|
103
103
|
"w-0 border-[1.5px] border-dashed bg-transparent": "dashed" === indicator,
|
|
@@ -108,21 +108,21 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
|
|
|
108
108
|
"--color-border": indicatorColor
|
|
109
109
|
}
|
|
110
110
|
}),
|
|
111
|
-
/*#__PURE__*/
|
|
112
|
-
className:
|
|
111
|
+
/*#__PURE__*/ jsxs("div", {
|
|
112
|
+
className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"),
|
|
113
113
|
children: [
|
|
114
|
-
/*#__PURE__*/
|
|
114
|
+
/*#__PURE__*/ jsxs("div", {
|
|
115
115
|
className: "grid gap-1.5",
|
|
116
116
|
children: [
|
|
117
117
|
nestLabel ? tooltipLabel : null,
|
|
118
|
-
/*#__PURE__*/
|
|
119
|
-
className: "text-
|
|
118
|
+
/*#__PURE__*/ jsx("span", {
|
|
119
|
+
className: "text-muted-foreground",
|
|
120
120
|
children: itemConfig?.label || item.name
|
|
121
121
|
})
|
|
122
122
|
]
|
|
123
123
|
}),
|
|
124
|
-
item.value && /*#__PURE__*/
|
|
125
|
-
className: "text-
|
|
124
|
+
item.value && /*#__PURE__*/ jsx("span", {
|
|
125
|
+
className: "text-foreground font-mono font-medium tabular-nums",
|
|
126
126
|
children: item.value.toLocaleString()
|
|
127
127
|
})
|
|
128
128
|
]
|
|
@@ -135,19 +135,19 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
|
|
|
135
135
|
]
|
|
136
136
|
});
|
|
137
137
|
}
|
|
138
|
-
const ChartLegend =
|
|
138
|
+
const ChartLegend = Legend;
|
|
139
139
|
function ChartLegendContent({ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey }) {
|
|
140
140
|
const { config } = useChart();
|
|
141
141
|
if (!payload?.length) return null;
|
|
142
|
-
return /*#__PURE__*/
|
|
143
|
-
className:
|
|
142
|
+
return /*#__PURE__*/ jsx("div", {
|
|
143
|
+
className: cn("flex items-center justify-center gap-4", "top" === verticalAlign ? "pb-3" : "pt-3", className),
|
|
144
144
|
children: payload.map((item)=>{
|
|
145
145
|
const key = `${nameKey || item.dataKey || "value"}`;
|
|
146
146
|
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
147
|
-
return /*#__PURE__*/
|
|
148
|
-
className:
|
|
147
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
148
|
+
className: cn("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"),
|
|
149
149
|
children: [
|
|
150
|
-
itemConfig?.icon && !hideIcon ? /*#__PURE__*/
|
|
150
|
+
itemConfig?.icon && !hideIcon ? /*#__PURE__*/ jsx(itemConfig.icon, {}) : /*#__PURE__*/ jsx("div", {
|
|
151
151
|
className: "h-2 w-2 shrink-0 rounded-[2px]",
|
|
152
152
|
style: {
|
|
153
153
|
backgroundColor: item.color
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\chart.js","sources":["webpack://@arolariu/components/./src/components/ui/chart.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RechartsPrimitive from \"recharts\";\n\nimport { cn } from \"@/lib/utils\";\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\n\nexport type ChartConfig = {\n [k in string]: {\n label?: React.ReactNode;\n icon?: React.ComponentType;\n } & (\n | { color?: string; theme?: never }\n | { color?: never; theme: Record<keyof typeof THEMES, string> }\n );\n};\n\ntype ChartContextProps = {\n config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n const context = React.useContext(ChartContext);\n\n if (!context) {\n throw new Error(\"useChart must be used within a <ChartContainer />\");\n }\n\n return context;\n}\n\nfunction ChartContainer({\n id,\n className,\n children,\n config,\n ...props\n}: React.ComponentProps<\"div\"> & {\n config: ChartConfig;\n children: React.ComponentProps<\n typeof RechartsPrimitive.ResponsiveContainer\n >[\"children\"];\n}) {\n const uniqueId = React.useId();\n const chartId = `chart-${id || uniqueId.replace(/:/g, \"\")}`;\n\n return (\n <ChartContext.Provider value={{ config }}>\n <div\n data-slot=\"chart\"\n data-chart={chartId}\n className={cn(\n \"[&_.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 flex aspect-video justify-center 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\",\n className\n )}\n {...props}\n >\n <ChartStyle id={chartId} config={config} />\n <RechartsPrimitive.ResponsiveContainer>\n {children}\n </RechartsPrimitive.ResponsiveContainer>\n </div>\n </ChartContext.Provider>\n );\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n const colorConfig = Object.entries(config).filter(\n ([, config]) => config.theme || config.color\n );\n\n if (!colorConfig.length) {\n return null;\n }\n\n return (\n <style\n dangerouslySetInnerHTML={{\n __html: Object.entries(THEMES)\n .map(\n ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n .map(([key, itemConfig]) => {\n const color =\n itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||\n itemConfig.color;\n return color ? ` --color-${key}: ${color};` : null;\n })\n .join(\"\\n\")}\n}\n`\n )\n .join(\"\\n\"),\n }}\n />\n );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\nfunction ChartTooltipContent({\n active,\n payload,\n className,\n indicator = \"dot\",\n hideLabel = false,\n hideIndicator = false,\n label,\n labelFormatter,\n labelClassName,\n formatter,\n color,\n nameKey,\n labelKey,\n}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n React.ComponentProps<\"div\"> & {\n hideLabel?: boolean;\n hideIndicator?: boolean;\n indicator?: \"line\" | \"dot\" | \"dashed\";\n nameKey?: string;\n labelKey?: string;\n }) {\n const { config } = useChart();\n\n const tooltipLabel = React.useMemo(() => {\n if (hideLabel || !payload?.length) {\n return null;\n }\n\n const [item] = payload;\n const key = `${labelKey || item?.dataKey || item?.name || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const value =\n !labelKey && typeof label === \"string\"\n ? config[label as keyof typeof config]?.label || label\n : itemConfig?.label;\n\n if (labelFormatter) {\n return (\n <div className={cn(\"font-medium\", labelClassName)}>\n {labelFormatter(value, payload)}\n </div>\n );\n }\n\n if (!value) {\n return null;\n }\n\n return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\n }, [\n label,\n labelFormatter,\n payload,\n hideLabel,\n labelClassName,\n config,\n labelKey,\n ]);\n\n if (!active || !payload?.length) {\n return null;\n }\n\n const nestLabel = payload.length === 1 && indicator !== \"dot\";\n\n return (\n <div\n className={cn(\n \"border-neutral-200/50 bg-white grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-neutral-200 px-2.5 py-1.5 text-xs shadow-xl dark:border-neutral-800/50 dark:bg-neutral-950 dark:border-neutral-800\",\n className\n )}\n >\n {!nestLabel ? tooltipLabel : null}\n <div className=\"grid gap-1.5\">\n {payload.map((item, index) => {\n const key = `${nameKey || item.name || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const indicatorColor = color || item.payload.fill || item.color;\n\n return (\n <div\n key={item.dataKey}\n className={cn(\n \"[&>svg]:text-neutral-500 flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 dark:[&>svg]:text-neutral-400\",\n indicator === \"dot\" && \"items-center\"\n )}\n >\n {formatter && item?.value !== undefined && item.name ? (\n formatter(item.value, item.name, item, index, item.payload)\n ) : (\n <>\n {itemConfig?.icon ? (\n <itemConfig.icon />\n ) : (\n !hideIndicator && (\n <div\n className={cn(\n \"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\",\n {\n \"h-2.5 w-2.5\": indicator === \"dot\",\n \"w-1\": indicator === \"line\",\n \"w-0 border-[1.5px] border-dashed bg-transparent\":\n indicator === \"dashed\",\n \"my-0.5\": nestLabel && indicator === \"dashed\",\n }\n )}\n style={\n {\n \"--color-bg\": indicatorColor,\n \"--color-border\": indicatorColor,\n } as React.CSSProperties\n }\n />\n )\n )}\n <div\n className={cn(\n \"flex flex-1 justify-between leading-none\",\n nestLabel ? \"items-end\" : \"items-center\"\n )}\n >\n <div className=\"grid gap-1.5\">\n {nestLabel ? tooltipLabel : null}\n <span className=\"text-neutral-500 dark:text-neutral-400\">\n {itemConfig?.label || item.name}\n </span>\n </div>\n {item.value && (\n <span className=\"text-neutral-950 font-mono font-medium tabular-nums dark:text-neutral-50\">\n {item.value.toLocaleString()}\n </span>\n )}\n </div>\n </>\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n}\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\nfunction ChartLegendContent({\n className,\n hideIcon = false,\n payload,\n verticalAlign = \"bottom\",\n nameKey,\n}: React.ComponentProps<\"div\"> &\n Pick<RechartsPrimitive.LegendProps, \"payload\" | \"verticalAlign\"> & {\n hideIcon?: boolean;\n nameKey?: string;\n }) {\n const { config } = useChart();\n\n if (!payload?.length) {\n return null;\n }\n\n return (\n <div\n className={cn(\n \"flex items-center justify-center gap-4\",\n verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\",\n className\n )}\n >\n {payload.map((item) => {\n const key = `${nameKey || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n return (\n <div\n key={item.value}\n className={cn(\n \"[&>svg]:text-neutral-500 flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 dark:[&>svg]:text-neutral-400\"\n )}\n >\n {itemConfig?.icon && !hideIcon ? (\n <itemConfig.icon />\n ) : (\n <div\n className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n style={{\n backgroundColor: item.color,\n }}\n />\n )}\n {itemConfig?.label}\n </div>\n );\n })}\n </div>\n );\n}\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(\n config: ChartConfig,\n payload: unknown,\n key: string\n) {\n if (typeof payload !== \"object\" || payload === null) {\n return undefined;\n }\n\n const payloadPayload =\n \"payload\" in payload &&\n typeof payload.payload === \"object\" &&\n payload.payload !== null\n ? payload.payload\n : undefined;\n\n let configLabelKey: string = key;\n\n if (\n key in payload &&\n typeof payload[key as keyof typeof payload] === \"string\"\n ) {\n configLabelKey = payload[key as keyof typeof payload] as string;\n } else if (\n payloadPayload &&\n key in payloadPayload &&\n typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n ) {\n configLabelKey = payloadPayload[\n key as keyof typeof payloadPayload\n ] as string;\n }\n\n return configLabelKey in config\n ? config[configLabelKey]\n : config[key as keyof typeof config];\n}\n\nexport {\n ChartContainer,\n ChartTooltip,\n ChartTooltipContent,\n ChartLegend,\n ChartLegendContent,\n ChartStyle,\n};\n"],"names":["THEMES","ChartContext","React","useChart","context","Error","ChartContainer","id","className","children","config","props","uniqueId","chartId","cn","ChartStyle","RechartsPrimitive","colorConfig","Object","theme","prefix","key","itemConfig","color","ChartTooltip","ChartTooltipContent","active","payload","indicator","hideLabel","hideIndicator","label","labelFormatter","labelClassName","formatter","nameKey","labelKey","tooltipLabel","item","getPayloadConfigFromPayload","value","nestLabel","index","indicatorColor","undefined","ChartLegend","ChartLegendContent","hideIcon","verticalAlign","payloadPayload","configLabelKey"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components\\ui\\chart.js","sources":["webpack://@arolariu/components/./src/components/ui/chart.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RechartsPrimitive from \"recharts\";\nimport type { LegendPayload } from \"recharts/types/component/DefaultLegendContent\";\nimport {\n NameType,\n Payload,\n ValueType,\n} from \"recharts/types/component/DefaultTooltipContent\";\nimport type { Props as LegendProps } from \"recharts/types/component/Legend\";\nimport { TooltipContentProps } from \"recharts/types/component/Tooltip\";\n\nimport { cn } from \"@/lib/utils\";\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\n\nexport type ChartConfig = {\n [k in string]: {\n label?: React.ReactNode;\n icon?: React.ComponentType;\n } & (\n | { color?: string; theme?: never }\n | { color?: never; theme: Record<keyof typeof THEMES, string> }\n );\n};\n\ntype ChartContextProps = {\n config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n const context = React.useContext(ChartContext);\n\n if (!context) {\n throw new Error(\"useChart must be used within a <ChartContainer />\");\n }\n\n return context;\n}\n\nfunction ChartContainer({\n id,\n className,\n children,\n config,\n ...props\n}: React.ComponentProps<\"div\"> & {\n config: ChartConfig;\n children: React.ComponentProps<\n typeof RechartsPrimitive.ResponsiveContainer\n >[\"children\"];\n}) {\n const uniqueId = React.useId();\n const chartId = `chart-${id || uniqueId.replace(/:/g, \"\")}`;\n\n return (\n <ChartContext.Provider value={{ config }}>\n <div\n data-slot=\"chart\"\n data-chart={chartId}\n className={cn(\n \"[&_.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 flex aspect-video justify-center 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\",\n className,\n )}\n {...props}\n >\n <ChartStyle id={chartId} config={config} />\n <RechartsPrimitive.ResponsiveContainer>\n {children}\n </RechartsPrimitive.ResponsiveContainer>\n </div>\n </ChartContext.Provider>\n );\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n const colorConfig = Object.entries(config).filter(\n ([, config]) => config.theme || config.color,\n );\n\n if (!colorConfig.length) {\n return null;\n }\n\n return (\n <style\n dangerouslySetInnerHTML={{\n __html: Object.entries(THEMES)\n .map(\n ([theme, prefix]) => `\n ${prefix} [data-chart=${id}] {\n ${colorConfig\n .map(([key, itemConfig]) => {\n const color =\n itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||\n itemConfig.color;\n return color ? ` --color-${key}: ${color};` : null;\n })\n .join(\"\\n\")}\n }\n `,\n )\n .join(\"\\n\"),\n }}\n />\n );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\ntype CustomTooltipProps = TooltipContentProps<ValueType, NameType> & {\n className?: string;\n hideLabel?: boolean;\n hideIndicator?: boolean;\n indicator?: \"line\" | \"dot\" | \"dashed\";\n nameKey?: string;\n labelKey?: string;\n labelFormatter?: (\n label: TooltipContentProps<number, string>[\"label\"],\n payload: TooltipContentProps<number, string>[\"payload\"],\n ) => React.ReactNode;\n formatter?: (\n value: number | string,\n name: string,\n item: Payload<number | string, string>,\n index: number,\n payload: ReadonlyArray<Payload<number | string, string>>,\n ) => React.ReactNode;\n labelClassName?: string;\n color?: string;\n};\n\nfunction ChartTooltipContent({\n active,\n payload,\n label,\n className,\n indicator = \"dot\",\n hideLabel = false,\n hideIndicator = false,\n labelFormatter,\n formatter,\n labelClassName,\n color,\n nameKey,\n labelKey,\n}: CustomTooltipProps) {\n const { config } = useChart();\n\n const tooltipLabel = React.useMemo(() => {\n if (hideLabel || !payload?.length) {\n return null;\n }\n\n const [item] = payload;\n const key = `${labelKey || item?.dataKey || item?.name || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const value =\n !labelKey && typeof label === \"string\"\n ? config[label as keyof typeof config]?.label || label\n : itemConfig?.label;\n\n if (labelFormatter) {\n return (\n <div className={cn(\"font-medium\", labelClassName)}>\n {labelFormatter(value, payload)}\n </div>\n );\n }\n\n if (!value) {\n return null;\n }\n\n return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\n }, [\n label,\n labelFormatter,\n payload,\n hideLabel,\n labelClassName,\n config,\n labelKey,\n ]);\n\n if (!active || !payload?.length) {\n return null;\n }\n\n const nestLabel = payload.length === 1 && indicator !== \"dot\";\n\n return (\n <div\n className={cn(\n \"border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl\",\n className,\n )}\n >\n {!nestLabel ? tooltipLabel : null}\n <div className=\"grid gap-1.5\">\n {payload.map((item, index) => {\n const key = `${nameKey || item.name || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const indicatorColor = color || item.payload.fill || item.color;\n\n return (\n <div\n key={item.dataKey}\n className={cn(\n \"[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5\",\n indicator === \"dot\" && \"items-center\",\n )}\n >\n {formatter && item?.value !== undefined && item.name ? (\n formatter(item.value, item.name, item, index, item.payload)\n ) : (\n <>\n {itemConfig?.icon ? (\n <itemConfig.icon />\n ) : (\n !hideIndicator && (\n <div\n className={cn(\n \"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\",\n {\n \"h-2.5 w-2.5\": indicator === \"dot\",\n \"w-1\": indicator === \"line\",\n \"w-0 border-[1.5px] border-dashed bg-transparent\":\n indicator === \"dashed\",\n \"my-0.5\": nestLabel && indicator === \"dashed\",\n },\n )}\n style={\n {\n \"--color-bg\": indicatorColor,\n \"--color-border\": indicatorColor,\n } as React.CSSProperties\n }\n />\n )\n )}\n <div\n className={cn(\n \"flex flex-1 justify-between leading-none\",\n nestLabel ? \"items-end\" : \"items-center\",\n )}\n >\n <div className=\"grid gap-1.5\">\n {nestLabel ? tooltipLabel : null}\n <span className=\"text-muted-foreground\">\n {itemConfig?.label || item.name}\n </span>\n </div>\n {item.value && (\n <span className=\"text-foreground font-mono font-medium tabular-nums\">\n {item.value.toLocaleString()}\n </span>\n )}\n </div>\n </>\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n}\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\ntype ChartLegendContentProps = {\n className?: string;\n hideIcon?: boolean;\n verticalAlign?: LegendProps[\"verticalAlign\"];\n payload?: LegendPayload[];\n nameKey?: string;\n};\n\nfunction ChartLegendContent({\n className,\n hideIcon = false,\n payload,\n verticalAlign = \"bottom\",\n nameKey,\n}: ChartLegendContentProps) {\n const { config } = useChart();\n\n if (!payload?.length) {\n return null;\n }\n\n return (\n <div\n className={cn(\n \"flex items-center justify-center gap-4\",\n verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\",\n className,\n )}\n >\n {payload.map((item) => {\n const key = `${nameKey || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n return (\n <div\n key={item.value}\n className={cn(\n \"[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3\",\n )}\n >\n {itemConfig?.icon && !hideIcon ? (\n <itemConfig.icon />\n ) : (\n <div\n className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n style={{\n backgroundColor: item.color,\n }}\n />\n )}\n {itemConfig?.label}\n </div>\n );\n })}\n </div>\n );\n}\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(\n config: ChartConfig,\n payload: unknown,\n key: string,\n) {\n if (typeof payload !== \"object\" || payload === null) {\n return undefined;\n }\n\n const payloadPayload =\n \"payload\" in payload &&\n typeof payload.payload === \"object\" &&\n payload.payload !== null\n ? payload.payload\n : undefined;\n\n let configLabelKey: string = key;\n\n if (\n key in payload &&\n typeof payload[key as keyof typeof payload] === \"string\"\n ) {\n configLabelKey = payload[key as keyof typeof payload] as string;\n } else if (\n payloadPayload &&\n key in payloadPayload &&\n typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n ) {\n configLabelKey = payloadPayload[\n key as keyof typeof payloadPayload\n ] as string;\n }\n\n return configLabelKey in config\n ? config[configLabelKey]\n : config[key as keyof typeof config];\n}\n\nexport {\n ChartContainer,\n ChartTooltip,\n ChartTooltipContent,\n ChartLegend,\n ChartLegendContent,\n ChartStyle,\n};\n"],"names":["THEMES","ChartContext","React","useChart","context","Error","ChartContainer","id","className","children","config","props","uniqueId","chartId","cn","ChartStyle","RechartsPrimitive","colorConfig","Object","theme","prefix","key","itemConfig","color","ChartTooltip","ChartTooltipContent","active","payload","label","indicator","hideLabel","hideIndicator","labelFormatter","formatter","labelClassName","nameKey","labelKey","tooltipLabel","item","getPayloadConfigFromPayload","value","nestLabel","index","indicatorColor","undefined","ChartLegend","ChartLegendContent","hideIcon","verticalAlign","payloadPayload","configLabelKey"],"mappings":"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"}
|