@arolariu/components 0.0.37 → 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 +1 -11
- 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 +627 -0
- package/dist/cjs/components/ui/dropdrawer.cjs.map +1 -0
- 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 +268 -232
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/cjs/index.css +2558 -193
- 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 +563 -0
- package/dist/esm/components/ui/dropdrawer.js.map +1 -0
- 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 +2558 -193
- package/dist/esm/index.css.map +1 -0
- package/dist/esm/index.js +62 -320
- package/dist/esm/lib/utils.js +3 -3
- package/dist/esm/lib/utils.js.map +1 -1
- package/dist/index.css +2558 -193
- package/dist/index.js +62 -320
- 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 +2 -1
- 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 +24 -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 +24 -0
- package/dist/types/hooks/use-mobile.d.ts.map +1 -0
- package/dist/types/index.d.ts +2 -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 +103 -71
- 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/background-beams.tsx +3 -3
- 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 +8 -5
- package/src/components/ui/dropdown-menu.tsx +9 -9
- package/src/components/ui/dropdrawer.tsx +973 -0
- 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 -19
- package/src/index.css +68 -68
- package/src/index.ts +400 -385
- package/src/lib/utils.ts +10 -10
- package/tailwind.config.mjs +65 -65
- package/tsconfig.json +58 -50
- package/changelog.md +0 -38
- package/readme.md +0 -214
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
|
|
4
|
+
import { cn } from "../../lib/utils.js";
|
|
5
5
|
const rand = (min, max)=>Math.random() * (max - min) + min;
|
|
6
6
|
const randInt = (min, max)=>Math.floor(Math.random() * (max - min) + min);
|
|
7
7
|
const randColor = ()=>`hsl(${randInt(0, 360)}, 100%, 50%)`;
|
|
@@ -116,7 +116,7 @@ const getColor = (color)=>{
|
|
|
116
116
|
if (Array.isArray(color)) return color[randInt(0, color.length)];
|
|
117
117
|
return color ?? randColor();
|
|
118
118
|
};
|
|
119
|
-
const FireworksBackground = /*#__PURE__*/
|
|
119
|
+
const FireworksBackground = /*#__PURE__*/ forwardRef(({ className, canvasProps, population = 1, color, fireworkSpeed = {
|
|
120
120
|
min: 4,
|
|
121
121
|
max: 8
|
|
122
122
|
}, fireworkSize = {
|
|
@@ -129,10 +129,10 @@ const FireworksBackground = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forw
|
|
|
129
129
|
min: 1,
|
|
130
130
|
max: 5
|
|
131
131
|
}, ...props }, ref)=>{
|
|
132
|
-
const canvasRef =
|
|
133
|
-
const containerRef =
|
|
134
|
-
|
|
135
|
-
|
|
132
|
+
const canvasRef = useRef(null);
|
|
133
|
+
const containerRef = useRef(null);
|
|
134
|
+
useImperativeHandle(ref, ()=>containerRef.current);
|
|
135
|
+
useEffect(()=>{
|
|
136
136
|
const canvas = canvasRef.current;
|
|
137
137
|
const container = containerRef.current;
|
|
138
138
|
if (!canvas || !container) return;
|
|
@@ -208,14 +208,14 @@ const FireworksBackground = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forw
|
|
|
208
208
|
particleSpeed,
|
|
209
209
|
particleSize
|
|
210
210
|
]);
|
|
211
|
-
return /*#__PURE__*/
|
|
211
|
+
return /*#__PURE__*/ jsx("div", {
|
|
212
212
|
ref: containerRef,
|
|
213
|
-
className:
|
|
213
|
+
className: cn("relative size-full overflow-hidden", className),
|
|
214
214
|
...props,
|
|
215
|
-
children: /*#__PURE__*/
|
|
215
|
+
children: /*#__PURE__*/ jsx("canvas", {
|
|
216
216
|
...canvasProps,
|
|
217
217
|
ref: canvasRef,
|
|
218
|
-
className:
|
|
218
|
+
className: cn("absolute inset-0 size-full", canvasProps?.className)
|
|
219
219
|
})
|
|
220
220
|
});
|
|
221
221
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\fireworks-background.js","sources":["webpack://@arolariu/components/./src/components/ui/fireworks-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst rand = (min: number, max: number): number =>\n Math.random() * (max - min) + min;\nconst randInt = (min: number, max: number): number =>\n Math.floor(Math.random() * (max - min) + min);\nconst randColor = (): string => `hsl(${randInt(0, 360)}, 100%, 50%)`;\n\ninterface ParticleType {\n x: number;\n y: number;\n color: string;\n speed: number;\n direction: number;\n vx: number;\n vy: number;\n gravity: number;\n friction: number;\n alpha: number;\n decay: number;\n size: number;\n update: () => void;\n draw: (ctx: CanvasRenderingContext2D) => void;\n isAlive: () => boolean;\n}\n\nconst createParticle = (\n x: number,\n y: number,\n color: string,\n speed: number,\n direction: number,\n gravity: number,\n friction: number,\n size: number\n): ParticleType => {\n const vx = Math.cos(direction) * speed;\n const vy = Math.sin(direction) * speed;\n const alpha = 1;\n const decay = rand(0.005, 0.02);\n\n return {\n x,\n y,\n color,\n speed,\n direction,\n vx,\n vy,\n gravity,\n friction,\n alpha,\n decay,\n size,\n update() {\n this.vx *= this.friction;\n this.vy *= this.friction;\n this.vy += this.gravity;\n this.x += this.vx;\n this.y += this.vy;\n this.alpha -= this.decay;\n },\n draw(ctx: CanvasRenderingContext2D) {\n ctx.save();\n ctx.globalAlpha = this.alpha;\n ctx.beginPath();\n ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\n ctx.fillStyle = this.color;\n ctx.fill();\n ctx.restore();\n },\n isAlive() {\n return this.alpha > 0;\n },\n };\n};\n\ninterface FireworkType {\n x: number;\n y: number;\n targetY: number;\n color: string;\n speed: number;\n size: number;\n angle: number;\n vx: number;\n vy: number;\n trail: { x: number; y: number }[];\n trailLength: number;\n exploded: boolean;\n update: () => boolean;\n explode: () => void;\n draw: (ctx: CanvasRenderingContext2D) => void;\n}\n\nconst createFirework = (\n x: number,\n y: number,\n targetY: number,\n color: string,\n speed: number,\n size: number,\n particleSpeed: { min: number; max: number } | number,\n particleSize: { min: number; max: number } | number,\n onExplode: (particles: ParticleType[]) => void\n): FireworkType => {\n const angle = -Math.PI / 2 + rand(-0.3, 0.3);\n const vx = Math.cos(angle) * speed;\n const vy = Math.sin(angle) * speed;\n const trail: { x: number; y: number }[] = [];\n const trailLength = randInt(10, 25);\n\n return {\n x,\n y,\n targetY,\n color,\n speed,\n size,\n angle,\n vx,\n vy,\n trail,\n trailLength,\n exploded: false,\n update() {\n this.trail.push({ x: this.x, y: this.y });\n if (this.trail.length > this.trailLength) {\n this.trail.shift();\n }\n this.x += this.vx;\n this.y += this.vy;\n this.vy += 0.02;\n if (this.vy >= 0 || this.y <= this.targetY) {\n this.explode();\n return false;\n }\n return true;\n },\n explode() {\n const numParticles = randInt(50, 150);\n const particles: ParticleType[] = [];\n for (let i = 0; i < numParticles; i++) {\n const particleAngle = rand(0, Math.PI * 2);\n const localParticleSpeed = getValueByRange(particleSpeed);\n const localParticleSize = getValueByRange(particleSize);\n particles.push(\n createParticle(\n this.x,\n this.y,\n this.color,\n localParticleSpeed,\n particleAngle,\n 0.05,\n 0.98,\n localParticleSize\n )\n );\n }\n onExplode(particles);\n },\n draw(ctx: CanvasRenderingContext2D) {\n ctx.save();\n ctx.beginPath();\n if (this.trail.length > 1) {\n ctx.moveTo(this.trail[0].x, this.trail[0].y);\n for (const point of this.trail) {\n ctx.lineTo(point.x, point.y);\n }\n } else {\n ctx.moveTo(this.x, this.y);\n ctx.lineTo(this.x, this.y);\n }\n ctx.strokeStyle = this.color;\n ctx.lineWidth = this.size;\n ctx.lineCap = \"round\";\n ctx.stroke();\n ctx.restore();\n },\n };\n};\n\nconst getValueByRange = (\n range: { min: number; max: number } | number\n): number => {\n if (typeof range === \"number\") {\n return range;\n }\n return rand(range.min, range.max);\n};\n\nconst getColor = (color: string | string[] | undefined): string => {\n if (Array.isArray(color)) {\n return color[randInt(0, color.length)];\n }\n return color ?? randColor();\n};\n\ninterface FireworksBackgroundProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"color\"> {\n canvasProps?: React.HTMLAttributes<HTMLCanvasElement>;\n population?: number;\n color?: string | string[];\n fireworkSpeed?: { min: number; max: number } | number;\n fireworkSize?: { min: number; max: number } | number;\n particleSpeed?: { min: number; max: number } | number;\n particleSize?: { min: number; max: number } | number;\n}\n\nconst FireworksBackground = React.forwardRef<\n HTMLDivElement,\n FireworksBackgroundProps\n>(\n (\n {\n className,\n canvasProps,\n population = 1,\n color,\n fireworkSpeed = { min: 4, max: 8 },\n fireworkSize = { min: 2, max: 5 },\n particleSpeed = { min: 2, max: 7 },\n particleSize = { min: 1, max: 5 },\n ...props\n },\n ref\n ) => {\n const canvasRef = React.useRef<HTMLCanvasElement>(null);\n const containerRef = React.useRef<HTMLDivElement>(null);\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement\n );\n\n React.useEffect(() => {\n const canvas = canvasRef.current;\n const container = containerRef.current;\n if (!canvas || !container) return;\n const ctx = canvas.getContext(\"2d\");\n if (!ctx) return;\n\n let maxX = window.innerWidth;\n let ratio = container.offsetHeight / container.offsetWidth;\n let maxY = maxX * ratio;\n canvas.width = maxX;\n canvas.height = maxY;\n\n const setCanvasSize = () => {\n maxX = window.innerWidth;\n ratio = container.offsetHeight / container.offsetWidth;\n maxY = maxX * ratio;\n canvas.width = maxX;\n canvas.height = maxY;\n };\n window.addEventListener(\"resize\", setCanvasSize);\n\n const explosions: ParticleType[] = [];\n const fireworks: FireworkType[] = [];\n\n const handleExplosion = (particles: ParticleType[]) => {\n explosions.push(...particles);\n };\n\n const launchFirework = () => {\n const x = rand(maxX * 0.1, maxX * 0.9);\n const y = maxY;\n const targetY = rand(maxY * 0.1, maxY * 0.4);\n const fireworkColor = getColor(color);\n const speed = getValueByRange(fireworkSpeed);\n const size = getValueByRange(fireworkSize);\n fireworks.push(\n createFirework(\n x,\n y,\n targetY,\n fireworkColor,\n speed,\n size,\n particleSpeed,\n particleSize,\n handleExplosion\n )\n );\n const timeout = rand(300, 800) / population;\n setTimeout(launchFirework, timeout);\n };\n\n launchFirework();\n\n let animationFrameId: number;\n const animate = () => {\n ctx.clearRect(0, 0, maxX, maxY);\n\n for (let i = fireworks.length - 1; i >= 0; i--) {\n const firework = fireworks[i];\n if (!firework.update()) {\n fireworks.splice(i, 1);\n } else {\n firework.draw(ctx);\n }\n }\n\n for (let i = explosions.length - 1; i >= 0; i--) {\n const particle = explosions[i];\n particle.update();\n if (particle.isAlive()) {\n particle.draw(ctx);\n } else {\n explosions.splice(i, 1);\n }\n }\n\n animationFrameId = requestAnimationFrame(animate);\n };\n\n animate();\n\n const handleClick = (event: MouseEvent) => {\n const x = event.clientX;\n const y = maxY;\n const targetY = event.clientY;\n const fireworkColor = getColor(color);\n const speed = getValueByRange(fireworkSpeed);\n const size = getValueByRange(fireworkSize);\n fireworks.push(\n createFirework(\n x,\n y,\n targetY,\n fireworkColor,\n speed,\n size,\n particleSpeed,\n particleSize,\n handleExplosion\n )\n );\n };\n\n container.addEventListener(\"click\", handleClick);\n\n return () => {\n window.removeEventListener(\"resize\", setCanvasSize);\n container.removeEventListener(\"click\", handleClick);\n cancelAnimationFrame(animationFrameId);\n };\n }, [\n population,\n color,\n fireworkSpeed,\n fireworkSize,\n particleSpeed,\n particleSize,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={cn(\"relative size-full overflow-hidden\", className)}\n {...props}\n >\n <canvas\n {...canvasProps}\n ref={canvasRef}\n className={cn(\"absolute inset-0 size-full\", canvasProps?.className)}\n />\n </div>\n );\n }\n);\n\nFireworksBackground.displayName = \"FireworksBackground\";\n\nexport { FireworksBackground, type FireworksBackgroundProps };\n"],"names":["rand","min","max","Math","randInt","randColor","createParticle","x","y","color","speed","direction","gravity","friction","size","vx","vy","alpha","decay","ctx","createFirework","targetY","particleSpeed","particleSize","onExplode","angle","trail","trailLength","numParticles","particles","i","particleAngle","localParticleSpeed","getValueByRange","localParticleSize","point","range","getColor","Array","FireworksBackground","React","className","canvasProps","population","fireworkSpeed","fireworkSize","props","ref","canvasRef","containerRef","canvas","container","maxX","window","ratio","maxY","setCanvasSize","explosions","fireworks","handleExplosion","launchFirework","fireworkColor","timeout","setTimeout","animationFrameId","animate","firework","particle","requestAnimationFrame","handleClick","event","cancelAnimationFrame","cn"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components\\ui\\fireworks-background.js","sources":["webpack://@arolariu/components/./src/components/ui/fireworks-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nconst rand = (min: number, max: number): number =>\n Math.random() * (max - min) + min;\nconst randInt = (min: number, max: number): number =>\n Math.floor(Math.random() * (max - min) + min);\nconst randColor = (): string => `hsl(${randInt(0, 360)}, 100%, 50%)`;\n\ninterface ParticleType {\n x: number;\n y: number;\n color: string;\n speed: number;\n direction: number;\n vx: number;\n vy: number;\n gravity: number;\n friction: number;\n alpha: number;\n decay: number;\n size: number;\n update: () => void;\n draw: (ctx: CanvasRenderingContext2D) => void;\n isAlive: () => boolean;\n}\n\nconst createParticle = (\n x: number,\n y: number,\n color: string,\n speed: number,\n direction: number,\n gravity: number,\n friction: number,\n size: number,\n): ParticleType => {\n const vx = Math.cos(direction) * speed;\n const vy = Math.sin(direction) * speed;\n const alpha = 1;\n const decay = rand(0.005, 0.02);\n\n return {\n x,\n y,\n color,\n speed,\n direction,\n vx,\n vy,\n gravity,\n friction,\n alpha,\n decay,\n size,\n update() {\n this.vx *= this.friction;\n this.vy *= this.friction;\n this.vy += this.gravity;\n this.x += this.vx;\n this.y += this.vy;\n this.alpha -= this.decay;\n },\n draw(ctx: CanvasRenderingContext2D) {\n ctx.save();\n ctx.globalAlpha = this.alpha;\n ctx.beginPath();\n ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\n ctx.fillStyle = this.color;\n ctx.fill();\n ctx.restore();\n },\n isAlive() {\n return this.alpha > 0;\n },\n };\n};\n\ninterface FireworkType {\n x: number;\n y: number;\n targetY: number;\n color: string;\n speed: number;\n size: number;\n angle: number;\n vx: number;\n vy: number;\n trail: { x: number; y: number }[];\n trailLength: number;\n exploded: boolean;\n update: () => boolean;\n explode: () => void;\n draw: (ctx: CanvasRenderingContext2D) => void;\n}\n\nconst createFirework = (\n x: number,\n y: number,\n targetY: number,\n color: string,\n speed: number,\n size: number,\n particleSpeed: { min: number; max: number } | number,\n particleSize: { min: number; max: number } | number,\n onExplode: (particles: ParticleType[]) => void,\n): FireworkType => {\n const angle = -Math.PI / 2 + rand(-0.3, 0.3);\n const vx = Math.cos(angle) * speed;\n const vy = Math.sin(angle) * speed;\n const trail: { x: number; y: number }[] = [];\n const trailLength = randInt(10, 25);\n\n return {\n x,\n y,\n targetY,\n color,\n speed,\n size,\n angle,\n vx,\n vy,\n trail,\n trailLength,\n exploded: false,\n update() {\n this.trail.push({ x: this.x, y: this.y });\n if (this.trail.length > this.trailLength) {\n this.trail.shift();\n }\n this.x += this.vx;\n this.y += this.vy;\n this.vy += 0.02;\n if (this.vy >= 0 || this.y <= this.targetY) {\n this.explode();\n return false;\n }\n return true;\n },\n explode() {\n const numParticles = randInt(50, 150);\n const particles: ParticleType[] = [];\n for (let i = 0; i < numParticles; i++) {\n const particleAngle = rand(0, Math.PI * 2);\n const localParticleSpeed = getValueByRange(particleSpeed);\n const localParticleSize = getValueByRange(particleSize);\n particles.push(\n createParticle(\n this.x,\n this.y,\n this.color,\n localParticleSpeed,\n particleAngle,\n 0.05,\n 0.98,\n localParticleSize,\n ),\n );\n }\n onExplode(particles);\n },\n draw(ctx: CanvasRenderingContext2D) {\n ctx.save();\n ctx.beginPath();\n if (this.trail.length > 1) {\n ctx.moveTo(this.trail[0].x, this.trail[0].y);\n for (const point of this.trail) {\n ctx.lineTo(point.x, point.y);\n }\n } else {\n ctx.moveTo(this.x, this.y);\n ctx.lineTo(this.x, this.y);\n }\n ctx.strokeStyle = this.color;\n ctx.lineWidth = this.size;\n ctx.lineCap = \"round\";\n ctx.stroke();\n ctx.restore();\n },\n };\n};\n\nconst getValueByRange = (\n range: { min: number; max: number } | number,\n): number => {\n if (typeof range === \"number\") {\n return range;\n }\n return rand(range.min, range.max);\n};\n\nconst getColor = (color: string | string[] | undefined): string => {\n if (Array.isArray(color)) {\n return color[randInt(0, color.length)];\n }\n return color ?? randColor();\n};\n\ninterface FireworksBackgroundProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"color\"> {\n canvasProps?: React.HTMLAttributes<HTMLCanvasElement>;\n population?: number;\n color?: string | string[];\n fireworkSpeed?: { min: number; max: number } | number;\n fireworkSize?: { min: number; max: number } | number;\n particleSpeed?: { min: number; max: number } | number;\n particleSize?: { min: number; max: number } | number;\n}\n\nconst FireworksBackground = React.forwardRef<\n HTMLDivElement,\n FireworksBackgroundProps\n>(\n (\n {\n className,\n canvasProps,\n population = 1,\n color,\n fireworkSpeed = { min: 4, max: 8 },\n fireworkSize = { min: 2, max: 5 },\n particleSpeed = { min: 2, max: 7 },\n particleSize = { min: 1, max: 5 },\n ...props\n },\n ref,\n ) => {\n const canvasRef = React.useRef<HTMLCanvasElement>(null);\n const containerRef = React.useRef<HTMLDivElement>(null);\n React.useImperativeHandle(\n ref,\n () => containerRef.current as HTMLDivElement,\n );\n\n React.useEffect(() => {\n const canvas = canvasRef.current;\n const container = containerRef.current;\n if (!canvas || !container) return;\n const ctx = canvas.getContext(\"2d\");\n if (!ctx) return;\n\n let maxX = window.innerWidth;\n let ratio = container.offsetHeight / container.offsetWidth;\n let maxY = maxX * ratio;\n canvas.width = maxX;\n canvas.height = maxY;\n\n const setCanvasSize = () => {\n maxX = window.innerWidth;\n ratio = container.offsetHeight / container.offsetWidth;\n maxY = maxX * ratio;\n canvas.width = maxX;\n canvas.height = maxY;\n };\n window.addEventListener(\"resize\", setCanvasSize);\n\n const explosions: ParticleType[] = [];\n const fireworks: FireworkType[] = [];\n\n const handleExplosion = (particles: ParticleType[]) => {\n explosions.push(...particles);\n };\n\n const launchFirework = () => {\n const x = rand(maxX * 0.1, maxX * 0.9);\n const y = maxY;\n const targetY = rand(maxY * 0.1, maxY * 0.4);\n const fireworkColor = getColor(color);\n const speed = getValueByRange(fireworkSpeed);\n const size = getValueByRange(fireworkSize);\n fireworks.push(\n createFirework(\n x,\n y,\n targetY,\n fireworkColor,\n speed,\n size,\n particleSpeed,\n particleSize,\n handleExplosion,\n ),\n );\n const timeout = rand(300, 800) / population;\n setTimeout(launchFirework, timeout);\n };\n\n launchFirework();\n\n let animationFrameId: number;\n const animate = () => {\n ctx.clearRect(0, 0, maxX, maxY);\n\n for (let i = fireworks.length - 1; i >= 0; i--) {\n const firework = fireworks[i];\n if (!firework.update()) {\n fireworks.splice(i, 1);\n } else {\n firework.draw(ctx);\n }\n }\n\n for (let i = explosions.length - 1; i >= 0; i--) {\n const particle = explosions[i];\n particle.update();\n if (particle.isAlive()) {\n particle.draw(ctx);\n } else {\n explosions.splice(i, 1);\n }\n }\n\n animationFrameId = requestAnimationFrame(animate);\n };\n\n animate();\n\n const handleClick = (event: MouseEvent) => {\n const x = event.clientX;\n const y = maxY;\n const targetY = event.clientY;\n const fireworkColor = getColor(color);\n const speed = getValueByRange(fireworkSpeed);\n const size = getValueByRange(fireworkSize);\n fireworks.push(\n createFirework(\n x,\n y,\n targetY,\n fireworkColor,\n speed,\n size,\n particleSpeed,\n particleSize,\n handleExplosion,\n ),\n );\n };\n\n container.addEventListener(\"click\", handleClick);\n\n return () => {\n window.removeEventListener(\"resize\", setCanvasSize);\n container.removeEventListener(\"click\", handleClick);\n cancelAnimationFrame(animationFrameId);\n };\n }, [\n population,\n color,\n fireworkSpeed,\n fireworkSize,\n particleSpeed,\n particleSize,\n ]);\n\n return (\n <div\n ref={containerRef}\n className={cn(\"relative size-full overflow-hidden\", className)}\n {...props}\n >\n <canvas\n {...canvasProps}\n ref={canvasRef}\n className={cn(\"absolute inset-0 size-full\", canvasProps?.className)}\n />\n </div>\n );\n },\n);\n\nFireworksBackground.displayName = \"FireworksBackground\";\n\nexport { FireworksBackground, type FireworksBackgroundProps };\n"],"names":["rand","min","max","Math","randInt","randColor","createParticle","x","y","color","speed","direction","gravity","friction","size","vx","vy","alpha","decay","ctx","createFirework","targetY","particleSpeed","particleSize","onExplode","angle","trail","trailLength","numParticles","particles","i","particleAngle","localParticleSpeed","getValueByRange","localParticleSize","point","range","getColor","Array","FireworksBackground","React","className","canvasProps","population","fireworkSpeed","fireworkSize","props","ref","canvasRef","containerRef","canvas","container","maxX","window","ratio","maxY","setCanvasSize","explosions","fireworks","handleExplosion","launchFirework","fireworkColor","timeout","setTimeout","animationFrameId","animate","firework","particle","requestAnimationFrame","handleClick","event","cancelAnimationFrame","cn"],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { motion } from "motion/react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
6
|
const defaultSpanClassName = "absolute inset-0 flex items-center justify-center rounded-lg";
|
|
7
|
-
const FlipButton = /*#__PURE__*/
|
|
7
|
+
const FlipButton = /*#__PURE__*/ forwardRef(({ frontText, backText, transition = {
|
|
8
8
|
type: "spring",
|
|
9
9
|
stiffness: 280,
|
|
10
10
|
damping: 20
|
|
@@ -31,29 +31,29 @@ const FlipButton = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(({
|
|
|
31
31
|
initial: buildVariant(0, 90, backOffset),
|
|
32
32
|
hover: buildVariant(1, 0, "0%")
|
|
33
33
|
};
|
|
34
|
-
return /*#__PURE__*/
|
|
34
|
+
return /*#__PURE__*/ jsxs(motion.button, {
|
|
35
35
|
ref: ref,
|
|
36
36
|
initial: "initial",
|
|
37
37
|
whileHover: "hover",
|
|
38
38
|
whileTap: {
|
|
39
39
|
scale: 0.95
|
|
40
40
|
},
|
|
41
|
-
className:
|
|
41
|
+
className: cn("relative inline-block h-10 px-4 py-2 text-sm font-medium cursor-pointer perspective-[1000px] focus:outline-none", className),
|
|
42
42
|
...props,
|
|
43
43
|
children: [
|
|
44
|
-
/*#__PURE__*/
|
|
44
|
+
/*#__PURE__*/ jsx(motion.span, {
|
|
45
45
|
variants: frontVariants,
|
|
46
46
|
transition: transition,
|
|
47
|
-
className:
|
|
47
|
+
className: cn(defaultSpanClassName, "bg-muted text-black dark:text-white", frontClassName),
|
|
48
48
|
children: frontText
|
|
49
49
|
}),
|
|
50
|
-
/*#__PURE__*/
|
|
50
|
+
/*#__PURE__*/ jsx(motion.span, {
|
|
51
51
|
variants: backVariants,
|
|
52
52
|
transition: transition,
|
|
53
|
-
className:
|
|
53
|
+
className: cn(defaultSpanClassName, "bg-primary text-primary-foreground", backClassName),
|
|
54
54
|
children: backText
|
|
55
55
|
}),
|
|
56
|
-
/*#__PURE__*/
|
|
56
|
+
/*#__PURE__*/ jsx("span", {
|
|
57
57
|
className: "invisible",
|
|
58
58
|
children: frontText
|
|
59
59
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\flip-button.js","sources":["webpack://@arolariu/components/./src/components/ui/flip-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n type HTMLMotionProps,\n type Transition,\n type Variant,\n motion,\n} from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype FlipDirection = \"top\" | \"bottom\" | \"left\" | \"righ\";\n\ninterface FlipButtonProps extends HTMLMotionProps<\"button\"> {\n frontText: string;\n backText: string;\n transition?: Transition;\n frontClassName?: string;\n backClassName?: string;\n from?: FlipDirection;\n}\n\nconst defaultSpanClassName =\n \"absolute inset-0 flex items-center justify-center rounded-lg\";\n\nconst FlipButton = React.forwardRef<HTMLButtonElement, FlipButtonProps>(\n (\n {\n frontText,\n backText,\n transition = { type: \"spring\", stiffness: 280, damping: 20 },\n className,\n frontClassName,\n backClassName,\n from = \"top\",\n ...props\n },\n ref
|
|
1
|
+
{"version":3,"file":"components\\ui\\flip-button.js","sources":["webpack://@arolariu/components/./src/components/ui/flip-button.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n type HTMLMotionProps,\n type Transition,\n type Variant,\n motion,\n} from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype FlipDirection = \"top\" | \"bottom\" | \"left\" | \"righ\";\n\ninterface FlipButtonProps extends HTMLMotionProps<\"button\"> {\n frontText: string;\n backText: string;\n transition?: Transition;\n frontClassName?: string;\n backClassName?: string;\n from?: FlipDirection;\n}\n\nconst defaultSpanClassName =\n \"absolute inset-0 flex items-center justify-center rounded-lg\";\n\nconst FlipButton = React.forwardRef<HTMLButtonElement, FlipButtonProps>(\n (\n {\n frontText,\n backText,\n transition = { type: \"spring\", stiffness: 280, damping: 20 },\n className,\n frontClassName,\n backClassName,\n from = \"top\",\n ...props\n },\n ref,\n ) => {\n const isVertical = from === \"top\" || from === \"bottom\";\n const rotateAxis = isVertical ? \"rotateX\" : \"rotateY\";\n\n const frontOffset = from === \"top\" || from === \"left\" ? \"50%\" : \"-50%\";\n const backOffset = from === \"top\" || from === \"left\" ? \"-50%\" : \"50%\";\n\n const buildVariant = (\n opacity: number,\n rotation: number,\n offset: string | null = null,\n ): Variant => ({\n opacity,\n [rotateAxis]: rotation,\n ...(isVertical && offset !== null ? { y: offset } : {}),\n ...(!isVertical && offset !== null ? { x: offset } : {}),\n });\n\n const frontVariants = {\n initial: buildVariant(1, 0, \"0%\"),\n hover: buildVariant(0, 90, frontOffset),\n };\n\n const backVariants = {\n initial: buildVariant(0, 90, backOffset),\n hover: buildVariant(1, 0, \"0%\"),\n };\n\n return (\n <motion.button\n ref={ref}\n initial=\"initial\"\n whileHover=\"hover\"\n whileTap={{ scale: 0.95 }}\n className={cn(\n \"relative inline-block h-10 px-4 py-2 text-sm font-medium cursor-pointer perspective-[1000px] focus:outline-none\",\n className,\n )}\n {...props}\n >\n <motion.span\n variants={frontVariants}\n transition={transition}\n className={cn(\n defaultSpanClassName,\n \"bg-muted text-black dark:text-white\",\n frontClassName,\n )}\n >\n {frontText}\n </motion.span>\n <motion.span\n variants={backVariants}\n transition={transition}\n className={cn(\n defaultSpanClassName,\n \"bg-primary text-primary-foreground\",\n backClassName,\n )}\n >\n {backText}\n </motion.span>\n <span className=\"invisible\">{frontText}</span>\n </motion.button>\n );\n },\n);\n\nFlipButton.displayName = \"FlipButton\";\n\nexport { FlipButton, type FlipButtonProps, type FlipDirection };\n"],"names":["defaultSpanClassName","FlipButton","React","frontText","backText","transition","className","frontClassName","backClassName","from","props","ref","isVertical","rotateAxis","frontOffset","backOffset","buildVariant","opacity","rotation","offset","frontVariants","backVariants","motion","cn"],"mappings":";;;;;AAuBA,MAAMA,uBACJ;AAEF,MAAMC,aAAa,WAAbA,GAAaC,WACjB,CACE,EACEC,SAAS,EACTC,QAAQ,EACRC,aAAa;IAAE,MAAM;IAAU,WAAW;IAAK,SAAS;AAAG,CAAC,EAC5DC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,OAAO,KAAK,EACZ,GAAGC,OACJ,EACDC;IAEA,MAAMC,aAAaH,UAAAA,QAAkBA,aAAAA;IACrC,MAAMI,aAAaD,aAAa,YAAY;IAE5C,MAAME,cAAcL,UAAAA,QAAkBA,WAAAA,OAAkB,QAAQ;IAChE,MAAMM,aAAaN,UAAAA,QAAkBA,WAAAA,OAAkB,SAAS;IAEhE,MAAMO,eAAe,CACnBC,SACAC,UACAC,SAAwB,IAAI,GACf;YACbF;YACA,CAACJ,WAAW,EAAEK;YACd,GAAIN,cAAcO,SAAAA,SAAkB;gBAAE,GAAGA;YAAO,IAAI,CAAC,CAAC;YACtD,GAAI,CAACP,cAAcO,SAAAA,SAAkB;gBAAE,GAAGA;YAAO,IAAI,CAAC,CAAC;QACzD;IAEA,MAAMC,gBAAgB;QACpB,SAASJ,aAAa,GAAG,GAAG;QAC5B,OAAOA,aAAa,GAAG,IAAIF;IAC7B;IAEA,MAAMO,eAAe;QACnB,SAASL,aAAa,GAAG,IAAID;QAC7B,OAAOC,aAAa,GAAG,GAAG;IAC5B;IAEA,OAAO,WAAP,GACE,KAACM,OAAO,MAAM;QACZ,KAAKX;QACL,SAAQ;QACR,YAAW;QACX,UAAU;YAAE,OAAO;QAAK;QACxB,WAAWY,GACT,mHACAjB;QAED,GAAGI,KAAK;;0BAET,IAACY,OAAO,IAAI;gBACV,UAAUF;gBACV,YAAYf;gBACZ,WAAWkB,GACTvB,sBACA,uCACAO;0BAGDJ;;0BAEH,IAACmB,OAAO,IAAI;gBACV,UAAUD;gBACV,YAAYhB;gBACZ,WAAWkB,GACTvB,sBACA,sCACAQ;0BAGDJ;;0BAEH,IAAC;gBAAK,WAAU;0BAAaD;;;;AAGnC;AAGFF,WAAW,WAAW,GAAG"}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
const Form =
|
|
9
|
-
const FormFieldContext = /*#__PURE__*/
|
|
10
|
-
const FormField = ({ ...props })=>/*#__PURE__*/
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { createContext, useContext, useId } from "react";
|
|
4
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
5
|
+
import { Controller, FormProvider, useFormContext, useFormState } from "react-hook-form";
|
|
6
|
+
import { cn } from "../../lib/utils.js";
|
|
7
|
+
import { Label } from "./label.js";
|
|
8
|
+
const Form = FormProvider;
|
|
9
|
+
const FormFieldContext = /*#__PURE__*/ createContext({});
|
|
10
|
+
const FormField = ({ ...props })=>/*#__PURE__*/ jsx(FormFieldContext.Provider, {
|
|
11
11
|
value: {
|
|
12
12
|
name: props.name
|
|
13
13
|
},
|
|
14
|
-
children: /*#__PURE__*/
|
|
14
|
+
children: /*#__PURE__*/ jsx(Controller, {
|
|
15
15
|
...props
|
|
16
16
|
})
|
|
17
17
|
});
|
|
18
18
|
const useFormField = ()=>{
|
|
19
|
-
const fieldContext =
|
|
20
|
-
const itemContext =
|
|
21
|
-
const { getFieldState } =
|
|
22
|
-
const formState =
|
|
19
|
+
const fieldContext = useContext(FormFieldContext);
|
|
20
|
+
const itemContext = useContext(FormItemContext);
|
|
21
|
+
const { getFieldState } = useFormContext();
|
|
22
|
+
const formState = useFormState({
|
|
23
23
|
name: fieldContext.name
|
|
24
24
|
});
|
|
25
25
|
const fieldState = getFieldState(fieldContext.name, formState);
|
|
@@ -34,33 +34,33 @@ const useFormField = ()=>{
|
|
|
34
34
|
...fieldState
|
|
35
35
|
};
|
|
36
36
|
};
|
|
37
|
-
const FormItemContext = /*#__PURE__*/
|
|
37
|
+
const FormItemContext = /*#__PURE__*/ createContext({});
|
|
38
38
|
function FormItem({ className, ...props }) {
|
|
39
|
-
const id =
|
|
40
|
-
return /*#__PURE__*/
|
|
39
|
+
const id = useId();
|
|
40
|
+
return /*#__PURE__*/ jsx(FormItemContext.Provider, {
|
|
41
41
|
value: {
|
|
42
42
|
id
|
|
43
43
|
},
|
|
44
|
-
children: /*#__PURE__*/
|
|
44
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
45
45
|
"data-slot": "form-item",
|
|
46
|
-
className:
|
|
46
|
+
className: cn("grid gap-2", className),
|
|
47
47
|
...props
|
|
48
48
|
})
|
|
49
49
|
});
|
|
50
50
|
}
|
|
51
51
|
function FormLabel({ className, ...props }) {
|
|
52
52
|
const { error, formItemId } = useFormField();
|
|
53
|
-
return /*#__PURE__*/
|
|
53
|
+
return /*#__PURE__*/ jsx(Label, {
|
|
54
54
|
"data-slot": "form-label",
|
|
55
55
|
"data-error": !!error,
|
|
56
|
-
className:
|
|
56
|
+
className: cn("data-[error=true]:text-red-500 dark:data-[error=true]:text-red-900", className),
|
|
57
57
|
htmlFor: formItemId,
|
|
58
58
|
...props
|
|
59
59
|
});
|
|
60
60
|
}
|
|
61
61
|
function FormControl({ ...props }) {
|
|
62
62
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
63
|
-
return /*#__PURE__*/
|
|
63
|
+
return /*#__PURE__*/ jsx(Slot, {
|
|
64
64
|
"data-slot": "form-control",
|
|
65
65
|
id: formItemId,
|
|
66
66
|
"aria-describedby": error ? `${formDescriptionId} ${formMessageId}` : `${formDescriptionId}`,
|
|
@@ -70,10 +70,10 @@ function FormControl({ ...props }) {
|
|
|
70
70
|
}
|
|
71
71
|
function FormDescription({ className, ...props }) {
|
|
72
72
|
const { formDescriptionId } = useFormField();
|
|
73
|
-
return /*#__PURE__*/
|
|
73
|
+
return /*#__PURE__*/ jsx("p", {
|
|
74
74
|
"data-slot": "form-description",
|
|
75
75
|
id: formDescriptionId,
|
|
76
|
-
className:
|
|
76
|
+
className: cn("text-neutral-500 text-sm dark:text-neutral-400", className),
|
|
77
77
|
...props
|
|
78
78
|
});
|
|
79
79
|
}
|
|
@@ -81,10 +81,10 @@ function FormMessage({ className, ...props }) {
|
|
|
81
81
|
const { error, formMessageId } = useFormField();
|
|
82
82
|
const body = error ? String(error?.message ?? "") : props.children;
|
|
83
83
|
if (!body) return null;
|
|
84
|
-
return /*#__PURE__*/
|
|
84
|
+
return /*#__PURE__*/ jsx("p", {
|
|
85
85
|
"data-slot": "form-message",
|
|
86
86
|
id: formMessageId,
|
|
87
|
-
className:
|
|
87
|
+
className: cn("text-red-500 text-sm dark:text-red-900", className),
|
|
88
88
|
...props,
|
|
89
89
|
children: body
|
|
90
90
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\form.js","sources":["webpack://@arolariu/components/./src/components/ui/form.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n Controller,\n FormProvider,\n useFormContext,\n useFormState,\n type ControllerProps,\n type FieldPath,\n type FieldValues,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Label } from \"@/components/ui/label\";\n\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues
|
|
1
|
+
{"version":3,"file":"components\\ui\\form.js","sources":["webpack://@arolariu/components/./src/components/ui/form.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport * as LabelPrimitive from \"@radix-ui/react-label\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n Controller,\n FormProvider,\n useFormContext,\n useFormState,\n type ControllerProps,\n type FieldPath,\n type FieldValues,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/lib/utils\";\nimport { Label } from \"@/components/ui/label\";\n\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n name: TName;\n};\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n {} as FormFieldContextValue,\n);\n\nconst FormField = <\n TFieldValues extends FieldValues = FieldValues,\n TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n ...props\n}: ControllerProps<TFieldValues, TName>) => {\n return (\n <FormFieldContext.Provider value={{ name: props.name }}>\n <Controller {...props} />\n </FormFieldContext.Provider>\n );\n};\n\nconst useFormField = () => {\n const fieldContext = React.useContext(FormFieldContext);\n const itemContext = React.useContext(FormItemContext);\n const { getFieldState } = useFormContext();\n const formState = useFormState({ name: fieldContext.name });\n const fieldState = getFieldState(fieldContext.name, formState);\n\n if (!fieldContext) {\n throw new Error(\"useFormField should be used within <FormField>\");\n }\n\n const { id } = itemContext;\n\n return {\n id,\n name: fieldContext.name,\n formItemId: `${id}-form-item`,\n formDescriptionId: `${id}-form-item-description`,\n formMessageId: `${id}-form-item-message`,\n ...fieldState,\n };\n};\n\ntype FormItemContextValue = {\n id: string;\n};\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n {} as FormItemContextValue,\n);\n\nfunction FormItem({ className, ...props }: React.ComponentProps<\"div\">) {\n const id = React.useId();\n\n return (\n <FormItemContext.Provider value={{ id }}>\n <div\n data-slot=\"form-item\"\n className={cn(\"grid gap-2\", className)}\n {...props}\n />\n </FormItemContext.Provider>\n );\n}\n\nfunction FormLabel({\n className,\n ...props\n}: React.ComponentProps<typeof LabelPrimitive.Root>) {\n const { error, formItemId } = useFormField();\n\n return (\n <Label\n data-slot=\"form-label\"\n data-error={!!error}\n className={cn(\n \"data-[error=true]:text-red-500 dark:data-[error=true]:text-red-900\",\n className,\n )}\n htmlFor={formItemId}\n {...props}\n />\n );\n}\n\nfunction FormControl({ ...props }: React.ComponentProps<typeof Slot>) {\n const { error, formItemId, formDescriptionId, formMessageId } =\n useFormField();\n\n return (\n <Slot\n data-slot=\"form-control\"\n id={formItemId}\n aria-describedby={\n !error\n ? `${formDescriptionId}`\n : `${formDescriptionId} ${formMessageId}`\n }\n aria-invalid={!!error}\n {...props}\n />\n );\n}\n\nfunction FormDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n const { formDescriptionId } = useFormField();\n\n return (\n <p\n data-slot=\"form-description\"\n id={formDescriptionId}\n className={cn(\n \"text-neutral-500 text-sm dark:text-neutral-400\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction FormMessage({ className, ...props }: React.ComponentProps<\"p\">) {\n const { error, formMessageId } = useFormField();\n const body = error ? String(error?.message ?? \"\") : props.children;\n\n if (!body) {\n return null;\n }\n\n return (\n <p\n data-slot=\"form-message\"\n id={formMessageId}\n className={cn(\"text-red-500 text-sm dark:text-red-900\", className)}\n {...props}\n >\n {body}\n </p>\n );\n}\n\nexport {\n useFormField,\n Form,\n FormItem,\n FormLabel,\n FormControl,\n FormDescription,\n FormMessage,\n FormField,\n};\n"],"names":["Form","FormProvider","FormFieldContext","React","FormField","props","Controller","useFormField","fieldContext","itemContext","FormItemContext","getFieldState","useFormContext","formState","useFormState","fieldState","Error","id","FormItem","className","cn","FormLabel","error","formItemId","Label","FormControl","formDescriptionId","formMessageId","Slot","FormDescription","FormMessage","body","String"],"mappings":";;;;;;;AAkBA,MAAMA,OAAOC;AASb,MAAMC,mBAAmB,WAAnBA,GAAmBC,cACvB,CAAC;AAGH,MAAMC,YAAY,CAGhB,EACA,GAAGC,OACkC,GAC9B,WAAP,GACE,IAACH,iBAAiB,QAAQ;QAAC,OAAO;YAAE,MAAMG,MAAM,IAAI;QAAC;kBACnD,kBAACC,YAAUA;YAAE,GAAGD,KAAK;;;AAK3B,MAAME,eAAe;IACnB,MAAMC,eAAeL,WAAiBD;IACtC,MAAMO,cAAcN,WAAiBO;IACrC,MAAM,EAAEC,aAAa,EAAE,GAAGC;IAC1B,MAAMC,YAAYC,aAAa;QAAE,MAAMN,aAAa,IAAI;IAAC;IACzD,MAAMO,aAAaJ,cAAcH,aAAa,IAAI,EAAEK;IAEpD,IAAI,CAACL,cACH,MAAM,IAAIQ,MAAM;IAGlB,MAAM,EAAEC,EAAE,EAAE,GAAGR;IAEf,OAAO;QACLQ;QACA,MAAMT,aAAa,IAAI;QACvB,YAAY,GAAGS,GAAG,UAAU,CAAC;QAC7B,mBAAmB,GAAGA,GAAG,sBAAsB,CAAC;QAChD,eAAe,GAAGA,GAAG,kBAAkB,CAAC;QACxC,GAAGF,UAAU;IACf;AACF;AAMA,MAAML,kBAAkB,WAAlBA,GAAkBP,cACtB,CAAC;AAGH,SAASe,SAAS,EAAEC,SAAS,EAAE,GAAGd,OAAoC;IACpE,MAAMY,KAAKd;IAEX,OAAO,WAAP,GACE,IAACO,gBAAgB,QAAQ;QAAC,OAAO;YAAEO;QAAG;kBACpC,kBAAC;YACC,aAAU;YACV,WAAWG,GAAG,cAAcD;YAC3B,GAAGd,KAAK;;;AAIjB;AAEA,SAASgB,UAAU,EACjBF,SAAS,EACT,GAAGd,OAC8C;IACjD,MAAM,EAAEiB,KAAK,EAAEC,UAAU,EAAE,GAAGhB;IAE9B,OAAO,WAAP,GACE,IAACiB,OAAKA;QACJ,aAAU;QACV,cAAY,CAAC,CAACF;QACd,WAAWF,GACT,sEACAD;QAEF,SAASI;QACR,GAAGlB,KAAK;;AAGf;AAEA,SAASoB,YAAY,EAAE,GAAGpB,OAA0C;IAClE,MAAM,EAAEiB,KAAK,EAAEC,UAAU,EAAEG,iBAAiB,EAAEC,aAAa,EAAE,GAC3DpB;IAEF,OAAO,WAAP,GACE,IAACqB,MAAIA;QACH,aAAU;QACV,IAAIL;QACJ,oBACE,QAEI,GAAGG,kBAAkB,CAAC,EAAEC,eAAe,GADvC,GAAGD,mBAAmB;QAG5B,gBAAc,CAAC,CAACJ;QACf,GAAGjB,KAAK;;AAGf;AAEA,SAASwB,gBAAgB,EAAEV,SAAS,EAAE,GAAGd,OAAkC;IACzE,MAAM,EAAEqB,iBAAiB,EAAE,GAAGnB;IAE9B,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,IAAImB;QACJ,WAAWN,GACT,kDACAD;QAED,GAAGd,KAAK;;AAGf;AAEA,SAASyB,YAAY,EAAEX,SAAS,EAAE,GAAGd,OAAkC;IACrE,MAAM,EAAEiB,KAAK,EAAEK,aAAa,EAAE,GAAGpB;IACjC,MAAMwB,OAAOT,QAAQU,OAAOV,OAAO,WAAW,MAAMjB,MAAM,QAAQ;IAElE,IAAI,CAAC0B,MACH,OAAO;IAGT,OAAO,WAAP,GACE,IAAC;QACC,aAAU;QACV,IAAIJ;QACJ,WAAWP,GAAG,0CAA0CD;QACvD,GAAGd,KAAK;kBAER0B;;AAGP"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
const GradientBackground = /*#__PURE__*/
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { motion } from "motion/react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
|
+
const GradientBackground = /*#__PURE__*/ forwardRef(({ className, transition = {
|
|
7
7
|
duration: 15,
|
|
8
8
|
ease: "easeInOut",
|
|
9
9
|
repeat: 1 / 0
|
|
10
|
-
}, ...props }, ref)=>/*#__PURE__*/
|
|
10
|
+
}, ...props }, ref)=>/*#__PURE__*/ jsx(motion.div, {
|
|
11
11
|
ref: ref,
|
|
12
|
-
className:
|
|
12
|
+
className: cn("size-full bg-gradient-to-br from-blue-500 via-purple-500 to-pink-500 bg-[length:400%_400%]", className),
|
|
13
13
|
animate: {
|
|
14
14
|
backgroundPosition: [
|
|
15
15
|
"0% 50%",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\gradient-background.js","sources":["webpack://@arolariu/components/./src/components/ui/gradient-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface GradientBackgroundProps extends HTMLMotionProps<\"div\"> {\n transition?: Transition;\n}\n\nconst GradientBackground = React.forwardRef<\n HTMLDivElement,\n GradientBackgroundProps\n>(\n (\n {\n className,\n transition = { duration: 15, ease: \"easeInOut\", repeat: Infinity },\n ...props\n },\n ref
|
|
1
|
+
{"version":3,"file":"components\\ui\\gradient-background.js","sources":["webpack://@arolariu/components/./src/components/ui/gradient-background.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { HTMLMotionProps, motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface GradientBackgroundProps extends HTMLMotionProps<\"div\"> {\n transition?: Transition;\n}\n\nconst GradientBackground = React.forwardRef<\n HTMLDivElement,\n GradientBackgroundProps\n>(\n (\n {\n className,\n transition = { duration: 15, ease: \"easeInOut\", repeat: Infinity },\n ...props\n },\n ref,\n ) => {\n return (\n <motion.div\n ref={ref}\n className={cn(\n \"size-full bg-gradient-to-br from-blue-500 via-purple-500 to-pink-500 bg-[length:400%_400%]\",\n className,\n )}\n animate={{\n backgroundPosition: [\"0% 50%\", \"100% 50%\", \"0% 50%\"],\n }}\n transition={transition}\n {...props}\n />\n );\n },\n);\n\nGradientBackground.displayName = \"GradientBackground\";\n\nexport { GradientBackground, type GradientBackgroundProps };\n"],"names":["GradientBackground","React","className","transition","Infinity","props","ref","motion","cn"],"mappings":";;;;;AAWA,MAAMA,qBAAqB,WAArBA,GAAqBC,WAIzB,CACE,EACEC,SAAS,EACTC,aAAa;IAAE,UAAU;IAAI,MAAM;IAAa,QAAQC;AAAS,CAAC,EAClE,GAAGC,OACJ,EACDC,MAEO,WAAP,GACE,IAACC,OAAO,GAAG;QACT,KAAKD;QACL,WAAWE,GACT,8FACAN;QAEF,SAAS;YACP,oBAAoB;gBAAC;gBAAU;gBAAY;aAAS;QACtD;QACA,YAAYC;QACX,GAAGE,KAAK;;AAMjBL,mBAAmB,WAAW,GAAG"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
const GradientText = /*#__PURE__*/
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import { motion } from "motion/react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
|
+
const GradientText = /*#__PURE__*/ forwardRef(({ text, className, gradient = "linear-gradient(90deg, #3b82f6 0%, #a855f7 20%, #ec4899 50%, #a855f7 80%, #3b82f6 100%)", neon = false, transition = {
|
|
7
7
|
duration: 50,
|
|
8
8
|
repeat: 1 / 0,
|
|
9
9
|
ease: "linear"
|
|
@@ -11,12 +11,12 @@ const GradientText = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(
|
|
|
11
11
|
const baseStyle = {
|
|
12
12
|
backgroundImage: gradient
|
|
13
13
|
};
|
|
14
|
-
return /*#__PURE__*/
|
|
14
|
+
return /*#__PURE__*/ jsxs("span", {
|
|
15
15
|
ref: ref,
|
|
16
|
-
className:
|
|
16
|
+
className: cn("relative inline-block", className),
|
|
17
17
|
...props,
|
|
18
18
|
children: [
|
|
19
|
-
/*#__PURE__*/
|
|
19
|
+
/*#__PURE__*/ jsx(motion.span, {
|
|
20
20
|
className: "m-0 text-transparent bg-clip-text bg-[length:700%_100%] bg-[position:0%_0%]",
|
|
21
21
|
style: baseStyle,
|
|
22
22
|
initial: {
|
|
@@ -28,7 +28,7 @@ const GradientText = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef(
|
|
|
28
28
|
transition: transition,
|
|
29
29
|
children: text
|
|
30
30
|
}),
|
|
31
|
-
neon && /*#__PURE__*/
|
|
31
|
+
neon && /*#__PURE__*/ jsx(motion.span, {
|
|
32
32
|
className: "m-0 absolute top-0 left-0 text-transparent bg-clip-text blur-[8px] mix-blend-plus-lighter bg-[length:700%_100%] bg-[position:0%_0%]",
|
|
33
33
|
style: baseStyle,
|
|
34
34
|
initial: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\gradient-text.js","sources":["webpack://@arolariu/components/./src/components/ui/gradient-text.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface GradientTextProps extends React.HTMLAttributes<HTMLSpanElement> {\n text: string;\n gradient?: string;\n neon?: boolean;\n transition?: Transition;\n}\n\nconst GradientText = React.forwardRef<HTMLSpanElement, GradientTextProps>(\n (\n {\n text,\n className,\n gradient = \"linear-gradient(90deg, #3b82f6 0%, #a855f7 20%, #ec4899 50%, #a855f7 80%, #3b82f6 100%)\",\n neon = false,\n transition = { duration: 50, repeat: Infinity, ease: \"linear\" },\n ...props\n },\n ref
|
|
1
|
+
{"version":3,"file":"components\\ui\\gradient-text.js","sources":["webpack://@arolariu/components/./src/components/ui/gradient-text.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport { motion, type Transition } from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface GradientTextProps extends React.HTMLAttributes<HTMLSpanElement> {\n text: string;\n gradient?: string;\n neon?: boolean;\n transition?: Transition;\n}\n\nconst GradientText = React.forwardRef<HTMLSpanElement, GradientTextProps>(\n (\n {\n text,\n className,\n gradient = \"linear-gradient(90deg, #3b82f6 0%, #a855f7 20%, #ec4899 50%, #a855f7 80%, #3b82f6 100%)\",\n neon = false,\n transition = { duration: 50, repeat: Infinity, ease: \"linear\" },\n ...props\n },\n ref,\n ) => {\n const baseStyle: React.CSSProperties = {\n backgroundImage: gradient,\n };\n\n return (\n <span\n ref={ref}\n className={cn(\"relative inline-block\", className)}\n {...props}\n >\n <motion.span\n className=\"m-0 text-transparent bg-clip-text bg-[length:700%_100%] bg-[position:0%_0%]\"\n style={baseStyle}\n initial={{ backgroundPosition: \"0% 0%\" }}\n animate={{ backgroundPosition: \"500% 100%\" }}\n transition={transition}\n >\n {text}\n </motion.span>\n\n {neon && (\n <motion.span\n className=\"m-0 absolute top-0 left-0 text-transparent bg-clip-text blur-[8px] mix-blend-plus-lighter bg-[length:700%_100%] bg-[position:0%_0%]\"\n style={baseStyle}\n initial={{ backgroundPosition: \"0% 0%\" }}\n animate={{ backgroundPosition: \"500% 100%\" }}\n transition={transition}\n >\n {text}\n </motion.span>\n )}\n </span>\n );\n },\n);\n\nGradientText.displayName = \"GradientText\";\n\nexport { GradientText, type GradientTextProps };\n"],"names":["GradientText","React","text","className","gradient","neon","transition","Infinity","props","ref","baseStyle","cn","motion"],"mappings":";;;;;AAcA,MAAMA,eAAe,WAAfA,GAAeC,WACnB,CACE,EACEC,IAAI,EACJC,SAAS,EACTC,WAAW,yFAAyF,EACpGC,OAAO,KAAK,EACZC,aAAa;IAAE,UAAU;IAAI,QAAQC;IAAU,MAAM;AAAS,CAAC,EAC/D,GAAGC,OACJ,EACDC;IAEA,MAAMC,YAAiC;QACrC,iBAAiBN;IACnB;IAEA,OAAO,WAAP,GACE,KAAC;QACC,KAAKK;QACL,WAAWE,GAAG,yBAAyBR;QACtC,GAAGK,KAAK;;0BAET,IAACI,OAAO,IAAI;gBACV,WAAU;gBACV,OAAOF;gBACP,SAAS;oBAAE,oBAAoB;gBAAQ;gBACvC,SAAS;oBAAE,oBAAoB;gBAAY;gBAC3C,YAAYJ;0BAEXJ;;YAGFG,QAAQ,WAARA,GACC,IAACO,OAAO,IAAI;gBACV,WAAU;gBACV,OAAOF;gBACP,SAAS;oBAAE,oBAAoB;gBAAQ;gBACvC,SAAS;oBAAE,oBAAoB;gBAAY;gBAC3C,YAAYJ;0BAEXJ;;;;AAKX;AAGFF,aAAa,WAAW,GAAG"}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef, useImperativeHandle, useRef } from "react";
|
|
4
|
+
import { motion, useInView } from "motion/react";
|
|
5
|
+
import { cn } from "../../lib/utils.js";
|
|
6
6
|
const animation = {
|
|
7
7
|
backgroundSize: "100% 100%"
|
|
8
8
|
};
|
|
9
|
-
const HighlightText = /*#__PURE__*/
|
|
9
|
+
const HighlightText = /*#__PURE__*/ forwardRef(({ text, className, inView = false, inViewMargin = "0px", transition = {
|
|
10
10
|
duration: 2,
|
|
11
11
|
ease: "easeInOut"
|
|
12
12
|
}, ...props }, ref)=>{
|
|
13
|
-
const localRef =
|
|
14
|
-
|
|
15
|
-
const inViewResult =
|
|
13
|
+
const localRef = useRef(null);
|
|
14
|
+
useImperativeHandle(ref, ()=>localRef.current);
|
|
15
|
+
const inViewResult = useInView(localRef, {
|
|
16
16
|
once: true,
|
|
17
17
|
margin: inViewMargin
|
|
18
18
|
});
|
|
19
19
|
const isInView = !inView || inViewResult;
|
|
20
|
-
return /*#__PURE__*/
|
|
20
|
+
return /*#__PURE__*/ jsx(motion.span, {
|
|
21
21
|
ref: localRef,
|
|
22
22
|
initial: {
|
|
23
23
|
backgroundSize: "0% 100%"
|
|
@@ -29,7 +29,7 @@ const HighlightText = /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__.forwardRef
|
|
|
29
29
|
backgroundPosition: "left center",
|
|
30
30
|
display: "inline"
|
|
31
31
|
},
|
|
32
|
-
className:
|
|
32
|
+
className: cn("relative inline-block px-2 py-1 rounded-lg bg-gradient-to-r from-blue-100 to-purple-100 dark:from-blue-500 dark:to-purple-500", className),
|
|
33
33
|
...props,
|
|
34
34
|
children: text
|
|
35
35
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components\\ui\\highlight-text.js","sources":["webpack://@arolariu/components/./src/components/ui/highlight-text.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n motion,\n useInView,\n type HTMLMotionProps,\n type Transition,\n type UseInViewOptions,\n} from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface HighlightTextProps extends HTMLMotionProps<\"span\"> {\n text: string;\n inView?: boolean;\n inViewMargin?: UseInViewOptions[\"margin\"];\n inViewOnce?: boolean;\n transition?: Transition;\n}\n\nconst animation = { backgroundSize: \"100% 100%\" };\n\nconst HighlightText = React.forwardRef<HTMLSpanElement, HighlightTextProps>(\n (\n {\n text,\n className,\n inView = false,\n inViewMargin = \"0px\",\n transition = { duration: 2, ease: \"easeInOut\" },\n ...props\n },\n ref
|
|
1
|
+
{"version":3,"file":"components\\ui\\highlight-text.js","sources":["webpack://@arolariu/components/./src/components/ui/highlight-text.tsx"],"sourcesContent":["\n\nimport * as React from \"react\";\nimport {\n motion,\n useInView,\n type HTMLMotionProps,\n type Transition,\n type UseInViewOptions,\n} from \"motion/react\";\n\nimport { cn } from \"@/lib/utils\";\n\ninterface HighlightTextProps extends HTMLMotionProps<\"span\"> {\n text: string;\n inView?: boolean;\n inViewMargin?: UseInViewOptions[\"margin\"];\n inViewOnce?: boolean;\n transition?: Transition;\n}\n\nconst animation = { backgroundSize: \"100% 100%\" };\n\nconst HighlightText = React.forwardRef<HTMLSpanElement, HighlightTextProps>(\n (\n {\n text,\n className,\n inView = false,\n inViewMargin = \"0px\",\n transition = { duration: 2, ease: \"easeInOut\" },\n ...props\n },\n ref,\n ) => {\n const localRef = React.useRef<HTMLSpanElement>(null);\n React.useImperativeHandle(ref, () => localRef.current as HTMLSpanElement);\n\n const inViewResult = useInView(localRef, {\n once: true,\n margin: inViewMargin,\n });\n const isInView = !inView || inViewResult;\n\n return (\n <motion.span\n ref={localRef}\n initial={{\n backgroundSize: \"0% 100%\",\n }}\n animate={isInView ? animation : undefined}\n transition={transition}\n style={{\n backgroundRepeat: \"no-repeat\",\n backgroundPosition: \"left center\",\n display: \"inline\",\n }}\n className={cn(\n `relative inline-block px-2 py-1 rounded-lg bg-gradient-to-r from-blue-100 to-purple-100 dark:from-blue-500 dark:to-purple-500`,\n className,\n )}\n {...props}\n >\n {text}\n </motion.span>\n );\n },\n);\nHighlightText.displayName = \"HighlightText\";\n\nexport { HighlightText, type HighlightTextProps };\n"],"names":["animation","HighlightText","React","text","className","inView","inViewMargin","transition","props","ref","localRef","inViewResult","useInView","isInView","motion","undefined","cn"],"mappings":";;;;;AAqBA,MAAMA,YAAY;IAAE,gBAAgB;AAAY;AAEhD,MAAMC,gBAAgB,WAAhBA,GAAgBC,WACpB,CACE,EACEC,IAAI,EACJC,SAAS,EACTC,SAAS,KAAK,EACdC,eAAe,KAAK,EACpBC,aAAa;IAAE,UAAU;IAAG,MAAM;AAAY,CAAC,EAC/C,GAAGC,OACJ,EACDC;IAEA,MAAMC,WAAWR,OAA8B;IAC/CA,oBAA0BO,KAAK,IAAMC,SAAS,OAAO;IAErD,MAAMC,eAAeC,UAAUF,UAAU;QACvC,MAAM;QACN,QAAQJ;IACV;IACA,MAAMO,WAAW,CAACR,UAAUM;IAE5B,OAAO,WAAP,GACE,IAACG,OAAO,IAAI;QACV,KAAKJ;QACL,SAAS;YACP,gBAAgB;QAClB;QACA,SAASG,WAAWb,YAAYe;QAChC,YAAYR;QACZ,OAAO;YACL,kBAAkB;YAClB,oBAAoB;YACpB,SAAS;QACX;QACA,WAAWS,GACT,iIACAZ;QAED,GAAGI,KAAK;kBAERL;;AAGP;AAEFF,cAAc,WAAW,GAAG"}
|