@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,37 +1,37 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
4
|
+
import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
|
+
import { buttonVariants } from "./button.js";
|
|
7
7
|
function Pagination({ className, ...props }) {
|
|
8
|
-
return /*#__PURE__*/
|
|
8
|
+
return /*#__PURE__*/ jsx("nav", {
|
|
9
9
|
role: "navigation",
|
|
10
10
|
"aria-label": "pagination",
|
|
11
11
|
"data-slot": "pagination",
|
|
12
|
-
className:
|
|
12
|
+
className: cn("mx-auto flex w-full justify-center", className),
|
|
13
13
|
...props
|
|
14
14
|
});
|
|
15
15
|
}
|
|
16
16
|
function PaginationContent({ className, ...props }) {
|
|
17
|
-
return /*#__PURE__*/
|
|
17
|
+
return /*#__PURE__*/ jsx("ul", {
|
|
18
18
|
"data-slot": "pagination-content",
|
|
19
|
-
className:
|
|
19
|
+
className: cn("flex flex-row items-center gap-1", className),
|
|
20
20
|
...props
|
|
21
21
|
});
|
|
22
22
|
}
|
|
23
23
|
function PaginationItem({ ...props }) {
|
|
24
|
-
return /*#__PURE__*/
|
|
24
|
+
return /*#__PURE__*/ jsx("li", {
|
|
25
25
|
"data-slot": "pagination-item",
|
|
26
26
|
...props
|
|
27
27
|
});
|
|
28
28
|
}
|
|
29
29
|
function PaginationLink({ className, isActive, size = "icon", ...props }) {
|
|
30
|
-
return /*#__PURE__*/
|
|
30
|
+
return /*#__PURE__*/ jsx("a", {
|
|
31
31
|
"aria-current": isActive ? "page" : void 0,
|
|
32
32
|
"data-slot": "pagination-link",
|
|
33
33
|
"data-active": isActive,
|
|
34
|
-
className:
|
|
34
|
+
className: cn(buttonVariants({
|
|
35
35
|
variant: isActive ? "outline" : "ghost",
|
|
36
36
|
size
|
|
37
37
|
}), className),
|
|
@@ -39,14 +39,14 @@ function PaginationLink({ className, isActive, size = "icon", ...props }) {
|
|
|
39
39
|
});
|
|
40
40
|
}
|
|
41
41
|
function PaginationPrevious({ className, ...props }) {
|
|
42
|
-
return /*#__PURE__*/
|
|
42
|
+
return /*#__PURE__*/ jsxs(PaginationLink, {
|
|
43
43
|
"aria-label": "Go to previous page",
|
|
44
44
|
size: "default",
|
|
45
|
-
className:
|
|
45
|
+
className: cn("gap-1 px-2.5 sm:pl-2.5", className),
|
|
46
46
|
...props,
|
|
47
47
|
children: [
|
|
48
|
-
/*#__PURE__*/
|
|
49
|
-
/*#__PURE__*/
|
|
48
|
+
/*#__PURE__*/ jsx(ChevronLeftIcon, {}),
|
|
49
|
+
/*#__PURE__*/ jsx("span", {
|
|
50
50
|
className: "hidden sm:block",
|
|
51
51
|
children: "Previous"
|
|
52
52
|
})
|
|
@@ -54,31 +54,31 @@ function PaginationPrevious({ className, ...props }) {
|
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
56
|
function PaginationNext({ className, ...props }) {
|
|
57
|
-
return /*#__PURE__*/
|
|
57
|
+
return /*#__PURE__*/ jsxs(PaginationLink, {
|
|
58
58
|
"aria-label": "Go to next page",
|
|
59
59
|
size: "default",
|
|
60
|
-
className:
|
|
60
|
+
className: cn("gap-1 px-2.5 sm:pr-2.5", className),
|
|
61
61
|
...props,
|
|
62
62
|
children: [
|
|
63
|
-
/*#__PURE__*/
|
|
63
|
+
/*#__PURE__*/ jsx("span", {
|
|
64
64
|
className: "hidden sm:block",
|
|
65
65
|
children: "Next"
|
|
66
66
|
}),
|
|
67
|
-
/*#__PURE__*/
|
|
67
|
+
/*#__PURE__*/ jsx(ChevronRightIcon, {})
|
|
68
68
|
]
|
|
69
69
|
});
|
|
70
70
|
}
|
|
71
71
|
function PaginationEllipsis({ className, ...props }) {
|
|
72
|
-
return /*#__PURE__*/
|
|
72
|
+
return /*#__PURE__*/ jsxs("span", {
|
|
73
73
|
"aria-hidden": true,
|
|
74
74
|
"data-slot": "pagination-ellipsis",
|
|
75
|
-
className:
|
|
75
|
+
className: cn("flex size-9 items-center justify-center", className),
|
|
76
76
|
...props,
|
|
77
77
|
children: [
|
|
78
|
-
/*#__PURE__*/
|
|
78
|
+
/*#__PURE__*/ jsx(MoreHorizontalIcon, {
|
|
79
79
|
className: "size-4"
|
|
80
80
|
}),
|
|
81
|
-
/*#__PURE__*/
|
|
81
|
+
/*#__PURE__*/ jsx("span", {
|
|
82
82
|
className: "sr-only",
|
|
83
83
|
children: "More pages"
|
|
84
84
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\pagination.js","sources":["webpack://@arolariu/components/./src/components/ui/pagination.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n MoreHorizontalIcon,\n} from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button, buttonVariants } from \"@/components/ui/button\";\n\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n return (\n <nav\n role=\"navigation\"\n aria-label=\"pagination\"\n data-slot=\"pagination\"\n className={cn(\"mx-auto flex w-full justify-center\", className)}\n {...props}\n />\n );\n}\n\nfunction PaginationContent({\n className,\n ...props\n}: React.ComponentProps<\"ul\">) {\n return (\n <ul\n data-slot=\"pagination-content\"\n className={cn(\"flex flex-row items-center gap-1\", className)}\n {...props}\n />\n );\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n React.ComponentProps<\"a\">;\n\nfunction PaginationLink({\n className,\n isActive,\n size = \"icon\",\n ...props\n}: PaginationLinkProps) {\n return (\n <a\n aria-current={isActive ? \"page\" : undefined}\n data-slot=\"pagination-link\"\n data-active={isActive}\n className={cn(\n buttonVariants({\n variant: isActive ? \"outline\" : \"ghost\",\n size,\n }),\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\pagination.js","sources":["webpack://@arolariu/components/./src/components/ui/pagination.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n ChevronLeftIcon,\n ChevronRightIcon,\n MoreHorizontalIcon,\n} from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Button, buttonVariants } from \"@/components/ui/button\";\n\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n return (\n <nav\n role=\"navigation\"\n aria-label=\"pagination\"\n data-slot=\"pagination\"\n className={cn(\"mx-auto flex w-full justify-center\", className)}\n {...props}\n />\n );\n}\n\nfunction PaginationContent({\n className,\n ...props\n}: React.ComponentProps<\"ul\">) {\n return (\n <ul\n data-slot=\"pagination-content\"\n className={cn(\"flex flex-row items-center gap-1\", className)}\n {...props}\n />\n );\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n isActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n React.ComponentProps<\"a\">;\n\nfunction PaginationLink({\n className,\n isActive,\n size = \"icon\",\n ...props\n}: PaginationLinkProps) {\n return (\n <a\n aria-current={isActive ? \"page\" : undefined}\n data-slot=\"pagination-link\"\n data-active={isActive}\n className={cn(\n buttonVariants({\n variant: isActive ? \"outline\" : \"ghost\",\n size,\n }),\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction PaginationPrevious({\n className,\n ...props\n}: React.ComponentProps<typeof PaginationLink>) {\n return (\n <PaginationLink\n aria-label=\"Go to previous page\"\n size=\"default\"\n className={cn(\"gap-1 px-2.5 sm:pl-2.5\", className)}\n {...props}\n >\n <ChevronLeftIcon />\n <span className=\"hidden sm:block\">Previous</span>\n </PaginationLink>\n );\n}\n\nfunction PaginationNext({\n className,\n ...props\n}: React.ComponentProps<typeof PaginationLink>) {\n return (\n <PaginationLink\n aria-label=\"Go to next page\"\n size=\"default\"\n className={cn(\"gap-1 px-2.5 sm:pr-2.5\", className)}\n {...props}\n >\n <span className=\"hidden sm:block\">Next</span>\n <ChevronRightIcon />\n </PaginationLink>\n );\n}\n\nfunction PaginationEllipsis({\n className,\n ...props\n}: React.ComponentProps<\"span\">) {\n return (\n <span\n aria-hidden\n data-slot=\"pagination-ellipsis\"\n className={cn(\"flex size-9 items-center justify-center\", className)}\n {...props}\n >\n <MoreHorizontalIcon className=\"size-4\" />\n <span className=\"sr-only\">More pages</span>\n </span>\n );\n}\n\nexport {\n Pagination,\n PaginationContent,\n PaginationLink,\n PaginationItem,\n PaginationPrevious,\n PaginationNext,\n PaginationEllipsis,\n};\n"],"names":["Pagination","className","props","cn","PaginationContent","PaginationItem","PaginationLink","isActive","size","undefined","buttonVariants","PaginationPrevious","ChevronLeftIcon","PaginationNext","ChevronRightIcon","PaginationEllipsis","MoreHorizontalIcon"],"mappings":";;;;;;AAYA,SAASA,WAAW,EAAEC,SAAS,EAAE,GAAGC,OAAoC;IACtE,OAAO,WAAP,GACE,IAAC;QACC,MAAK;QACL,cAAW;QACX,aAAU;QACV,WAAWC,GAAG,sCAAsCF;QACnD,GAAGC,KAAK;;AAGf;AAEA,SAASE,kBAAkB,EACzBH,SAAS,EACT,GAAGC,OACwB;IAC3B,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,WAAWC,GAAG,oCAAoCF;QACjD,GAAGC,KAAK;;AAGf;AAEA,SAASG,eAAe,EAAE,GAAGH,OAAmC;IAC9D,OAAO,WAAP,GAAO,IAAC;QAAG,aAAU;QAAmB,GAAGA,KAAK;;AAClD;AAOA,SAASI,eAAe,EACtBL,SAAS,EACTM,QAAQ,EACRC,OAAO,MAAM,EACb,GAAGN,OACiB;IACpB,OAAO,WAAP,GACE,IAAC;QACC,gBAAcK,WAAW,SAASE;QAClC,aAAU;QACV,eAAaF;QACb,WAAWJ,GACTO,eAAe;YACb,SAASH,WAAW,YAAY;YAChCC;QACF,IACAP;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASS,mBAAmB,EAC1BV,SAAS,EACT,GAAGC,OACyC;IAC5C,OAAO,WAAP,GACE,KAACI,gBAAAA;QACC,cAAW;QACX,MAAK;QACL,WAAWH,GAAG,0BAA0BF;QACvC,GAAGC,KAAK;;0BAET,IAACU,iBAAeA,CAAAA;0BAChB,IAAC;gBAAK,WAAU;0BAAkB;;;;AAGxC;AAEA,SAASC,eAAe,EACtBZ,SAAS,EACT,GAAGC,OACyC;IAC5C,OAAO,WAAP,GACE,KAACI,gBAAAA;QACC,cAAW;QACX,MAAK;QACL,WAAWH,GAAG,0BAA0BF;QACvC,GAAGC,KAAK;;0BAET,IAAC;gBAAK,WAAU;0BAAkB;;0BAClC,IAACY,kBAAgBA,CAAAA;;;AAGvB;AAEA,SAASC,mBAAmB,EAC1Bd,SAAS,EACT,GAAGC,OAC0B;IAC7B,OAAO,WAAP,GACE,KAAC;QACC,eAAW;QACX,aAAU;QACV,WAAWC,GAAG,2CAA2CF;QACxD,GAAGC,KAAK;;0BAET,IAACc,oBAAkBA;gBAAC,WAAU;;0BAC9B,IAAC;gBAAK,WAAU;0BAAU;;;;AAGhC"}
|
|
@@ -1,33 +1,33 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import { Anchor, Content, Portal, Root, Trigger } from "@radix-ui/react-popover";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
6
|
function Popover({ ...props }) {
|
|
7
|
-
return /*#__PURE__*/
|
|
7
|
+
return /*#__PURE__*/ jsx(Root, {
|
|
8
8
|
"data-slot": "popover",
|
|
9
9
|
...props
|
|
10
10
|
});
|
|
11
11
|
}
|
|
12
12
|
function PopoverTrigger({ ...props }) {
|
|
13
|
-
return /*#__PURE__*/
|
|
13
|
+
return /*#__PURE__*/ jsx(Trigger, {
|
|
14
14
|
"data-slot": "popover-trigger",
|
|
15
15
|
...props
|
|
16
16
|
});
|
|
17
17
|
}
|
|
18
18
|
function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
|
|
19
|
-
return /*#__PURE__*/
|
|
20
|
-
children: /*#__PURE__*/
|
|
19
|
+
return /*#__PURE__*/ jsx(Portal, {
|
|
20
|
+
children: /*#__PURE__*/ jsx(Content, {
|
|
21
21
|
"data-slot": "popover-content",
|
|
22
22
|
align: align,
|
|
23
23
|
sideOffset: sideOffset,
|
|
24
|
-
className:
|
|
24
|
+
className: cn("bg-white text-neutral-950 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800", className),
|
|
25
25
|
...props
|
|
26
26
|
})
|
|
27
27
|
});
|
|
28
28
|
}
|
|
29
29
|
function PopoverAnchor({ ...props }) {
|
|
30
|
-
return /*#__PURE__*/
|
|
30
|
+
return /*#__PURE__*/ jsx(Anchor, {
|
|
31
31
|
"data-slot": "popover-anchor",
|
|
32
32
|
...props
|
|
33
33
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\popover.js","sources":["webpack://@arolariu/components/./src/components/ui/popover.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Popover({\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n className,\n align = \"center\",\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n return (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n data-slot=\"popover-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n \"bg-white text-neutral-950 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\popover.js","sources":["webpack://@arolariu/components/./src/components/ui/popover.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Popover({\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Root>) {\n return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />;\n}\n\nfunction PopoverTrigger({\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n className,\n align = \"center\",\n sideOffset = 4,\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Content>) {\n return (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n data-slot=\"popover-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n \"bg-white text-neutral-950 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border border-neutral-200 p-4 shadow-md outline-hidden dark:bg-neutral-950 dark:text-neutral-50 dark:border-neutral-800\",\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n );\n}\n\nfunction PopoverAnchor({\n ...props\n}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {\n return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />;\n}\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n"],"names":["Popover","props","PopoverPrimitive","PopoverTrigger","PopoverContent","className","align","sideOffset","cn","PopoverAnchor"],"mappings":";;;;;AAOA,SAASA,QAAQ,EACf,GAAGC,OACgD;IACnD,OAAO,WAAP,GAAO,IAACC,MAAqB;QAAC,aAAU;QAAW,GAAGD,KAAK;;AAC7D;AAEA,SAASE,eAAe,EACtB,GAAGF,OACmD;IACtD,OAAO,WAAP,GAAO,IAACC,SAAwB;QAAC,aAAU;QAAmB,GAAGD,KAAK;;AACxE;AAEA,SAASG,eAAe,EACtBC,SAAS,EACTC,QAAQ,QAAQ,EAChBC,aAAa,CAAC,EACd,GAAGN,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,QAAuB;kBACtB,kBAACA,SAAwB;YACvB,aAAU;YACV,OAAOI;YACP,YAAYC;YACZ,WAAWC,GACT,6iBACAH;YAED,GAAGJ,KAAK;;;AAIjB;AAEA,SAASQ,cAAc,EACrB,GAAGR,OACkD;IACrD,OAAO,WAAP,GAAO,IAACC,QAAuB;QAAC,aAAU;QAAkB,GAAGD,KAAK;;AACtE"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
4
|
+
import { Indicator, Root } from "@radix-ui/react-progress";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
6
|
function Progress({ className, value, ...props }) {
|
|
7
|
-
return /*#__PURE__*/
|
|
7
|
+
return /*#__PURE__*/ jsx(Root, {
|
|
8
8
|
"data-slot": "progress",
|
|
9
|
-
className:
|
|
9
|
+
className: cn("bg-neutral-900/20 relative h-2 w-full overflow-hidden rounded-full dark:bg-neutral-50/20", className),
|
|
10
10
|
...props,
|
|
11
|
-
children: /*#__PURE__*/
|
|
11
|
+
children: /*#__PURE__*/ jsx(Indicator, {
|
|
12
12
|
"data-slot": "progress-indicator",
|
|
13
13
|
className: "bg-neutral-900 h-full w-full flex-1 transition-all dark:bg-neutral-50",
|
|
14
14
|
style: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\progress.js","sources":["webpack://@arolariu/components/./src/components/ui/progress.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Progress({\n className,\n value,\n ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root>) {\n return (\n <ProgressPrimitive.Root\n data-slot=\"progress\"\n className={cn(\n \"bg-neutral-900/20 relative h-2 w-full overflow-hidden rounded-full dark:bg-neutral-50/20\",\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\progress.js","sources":["webpack://@arolariu/components/./src/components/ui/progress.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Progress({\n className,\n value,\n ...props\n}: React.ComponentProps<typeof ProgressPrimitive.Root>) {\n return (\n <ProgressPrimitive.Root\n data-slot=\"progress\"\n className={cn(\n \"bg-neutral-900/20 relative h-2 w-full overflow-hidden rounded-full dark:bg-neutral-50/20\",\n className,\n )}\n {...props}\n >\n <ProgressPrimitive.Indicator\n data-slot=\"progress-indicator\"\n className=\"bg-neutral-900 h-full w-full flex-1 transition-all dark:bg-neutral-50\"\n style={{ transform: `translateX(-${100 - (value || 0)}%)` }}\n />\n </ProgressPrimitive.Root>\n );\n}\n\nexport { Progress };\n"],"names":["Progress","className","value","props","ProgressPrimitive","cn"],"mappings":";;;;;AAOA,SAASA,SAAS,EAChBC,SAAS,EACTC,KAAK,EACL,GAAGC,OACiD;IACpD,OAAO,WAAP,GACE,IAACC,MAAsB;QACrB,aAAU;QACV,WAAWC,GACT,4FACAJ;QAED,GAAGE,KAAK;kBAET,kBAACC,WAA2B;YAC1B,aAAU;YACV,WAAU;YACV,OAAO;gBAAE,WAAW,CAAC,YAAY,EAAE,MAAOF,CAAAA,SAAS,GAAG,EAAE,CAAC;YAAC;;;AAIlE"}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
4
|
+
import { Indicator, Item, Root } from "@radix-ui/react-radio-group";
|
|
5
|
+
import { CircleIcon } from "lucide-react";
|
|
6
|
+
import { cn } from "../../lib/utils.js";
|
|
7
7
|
function RadioGroup({ className, ...props }) {
|
|
8
|
-
return /*#__PURE__*/
|
|
8
|
+
return /*#__PURE__*/ jsx(Root, {
|
|
9
9
|
"data-slot": "radio-group",
|
|
10
|
-
className:
|
|
10
|
+
className: cn("grid gap-3", className),
|
|
11
11
|
...props
|
|
12
12
|
});
|
|
13
13
|
}
|
|
14
14
|
function RadioGroupItem({ className, ...props }) {
|
|
15
|
-
return /*#__PURE__*/
|
|
15
|
+
return /*#__PURE__*/ jsx(Item, {
|
|
16
16
|
"data-slot": "radio-group-item",
|
|
17
|
-
className:
|
|
17
|
+
className: cn("border-neutral-200 text-neutral-900 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:bg-neutral-200/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30", className),
|
|
18
18
|
...props,
|
|
19
|
-
children: /*#__PURE__*/
|
|
19
|
+
children: /*#__PURE__*/ jsx(Indicator, {
|
|
20
20
|
"data-slot": "radio-group-indicator",
|
|
21
21
|
className: "relative flex items-center justify-center",
|
|
22
|
-
children: /*#__PURE__*/
|
|
22
|
+
children: /*#__PURE__*/ jsx(CircleIcon, {
|
|
23
23
|
className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2"
|
|
24
24
|
})
|
|
25
25
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\radio-group.js","sources":["webpack://@arolariu/components/./src/components/ui/radio-group.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport { CircleIcon } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction RadioGroup({\n className,\n ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {\n return (\n <RadioGroupPrimitive.Root\n data-slot=\"radio-group\"\n className={cn(\"grid gap-3\", className)}\n {...props}\n />\n );\n}\n\nfunction RadioGroupItem({\n className,\n ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n return (\n <RadioGroupPrimitive.Item\n data-slot=\"radio-group-item\"\n className={cn(\n \"border-neutral-200 text-neutral-900 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:bg-neutral-200/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30\",\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\radio-group.js","sources":["webpack://@arolariu/components/./src/components/ui/radio-group.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport { CircleIcon } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction RadioGroup({\n className,\n ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Root>) {\n return (\n <RadioGroupPrimitive.Root\n data-slot=\"radio-group\"\n className={cn(\"grid gap-3\", className)}\n {...props}\n />\n );\n}\n\nfunction RadioGroupItem({\n className,\n ...props\n}: React.ComponentProps<typeof RadioGroupPrimitive.Item>) {\n return (\n <RadioGroupPrimitive.Item\n data-slot=\"radio-group-item\"\n className={cn(\n \"border-neutral-200 text-neutral-900 focus-visible:border-neutral-950 focus-visible:ring-neutral-950/50 aria-invalid:ring-red-500/20 dark:aria-invalid:ring-red-500/40 aria-invalid:border-red-500 dark:bg-neutral-200/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-800 dark:text-neutral-50 dark:focus-visible:border-neutral-300 dark:focus-visible:ring-neutral-300/50 dark:aria-invalid:ring-red-900/20 dark:dark:aria-invalid:ring-red-900/40 dark:aria-invalid:border-red-900 dark:dark:bg-neutral-800/30\",\n className,\n )}\n {...props}\n >\n <RadioGroupPrimitive.Indicator\n data-slot=\"radio-group-indicator\"\n className=\"relative flex items-center justify-center\"\n >\n <CircleIcon className=\"fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2\" />\n </RadioGroupPrimitive.Indicator>\n </RadioGroupPrimitive.Item>\n );\n}\n\nexport { RadioGroup, RadioGroupItem };\n"],"names":["RadioGroup","className","props","RadioGroupPrimitive","cn","RadioGroupItem","CircleIcon"],"mappings":";;;;;;AAQA,SAASA,WAAW,EAClBC,SAAS,EACT,GAAGC,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,MAAwB;QACvB,aAAU;QACV,WAAWC,GAAG,cAAcH;QAC3B,GAAGC,KAAK;;AAGf;AAEA,SAASG,eAAe,EACtBJ,SAAS,EACT,GAAGC,OACmD;IACtD,OAAO,WAAP,GACE,IAACC,MAAwB;QACvB,aAAU;QACV,WAAWC,GACT,4oBACAH;QAED,GAAGC,KAAK;kBAET,kBAACC,WAA6B;YAC5B,aAAU;YACV,WAAU;sBAEV,kBAACG,YAAUA;gBAAC,WAAU;;;;AAI9B"}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import "react";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
4
|
+
import { GripVerticalIcon } from "lucide-react";
|
|
5
|
+
import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
|
|
6
|
+
import { cn } from "../../lib/utils.js";
|
|
7
7
|
function ResizablePanelGroup({ className, ...props }) {
|
|
8
|
-
return /*#__PURE__*/
|
|
8
|
+
return /*#__PURE__*/ jsx(PanelGroup, {
|
|
9
9
|
"data-slot": "resizable-panel-group",
|
|
10
|
-
className:
|
|
10
|
+
className: cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
|
|
11
11
|
...props
|
|
12
12
|
});
|
|
13
13
|
}
|
|
14
14
|
function ResizablePanel({ ...props }) {
|
|
15
|
-
return /*#__PURE__*/
|
|
15
|
+
return /*#__PURE__*/ jsx(Panel, {
|
|
16
16
|
"data-slot": "resizable-panel",
|
|
17
17
|
...props
|
|
18
18
|
});
|
|
19
19
|
}
|
|
20
20
|
function ResizableHandle({ withHandle, className, ...props }) {
|
|
21
|
-
return /*#__PURE__*/
|
|
21
|
+
return /*#__PURE__*/ jsx(PanelResizeHandle, {
|
|
22
22
|
"data-slot": "resizable-handle",
|
|
23
|
-
className:
|
|
23
|
+
className: cn("bg-neutral-200 focus-visible:ring-neutral-950 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300", className),
|
|
24
24
|
...props,
|
|
25
|
-
children: withHandle && /*#__PURE__*/
|
|
25
|
+
children: withHandle && /*#__PURE__*/ jsx("div", {
|
|
26
26
|
className: "bg-neutral-200 z-10 flex h-4 w-3 items-center justify-center rounded-xs border dark:bg-neutral-800",
|
|
27
|
-
children: /*#__PURE__*/
|
|
27
|
+
children: /*#__PURE__*/ jsx(GripVerticalIcon, {
|
|
28
28
|
className: "size-2.5"
|
|
29
29
|
})
|
|
30
30
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\resizable.js","sources":["webpack://@arolariu/components/./src/components/ui/resizable.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {\n return (\n <ResizablePrimitive.PanelGroup\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full data-[panel-group-direction=vertical]:flex-col\",\n className
|
|
1
|
+
{"version":3,"file":"components\\ui\\resizable.js","sources":["webpack://@arolariu/components/./src/components/ui/resizable.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { GripVerticalIcon } from \"lucide-react\";\nimport * as ResizablePrimitive from \"react-resizable-panels\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction ResizablePanelGroup({\n className,\n ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {\n return (\n <ResizablePrimitive.PanelGroup\n data-slot=\"resizable-panel-group\"\n className={cn(\n \"flex h-full w-full data-[panel-group-direction=vertical]:flex-col\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction ResizablePanel({\n ...props\n}: React.ComponentProps<typeof ResizablePrimitive.Panel>) {\n return <ResizablePrimitive.Panel data-slot=\"resizable-panel\" {...props} />;\n}\n\nfunction ResizableHandle({\n withHandle,\n className,\n ...props\n}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {\n withHandle?: boolean;\n}) {\n return (\n <ResizablePrimitive.PanelResizeHandle\n data-slot=\"resizable-handle\"\n className={cn(\n \"bg-neutral-200 focus-visible:ring-neutral-950 relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90 dark:bg-neutral-800 dark:focus-visible:ring-neutral-300\",\n className,\n )}\n {...props}\n >\n {withHandle && (\n <div className=\"bg-neutral-200 z-10 flex h-4 w-3 items-center justify-center rounded-xs border dark:bg-neutral-800\">\n <GripVerticalIcon className=\"size-2.5\" />\n </div>\n )}\n </ResizablePrimitive.PanelResizeHandle>\n );\n}\n\nexport { ResizablePanelGroup, ResizablePanel, ResizableHandle };\n"],"names":["ResizablePanelGroup","className","props","ResizablePrimitive","cn","ResizablePanel","ResizableHandle","withHandle","GripVerticalIcon"],"mappings":";;;;;;AAQA,SAASA,oBAAoB,EAC3BC,SAAS,EACT,GAAGC,OACwD;IAC3D,OAAO,WAAP,GACE,IAACC,YAA6B;QAC5B,aAAU;QACV,WAAWC,GACT,qEACAH;QAED,GAAGC,KAAK;;AAGf;AAEA,SAASG,eAAe,EACtB,GAAGH,OACmD;IACtD,OAAO,WAAP,GAAO,IAACC,OAAwB;QAAC,aAAU;QAAmB,GAAGD,KAAK;;AACxE;AAEA,SAASI,gBAAgB,EACvBC,UAAU,EACVN,SAAS,EACT,GAAGC,OAGJ;IACC,OAAO,WAAP,GACE,IAACC,mBAAoC;QACnC,aAAU;QACV,WAAWC,GACT,itBACAH;QAED,GAAGC,KAAK;kBAERK,cAAc,WAAdA,GACC,IAAC;YAAI,WAAU;sBACb,kBAACC,kBAAgBA;gBAAC,WAAU;;;;AAKtC"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
const RippleButton = /*#__PURE__*/
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef, useCallback, useImperativeHandle, useRef, useState } from "react";
|
|
4
|
+
import { motion } from "motion/react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
|
+
const RippleButton = /*#__PURE__*/ forwardRef(({ children, onClick, className, rippleClassName, scale = 10, transition = {
|
|
7
7
|
duration: 0.6,
|
|
8
8
|
ease: "easeOut"
|
|
9
9
|
}, ...props }, ref)=>{
|
|
10
|
-
const [ripples, setRipples] =
|
|
11
|
-
const buttonRef =
|
|
12
|
-
|
|
13
|
-
const createRipple =
|
|
10
|
+
const [ripples, setRipples] = useState([]);
|
|
11
|
+
const buttonRef = useRef(null);
|
|
12
|
+
useImperativeHandle(ref, ()=>buttonRef.current);
|
|
13
|
+
const createRipple = useCallback((event)=>{
|
|
14
14
|
const button = buttonRef.current;
|
|
15
15
|
if (!button) return;
|
|
16
16
|
const rect = button.getBoundingClientRect();
|
|
@@ -29,14 +29,14 @@ const RippleButton = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(
|
|
|
29
29
|
setRipples((prev)=>prev.filter((r)=>r.id !== newRipple.id));
|
|
30
30
|
}, 600);
|
|
31
31
|
}, []);
|
|
32
|
-
const handleClick =
|
|
32
|
+
const handleClick = useCallback((event)=>{
|
|
33
33
|
createRipple(event);
|
|
34
34
|
if (onClick) onClick(event);
|
|
35
35
|
}, [
|
|
36
36
|
createRipple,
|
|
37
37
|
onClick
|
|
38
38
|
]);
|
|
39
|
-
return /*#__PURE__*/
|
|
39
|
+
return /*#__PURE__*/ jsxs(motion.button, {
|
|
40
40
|
ref: buttonRef,
|
|
41
41
|
onClick: handleClick,
|
|
42
42
|
whileTap: {
|
|
@@ -45,11 +45,11 @@ const RippleButton = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(
|
|
|
45
45
|
whileHover: {
|
|
46
46
|
scale: 1.05
|
|
47
47
|
},
|
|
48
|
-
className:
|
|
48
|
+
className: cn("relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none", className),
|
|
49
49
|
...props,
|
|
50
50
|
children: [
|
|
51
51
|
children,
|
|
52
|
-
ripples.map((ripple)=>/*#__PURE__*/
|
|
52
|
+
ripples.map((ripple)=>/*#__PURE__*/ jsx(motion.span, {
|
|
53
53
|
initial: {
|
|
54
54
|
scale: 0,
|
|
55
55
|
opacity: 0.5
|
|
@@ -59,7 +59,7 @@ const RippleButton = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(
|
|
|
59
59
|
opacity: 0
|
|
60
60
|
},
|
|
61
61
|
transition: transition,
|
|
62
|
-
className:
|
|
62
|
+
className: cn("absolute bg-primary-foreground rounded-full size-5 pointer-events-none", rippleClassName),
|
|
63
63
|
style: {
|
|
64
64
|
top: ripple.y - 10,
|
|
65
65
|
left: ripple.x - 10
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { type HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface Ripple {\n id: number;\n x: number;\n y: number;\n}\n\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\n children: React.ReactNode;\n rippleClassName?: string;\n scale?: number;\n transition?: Transition;\n}\n\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\n (\n {\n children,\n onClick,\n className,\n rippleClassName,\n scale = 10,\n transition = { duration: 0.6, ease: \"easeOut\" },\n ...props\n },\n ref
|
|
1
|
+
{"version":3,"file":"components\\ui\\ripple-button.js","sources":["webpack://@arolariu/components/./src/components/ui/ripple-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { type HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface Ripple {\n id: number;\n x: number;\n y: number;\n}\n\ninterface RippleButtonProps extends HTMLMotionProps<\"button\"> {\n children: React.ReactNode;\n rippleClassName?: string;\n scale?: number;\n transition?: Transition;\n}\n\nconst RippleButton = React.forwardRef<HTMLButtonElement, RippleButtonProps>(\n (\n {\n children,\n onClick,\n className,\n rippleClassName,\n scale = 10,\n transition = { duration: 0.6, ease: \"easeOut\" },\n ...props\n },\n ref,\n ) => {\n const [ripples, setRipples] = React.useState<Ripple[]>([]);\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n React.useImperativeHandle(\n ref,\n () => buttonRef.current as HTMLButtonElement,\n );\n\n const createRipple = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n const button = buttonRef.current;\n if (!button) return;\n\n const rect = button.getBoundingClientRect();\n const x = event.clientX - rect.left;\n const y = event.clientY - rect.top;\n\n const newRipple: Ripple = {\n id: Date.now(),\n x,\n y,\n };\n\n setRipples((prev) => [...prev, newRipple]);\n\n setTimeout(() => {\n setRipples((prev) => prev.filter((r) => r.id !== newRipple.id));\n }, 600);\n },\n [],\n );\n\n const handleClick = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n createRipple(event);\n if (onClick) {\n onClick(event);\n }\n },\n [createRipple, onClick],\n );\n\n return (\n <motion.button\n ref={buttonRef}\n onClick={handleClick}\n whileTap={{ scale: 0.95 }}\n whileHover={{ scale: 1.05 }}\n className={cn(\n \"relative h-10 px-4 py-2 text-sm font-medium text-primary-foreground overflow-hidden bg-primary cursor-pointer rounded-lg focus:outline-none\",\n className,\n )}\n {...props}\n >\n {children}\n {ripples.map((ripple) => (\n <motion.span\n key={ripple.id}\n initial={{ scale: 0, opacity: 0.5 }}\n animate={{ scale, opacity: 0 }}\n transition={transition}\n className={cn(\n \"absolute bg-primary-foreground rounded-full size-5 pointer-events-none\",\n rippleClassName,\n )}\n style={{\n top: ripple.y - 10,\n left: ripple.x - 10,\n }}\n />\n ))}\n </motion.button>\n );\n },\n);\n\nRippleButton.displayName = \"RippleButton\";\n\nexport { RippleButton, type RippleButtonProps };\n"],"names":["RippleButton","React","children","onClick","className","rippleClassName","scale","transition","props","ref","ripples","setRipples","buttonRef","createRipple","event","button","rect","x","y","newRipple","Date","prev","setTimeout","r","handleClick","motion","cn","ripple"],"mappings":";;;;;AAoBA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CACE,EACEC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,eAAe,EACfC,QAAQ,EAAE,EACVC,aAAa;IAAE,UAAU;IAAK,MAAM;AAAU,CAAC,EAC/C,GAAGC,OACJ,EACDC;IAEA,MAAM,CAACC,SAASC,WAAW,GAAGV,SAAyB,EAAE;IACzD,MAAMW,YAAYX,OAAgC;IAClDA,oBACEQ,KACA,IAAMG,UAAU,OAAO;IAGzB,MAAMC,eAAeZ,YACnB,CAACa;QACC,MAAMC,SAASH,UAAU,OAAO;QAChC,IAAI,CAACG,QAAQ;QAEb,MAAMC,OAAOD,OAAO,qBAAqB;QACzC,MAAME,IAAIH,MAAM,OAAO,GAAGE,KAAK,IAAI;QACnC,MAAME,IAAIJ,MAAM,OAAO,GAAGE,KAAK,GAAG;QAElC,MAAMG,YAAoB;YACxB,IAAIC,KAAK,GAAG;YACZH;YACAC;QACF;QAEAP,WAAW,CAACU,OAAS;mBAAIA;gBAAMF;aAAU;QAEzCG,WAAW;YACTX,WAAW,CAACU,OAASA,KAAK,MAAM,CAAC,CAACE,IAAMA,EAAE,EAAE,KAAKJ,UAAU,EAAE;QAC/D,GAAG;IACL,GACA,EAAE;IAGJ,MAAMK,cAAcvB,YAClB,CAACa;QACCD,aAAaC;QACb,IAAIX,SACFA,QAAQW;IAEZ,GACA;QAACD;QAAcV;KAAQ;IAGzB,OAAO,WAAP,GACE,KAACsB,OAAO,MAAM;QACZ,KAAKb;QACL,SAASY;QACT,UAAU;YAAE,OAAO;QAAK;QACxB,YAAY;YAAE,OAAO;QAAK;QAC1B,WAAWE,GACT,+IACAtB;QAED,GAAGI,KAAK;;YAERN;YACAQ,QAAQ,GAAG,CAAC,CAACiB,SAAAA,WAAAA,GACZ,IAACF,OAAO,IAAI;oBAEV,SAAS;wBAAE,OAAO;wBAAG,SAAS;oBAAI;oBAClC,SAAS;wBAAEnB;wBAAO,SAAS;oBAAE;oBAC7B,YAAYC;oBACZ,WAAWmB,GACT,0EACArB;oBAEF,OAAO;wBACL,KAAKsB,OAAO,CAAC,GAAG;wBAChB,MAAMA,OAAO,CAAC,GAAG;oBACnB;mBAXKA,OAAO,EAAE;;;AAgBxB;AAGF3B,aAAa,WAAW,GAAG"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { cn } from "../../lib/utils.js";
|
|
4
|
+
import { motion, useAnimation } from "motion/react";
|
|
5
|
+
import { useEffect, useRef, useState } from "react";
|
|
6
6
|
const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, children, className, gradientColors = [
|
|
7
7
|
"#A97CF8",
|
|
8
8
|
"#F38CB8",
|
|
9
9
|
"#FDCC92"
|
|
10
10
|
] })=>{
|
|
11
|
-
const canvasRef =
|
|
12
|
-
const [isScratching, setIsScratching] =
|
|
13
|
-
const [isComplete, setIsComplete] =
|
|
14
|
-
const controls =
|
|
15
|
-
|
|
11
|
+
const canvasRef = useRef(null);
|
|
12
|
+
const [isScratching, setIsScratching] = useState(false);
|
|
13
|
+
const [isComplete, setIsComplete] = useState(false);
|
|
14
|
+
const controls = useAnimation();
|
|
15
|
+
useEffect(()=>{
|
|
16
16
|
const canvas = canvasRef.current;
|
|
17
17
|
const ctx = canvas?.getContext("2d");
|
|
18
18
|
if (canvas && ctx) {
|
|
@@ -28,7 +28,7 @@ const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, child
|
|
|
28
28
|
}, [
|
|
29
29
|
gradientColors
|
|
30
30
|
]);
|
|
31
|
-
|
|
31
|
+
useEffect(()=>{
|
|
32
32
|
const handleDocumentMouseMove = (event)=>{
|
|
33
33
|
if (!isScratching) return;
|
|
34
34
|
scratch(event.clientX, event.clientY);
|
|
@@ -119,8 +119,8 @@ const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, child
|
|
|
119
119
|
}
|
|
120
120
|
}
|
|
121
121
|
};
|
|
122
|
-
return /*#__PURE__*/
|
|
123
|
-
className:
|
|
122
|
+
return /*#__PURE__*/ jsxs(motion.div, {
|
|
123
|
+
className: cn("relative select-none", className),
|
|
124
124
|
style: {
|
|
125
125
|
width,
|
|
126
126
|
height,
|
|
@@ -128,7 +128,7 @@ const Scratcher = ({ width, height, minScratchPercentage = 50, onComplete, child
|
|
|
128
128
|
},
|
|
129
129
|
animate: controls,
|
|
130
130
|
children: [
|
|
131
|
-
/*#__PURE__*/
|
|
131
|
+
/*#__PURE__*/ jsx("canvas", {
|
|
132
132
|
ref: canvasRef,
|
|
133
133
|
width: width,
|
|
134
134
|
height: height,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\n\nimport { cn } from \"@/lib/utils\";\nimport { motion, useAnimation } from \"motion/react\";\nimport React, { useEffect, useRef, useState } from \"react\";\n\ninterface ScratcherProps {\n children: React.ReactNode;\n width: number;\n height: number;\n minScratchPercentage?: number;\n className?: string;\n onComplete?: () => void;\n gradientColors?: [string, string, string];\n}\n\nexport const Scratcher: React.FC<ScratcherProps> = ({\n width,\n height,\n minScratchPercentage = 50,\n onComplete,\n children,\n className,\n gradientColors = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"],\n}) => {\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const [isScratching, setIsScratching] = useState(false);\n const [isComplete, setIsComplete] = useState(false);\n\n const controls = useAnimation();\n\n useEffect(() => {\n const canvas = canvasRef.current;\n const ctx = canvas?.getContext(\"2d\");\n if (canvas && ctx) {\n ctx.fillStyle = \"#ccc\";\n ctx.fillRect(0, 0, canvas.width, canvas.height);\n const gradient = ctx.createLinearGradient(\n 0,\n 0,\n canvas.width,\n canvas.height
|
|
1
|
+
{"version":3,"file":"components\\ui\\scratcher.js","sources":["webpack://@arolariu/components/./src/components/ui/scratcher.tsx"],"sourcesContent":["\n\nimport { cn } from \"@/lib/utils\";\nimport { motion, useAnimation } from \"motion/react\";\nimport React, { useEffect, useRef, useState } from \"react\";\n\ninterface ScratcherProps {\n children: React.ReactNode;\n width: number;\n height: number;\n minScratchPercentage?: number;\n className?: string;\n onComplete?: () => void;\n gradientColors?: [string, string, string];\n}\n\nexport const Scratcher: React.FC<ScratcherProps> = ({\n width,\n height,\n minScratchPercentage = 50,\n onComplete,\n children,\n className,\n gradientColors = [\"#A97CF8\", \"#F38CB8\", \"#FDCC92\"],\n}) => {\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const [isScratching, setIsScratching] = useState(false);\n const [isComplete, setIsComplete] = useState(false);\n\n const controls = useAnimation();\n\n useEffect(() => {\n const canvas = canvasRef.current;\n const ctx = canvas?.getContext(\"2d\");\n if (canvas && ctx) {\n ctx.fillStyle = \"#ccc\";\n ctx.fillRect(0, 0, canvas.width, canvas.height);\n const gradient = ctx.createLinearGradient(\n 0,\n 0,\n canvas.width,\n canvas.height,\n );\n gradient.addColorStop(0, gradientColors[0]);\n gradient.addColorStop(0.5, gradientColors[1]);\n gradient.addColorStop(1, gradientColors[2]);\n ctx.fillStyle = gradient;\n ctx.fillRect(0, 0, canvas.width, canvas.height);\n }\n }, [gradientColors]);\n\n useEffect(() => {\n const handleDocumentMouseMove = (event: MouseEvent) => {\n if (!isScratching) return;\n scratch(event.clientX, event.clientY);\n };\n\n const handleDocumentTouchMove = (event: TouchEvent) => {\n if (!isScratching) return;\n const touch = event.touches[0];\n scratch(touch.clientX, touch.clientY);\n };\n\n const handleDocumentMouseUp = () => {\n setIsScratching(false);\n checkCompletion();\n };\n\n const handleDocumentTouchEnd = () => {\n setIsScratching(false);\n checkCompletion();\n };\n\n document.addEventListener(\"mousedown\", handleDocumentMouseMove);\n document.addEventListener(\"mousemove\", handleDocumentMouseMove);\n document.addEventListener(\"touchstart\", handleDocumentTouchMove);\n document.addEventListener(\"touchmove\", handleDocumentTouchMove);\n document.addEventListener(\"mouseup\", handleDocumentMouseUp);\n document.addEventListener(\"touchend\", handleDocumentTouchEnd);\n document.addEventListener(\"touchcancel\", handleDocumentTouchEnd);\n\n return () => {\n document.removeEventListener(\"mousedown\", handleDocumentMouseMove);\n document.removeEventListener(\"mousemove\", handleDocumentMouseMove);\n document.removeEventListener(\"touchstart\", handleDocumentTouchMove);\n document.removeEventListener(\"touchmove\", handleDocumentTouchMove);\n document.removeEventListener(\"mouseup\", handleDocumentMouseUp);\n document.removeEventListener(\"touchend\", handleDocumentTouchEnd);\n document.removeEventListener(\"touchcancel\", handleDocumentTouchEnd);\n };\n }, [isScratching]);\n\n const handleMouseDown = () => setIsScratching(true);\n\n const handleTouchStart = () => setIsScratching(true);\n\n const scratch = (clientX: number, clientY: number) => {\n const canvas = canvasRef.current;\n const ctx = canvas?.getContext(\"2d\");\n if (canvas && ctx) {\n const rect = canvas.getBoundingClientRect();\n const x = clientX - rect.left + 16;\n const y = clientY - rect.top + 16;\n ctx.globalCompositeOperation = \"destination-out\";\n ctx.beginPath();\n ctx.arc(x, y, 30, 0, Math.PI * 2);\n ctx.fill();\n }\n };\n\n const startAnimation = async () => {\n await controls.start({\n scale: [1, 1.5, 1],\n rotate: [0, 10, -10, 10, -10, 0],\n transition: { duration: 0.5 },\n });\n\n // Call onComplete after animation finishes\n if (onComplete) {\n onComplete();\n }\n };\n\n const checkCompletion = () => {\n if (isComplete) return;\n\n const canvas = canvasRef.current;\n const ctx = canvas?.getContext(\"2d\");\n if (canvas && ctx) {\n const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\n const pixels = imageData.data;\n const totalPixels = pixels.length / 4;\n let clearPixels = 0;\n\n for (let i = 3; i < pixels.length; i += 4) {\n if (pixels[i] === 0) clearPixels++;\n }\n\n const percentage = (clearPixels / totalPixels) * 100;\n\n if (percentage >= minScratchPercentage) {\n setIsComplete(true);\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n startAnimation();\n }\n }\n };\n\n return (\n <motion.div\n className={cn(\"relative select-none\", className)}\n style={{\n width,\n height,\n cursor:\n \"url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiIgdmlld0JveD0iMCAwIDMyIDMyIj4KICA8Y2lyY2xlIGN4PSIxNiIgY3k9IjE2IiByPSIxNSIgc3R5bGU9ImZpbGw6I2ZmZjtzdHJva2U6IzAwMDtzdHJva2Utd2lkdGg6MXB4OyIgLz4KPC9zdmc+'), auto\",\n }}\n animate={controls}\n >\n <canvas\n ref={canvasRef}\n width={width}\n height={height}\n className=\"absolute left-0 top-0\"\n onMouseDown={handleMouseDown}\n onTouchStart={handleTouchStart}\n ></canvas>\n {children}\n </motion.div>\n );\n};\n"],"names":["Scratcher","width","height","minScratchPercentage","onComplete","children","className","gradientColors","canvasRef","useRef","isScratching","setIsScratching","useState","isComplete","setIsComplete","controls","useAnimation","useEffect","canvas","ctx","gradient","handleDocumentMouseMove","event","scratch","handleDocumentTouchMove","touch","handleDocumentMouseUp","checkCompletion","handleDocumentTouchEnd","document","handleMouseDown","handleTouchStart","clientX","clientY","rect","x","y","Math","startAnimation","imageData","pixels","totalPixels","clearPixels","i","percentage","motion","cn"],"mappings":";;;;;AAgBO,MAAMA,YAAsC,CAAC,EAClDC,KAAK,EACLC,MAAM,EACNC,uBAAuB,EAAE,EACzBC,UAAU,EACVC,QAAQ,EACRC,SAAS,EACTC,iBAAiB;IAAC;IAAW;IAAW;CAAU,EACnD;IACC,MAAMC,YAAYC,OAA0B;IAC5C,MAAM,CAACC,cAAcC,gBAAgB,GAAGC,SAAS;IACjD,MAAM,CAACC,YAAYC,cAAc,GAAGF,SAAS;IAE7C,MAAMG,WAAWC;IAEjBC,UAAU;QACR,MAAMC,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjBA,IAAI,SAAS,GAAG;YAChBA,IAAI,QAAQ,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;YAC9C,MAAME,WAAWD,IAAI,oBAAoB,CACvC,GACA,GACAD,OAAO,KAAK,EACZA,OAAO,MAAM;YAEfE,SAAS,YAAY,CAAC,GAAGb,cAAc,CAAC,EAAE;YAC1Ca,SAAS,YAAY,CAAC,KAAKb,cAAc,CAAC,EAAE;YAC5Ca,SAAS,YAAY,CAAC,GAAGb,cAAc,CAAC,EAAE;YAC1CY,IAAI,SAAS,GAAGC;YAChBD,IAAI,QAAQ,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;QAChD;IACF,GAAG;QAACX;KAAe;IAEnBU,UAAU;QACR,MAAMI,0BAA0B,CAACC;YAC/B,IAAI,CAACZ,cAAc;YACnBa,QAAQD,MAAM,OAAO,EAAEA,MAAM,OAAO;QACtC;QAEA,MAAME,0BAA0B,CAACF;YAC/B,IAAI,CAACZ,cAAc;YACnB,MAAMe,QAAQH,MAAM,OAAO,CAAC,EAAE;YAC9BC,QAAQE,MAAM,OAAO,EAAEA,MAAM,OAAO;QACtC;QAEA,MAAMC,wBAAwB;YAC5Bf,gBAAgB;YAChBgB;QACF;QAEA,MAAMC,yBAAyB;YAC7BjB,gBAAgB;YAChBgB;QACF;QAEAE,SAAS,gBAAgB,CAAC,aAAaR;QACvCQ,SAAS,gBAAgB,CAAC,aAAaR;QACvCQ,SAAS,gBAAgB,CAAC,cAAcL;QACxCK,SAAS,gBAAgB,CAAC,aAAaL;QACvCK,SAAS,gBAAgB,CAAC,WAAWH;QACrCG,SAAS,gBAAgB,CAAC,YAAYD;QACtCC,SAAS,gBAAgB,CAAC,eAAeD;QAEzC,OAAO;YACLC,SAAS,mBAAmB,CAAC,aAAaR;YAC1CQ,SAAS,mBAAmB,CAAC,aAAaR;YAC1CQ,SAAS,mBAAmB,CAAC,cAAcL;YAC3CK,SAAS,mBAAmB,CAAC,aAAaL;YAC1CK,SAAS,mBAAmB,CAAC,WAAWH;YACxCG,SAAS,mBAAmB,CAAC,YAAYD;YACzCC,SAAS,mBAAmB,CAAC,eAAeD;QAC9C;IACF,GAAG;QAAClB;KAAa;IAEjB,MAAMoB,kBAAkB,IAAMnB,gBAAgB;IAE9C,MAAMoB,mBAAmB,IAAMpB,gBAAgB;IAE/C,MAAMY,UAAU,CAACS,SAAiBC;QAChC,MAAMf,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjB,MAAMe,OAAOhB,OAAO,qBAAqB;YACzC,MAAMiB,IAAIH,UAAUE,KAAK,IAAI,GAAG;YAChC,MAAME,IAAIH,UAAUC,KAAK,GAAG,GAAG;YAC/Bf,IAAI,wBAAwB,GAAG;YAC/BA,IAAI,SAAS;YACbA,IAAI,GAAG,CAACgB,GAAGC,GAAG,IAAI,GAAGC,IAAAA,KAAK,EAAE;YAC5BlB,IAAI,IAAI;QACV;IACF;IAEA,MAAMmB,iBAAiB;QACrB,MAAMvB,SAAS,KAAK,CAAC;YACnB,OAAO;gBAAC;gBAAG;gBAAK;aAAE;YAClB,QAAQ;gBAAC;gBAAG;gBAAI;gBAAK;gBAAI;gBAAK;aAAE;YAChC,YAAY;gBAAE,UAAU;YAAI;QAC9B;QAGA,IAAIX,YACFA;IAEJ;IAEA,MAAMuB,kBAAkB;QACtB,IAAId,YAAY;QAEhB,MAAMK,SAASV,UAAU,OAAO;QAChC,MAAMW,MAAMD,QAAQ,WAAW;QAC/B,IAAIA,UAAUC,KAAK;YACjB,MAAMoB,YAAYpB,IAAI,YAAY,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;YACpE,MAAMsB,SAASD,UAAU,IAAI;YAC7B,MAAME,cAAcD,OAAO,MAAM,GAAG;YACpC,IAAIE,cAAc;YAElB,IAAK,IAAIC,IAAI,GAAGA,IAAIH,OAAO,MAAM,EAAEG,KAAK,EACtC,IAAIH,MAAAA,MAAM,CAACG,EAAE,EAAQD;YAGvB,MAAME,aAAcF,cAAcD,cAAe;YAEjD,IAAIG,cAAczC,sBAAsB;gBACtCW,cAAc;gBACdK,IAAI,SAAS,CAAC,GAAG,GAAGD,OAAO,KAAK,EAAEA,OAAO,MAAM;gBAC/CoB;YACF;QACF;IACF;IAEA,OAAO,WAAP,GACE,KAACO,OAAO,GAAG;QACT,WAAWC,GAAG,wBAAwBxC;QACtC,OAAO;YACLL;YACAC;YACA,QACE;QACJ;QACA,SAASa;;0BAET,IAAC;gBACC,KAAKP;gBACL,OAAOP;gBACP,QAAQC;gBACR,WAAU;gBACV,aAAa4B;gBACb,cAAcC;;YAEf1B;;;AAGP"}
|