@stfrigerio/sito-template 0.1.57 → 0.1.59
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/dist/components/atoms/Button/Button.stories.d.ts +0 -1
- package/dist/components/atoms/Button/Button.stories.d.ts.map +1 -1
- package/dist/components/atoms/Card/Card.stories.d.ts +0 -1
- package/dist/components/atoms/Card/Card.stories.d.ts.map +1 -1
- package/dist/components/atoms/Checkbox/Checkbox.stories.d.ts +0 -7
- package/dist/components/atoms/Checkbox/Checkbox.stories.d.ts.map +1 -1
- package/dist/components/atoms/DateInput/DateInput.stories.d.ts +0 -7
- package/dist/components/atoms/DateInput/DateInput.stories.d.ts.map +1 -1
- package/dist/components/atoms/LoadingSpinner/LoadingSpinner.stories.d.ts +1 -15
- package/dist/components/atoms/LoadingSpinner/LoadingSpinner.stories.d.ts.map +1 -1
- package/dist/components/atoms/NumberStepper/NumberStepper.stories.d.ts +0 -16
- package/dist/components/atoms/NumberStepper/NumberStepper.stories.d.ts.map +1 -1
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.stories.d.ts +0 -9
- package/dist/components/atoms/SearchableDropdown/SearchableDropdown.stories.d.ts.map +1 -1
- package/dist/components/atoms/SelectInput/SelectInput.stories.d.ts +0 -6
- package/dist/components/atoms/SelectInput/SelectInput.stories.d.ts.map +1 -1
- package/dist/components/atoms/Slider/Slider.stories.d.ts.map +1 -1
- package/dist/components/atoms/TextArea/TextArea.stories.d.ts +0 -10
- package/dist/components/atoms/TextArea/TextArea.stories.d.ts.map +1 -1
- package/dist/components/atoms/TextInput/TextInput.stories.d.ts +0 -14
- package/dist/components/atoms/TextInput/TextInput.stories.d.ts.map +1 -1
- package/dist/components/atoms/Toggle/Toggle.stories.d.ts +0 -8
- package/dist/components/atoms/Toggle/Toggle.stories.d.ts.map +1 -1
- package/dist/components/atoms/ToggleButton/ToggleButton.stories.d.ts +0 -7
- package/dist/components/atoms/ToggleButton/ToggleButton.stories.d.ts.map +1 -1
- package/dist/components/molecules/ArrayInput/ArrayInput.stories.d.ts +0 -9
- package/dist/components/molecules/ArrayInput/ArrayInput.stories.d.ts.map +1 -1
- package/dist/components/molecules/EditFAB/EditFAB.stories.d.ts +1 -12
- package/dist/components/molecules/EditFAB/EditFAB.stories.d.ts.map +1 -1
- package/dist/components/molecules/SearchBar/SearchBar.stories.d.ts +0 -8
- package/dist/components/molecules/SearchBar/SearchBar.stories.d.ts.map +1 -1
- package/dist/components/molecules/Tabs/Tabs.stories.d.ts.map +1 -1
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.stories.d.ts +0 -3
- package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.stories.d.ts.map +1 -1
- package/dist/components/molecules/TimeInput/TimeInput.stories.d.ts +0 -6
- package/dist/components/molecules/TimeInput/TimeInput.stories.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/Calendar.d.ts +21 -1
- package/dist/components/organisms/Calendar/Calendar.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/Calendar.stories.d.ts +1 -1
- package/dist/components/organisms/Calendar/Calendar.stories.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/DayEventCard.d.ts +1 -1
- package/dist/components/organisms/Calendar/DayEventCard.d.ts.map +1 -1
- package/dist/components/organisms/ImageSlideshow/ImageSlideshow.stories.d.ts +0 -23
- package/dist/components/organisms/ImageSlideshow/ImageSlideshow.stories.d.ts.map +1 -1
- package/dist/components/organisms/Navbar/Navbar.d.ts +1 -0
- package/dist/components/organisms/Navbar/Navbar.d.ts.map +1 -1
- package/dist/components/organisms/Navbar/Navbar.stories.d.ts +1 -7
- package/dist/components/organisms/Navbar/Navbar.stories.d.ts.map +1 -1
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.stories.d.ts +1 -4
- package/dist/components/organisms/charts/BooleansHeatmap/BooleansHeatmap.stories.d.ts.map +1 -1
- package/dist/components/organisms/charts/PieChart/PieChart.stories.d.ts +1 -5
- package/dist/components/organisms/charts/PieChart/PieChart.stories.d.ts.map +1 -1
- package/dist/index.esm.js +148 -60
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +147 -59
- package/dist/index.js.map +1 -1
- package/dist/stories/utils.d.ts.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/dist/themes/dao.css +16 -1
- package/dist/themes/globals.css +2 -5
- package/package.json +1 -1
- package/storybook-static/assets/{ASCIIText.stories-LbmvFzzv.js → ASCIIText.stories-CsG3yKr5.js} +4 -4
- package/storybook-static/assets/{AllAtoms.stories-CLunFOjI.js → AllAtoms.stories-D2Pzz8c7.js} +1 -1
- package/storybook-static/assets/{AnimatedContent.stories-B8hBaVkK.js → AnimatedContent.stories-BP9feFGz.js} +1 -1
- package/storybook-static/assets/{AnimatedList.stories-D8a9eYqH.js → AnimatedList.stories-DQ8jdk44.js} +2 -2
- package/storybook-static/assets/{Antigravity.stories-D_mJbWK0.js → Antigravity.stories-BTIHyYKU.js} +1 -1
- package/storybook-static/assets/ArrayInput.stories-d5_OJJMu.js +138 -0
- package/storybook-static/assets/{Aurora.stories-BN4MataE.js → Aurora.stories-D_eQNPaB.js} +2 -2
- package/storybook-static/assets/{Beams.stories-CCtZOw8G.js → Beams.stories-VLKuYE0_.js} +6 -6
- package/storybook-static/assets/{BlobCursor.stories-CdB55R5G.js → BlobCursor.stories-BQJgTsuD.js} +1 -1
- package/storybook-static/assets/{BlurText.stories-Bg2Ih2Je.js → BlurText.stories-oSn5_w7h.js} +2 -2
- package/storybook-static/assets/BooleansHeatmap-C8cFXa7K.css +1 -0
- package/storybook-static/assets/BooleansHeatmap.stories-CHoCYK4N.js +63 -0
- package/storybook-static/assets/{BorderGlow.stories-CUxbrsvW.js → BorderGlow.stories-D-vgIU3S.js} +1 -1
- package/storybook-static/assets/{BubbleMenu.stories-DuVDLBsV.js → BubbleMenu.stories-DcWoqA7_.js} +1 -1
- package/storybook-static/assets/{Button-CQGdvhpN.js → Button-DgpqJWgD.js} +1 -1
- package/storybook-static/assets/{Button.stories-D8Xx3I9p.js → Button.stories-TQXKQagp.js} +2 -2
- package/storybook-static/assets/Calendar-BZCyXxvF.css +1 -0
- package/storybook-static/assets/Calendar.stories-D5CKBagI.js +321 -0
- package/storybook-static/assets/{Card-DNp-cUnt.js → Card-Bu54h8gN.js} +1 -1
- package/storybook-static/assets/{Card.stories-D1f1NTVU.js → Card.stories-Dw2bPvLo.js} +1 -1
- package/storybook-static/assets/{CardNav.stories-Cd4zEw8p.js → CardNav.stories-CnbwwAde.js} +1 -1
- package/storybook-static/assets/{Carousel.stories-BxbGwXE5.js → Carousel.stories-ChBLLqBg.js} +2 -2
- package/storybook-static/assets/{Checkbox-Dw8W2w74.js → Checkbox-Duyafa-Y.js} +1 -1
- package/storybook-static/assets/Checkbox.stories-Co7IxmK1.js +55 -0
- package/storybook-static/assets/{ChromaGrid.stories-DBHYiDPV.js → ChromaGrid.stories-68ukohGs.js} +1 -1
- package/storybook-static/assets/{CircularGallery.stories-TJN6o_RG.js → CircularGallery.stories-CV4iXVIX.js} +2 -2
- package/storybook-static/assets/{CircularText.stories-rNjRUNn2.js → CircularText.stories-DqYHtbPW.js} +1 -1
- package/storybook-static/assets/{ClickSpark.stories-BfqByoGe.js → ClickSpark.stories-DvAOxLjs.js} +1 -1
- package/storybook-static/assets/{ColorBends.stories-IEMOWAyf.js → ColorBends.stories-Dm4nxTTN.js} +2 -2
- package/storybook-static/assets/{CountUp.stories-DXPrKAQb.js → CountUp.stories-DTaL8Yfy.js} +1 -1
- package/storybook-static/assets/{Counter.stories-DMdecsw_.js → Counter.stories-Bf_2Js0l.js} +2 -2
- package/storybook-static/assets/{Crosshair.stories-CYzDxRSn.js → Crosshair.stories-DJjjCcED.js} +2 -2
- package/storybook-static/assets/{Cubes.stories-Drq4ULo3.js → Cubes.stories-Qh3JqlQW.js} +1 -1
- package/storybook-static/assets/{CurvedLoop.stories-C9GMKnIw.js → CurvedLoop.stories-BvyrCuM7.js} +1 -1
- package/storybook-static/assets/{DarkVeil.stories-BtLNfEH8.js → DarkVeil.stories-BVY870pm.js} +2 -2
- package/storybook-static/assets/{DateInput-CW4PsZAQ.js → DateInput-DfGES3te.js} +2 -2
- package/storybook-static/assets/DateInput-Dhcb9x13.css +1 -0
- package/storybook-static/assets/DateInput.stories-BXF8Ttde.js +51 -0
- package/storybook-static/assets/{DecayCard.stories-CAU_wTc7.js → DecayCard.stories-B0g2xWqX.js} +1 -1
- package/storybook-static/assets/{DecryptedText.stories-Dvba9C1V.js → DecryptedText.stories-fqDZfjv8.js} +1 -1
- package/storybook-static/assets/{Dither.stories-B5KfMprl.js → Dither.stories-B4N3Z5sW.js} +2 -2
- package/storybook-static/assets/{Dock.stories-oyQGRzlM.js → Dock.stories-f_YKz-pl.js} +1 -1
- package/storybook-static/assets/EditFAB.stories-LhVUDgtx.js +233 -0
- package/storybook-static/assets/{EvilEye.stories-C1820-DG.js → EvilEye.stories-BtBvvs31.js} +2 -2
- package/storybook-static/assets/{FadeContent.stories-B4z_JRy9.js → FadeContent.stories-oNqKrfSe.js} +1 -1
- package/storybook-static/assets/{FaultyTerminal.stories-DmkguJql.js → FaultyTerminal.stories-7nV4DvrW.js} +2 -2
- package/storybook-static/assets/{Fbo-CTQm-4Bw.js → Fbo-Clk04E0N.js} +1 -1
- package/storybook-static/assets/{FloatingLines.stories-CQvqKSpH.js → FloatingLines.stories-DgxhGl_b.js} +2 -2
- package/storybook-static/assets/{FlowingMenu.stories-DmOspv0B.js → FlowingMenu.stories-C5dfG25U.js} +1 -1
- package/storybook-static/assets/{FluidGlass.stories-CZSqxrNt.js → FluidGlass.stories-DGLlp1x1.js} +2 -2
- package/storybook-static/assets/{Folder.stories-7vb52Lfi.js → Folder.stories-BJGdA6Qb.js} +1 -1
- package/storybook-static/assets/{FuzzyText.stories-BdXN4VK1.js → FuzzyText.stories-DygRT6bB.js} +1 -1
- package/storybook-static/assets/{Galaxy.stories-BhT1GZh5.js → Galaxy.stories-BU6XCHeu.js} +2 -2
- package/storybook-static/assets/{GhostCursor.stories-DkXqCjE9.js → GhostCursor.stories-D_HIFPUl.js} +2 -2
- package/storybook-static/assets/{GlareHover.stories-CznX3yTV.js → GlareHover.stories-D5_-xnyP.js} +1 -1
- package/storybook-static/assets/{GlassSurface.stories-BnwwYK95.js → GlassSurface.stories-CrZqAGRq.js} +2 -2
- package/storybook-static/assets/{GlitchText.stories-CVcTBUVS.js → GlitchText.stories-BRqI-kBX.js} +2 -2
- package/storybook-static/assets/{GooeyNav.stories-C0abTHBc.js → GooeyNav.stories-DjR0-Th2.js} +1 -1
- package/storybook-static/assets/{GradientBlinds.stories-CpSguKtv.js → GradientBlinds.stories-CiIDtPz3.js} +2 -2
- package/storybook-static/assets/{GradientText.stories-B4hMx13h.js → GradientText.stories-pLA_An71.js} +1 -1
- package/storybook-static/assets/{Grainient.stories-5EakpvU2.js → Grainient.stories-BthRrRMd.js} +2 -2
- package/storybook-static/assets/{GridMotion.stories-Bm3DD7cb.js → GridMotion.stories-BSwjL8IE.js} +1 -1
- package/storybook-static/assets/ImageSlideshow.stories-BYAQMHlZ.js +108 -0
- package/storybook-static/assets/{Iridescence.stories-Cykk3hHZ.js → Iridescence.stories-ChHTH2TM.js} +2 -2
- package/storybook-static/assets/{LaserFlow.stories-CfiM4ZZ5.js → LaserFlow.stories-DlDx8Vr8.js} +2 -2
- package/storybook-static/assets/{LetterGlitch.stories-BXb7iSeX.js → LetterGlitch.stories-C-S2SRjU.js} +1 -1
- package/storybook-static/assets/{LightPillar.stories-CwI-8_BF.js → LightPillar.stories-D0PF-h7T.js} +3 -3
- package/storybook-static/assets/{LightRays.stories-BIIfv6Ky.js → LightRays.stories-Cbkl7wuP.js} +2 -2
- package/storybook-static/assets/{Lightning.stories-B8GNkzSN.js → Lightning.stories-BUs-gwYj.js} +2 -2
- package/storybook-static/assets/{LineWaves.stories-CjxdD_yt.js → LineWaves.stories-D2GXzteP.js} +2 -2
- package/storybook-static/assets/{LiquidChrome.stories-G7bVFJM9.js → LiquidChrome.stories-CtDp7th1.js} +2 -2
- package/storybook-static/assets/{LiquidEther.stories-C8n27zuA.js → LiquidEther.stories-DM2n5oEm.js} +2 -2
- package/storybook-static/assets/{LoadingSpinner-Br8TYFlF.js → LoadingSpinner-DaUSIVPY.js} +1 -1
- package/storybook-static/assets/LoadingSpinner.stories-Cx4_nNAf.js +21 -0
- package/storybook-static/assets/{MagicRings.stories-D50m_2UF.js → MagicRings.stories-CZt-cHcL.js} +2 -2
- package/storybook-static/assets/{Magnet.stories-BP9fjpzP.js → Magnet.stories-B6js1VeO.js} +1 -1
- package/storybook-static/assets/{MagnetLines.stories-DvbytV0Y.js → MagnetLines.stories-BKQ9YC_E.js} +1 -1
- package/storybook-static/assets/{Masonry.stories-xXYQw2uD.js → Masonry.stories-BGkTkNUa.js} +1 -1
- package/storybook-static/assets/{MetaBalls.stories-DKD3gVUH.js → MetaBalls.stories-Cao6Tqjg.js} +2 -2
- package/storybook-static/assets/{MetallicPaint.stories-Bz-uS-L_.js → MetallicPaint.stories-DF9qb3W_.js} +2 -2
- package/storybook-static/assets/MoodChart-ba3aY_qF.css +1 -0
- package/storybook-static/assets/MoodChart.stories-AGxwnR6s.js +40 -0
- package/storybook-static/assets/{MotionConfigContext-D5hZdVGx.js → MotionConfigContext-BCa1jVYq.js} +1 -1
- package/storybook-static/assets/Navbar-CH6O1IzY.css +1 -0
- package/storybook-static/assets/Navbar.stories-CFHb1c22.js +186 -0
- package/storybook-static/assets/{Noise.stories-D6C6-k8-.js → Noise.stories-ConXbyqm.js} +2 -2
- package/storybook-static/assets/{NumberStepper--0cJcLNZ.js → NumberStepper-DH9y3k8b.js} +1 -1
- package/storybook-static/assets/NumberStepper.stories-PMwPqbsn.js +88 -0
- package/storybook-static/assets/{Orb.stories-CS__2PJW.js → Orb.stories-DcXSWhV1.js} +2 -2
- package/storybook-static/assets/{OrbitImages.stories-CcaelcY5.js → OrbitImages.stories-Dk417qKA.js} +1 -1
- package/storybook-static/assets/PieChart-DXPBsaZR.css +1 -0
- package/storybook-static/assets/PieChart.stories-6sgfe6Xk.js +91 -0
- package/storybook-static/assets/{PixelBlast.stories-CyK8BxPq.js → PixelBlast.stories-_cBuognT.js} +2 -2
- package/storybook-static/assets/{PixelCard.stories-D_Og1Eve.js → PixelCard.stories-D_EZOUox.js} +1 -1
- package/storybook-static/assets/{PixelSnow.stories-CoCZucVV.js → PixelSnow.stories-DcD7737G.js} +2 -2
- package/storybook-static/assets/{PixelTransition.stories-DmVJ4jdu.js → PixelTransition.stories-BwNcUv5J.js} +1 -1
- package/storybook-static/assets/{Plasma.stories-DUqrW-qq.js → Plasma.stories-BLolMCfR.js} +2 -2
- package/storybook-static/assets/{Prism.stories-DWdVDcBG.js → Prism.stories-CG2_KGsq.js} +2 -2
- package/storybook-static/assets/{PrismaticBurst.stories-BEVYTjXo.js → PrismaticBurst.stories-DzS--Ffu.js} +2 -2
- package/storybook-static/assets/{ProfileCard.stories-CAoKQpAZ.js → ProfileCard.stories-vI_ispYe.js} +1 -1
- package/storybook-static/assets/QuantifiableHabitsChart-BiMp7Kkq.css +1 -0
- package/storybook-static/assets/{QuantifiableHabitsChart.stories-CMexb5Ij.js → QuantifiableHabitsChart.stories-D5yeGCZ5.js} +2 -2
- package/storybook-static/assets/{Radar.stories-Dcjnm9Bu.js → Radar.stories-DLv_hY9T.js} +2 -2
- package/storybook-static/assets/{Ribbons.stories-Cs3Eg2Gz.js → Ribbons.stories-4BbVINtW.js} +4 -4
- package/storybook-static/assets/{RippleGrid.stories-QV9Doq9P.js → RippleGrid.stories-CFh8tigy.js} +2 -2
- package/storybook-static/assets/{RotatingText.stories-DkntoAXJ.js → RotatingText.stories-AM4GcpU2.js} +2 -2
- package/storybook-static/assets/{ScrollFloat.stories-BaX43Ike.js → ScrollFloat.stories-Ct_ZkL7k.js} +1 -1
- package/storybook-static/assets/{ScrollReveal.stories-C2IWpLpI.js → ScrollReveal.stories-B7fcgLZ3.js} +1 -1
- package/storybook-static/assets/{ScrollVelocity.stories-LaYJ5WQN.js → ScrollVelocity.stories-BRDv3Fdk.js} +1 -1
- package/storybook-static/assets/SearchBar.stories-Dnmegbak.js +64 -0
- package/storybook-static/assets/{SearchableDropdown-4HgWY0Ck.js → SearchableDropdown-BtIsuxmT.js} +1 -1
- package/storybook-static/assets/SearchableDropdown.stories-DVub17TN.js +44 -0
- package/storybook-static/assets/{SelectInput-DvSeeIw5.js → SelectInput-C0kBLYgX.js} +1 -1
- package/storybook-static/assets/SelectInput.stories-HoF32-Km.js +94 -0
- package/storybook-static/assets/{ShapeBlur.stories-ZQV0yHkn.js → ShapeBlur.stories-C3RyLvBh.js} +2 -2
- package/storybook-static/assets/{ShapeGrid.stories-G_tZAcp9.js → ShapeGrid.stories-ltmu466o.js} +1 -1
- package/storybook-static/assets/{ShinyText.stories-C6BrLI0x.js → ShinyText.stories-JO2F4CpJ.js} +1 -1
- package/storybook-static/assets/{Silk.stories-BpsR4txJ.js → Silk.stories-CUzWiwqP.js} +2 -2
- package/storybook-static/assets/SleepChart-CjpdWR_T.css +1 -0
- package/storybook-static/assets/SleepChart.stories-YvCzf0BI.js +58 -0
- package/storybook-static/assets/Slider-BaDHm9m3.css +1 -0
- package/storybook-static/assets/{Slider-3iog5_du.js → Slider-CI9mXQSu.js} +1 -1
- package/storybook-static/assets/{Slider.stories-C8eUZ7Ne.js → Slider.stories-DQYlBjGq.js} +1 -1
- package/storybook-static/assets/{SoftAurora.stories--Rcyqxiu.js → SoftAurora.stories-ubq_KV8Q.js} +2 -2
- package/storybook-static/assets/{SoundDemo.stories-DvhKS2Fi.js → SoundDemo.stories-Cie-leKw.js} +1 -1
- package/storybook-static/assets/{SplashCursor.stories-FzRIUaX9.js → SplashCursor.stories-Clea3dMy.js} +2 -2
- package/storybook-static/assets/{SpotlightCard.stories-CifqsSUc.js → SpotlightCard.stories-BWv0AuTI.js} +1 -1
- package/storybook-static/assets/{Stack.stories-Dq82x0TG.js → Stack.stories-DxVGTJ6l.js} +1 -1
- package/storybook-static/assets/{StaggeredMenu.stories-CsiTDJGG.js → StaggeredMenu.stories-1UB8ravq.js} +1 -1
- package/storybook-static/assets/{StarBorder.stories-Ba14_TPk.js → StarBorder.stories-DiSAqN3r.js} +2 -2
- package/storybook-static/assets/{SunburstChart.stories-fREzDXM9.js → SunburstChart.stories-DLjQA_I1.js} +1 -1
- package/storybook-static/assets/Table-BFjXRRk3.css +1 -0
- package/storybook-static/assets/{Table.stories-CXsQAQrR.js → Table.stories-wQGb96WC.js} +6 -6
- package/storybook-static/assets/Tabs-CDVjuS9_.css +1 -0
- package/storybook-static/assets/{Tabs.stories-HeiG8gYN.js → Tabs.stories-jkioQ4xt.js} +4 -4
- package/storybook-static/assets/{TargetCursor.stories-B16pWZaP.js → TargetCursor.stories-B4ACbrmW.js} +1 -1
- package/storybook-static/assets/{TextArea-DKx3k6hV.js → TextArea-DN6IYITs.js} +1 -1
- package/storybook-static/assets/TextArea.stories-CwLLZFoD.js +118 -0
- package/storybook-static/assets/{TextCursor.stories-CY2eIn6Z.js → TextCursor.stories-NORQhkfy.js} +1 -1
- package/storybook-static/assets/TextInput-6V0mlIuS.css +1 -0
- package/storybook-static/assets/TextInput-CLgIGUn3.js +28 -0
- package/storybook-static/assets/TextInput.stories-BNooOWA2.js +89 -0
- package/storybook-static/assets/{TextPressure.stories-sH-cgdL2.js → TextPressure.stories-BaCAyBD4.js} +2 -2
- package/storybook-static/assets/{TextType.stories-B7Oy3P9u.js → TextType.stories-DG4mQ3HF.js} +1 -1
- package/storybook-static/assets/ThemeSwitcher.stories-slxIamHU.js +47 -0
- package/storybook-static/assets/{Threads.stories-e52ErKbM.js → Threads.stories-Rsg8lRsX.js} +2 -2
- package/storybook-static/assets/TimeInput-BT44V2P0.css +1 -0
- package/storybook-static/assets/TimeInput.stories-CaO8_PY2.js +13 -0
- package/storybook-static/assets/{Toggle-BntWdyUe.js → Toggle-CTTN-13k.js} +1 -1
- package/storybook-static/assets/Toggle.stories-DrNYDjFB.js +163 -0
- package/storybook-static/assets/{ToggleButton-BQqJdlB_.js → ToggleButton-CXK855yx.js} +1 -1
- package/storybook-static/assets/ToggleButton.stories-DNsNH9vH.js +103 -0
- package/storybook-static/assets/{TrueFocus.stories-wm4VXWCk.js → TrueFocus.stories-zG6Ml8RP.js} +1 -1
- package/storybook-static/assets/{VariableProximity.stories-BNSYs_rC.js → VariableProximity.stories-CMZW-Tov.js} +1 -1
- package/storybook-static/assets/{Waves.stories-Ce2ZJFsV.js → Waves.stories-CscXTp_S.js} +1 -1
- package/storybook-static/assets/{check-Cty-Z1Ib.js → check-DLeHG_Da.js} +1 -1
- package/storybook-static/assets/{chevron-down-OhqRl4eJ.js → chevron-down-Ciks5pXx.js} +1 -1
- package/storybook-static/assets/{chevron-right-CZm4bArI.js → chevron-right-DjeluSA0.js} +1 -1
- package/storybook-static/assets/client-D1KVnN68.js +1 -0
- package/storybook-static/assets/{createLucideIcon-BNUG5osq.js → createLucideIcon-dvowvj4F.js} +1 -1
- package/storybook-static/assets/{folder-BjriMpXc.js → folder-CCqkDvFG.js} +1 -1
- package/storybook-static/assets/{iconBase-DmcmY1l-.js → iconBase-nrk1zV8Q.js} +1 -1
- package/storybook-static/assets/iframe-CU5nRRrn.css +1 -0
- package/storybook-static/assets/{iframe-B8pH-Lvr.js → iframe-Cw8dCV4Z.js} +180 -181
- package/storybook-static/assets/{index-PY_vM88c.js → index-A7l1uA6_.js} +6 -6
- package/storybook-static/assets/{index-BN99WpBo.js → index-Bm5msOcI.js} +1 -1
- package/storybook-static/assets/{index-DBfrIdYd.js → index-CzApopWo.js} +1 -1
- package/storybook-static/assets/{proxy-BA3VZtN5.js → proxy-p8L3T_Zy.js} +1 -1
- package/storybook-static/assets/{react-18-7dGub68c.js → react-18-D7YhBYbX.js} +1 -1
- package/storybook-static/assets/{react-three-fiber.esm-DI-wNJmP.js → react-three-fiber.esm-BnMrba87.js} +1 -1
- package/storybook-static/assets/{search-2YqBkJlG.js → search-7V6DOf2z.js} +1 -1
- package/storybook-static/assets/{settings-DvzICcFU.js → settings-B8s5hJGs.js} +1 -1
- package/storybook-static/assets/{sun-DgDhCM_S.js → sun-5V6ee2LJ.js} +1 -1
- package/storybook-static/assets/{trash-2-BwI5jvsn.js → trash-2-DeQvYdO7.js} +1 -1
- package/storybook-static/assets/{use-animation-frame-CF42h0i5.js → use-animation-frame-DovyG_Es.js} +1 -1
- package/storybook-static/assets/{use-in-view-Zn8evg3J.js → use-in-view-Dv3LTdsl.js} +1 -1
- package/storybook-static/assets/{use-motion-value--XhiA2Gt.js → use-motion-value-BVm7csqA.js} +1 -1
- package/storybook-static/assets/{use-spring-CrWzlBMd.js → use-spring-BkrdNVnG.js} +1 -1
- package/storybook-static/assets/{use-transform-vyDqMhf-.js → use-transform-CQNghMvr.js} +1 -1
- package/storybook-static/assets/{useSound-Bk2W5gkV.js → useSound-D23BsIr4.js} +1 -1
- package/storybook-static/assets/{users-aNPxMiig.js → users-R6T-yLyH.js} +1 -1
- package/storybook-static/assets/{x-BC8LCdn9.js → x-CypMgsiv.js} +1 -1
- package/storybook-static/iframe.html +3 -3
- package/storybook-static/index.html +5 -19
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/addon-visual-tests-assets/visual-test-illustration.mp4 +0 -0
- package/storybook-static/assets/ArrayInput.stories-Cshz2s-a.js +0 -232
- package/storybook-static/assets/BooleansHeatmap-BV4VTyo6.css +0 -1
- package/storybook-static/assets/BooleansHeatmap.stories-CpNxqSED.js +0 -123
- package/storybook-static/assets/Calendar-tbpzwSIm.css +0 -1
- package/storybook-static/assets/Calendar.stories-Cx2JEddO.js +0 -229
- package/storybook-static/assets/Checkbox.stories-BwsnN3CP.js +0 -83
- package/storybook-static/assets/Color-AVL7NMMY-CoWQkAiP.js +0 -1
- package/storybook-static/assets/DateInput-C4-Rlnpy.css +0 -1
- package/storybook-static/assets/DateInput.stories-d46zYiZA.js +0 -119
- package/storybook-static/assets/DocsRenderer-PQXLIZUC-C2AYT361.js +0 -1243
- package/storybook-static/assets/EditFAB.stories-DvtpW34v.js +0 -378
- package/storybook-static/assets/ImageSlideshow.stories-BasuECRV.js +0 -385
- package/storybook-static/assets/LoadingSpinner.stories-Dj0bMFhR.js +0 -169
- package/storybook-static/assets/MoodChart-2hr_Y2GI.css +0 -1
- package/storybook-static/assets/MoodChart.stories-Bk0jtB4g.js +0 -40
- package/storybook-static/assets/Navbar-BPWxCB-U.css +0 -1
- package/storybook-static/assets/Navbar.stories-Dos3kovt.js +0 -320
- package/storybook-static/assets/NumberStepper.stories-BvFwBEjt.js +0 -436
- package/storybook-static/assets/PieChart-OfDGlJ4g.css +0 -1
- package/storybook-static/assets/PieChart.stories-XZqxh_GW.js +0 -199
- package/storybook-static/assets/QuantifiableHabitsChart-Bam6n9X_.css +0 -1
- package/storybook-static/assets/SearchBar.stories-CGaj__zF.js +0 -169
- package/storybook-static/assets/SearchableDropdown.stories-CfeFR5Rk.js +0 -282
- package/storybook-static/assets/SelectInput.stories-DByYKCGI.js +0 -129
- package/storybook-static/assets/SleepChart-DBRb08s_.css +0 -1
- package/storybook-static/assets/SleepChart.stories-DcoBwiEm.js +0 -58
- package/storybook-static/assets/Slider-Bq7zObwV.css +0 -1
- package/storybook-static/assets/Table-DnhtoClE.css +0 -1
- package/storybook-static/assets/Tabs-D5ZPN7MM.css +0 -1
- package/storybook-static/assets/TextArea.stories-Bpqlv7j5.js +0 -155
- package/storybook-static/assets/TextInput-BjVJQEYN.css +0 -1
- package/storybook-static/assets/TextInput-CLyTHgK9.js +0 -28
- package/storybook-static/assets/TextInput.stories-BP1LSkLG.js +0 -203
- package/storybook-static/assets/ThemeSwitcher.stories-Bj0YQKM5.js +0 -62
- package/storybook-static/assets/TimeInput-C3enPYoV.css +0 -1
- package/storybook-static/assets/TimeInput.stories-Cd28zwwR.js +0 -55
- package/storybook-static/assets/Toggle.stories-DtqFmh3E.js +0 -199
- package/storybook-static/assets/ToggleButton.stories-DkN_4qpp.js +0 -163
- package/storybook-static/assets/client-0pKYCVHx.js +0 -1
- package/storybook-static/assets/iframe-B7RIyArP.css +0 -1
- package/storybook-static/assets/index-bi5z6E3I.js +0 -1
- package/storybook-static/assets/layout-grid-TssXYNzv.js +0 -6
- package/storybook-static/sb-addons/chromatic-com-storybook-4/manager-bundle.js +0 -356
- package/storybook-static/sb-addons/chromatic-com-storybook-4/manager-bundle.js.LEGAL.txt +0 -40
- package/storybook-static/sb-addons/docs-2/manager-bundle.js +0 -151
- package/storybook-static/sb-addons/onboarding-1/manager-bundle.js +0 -127
- /package/storybook-static/sb-addons/{links-3 → links-1}/manager-bundle.js +0 -0
- /package/storybook-static/sb-addons/{storybook-5 → storybook-2}/manager-bundle.js +0 -0
package/storybook-static/assets/{PixelCard.stories-D_Og1Eve.js → PixelCard.stories-D_EZOUox.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as l,j as V}from"./iframe-
|
|
1
|
+
import{r as l,j as V}from"./iframe-Cw8dCV4Z.js";import"./preload-helper-C1FmrZbK.js";const q={"pixel-canvas":"_pixel-canvas_wo94u_1","pixel-card":"_pixel-card_wo94u_7"};class J{constructor(t,u,p,x,i,y,n){this.width=t.width,this.height=t.height,this.ctx=u,this.x=p,this.y=x,this.color=i,this.speed=this.getRandomValue(.1,.9)*y,this.size=0,this.sizeStep=Math.random()*.4,this.minSize=.5,this.maxSizeInteger=2,this.maxSize=this.getRandomValue(this.minSize,this.maxSizeInteger),this.delay=n,this.counter=0,this.counterStep=Math.random()*4+(this.width+this.height)*.01,this.isIdle=!1,this.isReverse=!1,this.isShimmer=!1}getRandomValue(t,u){return Math.random()*(u-t)+t}draw(){const t=this.maxSizeInteger*.5-this.size*.5;this.ctx.fillStyle=this.color,this.ctx.fillRect(this.x+t,this.y+t,this.size,this.size)}appear(){if(this.isIdle=!1,this.counter<=this.delay){this.counter+=this.counterStep;return}this.size>=this.maxSize&&(this.isShimmer=!0),this.isShimmer?this.shimmer():this.size+=this.sizeStep,this.draw()}disappear(){if(this.isShimmer=!1,this.counter=0,this.size<=0){this.isIdle=!0;return}else this.size-=.1;this.draw()}shimmer(){this.size>=this.maxSize?this.isReverse=!0:this.size<=this.minSize&&(this.isReverse=!1),this.isReverse?this.size-=this.speed:this.size+=this.speed}}function K(m,t){const i=parseInt(m,10);return i<=0||t?0:i>=100?100*.001:i*.001}const T={default:{activeColor:null,gap:5,speed:35,colors:"#f8fafc,#f1f5f9,#cbd5e1",noFocus:!1},blue:{activeColor:"#e0f2fe",gap:10,speed:25,colors:"#e0f2fe,#7dd3fc,#0ea5e9",noFocus:!1},yellow:{activeColor:"#fef08a",gap:3,speed:20,colors:"#fef08a,#fde047,#eab308",noFocus:!1},pink:{activeColor:"#fecdd3",gap:6,speed:80,colors:"#fecdd3,#fda4af,#e11d48",noFocus:!0}};function O({variant:m="default",gap:t,speed:u,colors:p,noFocus:x,className:i="",children:y}){const n=l.useRef(null),s=l.useRef(null),I=l.useRef([]),h=l.useRef(null),F=l.useRef(performance.now()),M=l.useRef(window.matchMedia("(prefers-reduced-motion: reduce)").matches).current,g=T[m]||T.default,C=t??g.gap,A=u??g.speed,_=p??g.colors,v=x??g.noFocus,b=()=>{if(!n.current||!s.current)return;const e=n.current.getBoundingClientRect(),a=Math.floor(e.width),o=Math.floor(e.height),z=s.current.getContext("2d");s.current.width=a,s.current.height=o,s.current.style.width=`${a}px`,s.current.style.height=`${o}px`;const d=_.split(","),f=[];for(let c=0;c<a;c+=parseInt(C,10))for(let r=0;r<o;r+=parseInt(C,10)){const S=d[Math.floor(Math.random()*d.length)],E=c-a/2,N=r-o/2,G=Math.sqrt(E*E+N*N),L=M?0:G;f.push(new J(s.current,z,c,r,S,K(A,M),L))}I.current=f},P=e=>{var c;h.current=requestAnimationFrame(()=>P(e));const a=performance.now(),o=a-F.current,z=1e3/60;if(o<z)return;F.current=a-o%z;const d=(c=s.current)==null?void 0:c.getContext("2d");if(!d||!s.current)return;d.clearRect(0,0,s.current.width,s.current.height);let f=!0;for(let r=0;r<I.current.length;r++){const S=I.current[r];S[e](),S.isIdle||(f=!1)}f&&cancelAnimationFrame(h.current)},R=e=>{cancelAnimationFrame(h.current),h.current=requestAnimationFrame(()=>P(e))},D=()=>R("appear"),H=()=>R("disappear"),W=e=>{e.currentTarget.contains(e.relatedTarget)||R("appear")},k=e=>{e.currentTarget.contains(e.relatedTarget)||R("disappear")};return l.useEffect(()=>{b();const e=new ResizeObserver(()=>{b()});return n.current&&e.observe(n.current),()=>{e.disconnect(),cancelAnimationFrame(h.current)}},[C,A,_,v]),V.jsxs("div",{ref:n,className:`${q["pixel-card"]} ${i}`,onMouseEnter:D,onMouseLeave:H,onFocus:v?void 0:W,onBlur:v?void 0:k,tabIndex:v?-1:0,children:[V.jsx("canvas",{className:`${q["pixel-canvas"]}`,ref:s}),y]})}O.__docgenInfo={description:"",methods:[],displayName:"PixelCard",props:{variant:{defaultValue:{value:"'default'",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1}}};const X={title:"ReactBits/Components/PixelCard",component:O,parameters:{layout:"fullscreen"}},w={args:{variant:"default",children:"Hello World"}};var $,j,B;w.parameters={...w.parameters,docs:{...($=w.parameters)==null?void 0:$.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
variant: 'default',
|
|
4
4
|
children: 'Hello World'
|
package/storybook-static/assets/{PixelSnow.stories-CoCZucVV.js → PixelSnow.stories-DcD7737G.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as t,j as B}from"./iframe-
|
|
1
|
+
import{r as t,j as B}from"./iframe-Cw8dCV4Z.js";import{n as K,e as O,S as T,a as U,W as X,i as G,d as H,q as W,M as Y}from"./three.module--_vTUKhS.js";import"./preload-helper-C1FmrZbK.js";const J={"pixel-snow-container":"_pixel-snow-container_udm6i_1"},L=`
|
|
2
2
|
void main() {
|
|
3
3
|
gl_Position = vec4(position, 1.0);
|
|
4
4
|
}
|
|
@@ -152,4 +152,4 @@ void main() {
|
|
|
152
152
|
|
|
153
153
|
gl_FragColor = vec4(0.0);
|
|
154
154
|
}
|
|
155
|
-
`;function _({color:V="#ffffff",flakeSize:c=.01,minFlakeSize:f=1.25,pixelResolution:d=200,speed:m=1.25,depthFade:v=8,farPlane:p=20,brightness:h=1,gamma:x=.4545,density:S=.3,variant:P="square",direction:R=125,className:M="",style:E={}}){const n=t.useRef(null),k=t.useRef(0),b=t.useRef(!0),y=t.useRef(null),l=t.useRef(null),r=t.useRef(null),w=t.useMemo(()=>P==="round"?1:P==="snowflake"?2:0,[P]),z=t.useMemo(()=>{const e=new K(V);return new O(e.r,e.g,e.b)},[V]),g=t.useCallback(()=>{r.current&&clearTimeout(r.current),r.current=window.setTimeout(()=>{const e=n.current,o=y.current,i=l.current;if(!e||!o||!i)return;const a=e.offsetWidth,s=e.offsetHeight;o.setSize(a,s),i.uniforms.uResolution.value.set(a,s)},100)},[]);return t.useEffect(()=>{const e=n.current;if(!e)return;const o=new IntersectionObserver(([i])=>{b.current=i.isIntersecting},{threshold:0});return o.observe(e),()=>o.disconnect()},[]),t.useEffect(()=>{const e=n.current;if(!e)return;const o=new T,i=new U(-1,1,1,-1,0,1),a=new X({antialias:!1,alpha:!0,premultipliedAlpha:!1,powerPreference:"high-performance",stencil:!1,depth:!1});a.setPixelRatio(Math.min(window.devicePixelRatio,2)),a.setSize(e.offsetWidth,e.offsetHeight),a.setClearColor(0,0),e.appendChild(a.domElement),y.current=a;const s=new G({vertexShader:L,fragmentShader:N,uniforms:{uTime:{value:0},uResolution:{value:new H(e.offsetWidth,e.offsetHeight)},uFlakeSize:{value:c},uMinFlakeSize:{value:f},uPixelResolution:{value:d},uSpeed:{value:m},uDepthFade:{value:v},uFarPlane:{value:p},uColor:{value:z.clone()},uBrightness:{value:h},uGamma:{value:x},uDensity:{value:S},uVariant:{value:w},uDirection:{value:R*Math.PI/180}},transparent:!0});l.current=s;const q=new W(2,2);o.add(new Y(q,s)),window.addEventListener("resize",g);const A=performance.now(),F=()=>{k.current=requestAnimationFrame(F),b.current&&(s.uniforms.uTime.value=(performance.now()-A)*.001,a.render(o,i))};return F(),()=>{cancelAnimationFrame(k.current),window.removeEventListener("resize",g),r.current&&clearTimeout(r.current),e.contains(a.domElement)&&e.removeChild(a.domElement),a.dispose(),a.forceContextLoss(),q.dispose(),s.dispose(),y.current=null,l.current=null}},[g]),t.useEffect(()=>{const e=l.current;e&&(e.uniforms.uFlakeSize.value=c,e.uniforms.uMinFlakeSize.value=f,e.uniforms.uPixelResolution.value=d,e.uniforms.uSpeed.value=m,e.uniforms.uDepthFade.value=v,e.uniforms.uFarPlane.value=p,e.uniforms.uBrightness.value=h,e.uniforms.uGamma.value=x,e.uniforms.uDensity.value=S,e.uniforms.uVariant.value=w,e.uniforms.uDirection.value=R*Math.PI/180,e.uniforms.uColor.value.copy(z))},[c,f,d,m,v,p,h,x,S,w,R,z]),B.jsx("div",{ref:n,className:`${J["pixel-snow-container"]} ${M}`,style:E})}_.__docgenInfo={description:"",methods:[],displayName:"PixelSnow",props:{color:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},flakeSize:{defaultValue:{value:"0.01",computed:!1},required:!1},minFlakeSize:{defaultValue:{value:"1.25",computed:!1},required:!1},pixelResolution:{defaultValue:{value:"200",computed:!1},required:!1},speed:{defaultValue:{value:"1.25",computed:!1},required:!1},depthFade:{defaultValue:{value:"8",computed:!1},required:!1},farPlane:{defaultValue:{value:"20",computed:!1},required:!1},brightness:{defaultValue:{value:"1",computed:!1},required:!1},gamma:{defaultValue:{value:"0.4545",computed:!1},required:!1},density:{defaultValue:{value:"0.3",computed:!1},required:!1},variant:{defaultValue:{value:"'square'",computed:!1},required:!1},direction:{defaultValue:{value:"125",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},style:{defaultValue:{value:"{}",computed:!1},required:!1}}};const Z={title:"ReactBits/Backgrounds/PixelSnow",component:_,parameters:{layout:"fullscreen"}
|
|
155
|
+
`;function _({color:V="#ffffff",flakeSize:c=.01,minFlakeSize:f=1.25,pixelResolution:d=200,speed:m=1.25,depthFade:v=8,farPlane:p=20,brightness:h=1,gamma:x=.4545,density:S=.3,variant:P="square",direction:R=125,className:M="",style:E={}}){const n=t.useRef(null),k=t.useRef(0),b=t.useRef(!0),y=t.useRef(null),l=t.useRef(null),r=t.useRef(null),w=t.useMemo(()=>P==="round"?1:P==="snowflake"?2:0,[P]),z=t.useMemo(()=>{const e=new K(V);return new O(e.r,e.g,e.b)},[V]),g=t.useCallback(()=>{r.current&&clearTimeout(r.current),r.current=window.setTimeout(()=>{const e=n.current,o=y.current,i=l.current;if(!e||!o||!i)return;const a=e.offsetWidth,s=e.offsetHeight;o.setSize(a,s),i.uniforms.uResolution.value.set(a,s)},100)},[]);return t.useEffect(()=>{const e=n.current;if(!e)return;const o=new IntersectionObserver(([i])=>{b.current=i.isIntersecting},{threshold:0});return o.observe(e),()=>o.disconnect()},[]),t.useEffect(()=>{const e=n.current;if(!e)return;const o=new T,i=new U(-1,1,1,-1,0,1),a=new X({antialias:!1,alpha:!0,premultipliedAlpha:!1,powerPreference:"high-performance",stencil:!1,depth:!1});a.setPixelRatio(Math.min(window.devicePixelRatio,2)),a.setSize(e.offsetWidth,e.offsetHeight),a.setClearColor(0,0),e.appendChild(a.domElement),y.current=a;const s=new G({vertexShader:L,fragmentShader:N,uniforms:{uTime:{value:0},uResolution:{value:new H(e.offsetWidth,e.offsetHeight)},uFlakeSize:{value:c},uMinFlakeSize:{value:f},uPixelResolution:{value:d},uSpeed:{value:m},uDepthFade:{value:v},uFarPlane:{value:p},uColor:{value:z.clone()},uBrightness:{value:h},uGamma:{value:x},uDensity:{value:S},uVariant:{value:w},uDirection:{value:R*Math.PI/180}},transparent:!0});l.current=s;const q=new W(2,2);o.add(new Y(q,s)),window.addEventListener("resize",g);const A=performance.now(),F=()=>{k.current=requestAnimationFrame(F),b.current&&(s.uniforms.uTime.value=(performance.now()-A)*.001,a.render(o,i))};return F(),()=>{cancelAnimationFrame(k.current),window.removeEventListener("resize",g),r.current&&clearTimeout(r.current),e.contains(a.domElement)&&e.removeChild(a.domElement),a.dispose(),a.forceContextLoss(),q.dispose(),s.dispose(),y.current=null,l.current=null}},[g]),t.useEffect(()=>{const e=l.current;e&&(e.uniforms.uFlakeSize.value=c,e.uniforms.uMinFlakeSize.value=f,e.uniforms.uPixelResolution.value=d,e.uniforms.uSpeed.value=m,e.uniforms.uDepthFade.value=v,e.uniforms.uFarPlane.value=p,e.uniforms.uBrightness.value=h,e.uniforms.uGamma.value=x,e.uniforms.uDensity.value=S,e.uniforms.uVariant.value=w,e.uniforms.uDirection.value=R*Math.PI/180,e.uniforms.uColor.value.copy(z))},[c,f,d,m,v,p,h,x,S,w,R,z]),B.jsx("div",{ref:n,className:`${J["pixel-snow-container"]} ${M}`,style:E})}_.__docgenInfo={description:"",methods:[],displayName:"PixelSnow",props:{color:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},flakeSize:{defaultValue:{value:"0.01",computed:!1},required:!1},minFlakeSize:{defaultValue:{value:"1.25",computed:!1},required:!1},pixelResolution:{defaultValue:{value:"200",computed:!1},required:!1},speed:{defaultValue:{value:"1.25",computed:!1},required:!1},depthFade:{defaultValue:{value:"8",computed:!1},required:!1},farPlane:{defaultValue:{value:"20",computed:!1},required:!1},brightness:{defaultValue:{value:"1",computed:!1},required:!1},gamma:{defaultValue:{value:"0.4545",computed:!1},required:!1},density:{defaultValue:{value:"0.3",computed:!1},required:!1},variant:{defaultValue:{value:"'square'",computed:!1},required:!1},direction:{defaultValue:{value:"125",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},style:{defaultValue:{value:"{}",computed:!1},required:!1}}};const Z={title:"ReactBits/Backgrounds/PixelSnow",component:_,parameters:{layout:"fullscreen"}},u={};var C,D,I;u.parameters={...u.parameters,docs:{...(C=u.parameters)==null?void 0:C.docs,source:{originalSource:"{}",...(I=(D=u.parameters)==null?void 0:D.docs)==null?void 0:I.source}}};const ee=["Default"];export{u as Default,ee as __namedExportsOrder,Z as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r,j as l}from"./iframe-
|
|
1
|
+
import{r,j as l}from"./iframe-Cw8dCV4Z.js";import{g as d}from"./index-C8pce-KX.js";import"./preload-helper-C1FmrZbK.js";const c={"pixelated-image-card":"_pixelated-image-card_12og9_1","pixelated-image-card__default":"_pixelated-image-card__default_12og9_12","pixelated-image-card__active":"_pixelated-image-card__active_12og9_13","pixelated-image-card__pixels":"_pixelated-image-card__pixels_12og9_14","pixelated-image-card__pixel":"_pixelated-image-card__pixel_12og9_14"};function E({firstContent:b,secondContent:F,gridSize:u=7,pixelColor:_="currentColor",animationStepDuration:m=.3,once:v=!1,aspectRatio:$="100%",className:q="",style:S={}}){const T=r.useRef(null),x=r.useRef(null),h=r.useRef(null),g=r.useRef(null),[i,I]=r.useState(!1),o="ontouchstart"in window||navigator.maxTouchPoints>0||window.matchMedia("(pointer: coarse)").matches;r.useEffect(()=>{const t=x.current;if(t){t.innerHTML="";for(let n=0;n<u;n++)for(let a=0;a<u;a++){const e=document.createElement("div");e.classList.add(c["pixelated-image-card__pixel"]),e.setAttribute("data-pixel",""),e.style.backgroundColor=_;const s=100/u;e.style.width=`${s}%`,e.style.height=`${s}%`,e.style.left=`${a*s}%`,e.style.top=`${n*s}%`,t.appendChild(e)}}},[u,_]);const f=t=>{I(t);const n=x.current,a=h.current;if(!n||!a)return;const e=n.querySelectorAll("[data-pixel]");if(!e.length)return;d.killTweensOf(e),g.current&&g.current.kill(),d.set(e,{display:"none"});const s=e.length,R=m/s;d.to(e,{display:"block",duration:0,stagger:{each:R,from:"random"}}),g.current=d.delayedCall(m,()=>{a.style.display=t?"block":"none",a.style.pointerEvents=t?"none":""}),d.to(e,{display:"none",duration:0,delay:m,stagger:{each:R,from:"random"}})},y=()=>{i||f(!0)},C=()=>{i&&!v&&f(!1)},V=()=>{i?i&&!v&&f(!1):f(!0)};return l.jsxs("div",{ref:T,className:`${c["pixelated-image-card"]} ${q}`,style:S,onMouseEnter:o?void 0:y,onMouseLeave:o?void 0:C,onClick:o?V:void 0,onFocus:o?void 0:y,onBlur:o?void 0:C,tabIndex:0,children:[l.jsx("div",{style:{paddingTop:$}}),l.jsx("div",{className:`${c["pixelated-image-card__default"]}`,"aria-hidden":i,children:b}),l.jsx("div",{className:`${c["pixelated-image-card__active"]}`,ref:h,"aria-hidden":!i,children:F}),l.jsx("div",{className:`${c["pixelated-image-card__pixels"]}`,ref:x})]})}E.__docgenInfo={description:"",methods:[],displayName:"PixelTransition",props:{gridSize:{defaultValue:{value:"7",computed:!1},required:!1},pixelColor:{defaultValue:{value:"'currentColor'",computed:!1},required:!1},animationStepDuration:{defaultValue:{value:"0.3",computed:!1},required:!1},once:{defaultValue:{value:"false",computed:!1},required:!1},aspectRatio:{defaultValue:{value:"'100%'",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},style:{defaultValue:{value:"{}",computed:!1},required:!1}}};const A={title:"ReactBits/Animations/PixelTransition",component:E,parameters:{layout:"fullscreen"}},p={args:{firstContent:l.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",background:"#1a1a2e",color:"#fff",fontSize:"2rem"},children:"Hover me"}),secondContent:l.jsx("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",background:"#5227FF",color:"#fff",fontSize:"2rem"},children:"Revealed!"}),gridSize:7,pixelColor:"#5227FF",aspectRatio:"100%"}};var j,k,w;p.parameters={...p.parameters,docs:{...(j=p.parameters)==null?void 0:j.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
firstContent: <div style={{
|
|
4
4
|
width: '100%',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as y,j as U}from"./iframe-
|
|
1
|
+
import{r as y,j as U}from"./iframe-Cw8dCV4Z.js";import{R as E,P as Q,M as j}from"./Mesh-CwXV3WjE.js";import{T as k}from"./Triangle-64ffRKNB.js";import"./preload-helper-C1FmrZbK.js";const L={"plasma-container":"_plasma-container_4c6hx_1"},N=n=>{const o=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(n);return o?[parseInt(o[1],16)/255,parseInt(o[2],16)/255,parseInt(o[3],16)/255]:[1,.5,.2]},$=`#version 300 es
|
|
2
2
|
precision highp float;
|
|
3
3
|
in vec2 position;
|
|
4
4
|
in vec2 uv;
|
|
@@ -66,7 +66,7 @@ void main() {
|
|
|
66
66
|
|
|
67
67
|
float alpha = length(rgb) * uOpacity;
|
|
68
68
|
fragColor = vec4(finalColor, alpha);
|
|
69
|
-
}`,O=({color:n="#ffffff",speed:o=1,direction:d="forward",scale:C=1,opacity:x=1,mouseInteractive:u=!0})=>{const a=y.useRef(null),f=y.useRef({x:0,y:0});return y.useEffect(()=>{if(!a.current)return;const t=a.current,q=n?1:0,_=n?N(n):[1,1,1],F=d==="reverse"?-1:1,v=new E({webgl:2,alpha:!0,antialias:!1,dpr:Math.min(window.devicePixelRatio||1,2)}),
|
|
69
|
+
}`,O=({color:n="#ffffff",speed:o=1,direction:d="forward",scale:C=1,opacity:x=1,mouseInteractive:u=!0})=>{const a=y.useRef(null),f=y.useRef({x:0,y:0});return y.useEffect(()=>{if(!a.current)return;const t=a.current,q=n?1:0,_=n?N(n):[1,1,1],F=d==="reverse"?-1:1,v=new E({webgl:2,alpha:!0,antialias:!1,dpr:Math.min(window.devicePixelRatio||1,2)}),i=v.gl,c=i.canvas;c.style.display="block",c.style.width="100%",c.style.height="100%",a.current.appendChild(c);const I=new k(i),s=new Q(i,{vertex:$,fragment:H,uniforms:{iTime:{value:0},iResolution:{value:new Float32Array([1,1])},uCustomColor:{value:new Float32Array(_)},uUseCustomColor:{value:q},uSpeed:{value:o*.4},uDirection:{value:F},uScale:{value:C},uOpacity:{value:x},uMouse:{value:new Float32Array([0,0])},uMouseInteractive:{value:u?1:0}}}),P=new j(i,{geometry:I,program:s}),w=r=>{if(!u)return;const e=a.current.getBoundingClientRect();f.current.x=r.clientX-e.left,f.current.y=r.clientY-e.top;const l=s.uniforms.uMouse.value;l[0]=f.current.x,l[1]=f.current.y};u&&t.addEventListener("mousemove",w);const b=()=>{const r=a.current.getBoundingClientRect(),e=Math.max(1,Math.floor(r.width)),l=Math.max(1,Math.floor(r.height));v.setSize(e,l);const m=s.uniforms.iResolution.value;m[0]=i.drawingBufferWidth,m[1]=i.drawingBufferHeight},M=new ResizeObserver(b);M.observe(t),b();let g=0;const V=performance.now(),R=r=>{let e=(r-V)*.001;if(d==="pingpong"){const m=e%10,A=Math.floor(e/10)%2===0,h=m/10,z=h*h*(3-2*h),B=A?z*10:(1-z)*10;s.uniforms.uDirection.value=1,s.uniforms.iTime.value=B}else s.uniforms.iTime.value=e;v.render({scene:P}),g=requestAnimationFrame(R)};return g=requestAnimationFrame(R),()=>{cancelAnimationFrame(g),M.disconnect(),u&&t&&t.removeEventListener("mousemove",w);try{t==null||t.removeChild(c)}catch{console.warn("Canvas already removed from container")}}},[n,o,d,C,x,u]),U.jsx("div",{ref:a,className:`${L["plasma-container"]}`})};O.__docgenInfo={description:"",methods:[],displayName:"Plasma",props:{color:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},speed:{defaultValue:{value:"1",computed:!1},required:!1},direction:{defaultValue:{value:"'forward'",computed:!1},required:!1},scale:{defaultValue:{value:"1",computed:!1},required:!1},opacity:{defaultValue:{value:"1",computed:!1},required:!1},mouseInteractive:{defaultValue:{value:"true",computed:!1},required:!1}}};const J={title:"ReactBits/Backgrounds/Plasma",component:O,parameters:{layout:"fullscreen"}},p={args:{color:"#ffffff",speed:1,direction:"forward",scale:1,opacity:1,mouseInteractive:!0}};var S,T,D;p.parameters={...p.parameters,docs:{...(S=p.parameters)==null?void 0:S.docs,source:{originalSource:`{
|
|
70
70
|
args: {
|
|
71
71
|
color: '#ffffff',
|
|
72
72
|
speed: 1,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as le,j as Ne}from"./iframe-
|
|
1
|
+
import{r as le,j as Ne}from"./iframe-Cw8dCV4Z.js";import{R as Ye,P as je,M as De}from"./Mesh-CwXV3WjE.js";import{T as Ge}from"./Triangle-64ffRKNB.js";import"./preload-helper-C1FmrZbK.js";const Xe={"prism-container":"_prism-container_sjqpx_1"},ce=({height:T=3.5,baseWidth:z=5.5,animationType:h="rotate",glow:W=1,offset:s={x:0,y:0},noise:U=.5,transparent:E=!0,scale:N=3.6,hueShift:Y=0,colorFrequency:j=1,hoverStrength:D=2,inertia:G=.05,bloom:X=1,suspendWhenOffscreen:P=!1,timeScale:Z=.5})=>{const k=le.useRef(null);return le.useEffect(()=>{const r=k.current;if(!r)return;const b=Math.max(.001,T),H=Math.max(.001,z)*.5,fe=Math.max(0,W),Q=Math.max(0,U),me=(s==null?void 0:s.x)??0,de=(s==null?void 0:s.y)??0,ve=E?1.5:1,I=Math.max(.001,N),he=Y||0,pe=Math.max(0,j||1),xe=Math.max(0,X||1),we=1,Me=1,Se=1,R=Math.max(0,Z||1),$=Math.max(0,D||1),J=Math.max(0,Math.min(1,G||.12)),_=Math.min(2,window.devicePixelRatio||1),A=new Ye({dpr:_,alpha:E,antialias:!1}),a=A.gl;a.disable(a.DEPTH_TEST),a.disable(a.CULL_FACE),a.disable(a.BLEND),Object.assign(a.canvas.style,{position:"absolute",inset:"0",width:"100%",height:"100%",display:"block"}),r.appendChild(a.canvas);const ge=`
|
|
2
2
|
attribute vec2 position;
|
|
3
3
|
void main() {
|
|
4
4
|
gl_Position = vec4(position, 0.0, 1.0);
|
|
@@ -118,4 +118,4 @@ import{r as le,j as Ne}from"./iframe-B8pH-Lvr.js";import{R as Ye,P as je,M as De
|
|
|
118
118
|
|
|
119
119
|
gl_FragColor = vec4(col, o.a);
|
|
120
120
|
}
|
|
121
|
-
`,Re=new Ge(a),F=new Float32Array(2),O=new Float32Array(2),i=new je(a,{vertex:ge,fragment:be,uniforms:{iResolution:{value:F},iTime:{value:0},uHeight:{value:b},uBaseHalf:{value:H},uUseBaseWobble:{value:1},uRot:{value:new Float32Array([1,0,0,0,1,0,0,0,1])},uGlow:{value:fe},uOffsetPx:{value:O},uNoise:{value:Q},uSaturation:{value:ve},uScale:{value:I},uHueShift:{value:he},uColorFreq:{value:pe},uBloom:{value:xe},uCenterShift:{value:b*.25},uInvBaseHalf:{value:1/H},uInvHeight:{value:1/b},uMinAxis:{value:Math.min(H,b)},uPxScale:{value:1/((a.drawingBufferHeight||1)*.1*I)},uTimeScale:{value:R}}}),Be=new De(a,{geometry:Re,program:i}),K=()=>{const e=r.clientWidth||1,o=r.clientHeight||1;A.setSize(e,o),F[0]=a.drawingBufferWidth,F[1]=a.drawingBufferHeight,O[0]=me*_,O[1]=de*_,i.uniforms.uPxScale.value=1/((a.drawingBufferHeight||1)*.1*I)},ee=new ResizeObserver(K);ee.observe(r),K();const l=new Float32Array(9),te=(e,o,n,t)=>{const c=Math.cos(e),f=Math.sin(e),m=Math.cos(o),v=Math.sin(o),M=Math.cos(n),g=Math.sin(n),Fe=c*M+f*v*g,Oe=-c*g+f*v*M,Ve=f*m,Le=m*g,Ce=m*M,Te=-v,ze=-f*M+c*v*g,We=f*g+c*v*M,Ue=c*m;return t[0]=Fe,t[1]=Le,t[2]=ze,t[3]=Oe,t[4]=Ce,t[5]=We,t[6]=Ve,t[7]=Te,t[8]=Ue,t},qe=Q<1e-6;let d=0;const ye=performance.now(),B=()=>{d||(d=requestAnimationFrame(se))},ae=()=>{d&&(cancelAnimationFrame(d),d=0)},S=()=>Math.random(),Ee=(.3+S()*.6)*we,Pe=(.2+S()*.7)*Me,He=(.1+S()*.5)*Se,Ie=S()*Math.PI*2,_e=S()*Math.PI*2;let p=0,x=0,w=0,V=0,L=0;const C=(e,o,n)=>e+(o-e)*n,u={x:0,y:0,inside:!0},Ae=e=>{const o=Math.max(1,window.innerWidth),n=Math.max(1,window.innerHeight),t=o*.5,c=n*.5,f=(e.clientX-t)/(o*.5),m=(e.clientY-c)/(n*.5);u.x=Math.max(-1,Math.min(1,f)),u.y=Math.max(-1,Math.min(1,m)),u.inside=!0},oe=()=>{u.inside=!1},ne=()=>{u.inside=!1};let q=null;h==="hover"?(q=e=>{Ae(e),B()},window.addEventListener("pointermove",q,{passive:!0}),window.addEventListener("mouseleave",oe),window.addEventListener("blur",ne),i.uniforms.uUseBaseWobble.value=0):h==="3drotate"?i.uniforms.uUseBaseWobble.value=0:i.uniforms.uUseBaseWobble.value=1;const se=e=>{const o=(e-ye)*.001;i.uniforms.iTime.value=o;let n=!0;if(h==="hover"){const t=.6*$,c=.6*$;V=(u.inside?-u.x:0)*c,L=(u.inside?u.y:0)*t;const f=p,m=x,v=w;p=C(f,V,J),x=C(m,L,J),w=C(v,0,.1),i.uniforms.uRot.value=te(p,x,w,l),qe&&Math.abs(p-V)<1e-4&&Math.abs(x-L)<1e-4&&Math.abs(w)<1e-4&&(n=!1)}else if(h==="3drotate"){const t=o*R;p=t*Pe,x=Math.sin(t*Ee+Ie)*.6,w=Math.sin(t*He+_e)*.5,i.uniforms.uRot.value=te(p,x,w,l),R<1e-6&&(n=!1)}else l[0]=1,l[1]=0,l[2]=0,l[3]=0,l[4]=1,l[5]=0,l[6]=0,l[7]=0,l[8]=1,i.uniforms.uRot.value=l,R<1e-6&&(n=!1);A.render({scene:Be}),n?d=requestAnimationFrame(se):d=0};if(P){const e=new IntersectionObserver(o=>{o.some(t=>t.isIntersecting)?B():ae()});e.observe(r),B(),r.__prismIO=e}else B();return()=>{if(ae(),ee.disconnect(),h==="hover"&&(q&&window.removeEventListener("pointermove",q),window.removeEventListener("mouseleave",oe),window.removeEventListener("blur",ne)),P){const e=r.__prismIO;e&&e.disconnect(),delete r.__prismIO}a.canvas.parentElement===r&&r.removeChild(a.canvas)}},[T,z,h,W,U,s==null?void 0:s.x,s==null?void 0:s.y,N,E,Y,j,Z,D,G,X,P]),Ne.jsx("div",{className:`${Xe["prism-container"]}`,ref:k})};ce.__docgenInfo={description:"",methods:[],displayName:"Prism",props:{height:{defaultValue:{value:"3.5",computed:!1},required:!1},baseWidth:{defaultValue:{value:"5.5",computed:!1},required:!1},animationType:{defaultValue:{value:"'rotate'",computed:!1},required:!1},glow:{defaultValue:{value:"1",computed:!1},required:!1},offset:{defaultValue:{value:"{ x: 0, y: 0 }",computed:!1},required:!1},noise:{defaultValue:{value:"0.5",computed:!1},required:!1},transparent:{defaultValue:{value:"true",computed:!1},required:!1},scale:{defaultValue:{value:"3.6",computed:!1},required:!1},hueShift:{defaultValue:{value:"0",computed:!1},required:!1},colorFrequency:{defaultValue:{value:"1",computed:!1},required:!1},hoverStrength:{defaultValue:{value:"2",computed:!1},required:!1},inertia:{defaultValue:{value:"0.05",computed:!1},required:!1},bloom:{defaultValue:{value:"1",computed:!1},required:!1},suspendWhenOffscreen:{defaultValue:{value:"false",computed:!1},required:!1},timeScale:{defaultValue:{value:"0.5",computed:!1},required:!1}}};const Ke={title:"ReactBits/Backgrounds/Prism",component:ce,parameters:{layout:"fullscreen"}
|
|
121
|
+
`,Re=new Ge(a),F=new Float32Array(2),O=new Float32Array(2),i=new je(a,{vertex:ge,fragment:be,uniforms:{iResolution:{value:F},iTime:{value:0},uHeight:{value:b},uBaseHalf:{value:H},uUseBaseWobble:{value:1},uRot:{value:new Float32Array([1,0,0,0,1,0,0,0,1])},uGlow:{value:fe},uOffsetPx:{value:O},uNoise:{value:Q},uSaturation:{value:ve},uScale:{value:I},uHueShift:{value:he},uColorFreq:{value:pe},uBloom:{value:xe},uCenterShift:{value:b*.25},uInvBaseHalf:{value:1/H},uInvHeight:{value:1/b},uMinAxis:{value:Math.min(H,b)},uPxScale:{value:1/((a.drawingBufferHeight||1)*.1*I)},uTimeScale:{value:R}}}),Be=new De(a,{geometry:Re,program:i}),K=()=>{const e=r.clientWidth||1,o=r.clientHeight||1;A.setSize(e,o),F[0]=a.drawingBufferWidth,F[1]=a.drawingBufferHeight,O[0]=me*_,O[1]=de*_,i.uniforms.uPxScale.value=1/((a.drawingBufferHeight||1)*.1*I)},ee=new ResizeObserver(K);ee.observe(r),K();const l=new Float32Array(9),te=(e,o,n,t)=>{const c=Math.cos(e),f=Math.sin(e),m=Math.cos(o),v=Math.sin(o),M=Math.cos(n),g=Math.sin(n),Fe=c*M+f*v*g,Oe=-c*g+f*v*M,Ve=f*m,Le=m*g,Ce=m*M,Te=-v,ze=-f*M+c*v*g,We=f*g+c*v*M,Ue=c*m;return t[0]=Fe,t[1]=Le,t[2]=ze,t[3]=Oe,t[4]=Ce,t[5]=We,t[6]=Ve,t[7]=Te,t[8]=Ue,t},qe=Q<1e-6;let d=0;const ye=performance.now(),B=()=>{d||(d=requestAnimationFrame(se))},ae=()=>{d&&(cancelAnimationFrame(d),d=0)},S=()=>Math.random(),Ee=(.3+S()*.6)*we,Pe=(.2+S()*.7)*Me,He=(.1+S()*.5)*Se,Ie=S()*Math.PI*2,_e=S()*Math.PI*2;let p=0,x=0,w=0,V=0,L=0;const C=(e,o,n)=>e+(o-e)*n,u={x:0,y:0,inside:!0},Ae=e=>{const o=Math.max(1,window.innerWidth),n=Math.max(1,window.innerHeight),t=o*.5,c=n*.5,f=(e.clientX-t)/(o*.5),m=(e.clientY-c)/(n*.5);u.x=Math.max(-1,Math.min(1,f)),u.y=Math.max(-1,Math.min(1,m)),u.inside=!0},oe=()=>{u.inside=!1},ne=()=>{u.inside=!1};let q=null;h==="hover"?(q=e=>{Ae(e),B()},window.addEventListener("pointermove",q,{passive:!0}),window.addEventListener("mouseleave",oe),window.addEventListener("blur",ne),i.uniforms.uUseBaseWobble.value=0):h==="3drotate"?i.uniforms.uUseBaseWobble.value=0:i.uniforms.uUseBaseWobble.value=1;const se=e=>{const o=(e-ye)*.001;i.uniforms.iTime.value=o;let n=!0;if(h==="hover"){const t=.6*$,c=.6*$;V=(u.inside?-u.x:0)*c,L=(u.inside?u.y:0)*t;const f=p,m=x,v=w;p=C(f,V,J),x=C(m,L,J),w=C(v,0,.1),i.uniforms.uRot.value=te(p,x,w,l),qe&&Math.abs(p-V)<1e-4&&Math.abs(x-L)<1e-4&&Math.abs(w)<1e-4&&(n=!1)}else if(h==="3drotate"){const t=o*R;p=t*Pe,x=Math.sin(t*Ee+Ie)*.6,w=Math.sin(t*He+_e)*.5,i.uniforms.uRot.value=te(p,x,w,l),R<1e-6&&(n=!1)}else l[0]=1,l[1]=0,l[2]=0,l[3]=0,l[4]=1,l[5]=0,l[6]=0,l[7]=0,l[8]=1,i.uniforms.uRot.value=l,R<1e-6&&(n=!1);A.render({scene:Be}),n?d=requestAnimationFrame(se):d=0};if(P){const e=new IntersectionObserver(o=>{o.some(t=>t.isIntersecting)?B():ae()});e.observe(r),B(),r.__prismIO=e}else B();return()=>{if(ae(),ee.disconnect(),h==="hover"&&(q&&window.removeEventListener("pointermove",q),window.removeEventListener("mouseleave",oe),window.removeEventListener("blur",ne)),P){const e=r.__prismIO;e&&e.disconnect(),delete r.__prismIO}a.canvas.parentElement===r&&r.removeChild(a.canvas)}},[T,z,h,W,U,s==null?void 0:s.x,s==null?void 0:s.y,N,E,Y,j,Z,D,G,X,P]),Ne.jsx("div",{className:`${Xe["prism-container"]}`,ref:k})};ce.__docgenInfo={description:"",methods:[],displayName:"Prism",props:{height:{defaultValue:{value:"3.5",computed:!1},required:!1},baseWidth:{defaultValue:{value:"5.5",computed:!1},required:!1},animationType:{defaultValue:{value:"'rotate'",computed:!1},required:!1},glow:{defaultValue:{value:"1",computed:!1},required:!1},offset:{defaultValue:{value:"{ x: 0, y: 0 }",computed:!1},required:!1},noise:{defaultValue:{value:"0.5",computed:!1},required:!1},transparent:{defaultValue:{value:"true",computed:!1},required:!1},scale:{defaultValue:{value:"3.6",computed:!1},required:!1},hueShift:{defaultValue:{value:"0",computed:!1},required:!1},colorFrequency:{defaultValue:{value:"1",computed:!1},required:!1},hoverStrength:{defaultValue:{value:"2",computed:!1},required:!1},inertia:{defaultValue:{value:"0.05",computed:!1},required:!1},bloom:{defaultValue:{value:"1",computed:!1},required:!1},suspendWhenOffscreen:{defaultValue:{value:"false",computed:!1},required:!1},timeScale:{defaultValue:{value:"0.5",computed:!1},required:!1}}};const Ke={title:"ReactBits/Backgrounds/Prism",component:ce,parameters:{layout:"fullscreen"}},y={};var re,ie,ue;y.parameters={...y.parameters,docs:{...(re=y.parameters)==null?void 0:re.docs,source:{originalSource:"{}",...(ue=(ie=y.parameters)==null?void 0:ie.docs)==null?void 0:ue.source}}};const et=["Default"];export{y as Default,et as __namedExportsOrder,Ke as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as n,j as te}from"./iframe-
|
|
1
|
+
import{r as n,j as te}from"./iframe-Cw8dCV4Z.js";import{R as re,P as ae,M as ne}from"./Mesh-CwXV3WjE.js";import{T as oe}from"./Texture-BkQWYNP2.js";import{T as se}from"./Triangle-64ffRKNB.js";import"./preload-helper-C1FmrZbK.js";const ue={"prismatic-burst-container":"_prismatic-burst-container_u2n5x_1"},ce=`#version 300 es
|
|
2
2
|
in vec2 position;
|
|
3
3
|
in vec2 uv;
|
|
4
4
|
out vec2 vUv;
|
|
@@ -167,4 +167,4 @@ void main(){
|
|
|
167
167
|
col *= uIntensity;
|
|
168
168
|
|
|
169
169
|
fragColor = vec4(clamp(col, 0.0, 1.0), 1.0);
|
|
170
|
-
}`,le=m=>{let a=m.trim();if(a.startsWith("#")&&(a=a.slice(1)),a.length===3){const l=a[0],b=a[1],E=a[2];a=l+l+b+b+E+E}const i=parseInt(a,16);if(isNaN(i)||a.length!==6&&a.length!==8)return[1,1,1];const P=(i>>16&255)/255,M=(i>>8&255)/255,A=(i&255)/255;return[P,M,A]},k=m=>{if(m==null)return 0;if(typeof m=="number")return m;const a=String(m).trim(),i=parseFloat(a.replace("px",""));return isNaN(i)?0:i},Q=({intensity:m=2,speed:a=.5,animationType:i="rotate3d",colors:P,distort:M=0,paused:A=!1,offset:l={x:0,y:0},hoverDampness:b=0,rayCount:E,mixBlendMode:g="lighten"})=>{const B=n.useRef(null),_=n.useRef(null),C=n.useRef(null),Y=n.useRef([.5,.5]),ee=n.useRef([.5,.5]),U=n.useRef(A),q=n.useRef(null),j=n.useRef(b),X=n.useRef(!0),z=n.useRef(null),S=n.useRef(null);return n.useEffect(()=>{U.current=A},[A]),n.useEffect(()=>{j.current=b},[b]),n.useEffect(()=>{const e=B.current;if(!e)return;const y=Math.min(window.devicePixelRatio||1,2),t=new re({dpr:y,alpha:!1,antialias:!1});C.current=t;const r=t.gl;r.canvas.style.position="absolute",r.canvas.style.inset="0",r.canvas.style.width="100%",r.canvas.style.height="100%",r.canvas.style.mixBlendMode=g&&g!=="none"?g:"",e.appendChild(r.canvas);const F=new Uint8Array([255,255,255,255]),d=new oe(r,{image:F,width:1,height:1,generateMipmaps:!1,flipY:!1});d.minFilter=r.LINEAR,d.magFilter=r.LINEAR,d.wrapS=r.CLAMP_TO_EDGE,d.wrapT=r.CLAMP_TO_EDGE,q.current=d;const u=new ae(r,{vertex:ce,fragment:ie,uniforms:{uResolution:{value:[1,1]},uTime:{value:0},uIntensity:{value:1},uSpeed:{value:1},uAnimType:{value:0},uMouse:{value:[.5,.5]},uColorCount:{value:0},uDistort:{value:0},uOffset:{value:[0,0]},uGradient:{value:d},uNoiseAmount:{value:.8},uRayCount:{value:0}}});_.current=u;const v=new se(r),L=new ne(r,{geometry:v,program:u});S.current=v,z.current=L;const f=()=>{const o=e.clientWidth||1,c=e.clientHeight||1;t.setSize(o,c),u.uniforms.uResolution.value=[r.drawingBufferWidth,r.drawingBufferHeight]};let s=null;"ResizeObserver"in window?(s=new ResizeObserver(f),s.observe(e)):window.addEventListener("resize",f),f();const D=o=>{const c=e.getBoundingClientRect(),p=(o.clientX-c.left)/Math.max(c.width,1),w=(o.clientY-c.top)/Math.max(c.height,1);Y.current=[Math.min(Math.max(p,0),1),Math.min(Math.max(w,0),1)]};e.addEventListener("pointermove",D,{passive:!0});let x=null;"IntersectionObserver"in window&&(x=new IntersectionObserver(o=>{o[0]&&(X.current=o[0].isIntersecting)},{root:null,threshold:.01}),x.observe(e));const I=()=>{};document.addEventListener("visibilitychange",I);let O=0,W=performance.now(),H=0;const V=o=>{const c=Math.max(0,o-W)*.001;W=o;const p=X.current&&!document.hidden;if(U.current||(H+=c),!p){O=requestAnimationFrame(V);return}const w=.02+Math.max(0,Math.min(1,j.current))*.5,R=1-Math.exp(-c/w),N=Y.current,h=ee.current;h[0]+=(N[0]-h[0])*R,h[1]+=(N[1]-h[1])*R,u.uniforms.uMouse.value=h,u.uniforms.uTime.value=H,t.render({scene:z.current}),O=requestAnimationFrame(V)};return O=requestAnimationFrame(V),()=>{var o,c,p,w,R,N,h,Z;cancelAnimationFrame(O),e.removeEventListener("pointermove",D),s==null||s.disconnect(),s||window.removeEventListener("resize",f),x==null||x.disconnect(),document.removeEventListener("visibilitychange",I);try{e.removeChild(r.canvas)}catch{console.warn("Canvas already removed")}try{(c=(o=z.current)==null?void 0:o.remove)==null||c.call(o)}catch{}try{(w=(p=S.current)==null?void 0:p.remove)==null||w.call(p)}catch{}try{(N=(R=_.current)==null?void 0:R.remove)==null||N.call(R)}catch{}try{const T=(h=C.current)==null?void 0:h.gl;T&&((Z=q.current)!=null&&Z.texture)&&T.deleteTexture(q.current.texture)}catch{}_.current=null,C.current=null,q.current=null,z.current=null,S.current=null}},[]),n.useEffect(()=>{var y,t;const e=(t=(y=C.current)==null?void 0:y.gl)==null?void 0:t.canvas;e&&(e.style.mixBlendMode=g&&g!=="none"?g:"")},[g]),n.useEffect(()=>{const e=_.current,y=C.current,t=q.current;if(!e||!y||!t)return;e.uniforms.uIntensity.value=m??1,e.uniforms.uSpeed.value=a??1;const r={rotate:0,rotate3d:1,hover:2};e.uniforms.uAnimType.value=r[i??"rotate"],e.uniforms.uDistort.value=typeof M=="number"?M:0;const F=k(l==null?void 0:l.x),d=k(l==null?void 0:l.y);e.uniforms.uOffset.value=[F,d],e.uniforms.uRayCount.value=Math.max(0,Math.floor(E??0));let u=0;if(Array.isArray(P)&&P.length>0){const v=y.gl,L=P.slice(0,64);u=L.length;const f=new Uint8Array(u*4);for(let s=0;s<u;s++){const[D,x,I]=le(L[s]);f[s*4+0]=Math.round(D*255),f[s*4+1]=Math.round(x*255),f[s*4+2]=Math.round(I*255),f[s*4+3]=255}t.image=f,t.width=u,t.height=1,t.minFilter=v.LINEAR,t.magFilter=v.LINEAR,t.wrapS=v.CLAMP_TO_EDGE,t.wrapT=v.CLAMP_TO_EDGE,t.flipY=!1,t.generateMipmaps=!1,t.format=v.RGBA,t.type=v.UNSIGNED_BYTE,t.needsUpdate=!0}else u=0;e.uniforms.uColorCount.value=u},[m,a,i,P,M,l,E]),te.jsx("div",{className:`${ue["prismatic-burst-container"]}`,ref:B})};Q.__docgenInfo={description:"",methods:[],displayName:"PrismaticBurst",props:{intensity:{defaultValue:{value:"2",computed:!1},required:!1},speed:{defaultValue:{value:"0.5",computed:!1},required:!1},animationType:{defaultValue:{value:"'rotate3d'",computed:!1},required:!1},distort:{defaultValue:{value:"0",computed:!1},required:!1},paused:{defaultValue:{value:"false",computed:!1},required:!1},offset:{defaultValue:{value:"{ x: 0, y: 0 }",computed:!1},required:!1},hoverDampness:{defaultValue:{value:"0",computed:!1},required:!1},mixBlendMode:{defaultValue:{value:"'lighten'",computed:!1},required:!1}}};const he={title:"ReactBits/Backgrounds/PrismaticBurst",component:Q,parameters:{layout:"fullscreen"}
|
|
170
|
+
}`,le=m=>{let a=m.trim();if(a.startsWith("#")&&(a=a.slice(1)),a.length===3){const l=a[0],b=a[1],E=a[2];a=l+l+b+b+E+E}const i=parseInt(a,16);if(isNaN(i)||a.length!==6&&a.length!==8)return[1,1,1];const P=(i>>16&255)/255,M=(i>>8&255)/255,A=(i&255)/255;return[P,M,A]},k=m=>{if(m==null)return 0;if(typeof m=="number")return m;const a=String(m).trim(),i=parseFloat(a.replace("px",""));return isNaN(i)?0:i},Q=({intensity:m=2,speed:a=.5,animationType:i="rotate3d",colors:P,distort:M=0,paused:A=!1,offset:l={x:0,y:0},hoverDampness:b=0,rayCount:E,mixBlendMode:g="lighten"})=>{const B=n.useRef(null),_=n.useRef(null),C=n.useRef(null),Y=n.useRef([.5,.5]),ee=n.useRef([.5,.5]),U=n.useRef(A),q=n.useRef(null),j=n.useRef(b),X=n.useRef(!0),z=n.useRef(null),S=n.useRef(null);return n.useEffect(()=>{U.current=A},[A]),n.useEffect(()=>{j.current=b},[b]),n.useEffect(()=>{const e=B.current;if(!e)return;const y=Math.min(window.devicePixelRatio||1,2),t=new re({dpr:y,alpha:!1,antialias:!1});C.current=t;const r=t.gl;r.canvas.style.position="absolute",r.canvas.style.inset="0",r.canvas.style.width="100%",r.canvas.style.height="100%",r.canvas.style.mixBlendMode=g&&g!=="none"?g:"",e.appendChild(r.canvas);const F=new Uint8Array([255,255,255,255]),d=new oe(r,{image:F,width:1,height:1,generateMipmaps:!1,flipY:!1});d.minFilter=r.LINEAR,d.magFilter=r.LINEAR,d.wrapS=r.CLAMP_TO_EDGE,d.wrapT=r.CLAMP_TO_EDGE,q.current=d;const u=new ae(r,{vertex:ce,fragment:ie,uniforms:{uResolution:{value:[1,1]},uTime:{value:0},uIntensity:{value:1},uSpeed:{value:1},uAnimType:{value:0},uMouse:{value:[.5,.5]},uColorCount:{value:0},uDistort:{value:0},uOffset:{value:[0,0]},uGradient:{value:d},uNoiseAmount:{value:.8},uRayCount:{value:0}}});_.current=u;const v=new se(r),L=new ne(r,{geometry:v,program:u});S.current=v,z.current=L;const f=()=>{const o=e.clientWidth||1,c=e.clientHeight||1;t.setSize(o,c),u.uniforms.uResolution.value=[r.drawingBufferWidth,r.drawingBufferHeight]};let s=null;"ResizeObserver"in window?(s=new ResizeObserver(f),s.observe(e)):window.addEventListener("resize",f),f();const D=o=>{const c=e.getBoundingClientRect(),p=(o.clientX-c.left)/Math.max(c.width,1),w=(o.clientY-c.top)/Math.max(c.height,1);Y.current=[Math.min(Math.max(p,0),1),Math.min(Math.max(w,0),1)]};e.addEventListener("pointermove",D,{passive:!0});let x=null;"IntersectionObserver"in window&&(x=new IntersectionObserver(o=>{o[0]&&(X.current=o[0].isIntersecting)},{root:null,threshold:.01}),x.observe(e));const I=()=>{};document.addEventListener("visibilitychange",I);let O=0,W=performance.now(),H=0;const V=o=>{const c=Math.max(0,o-W)*.001;W=o;const p=X.current&&!document.hidden;if(U.current||(H+=c),!p){O=requestAnimationFrame(V);return}const w=.02+Math.max(0,Math.min(1,j.current))*.5,R=1-Math.exp(-c/w),N=Y.current,h=ee.current;h[0]+=(N[0]-h[0])*R,h[1]+=(N[1]-h[1])*R,u.uniforms.uMouse.value=h,u.uniforms.uTime.value=H,t.render({scene:z.current}),O=requestAnimationFrame(V)};return O=requestAnimationFrame(V),()=>{var o,c,p,w,R,N,h,Z;cancelAnimationFrame(O),e.removeEventListener("pointermove",D),s==null||s.disconnect(),s||window.removeEventListener("resize",f),x==null||x.disconnect(),document.removeEventListener("visibilitychange",I);try{e.removeChild(r.canvas)}catch{console.warn("Canvas already removed")}try{(c=(o=z.current)==null?void 0:o.remove)==null||c.call(o)}catch{}try{(w=(p=S.current)==null?void 0:p.remove)==null||w.call(p)}catch{}try{(N=(R=_.current)==null?void 0:R.remove)==null||N.call(R)}catch{}try{const T=(h=C.current)==null?void 0:h.gl;T&&((Z=q.current)!=null&&Z.texture)&&T.deleteTexture(q.current.texture)}catch{}_.current=null,C.current=null,q.current=null,z.current=null,S.current=null}},[]),n.useEffect(()=>{var y,t;const e=(t=(y=C.current)==null?void 0:y.gl)==null?void 0:t.canvas;e&&(e.style.mixBlendMode=g&&g!=="none"?g:"")},[g]),n.useEffect(()=>{const e=_.current,y=C.current,t=q.current;if(!e||!y||!t)return;e.uniforms.uIntensity.value=m??1,e.uniforms.uSpeed.value=a??1;const r={rotate:0,rotate3d:1,hover:2};e.uniforms.uAnimType.value=r[i??"rotate"],e.uniforms.uDistort.value=typeof M=="number"?M:0;const F=k(l==null?void 0:l.x),d=k(l==null?void 0:l.y);e.uniforms.uOffset.value=[F,d],e.uniforms.uRayCount.value=Math.max(0,Math.floor(E??0));let u=0;if(Array.isArray(P)&&P.length>0){const v=y.gl,L=P.slice(0,64);u=L.length;const f=new Uint8Array(u*4);for(let s=0;s<u;s++){const[D,x,I]=le(L[s]);f[s*4+0]=Math.round(D*255),f[s*4+1]=Math.round(x*255),f[s*4+2]=Math.round(I*255),f[s*4+3]=255}t.image=f,t.width=u,t.height=1,t.minFilter=v.LINEAR,t.magFilter=v.LINEAR,t.wrapS=v.CLAMP_TO_EDGE,t.wrapT=v.CLAMP_TO_EDGE,t.flipY=!1,t.generateMipmaps=!1,t.format=v.RGBA,t.type=v.UNSIGNED_BYTE,t.needsUpdate=!0}else u=0;e.uniforms.uColorCount.value=u},[m,a,i,P,M,l,E]),te.jsx("div",{className:`${ue["prismatic-burst-container"]}`,ref:B})};Q.__docgenInfo={description:"",methods:[],displayName:"PrismaticBurst",props:{intensity:{defaultValue:{value:"2",computed:!1},required:!1},speed:{defaultValue:{value:"0.5",computed:!1},required:!1},animationType:{defaultValue:{value:"'rotate3d'",computed:!1},required:!1},distort:{defaultValue:{value:"0",computed:!1},required:!1},paused:{defaultValue:{value:"false",computed:!1},required:!1},offset:{defaultValue:{value:"{ x: 0, y: 0 }",computed:!1},required:!1},hoverDampness:{defaultValue:{value:"0",computed:!1},required:!1},mixBlendMode:{defaultValue:{value:"'lighten'",computed:!1},required:!1}}};const he={title:"ReactBits/Backgrounds/PrismaticBurst",component:Q,parameters:{layout:"fullscreen"}},G={};var $,J,K;G.parameters={...G.parameters,docs:{...($=G.parameters)==null?void 0:$.docs,source:{originalSource:"{}",...(K=(J=G.parameters)==null?void 0:J.docs)==null?void 0:K.source}}};const ge=["Default"];export{G as Default,ge as __namedExportsOrder,he as default};
|
package/storybook-static/assets/{ProfileCard.stories-CAoKQpAZ.js → ProfileCard.stories-vI_ispYe.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{R as ve,r as o,j as r}from"./iframe-
|
|
1
|
+
import{R as ve,r as o,j as r}from"./iframe-Cw8dCV4Z.js";import"./preload-helper-C1FmrZbK.js";const he="_active_uxwt3_56",_e="_entering_uxwt3_84",xe="_avatar_uxwt3_252",n={"pc-behind":"_pc-behind_uxwt3_40",active:he,"pc-card":"_pc-card_uxwt3_33","pc-card-shell":"_pc-card-shell_uxwt3_84",entering:_e,"pc-inside":"_pc-inside_uxwt3_100","pc-shine":"_pc-shine_uxwt3_108","pc-glare":"_pc-glare_uxwt3_232","pc-avatar-content":"_pc-avatar-content_uxwt3_245",avatar:xe,"pc-user-info":"_pc-user-info_uxwt3_274","pc-user-details":"_pc-user-details_uxwt3_293","pc-mini-avatar":"_pc-mini-avatar_uxwt3_299","pc-user-text":"_pc-user-text_uxwt3_315","pc-handle":"_pc-handle_uxwt3_322","pc-status":"_pc-status_uxwt3_329","pc-contact-btn":"_pc-contact-btn_uxwt3_335","pc-content":"_pc-content_uxwt3_353","pc-details":"_pc-details_uxwt3_367"},ge="linear-gradient(145deg,#60496e8c 0%,#71C4FF44 100%)",L={INITIAL_DURATION:1200,INITIAL_X_OFFSET:70,INITIAL_Y_OFFSET:60,DEVICE_BETA_OFFSET:20,ENTER_TRANSITION_MS:180},$=(p,d=0,v=100)=>Math.min(Math.max(p,d),v),C=(p,d=3)=>parseFloat(p.toFixed(d)),z=(p,d,v,x,O)=>C(x+(O-x)*(p-d)/(v-d)),Z=({avatarUrl:p="<Placeholder for avatar URL>",iconUrl:d="<Placeholder for icon URL>",grainUrl:v="<Placeholder for grain URL>",innerGradient:x,behindGlowEnabled:O=!0,behindGlowColor:S,behindGlowSize:U,className:ee="",enableTilt:A=!0,enableMobileTilt:V=!1,mobileTiltSensitivity:q=5,miniAvatarUrl:te,name:y="Javi A. Torres",title:ne="Software Engineer",handle:ae="javicodes",status:re="Online",contactText:se="Contact",showUserInfo:ce=!0,onContactClick:F})=>{const M=o.useRef(null),m=o.useRef(null),g=o.useRef(null),h=o.useRef(null),s=o.useMemo(()=>{if(!A)return null;let e=null,t=!1,a=0,c=0,i=0,u=0,f=0;const E=.14,T=.6;let j=0;const H=(l,_)=>{const w=m.current,I=M.current;if(!w||!I)return;const J=w.clientWidth||1,oe=w.clientHeight||1,N=$(100/J*l),b=$(100/oe*_),ue=N-50,de=b-50,pe={"--pointer-x":`${N}%`,"--pointer-y":`${b}%`,"--background-x":`${z(N,0,100,35,65)}%`,"--background-y":`${z(b,0,100,35,65)}%`,"--pointer-from-center":`${$(Math.hypot(b-50,N-50)/50,0,1)}`,"--pointer-from-top":`${b/100}`,"--pointer-from-left":`${N/100}`,"--rotate-x":`${C(-(ue/5))}deg`,"--rotate-y":`${C(de/4)}deg`};for(const[fe,me]of Object.entries(pe))I.style.setProperty(fe,me)},W=l=>{if(!t)return;a===0&&(a=l);const _=(l-a)/1e3;a=l;const w=l<j?T:E,I=1-Math.exp(-_/w);c+=(u-c)*I,i+=(f-i)*I,H(c,i),Math.abs(u-c)>.05||Math.abs(f-i)>.05||document.hasFocus()?e=requestAnimationFrame(W):(t=!1,a=0,e&&(cancelAnimationFrame(e),e=null))},B=()=>{t||(t=!0,a=0,e=requestAnimationFrame(W))};return{setImmediate(l,_){c=l,i=_,H(c,i)},setTarget(l,_){u=l,f=_,B()},toCenter(){const l=m.current;l&&this.setTarget(l.clientWidth/2,l.clientHeight/2)},beginInitial(l){j=performance.now()+l,B()},getCurrent(){return{x:c,y:i,tx:u,ty:f}},cancel(){e&&cancelAnimationFrame(e),e=null,t=!1,a=0}}},[A]),P=(e,t)=>{const a=t.getBoundingClientRect();return{x:e.clientX-a.left,y:e.clientY-a.top}},D=o.useCallback(e=>{const t=m.current;if(!t||!s)return;const{x:a,y:c}=P(e,t);s.setTarget(a,c)},[s]),k=o.useCallback(e=>{const t=m.current;if(!t||!s)return;t.classList.add(n.active),t.classList.add(n.entering),g.current&&window.clearTimeout(g.current),g.current=window.setTimeout(()=>{t.classList.remove(n.entering)},L.ENTER_TRANSITION_MS);const{x:a,y:c}=P(e,t);s.setTarget(a,c)},[s]),X=o.useCallback(()=>{const e=m.current;if(!e||!s)return;s.toCenter();const t=()=>{const{x:a,y:c,tx:i,ty:u}=s.getCurrent();Math.hypot(i-a,u-c)<.6?(e.classList.remove(n.active),h.current=null):h.current=requestAnimationFrame(t)};h.current&&cancelAnimationFrame(h.current),h.current=requestAnimationFrame(t)},[s]),Y=o.useCallback(e=>{const t=m.current;if(!t||!s)return;const{beta:a,gamma:c}=e;if(a==null||c==null)return;const i=t.clientWidth/2,u=t.clientHeight/2,f=$(i+c*q,0,t.clientWidth),E=$(u+(a-L.DEVICE_BETA_OFFSET)*q,0,t.clientHeight);s.setTarget(f,E)},[s,q]);o.useEffect(()=>{if(!A||!s)return;const e=m.current;if(!e)return;const t=D,a=k,c=X,i=Y;e.addEventListener("pointerenter",a),e.addEventListener("pointermove",t),e.addEventListener("pointerleave",c);const u=()=>{if(!V||location.protocol!=="https:")return;const T=window.DeviceMotionEvent;T&&typeof T.requestPermission=="function"?T.requestPermission().then(j=>{j==="granted"&&window.addEventListener("deviceorientation",i)}).catch(console.error):window.addEventListener("deviceorientation",i)};e.addEventListener("click",u);const f=(e.clientWidth||0)-L.INITIAL_X_OFFSET,E=L.INITIAL_Y_OFFSET;return s.setImmediate(f,E),s.toCenter(),s.beginInitial(L.INITIAL_DURATION),()=>{e.removeEventListener("pointerenter",a),e.removeEventListener("pointermove",t),e.removeEventListener("pointerleave",c),e.removeEventListener("click",u),window.removeEventListener("deviceorientation",i),g.current&&window.clearTimeout(g.current),h.current&&cancelAnimationFrame(h.current),s.cancel(),e.classList.remove(n.entering)}},[A,V,s,D,k,X,Y]);const le=o.useMemo(()=>({"--icon":d?`url(${d})`:"none","--grain":v?`url(${v})`:"none","--inner-gradient":x??ge,"--behind-glow-color":S??"rgba(125, 190, 255, 0.67)","--behind-glow-size":U??"50%"}),[d,v,x,S,U]),ie=o.useCallback(()=>{F==null||F()},[F]);return r.jsxs("div",{ref:M,className:`pc-card-wrapper ${ee}`.trim(),style:le,children:[O&&r.jsx("div",{className:`${n["pc-behind"]}`}),r.jsx("div",{ref:m,className:`${n["pc-card-shell"]}`,children:r.jsx("section",{className:`${n["pc-card"]}`,children:r.jsxs("div",{className:`${n["pc-inside"]}`,children:[r.jsx("div",{className:`${n["pc-shine"]}`}),r.jsx("div",{className:`${n["pc-glare"]}`}),r.jsxs("div",{className:`${n["pc-content"]} ${n["pc-avatar-content"]}`,children:[r.jsx("img",{className:`${n.avatar}`,src:p,alt:`${y||"User"} avatar`,loading:"lazy",onError:e=>{const t=e.target;t.style.display="none"}}),ce&&r.jsxs("div",{className:`${n["pc-user-info"]}`,children:[r.jsxs("div",{className:`${n["pc-user-details"]}`,children:[r.jsx("div",{className:`${n["pc-mini-avatar"]}`,children:r.jsx("img",{src:te||p,alt:`${y||"User"} mini avatar`,loading:"lazy",onError:e=>{const t=e.target;t.style.opacity="0.5",t.src=p}})}),r.jsxs("div",{className:`${n["pc-user-text"]}`,children:[r.jsxs("div",{className:`${n["pc-handle"]}`,children:["@",ae]}),r.jsx("div",{className:`${n["pc-status"]}`,children:re})]})]}),r.jsx("button",{className:`${n["pc-contact-btn"]}`,onClick:ie,style:{pointerEvents:"auto"},type:"button","aria-label":`Contact ${y||"user"}`,children:se})]})]}),r.jsx("div",{className:`${n["pc-content"]}`,children:r.jsxs("div",{className:`${n["pc-details"]}`,children:[r.jsx("h3",{children:y}),r.jsx("p",{children:ne})]})})]})})})]})},Ee=ve.memo(Z);Z.__docgenInfo={description:"",methods:[],displayName:"ProfileCardComponent",props:{avatarUrl:{defaultValue:{value:"'<Placeholder for avatar URL>'",computed:!1},required:!1},iconUrl:{defaultValue:{value:"'<Placeholder for icon URL>'",computed:!1},required:!1},grainUrl:{defaultValue:{value:"'<Placeholder for grain URL>'",computed:!1},required:!1},behindGlowEnabled:{defaultValue:{value:"true",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},enableTilt:{defaultValue:{value:"true",computed:!1},required:!1},enableMobileTilt:{defaultValue:{value:"false",computed:!1},required:!1},mobileTiltSensitivity:{defaultValue:{value:"5",computed:!1},required:!1},name:{defaultValue:{value:"'Javi A. Torres'",computed:!1},required:!1},title:{defaultValue:{value:"'Software Engineer'",computed:!1},required:!1},handle:{defaultValue:{value:"'javicodes'",computed:!1},required:!1},status:{defaultValue:{value:"'Online'",computed:!1},required:!1},contactText:{defaultValue:{value:"'Contact'",computed:!1},required:!1},showUserInfo:{defaultValue:{value:"true",computed:!1},required:!1}}};const Ie={title:"ReactBits/Components/ProfileCard",component:Ee,parameters:{layout:"fullscreen"}},R={args:{avatarUrl:"https://i.pravatar.cc/300?img=12",behindGlowEnabled:!0,enableTilt:!0,enableMobileTilt:!1,mobileTiltSensitivity:5,name:"Javi A. Torres",title:"Software Engineer",handle:"javicodes",status:"Online",contactText:"Contact",showUserInfo:!0}};var G,K,Q;R.parameters={...R.parameters,docs:{...(G=R.parameters)==null?void 0:G.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
avatarUrl: 'https://i.pravatar.cc/300?img=12',
|
|
4
4
|
behindGlowEnabled: true,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._container_2763s_1{background:transparent;border-radius:var(--radius-lg);padding:var(--spacing-xl);display:flex;flex-direction:column;align-items:center}._controls_2763s_10{display:flex;justify-content:center;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}._viewToggle_2763s_18{display:flex;gap:4px;background:var(--color-background-tertiary);padding:4px;border-radius:12px;border:1px solid var(--color-border)}._viewButton_2763s_27{display:flex;align-items:center;gap:6px;padding:8px 12px;background:transparent;border:none;border-radius:8px;color:var(--color-text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;position:relative}._viewButton_2763s_27:hover{background:var(--color-surface-hover);transform:translateY(-1px)}._viewButton_2763s_27._active_2763s_48{background:var(--color-primary);color:var(--color-text-inverse);box-shadow:0 4px 12px #d4af374d}._viewIcon_2763s_54{font-size:16px;display:inline-block}._viewLabel_2763s_59{display:inline-block}@media (max-width: 640px){._viewLabel_2763s_59{display:none}}._aggregationToggle_2763s_69{display:flex;gap:4px;background:var(--color-background-tertiary);padding:4px;border-radius:12px;border:1px solid var(--color-border)}._aggregationButton_2763s_78{display:flex;align-items:center;gap:6px;padding:8px 12px;background:transparent;border:none;border-radius:8px;color:var(--color-text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease;position:relative}._aggregationButton_2763s_78:hover{background:var(--color-surface-hover);transform:translateY(-1px)}._aggregationButton_2763s_78._active_2763s_48{background:var(--color-accent);color:var(--color-text-inverse);box-shadow:0 4px 12px #d4af374d}._aggregationIcon_2763s_105{font-size:16px;display:inline-block}._aggregationLabel_2763s_110{display:inline-block}@media (max-width: 640px){._aggregationLabel_2763s_110{display:none}}._legend_2763s_120{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--spacing-xl);padding:12px;background:var(--color-background-tertiary);border-radius:12px;border:1px solid var(--color-border);justify-content:center}._compactLegend_2763s_132{gap:4px;padding:6px 8px}._compactLegend_2763s_132 ._legendItem_2763s_137{padding:3px 8px;gap:4px}._compactLegend_2763s_132 ._legendEmoji_2763s_142{font-size:14px}._compactLegend_2763s_132 ._legendLabel_2763s_146{font-size:11px}._legendItem_2763s_137{display:flex;align-items:center;gap:8px;padding:6px 12px;background:var(--color-background-secondary);border:2px solid var(--border-primary);border-radius:20px;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #00000014;position:relative;overflow:hidden}._legendItem_2763s_137:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent,var(--color-primary-lighter));opacity:0;transition:opacity .2s ease}._legendItem_2763s_137:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:var(--color-primary)}._legendItem_2763s_137:hover:before{opacity:1}._legendItem_2763s_137._inactive_2763s_187{opacity:.4;background:var(--color-background-tertiary)}._legendItem_2763s_137._inactive_2763s_187:hover{opacity:.6}._legendItem_2763s_137._inactive_2763s_187 ._legendColor_2763s_196{background:var(--color-text-tertiary)!important}._legendEmoji_2763s_142{font-size:18px;display:inline-block;animation:_bounce_2763s_1 2s infinite;animation-delay:var(--animation-delay, 0s)}@keyframes _bounce_2763s_1{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}._legendColor_2763s_196{width:12px;height:12px;border-radius:50%;transition:all .2s ease;box-shadow:0 2px 4px #0003;position:relative}._legendItem_2763s_137:hover ._legendColor_2763s_196{transform:scale(1.2)}._legendLabel_2763s_146{font-size:13px;font-weight:500;color:var(--color-text);position:relative;z-index:1}._chart_2763s_233{display:block;margin:0 auto}._gridLine_2763s_238{stroke:var(--color-border);stroke-opacity:.15;stroke-dasharray:4,4}._line_2763s_244{fill:none;stroke-width:2.5;transition:opacity .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}._xAxis_2763s_251,._yAxis_2763s_252{color:var(--color-text-secondary);font-size:11px;font-weight:500}._xAxis_2763s_251 line,._xAxis_2763s_251 path,._yAxis_2763s_252 line,._yAxis_2763s_252 path{stroke:var(--color-border);stroke-opacity:.3}._xAxis_2763s_251 text,._yAxis_2763s_252 text{fill:var(--color-text-secondary)}._dataPoint_2763s_271{transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}._dataPoint_2763s_271:hover{r:6;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}._tooltip_2763s_281{position:fixed;pointer-events:none;background:var(--color-background-primary);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--color-border);border-radius:12px;padding:12px 16px;font-size:13px;font-weight:500;z-index:10000;box-shadow:0 0 0 1px var(--color-border),0 10px 20px #00000026,0 4px 8px #0000001a;transition:opacity .15s ease,transform .15s ease;opacity:0;transform:translateY(-8px) translate(-50%)}._tooltip_2763s_281._visible_2763s_302{opacity:1;transform:translateY(-4px) translate(-50%)}._tooltipHeader_2763s_307{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--color-border);font-weight:600;color:var(--color-text)}._tooltipEmoji_2763s_318{font-size:18px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}._tooltipDot_2763s_323{width:10px;height:10px;border-radius:50%;box-shadow:0 2px 4px #0003}._tooltipInfo_2763s_330{display:flex;flex-direction:column;gap:6px}._tooltipDate_2763s_336{color:var(--color-text-secondary);font-size:12px;font-weight:500}._tooltipValue_2763s_342{color:var(--color-text);font-weight:700;font-size:16px;display:flex;align-items:baseline;gap:6px}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as u,j as r}from"./iframe-B8pH-Lvr.js";import{s as z}from"./transform-BKmuZieF.js";import{t as be,e as Me,l as Se,m as Te}from"./monotone-DHdPkfDP.js";import{l as je}from"./linear-dkJHgUri.js";import{t as Q}from"./defaultLocale-DJ2q5QjE.js";import{a as ke,b as De}from"./axis-D3QohQNI.js";import"./preload-helper-C1FmrZbK.js";import"./array-BKyUJesY.js";import"./path-CbwjOpE9.js";const Ee="_container_1dsyv_1",Ce="_controls_1dsyv_10",qe="_viewToggle_1dsyv_18",Le="_viewButton_1dsyv_27",$e="_active_1dsyv_48",Ne="_viewIcon_1dsyv_54",Ae="_viewLabel_1dsyv_59",Ve="_aggregationToggle_1dsyv_69",Ie="_aggregationButton_1dsyv_78",Fe="_aggregationIcon_1dsyv_105",We="_aggregationLabel_1dsyv_110",Be="_legend_1dsyv_120",Re="_compactLegend_1dsyv_132",He="_legendItem_1dsyv_137",Oe="_legendEmoji_1dsyv_142",Ye="_legendLabel_1dsyv_146",ze="_inactive_1dsyv_187",Qe="_legendColor_1dsyv_196",Ue="_chart_1dsyv_233",Pe="_gridLine_1dsyv_238",Ge="_line_1dsyv_244",Ke="_xAxis_1dsyv_251",Xe="_yAxis_1dsyv_252",Je="_dataPoint_1dsyv_271",Ze="_tooltip_1dsyv_281",et="_visible_1dsyv_302",tt="_tooltipHeader_1dsyv_307",at="_tooltipEmoji_1dsyv_318",nt="_tooltipDot_1dsyv_323",rt="_tooltipInfo_1dsyv_330",ot="_tooltipDate_1dsyv_336",st="_tooltipValue_1dsyv_342",t={container:Ee,controls:Ce,viewToggle:qe,viewButton:Le,active:$e,viewIcon:Ne,viewLabel:Ae,aggregationToggle:Ve,aggregationButton:Ie,aggregationIcon:Fe,aggregationLabel:We,legend:Be,compactLegend:Re,legendItem:He,legendEmoji:Oe,legendLabel:Ye,inactive:ze,legendColor:Qe,chart:Ue,gridLine:Pe,line:Ge,xAxis:Ke,yAxis:Xe,dataPoint:Je,tooltip:Ze,visible:et,tooltipHeader:tt,tooltipEmoji:at,tooltipDot:nt,tooltipInfo:rt,tooltipDate:ot,tooltipValue:st},lt={Exercise:"#6BCB77",Meditation:"#4D96FF",Reading:"#FFB319",Water:"#00D9FF",Steps:"#FF6B6B",Sleep:"#9B59B6",Calories:"#FF9F1C",Study:"#C774E8"},ge=({data:n,width:v=800,height:_=400,defaultViewType:M="daily",periodType:b="month",habitColors:U={},habitEmojis:P={},onDataPointClick:W,hideControls:me=!1,compactLegend:pe=!1})=>{const D=u.useRef(null),he=u.useRef(null),[g,ye]=u.useState(M),[E,G]=u.useState([]),[S,K]=u.useState(null),[h,C]=u.useState(null),[q,X]=u.useState("average"),y=u.useMemo(()=>({top:20,right:20,bottom:50,left:50}),[]),B=v-y.left-y.right,R=_-y.top-y.bottom,T=u.useMemo(()=>Object.keys(n).filter(e=>e!=="dates"),[n]);u.useEffect(()=>{G(T)},[T]),u.useEffect(()=>{const e=()=>{C(null)};return window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("scroll",e,!0)}},[]);const fe=u.useMemo(()=>{switch(b){case"week":return["daily"];case"month":return["daily","weekly"];case"quarter":return["weekly","monthly"];case"year":return["daily","weekly","monthly","quarterly"];case"allTime":return["monthly","quarterly"];default:return["daily"]}},[b]),j=u.useCallback(e=>U[e]||lt[e]||`hsl(${Math.abs(e.split("").reduce((o,s)=>o+s.charCodeAt(0),0))%360}, 70%, 50%)`,[U]),f=u.useMemo(()=>{if(g==="daily"||!n.dates.length)return n;const e={dates:[]},o=new Map;return n.dates.forEach((s,m)=>{const w=new Date(s);let l;switch(g){case"weekly":{const c=new Date(w),p=c.getDay(),L=c.getDate()-p+(p===0?-6:1);c.setDate(L),l=c.toISOString().split("T")[0];break}case"monthly":l=`${w.getFullYear()}-${String(w.getMonth()+1).padStart(2,"0")}-01`;break;case"quarterly":{const p=(Math.floor(w.getMonth()/3)+1-1)*3;l=new Date(w.getFullYear(),p,1).toISOString().split("T")[0];break}default:l=s}o.has(l)||o.set(l,[]),o.get(l).push(m)}),e.dates=Array.from(o.keys()).sort(),T.forEach(s=>{e[s]=e.dates.map(m=>{const l=o.get(m).map(c=>n[s][c]).filter(c=>typeof c=="number"&&!isNaN(c));return l.length===0?0:Math.round(q==="sum"?l.reduce((c,p)=>c+p,0):l.reduce((c,p)=>c+p,0)/l.length)})}),e},[n,g,T,q]),ve=e=>{G(o=>o.includes(e)?o.filter(s=>s!==e):[...o,e])};u.useEffect(()=>{if(!D.current||f.dates.length===0)return;const e=z(D.current);e.selectAll("*").remove(),e.append("rect").attr("width",v).attr("height",_).attr("fill","transparent").style("pointer-events","all").on("mouseleave",()=>{C(null)});const o=e.append("g").attr("transform",`translate(${y.left},${y.top})`),s=f.dates.map(a=>new Date(a)),m=be().domain(Me(s)).range([0,B]),w=Math.max(...E.flatMap(a=>f[a].filter(d=>typeof d=="number"))),l=je().domain([0,w*1.1]).range([R,0]);o.selectAll(".grid-line-y").data(l.ticks(5)).enter().append("line").attr("class",t.gridLine).attr("x1",0).attr("y1",a=>l(a)).attr("x2",B).attr("y2",a=>l(a));const c=Se().x(a=>m(a[0])).y(a=>l(a[1])).curve(Te);E.forEach(a=>{const d=s.map((i,x)=>[i,f[a][x]]).filter(i=>typeof i[1]=="number");o.append("path").datum(d).attr("class",t.line).attr("d",c).attr("stroke",j(a)).attr("opacity",S&&S!==a?.3:1),o.selectAll(`.hover-circle-${a}`).data(d).enter().append("circle").attr("cx",i=>m(i[0])).attr("cy",i=>l(i[1])).attr("r",10).attr("fill","transparent").style("cursor","pointer").on("mouseenter",function(i,x){var Z;const[k,$]=x,Y=(Z=D.current)==null?void 0:Z.getBoundingClientRect();Y&&C({habit:a,date:k.toISOString().split("T")[0],value:$,x:m(k)+y.left+Y.left,y:l($)+y.top+Y.top}),z(o.node()).selectAll(`.circle-${a}-${s.indexOf(k)}`).attr("r",6)}).on("mouseleave",function(i,x){C(null),z(o.node()).selectAll('[class*="circle-'+a+'"]').attr("r",4)}).on("click",function(i,x){const[k,$]=x;W&&W(a,k.toISOString().split("T")[0],$)}),o.selectAll(`.circle-${a}`).data(d).enter().append("circle").attr("class",(i,x)=>`${t.dataPoint} circle-${a}-${x}`).attr("cx",i=>m(i[0])).attr("cy",i=>l(i[1])).attr("r",4).attr("fill",j(a)).attr("opacity",S&&S!==a?.3:1).style("pointer-events","none")});const p=a=>{const d=new Date(a);d.setHours(0,0,0,0),d.setDate(d.getDate()+3-(d.getDay()+6)%7);const i=new Date(d.getFullYear(),0,4);return 1+Math.round(((d.getTime()-i.getTime())/864e5-3+(i.getDay()+6)%7)/7)},L=(()=>{switch(g){case"daily":return Q("%Y-%m-%d");case"weekly":return a=>{const d=p(a);return`${a.getFullYear()}-W${d.toString().padStart(2,"0")}`};case"monthly":return Q("%Y-%m");case"quarterly":return a=>{const d=Math.floor(a.getMonth()/3)+1;return`${a.getFullYear()}-Q${d}`};default:return Q("%Y-%m-%d")}})(),J=(()=>{switch(g){case"daily":return Math.min(10,f.dates.length);case"weekly":return Math.min(12,f.dates.length);case"monthly":return Math.min(12,f.dates.length);case"quarterly":return f.dates.length;default:return}})(),O=ke(m).tickFormat(a=>L(a));g==="quarterly"?O.tickValues(s):J&&O.ticks(J);const xe=o.append("g").attr("class",t.xAxis).attr("transform",`translate(0,${R})`).call(O);(g==="daily"||g==="weekly")&&xe.selectAll("text").style("text-anchor","end").attr("dx","-.8em").attr("dy",".15em").attr("transform","rotate(-45)"),o.append("g").attr("class",t.yAxis).call(De(l))},[f,E,B,R,y,S,W,j,_,g,v]);const _e=(e,o)=>{const s=new Date(e);switch(o){case"daily":return s.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"});case"weekly":return new Date(s).setDate(s.getDate()+6),`Week of ${s.toLocaleDateString("en-US",{month:"short",day:"numeric"})}`;case"monthly":return s.toLocaleDateString("en-US",{month:"long",year:"numeric"});case"quarterly":return`Q${Math.floor(s.getMonth()/3)+1} ${s.getFullYear()}`;default:return e}},H={daily:{icon:"📅",label:"Daily"},weekly:{icon:"📆",label:"Weekly"},monthly:{icon:"🗓️",label:"Monthly"},quarterly:{icon:"📊",label:"Quarterly"}},we=g!=="daily";return r.jsxs("div",{className:t.container,children:[!me&&r.jsxs("div",{className:t.controls,children:[r.jsx("div",{className:t.viewToggle,children:fe.map(e=>r.jsxs("button",{className:`${t.viewButton} ${g===e?t.active:""}`,onClick:()=>ye(e),title:H[e].label,children:[r.jsx("span",{className:t.viewIcon,children:H[e].icon}),r.jsx("span",{className:t.viewLabel,children:H[e].label})]},e))}),we&&r.jsxs("div",{className:t.aggregationToggle,children:[r.jsxs("button",{className:`${t.aggregationButton} ${q==="average"?t.active:""}`,onClick:()=>X("average"),title:"Show average values for each period",children:[r.jsx("span",{className:t.aggregationIcon,children:"📊"}),r.jsx("span",{className:t.aggregationLabel,children:"Average"})]}),r.jsxs("button",{className:`${t.aggregationButton} ${q==="sum"?t.active:""}`,onClick:()=>X("sum"),title:"Show total values for each period",children:[r.jsx("span",{className:t.aggregationIcon,children:"➕"}),r.jsx("span",{className:t.aggregationLabel,children:"Sum"})]})]})]}),r.jsx("div",{className:`${t.legend}${pe?` ${t.compactLegend}`:""}`,children:T.map(e=>r.jsxs("button",{className:`${t.legendItem} ${E.includes(e)?"":t.inactive}`,onClick:()=>ve(e),onMouseEnter:()=>K(e),onMouseLeave:()=>K(null),children:[r.jsx("span",{className:t.legendEmoji,children:P[e]||"📊"}),r.jsx("span",{className:t.legendColor,style:{backgroundColor:j(e)}}),r.jsx("span",{className:t.legendLabel,children:e})]},e))}),r.jsx("svg",{ref:D,width:v,height:_,className:t.chart}),h&&r.jsxs("div",{ref:he,className:`${t.tooltip} ${h?t.visible:""}`,style:{left:`${h.x}px`,top:`${h.y-80}px`},children:[r.jsxs("div",{className:t.tooltipHeader,children:[r.jsx("span",{className:t.tooltipEmoji,children:P[h.habit]||"📊"}),r.jsx("span",{className:t.tooltipDot,style:{backgroundColor:j(h.habit)}}),r.jsx("span",{children:h.habit})]}),r.jsxs("div",{className:t.tooltipInfo,children:[r.jsx("div",{className:t.tooltipDate,children:_e(h.date,g)}),r.jsxs("div",{className:t.tooltipValue,children:[r.jsx("strong",{children:Math.round(h.value*10)/10}),r.jsx("span",{style:{fontSize:"12px",fontWeight:"normal",opacity:.6},children:"units"})]})]})]})]})};ge.__docgenInfo={description:"",methods:[],displayName:"QuantifiableHabitsChart",props:{data:{required:!0,tsType:{name:"ChartData"},description:""},width:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"800",computed:!1}},height:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"400",computed:!1}},defaultViewType:{required:!1,tsType:{name:"union",raw:"'daily' | 'weekly' | 'monthly' | 'quarterly'",elements:[{name:"literal",value:"'daily'"},{name:"literal",value:"'weekly'"},{name:"literal",value:"'monthly'"},{name:"literal",value:"'quarterly'"}]},description:"",defaultValue:{value:"'daily'",computed:!1}},periodType:{required:!1,tsType:{name:"union",raw:"'week' | 'month' | 'quarter' | 'year' | 'allTime'",elements:[{name:"literal",value:"'week'"},{name:"literal",value:"'month'"},{name:"literal",value:"'quarter'"},{name:"literal",value:"'year'"},{name:"literal",value:"'allTime'"}]},description:"",defaultValue:{value:"'month'",computed:!1}},habitColors:{required:!1,tsType:{name:"signature",type:"object",raw:"{ [key: string]: string }",signature:{properties:[{key:{name:"string"},value:{name:"string",required:!0}}]}},description:"",defaultValue:{value:"{}",computed:!1}},habitEmojis:{required:!1,tsType:{name:"signature",type:"object",raw:"{ [key: string]: string }",signature:{properties:[{key:{name:"string"},value:{name:"string",required:!0}}]}},description:"",defaultValue:{value:"{}",computed:!1}},onDataPointClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(habit: string, date: string, value: number) => void",signature:{arguments:[{type:{name:"string"},name:"habit"},{type:{name:"string"},name:"date"},{type:{name:"number"},name:"value"}],return:{name:"void"}}},description:""},hideControls:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},compactLegend:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}}}};const ft={title:"Organisms/Charts/QuantifiableHabitsChart",component:ge,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:400,max:1200,step:50}},height:{control:{type:"number",min:200,max:600,step:50}},defaultViewType:{control:{type:"select"},options:["daily","weekly","monthly","quarterly"]},periodType:{control:{type:"select"},options:["week","month","quarter","year","allTime"]}}},F=n=>{const v=[],_=new Date;for(let M=n-1;M>=0;M--){const b=new Date(_);b.setDate(b.getDate()-M),v.push(b.toISOString().split("T")[0])}return v},N={args:{data:(()=>{const n=F(30);return{dates:n,Exercise:n.map(()=>Math.floor(Math.random()*60)+20),Reading:n.map(()=>Math.floor(Math.random()*120)+30),Water:n.map(()=>Math.floor(Math.random()*8)+2),Steps:n.map(()=>Math.floor(Math.random()*15e3)+5e3)}})(),width:900,height:400,defaultViewType:"daily",periodType:"month",habitColors:{Exercise:"#10b981",Reading:"#8b5cf6",Water:"#3b82f6",Steps:"#f59e0b"},habitEmojis:{Exercise:"🏃",Reading:"📚",Water:"💧",Steps:"👟"}}},A={args:{data:(()=>{const n=F(90);return{dates:n,Meditation:n.map(()=>Math.floor(Math.random()*30)+10),Study:n.map(()=>Math.floor(Math.random()*180)+60),Sleep:n.map(()=>Math.floor(Math.random()*3)+6)}})(),width:900,height:400,defaultViewType:"weekly",periodType:"quarter",habitColors:{Meditation:"#a78bfa",Study:"#34d399",Sleep:"#60a5fa"},habitEmojis:{Meditation:"🧘",Study:"📖",Sleep:"😴"}}},V={args:{data:(()=>{const n=F(365);return{dates:n,Coding:n.map(()=>Math.floor(Math.random()*240)+120),Exercise:n.map(()=>Math.floor(Math.random()*90)+30),Learning:n.map(()=>Math.floor(Math.random()*120)+60),Socializing:n.map(()=>Math.floor(Math.random()*180)+60)}})(),width:1e3,height:450,defaultViewType:"monthly",periodType:"year",habitColors:{Coding:"#7c3aed",Exercise:"#10b981",Learning:"#f59e0b",Socializing:"#ec4899"},habitEmojis:{Coding:"💻",Exercise:"💪",Learning:"🎓",Socializing:"👥"}}},I={args:{data:(()=>{const n=F(30);return{dates:n,Weight:n.map((v,_)=>70+Math.sin(_/5)*2+Math.random())}})(),width:800,height:300,defaultViewType:"daily",periodType:"month",habitColors:{Weight:"#3b82f6"},habitEmojis:{Weight:"⚖️"}}};var ee,te,ae;N.parameters={...N.parameters,docs:{...(ee=N.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
1
|
+
import{r as u,j as r}from"./iframe-Cw8dCV4Z.js";import{s as z}from"./transform-BKmuZieF.js";import{t as be,e as Me,l as Se,m as Te}from"./monotone-DHdPkfDP.js";import{l as je}from"./linear-dkJHgUri.js";import{t as Q}from"./defaultLocale-DJ2q5QjE.js";import{a as ke,b as De}from"./axis-D3QohQNI.js";import"./preload-helper-C1FmrZbK.js";import"./array-BKyUJesY.js";import"./path-CbwjOpE9.js";const Ee="_container_2763s_1",Ce="_controls_2763s_10",qe="_viewToggle_2763s_18",Le="_viewButton_2763s_27",$e="_active_2763s_48",Ne="_viewIcon_2763s_54",Ae="_viewLabel_2763s_59",Ve="_aggregationToggle_2763s_69",Ie="_aggregationButton_2763s_78",Fe="_aggregationIcon_2763s_105",We="_aggregationLabel_2763s_110",Be="_legend_2763s_120",Re="_compactLegend_2763s_132",He="_legendItem_2763s_137",Oe="_legendEmoji_2763s_142",Ye="_legendLabel_2763s_146",ze="_inactive_2763s_187",Qe="_legendColor_2763s_196",Ue="_chart_2763s_233",Pe="_gridLine_2763s_238",Ge="_line_2763s_244",Ke="_xAxis_2763s_251",Xe="_yAxis_2763s_252",Je="_dataPoint_2763s_271",Ze="_tooltip_2763s_281",et="_visible_2763s_302",tt="_tooltipHeader_2763s_307",at="_tooltipEmoji_2763s_318",nt="_tooltipDot_2763s_323",rt="_tooltipInfo_2763s_330",ot="_tooltipDate_2763s_336",st="_tooltipValue_2763s_342",t={container:Ee,controls:Ce,viewToggle:qe,viewButton:Le,active:$e,viewIcon:Ne,viewLabel:Ae,aggregationToggle:Ve,aggregationButton:Ie,aggregationIcon:Fe,aggregationLabel:We,legend:Be,compactLegend:Re,legendItem:He,legendEmoji:Oe,legendLabel:Ye,inactive:ze,legendColor:Qe,chart:Ue,gridLine:Pe,line:Ge,xAxis:Ke,yAxis:Xe,dataPoint:Je,tooltip:Ze,visible:et,tooltipHeader:tt,tooltipEmoji:at,tooltipDot:nt,tooltipInfo:rt,tooltipDate:ot,tooltipValue:st},lt={Exercise:"#6BCB77",Meditation:"#4D96FF",Reading:"#FFB319",Water:"#00D9FF",Steps:"#FF6B6B",Sleep:"#9B59B6",Calories:"#FF9F1C",Study:"#C774E8"},ge=({data:n,width:_=800,height:v=400,defaultViewType:M="daily",periodType:b="month",habitColors:U={},habitEmojis:P={},onDataPointClick:W,hideControls:me=!1,compactLegend:pe=!1})=>{const D=u.useRef(null),he=u.useRef(null),[g,ye]=u.useState(M),[E,G]=u.useState([]),[S,K]=u.useState(null),[h,C]=u.useState(null),[q,X]=u.useState("average"),y=u.useMemo(()=>({top:20,right:20,bottom:50,left:50}),[]),B=_-y.left-y.right,R=v-y.top-y.bottom,T=u.useMemo(()=>Object.keys(n).filter(e=>e!=="dates"),[n]);u.useEffect(()=>{G(T)},[T]),u.useEffect(()=>{const e=()=>{C(null)};return window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("scroll",e,!0)}},[]);const fe=u.useMemo(()=>{switch(b){case"week":return["daily"];case"month":return["daily","weekly"];case"quarter":return["weekly","monthly"];case"year":return["daily","weekly","monthly","quarterly"];case"allTime":return["monthly","quarterly"];default:return["daily"]}},[b]),j=u.useCallback(e=>U[e]||lt[e]||`hsl(${Math.abs(e.split("").reduce((o,s)=>o+s.charCodeAt(0),0))%360}, 70%, 50%)`,[U]),f=u.useMemo(()=>{if(g==="daily"||!n.dates.length)return n;const e={dates:[]},o=new Map;return n.dates.forEach((s,m)=>{const w=new Date(s);let l;switch(g){case"weekly":{const c=new Date(w),p=c.getDay(),L=c.getDate()-p+(p===0?-6:1);c.setDate(L),l=c.toISOString().split("T")[0];break}case"monthly":l=`${w.getFullYear()}-${String(w.getMonth()+1).padStart(2,"0")}-01`;break;case"quarterly":{const p=(Math.floor(w.getMonth()/3)+1-1)*3;l=new Date(w.getFullYear(),p,1).toISOString().split("T")[0];break}default:l=s}o.has(l)||o.set(l,[]),o.get(l).push(m)}),e.dates=Array.from(o.keys()).sort(),T.forEach(s=>{e[s]=e.dates.map(m=>{const l=o.get(m).map(c=>n[s][c]).filter(c=>typeof c=="number"&&!isNaN(c));return l.length===0?0:Math.round(q==="sum"?l.reduce((c,p)=>c+p,0):l.reduce((c,p)=>c+p,0)/l.length)})}),e},[n,g,T,q]),_e=e=>{G(o=>o.includes(e)?o.filter(s=>s!==e):[...o,e])};u.useEffect(()=>{if(!D.current||f.dates.length===0)return;const e=z(D.current);e.selectAll("*").remove(),e.append("rect").attr("width",_).attr("height",v).attr("fill","transparent").style("pointer-events","all").on("mouseleave",()=>{C(null)});const o=e.append("g").attr("transform",`translate(${y.left},${y.top})`),s=f.dates.map(a=>new Date(a)),m=be().domain(Me(s)).range([0,B]),w=Math.max(...E.flatMap(a=>f[a].filter(d=>typeof d=="number"))),l=je().domain([0,w*1.1]).range([R,0]);o.selectAll(".grid-line-y").data(l.ticks(5)).enter().append("line").attr("class",t.gridLine).attr("x1",0).attr("y1",a=>l(a)).attr("x2",B).attr("y2",a=>l(a));const c=Se().x(a=>m(a[0])).y(a=>l(a[1])).curve(Te);E.forEach(a=>{const d=s.map((i,x)=>[i,f[a][x]]).filter(i=>typeof i[1]=="number");o.append("path").datum(d).attr("class",t.line).attr("d",c).attr("stroke",j(a)).attr("opacity",S&&S!==a?.3:1),o.selectAll(`.hover-circle-${a}`).data(d).enter().append("circle").attr("cx",i=>m(i[0])).attr("cy",i=>l(i[1])).attr("r",10).attr("fill","transparent").style("cursor","pointer").on("mouseenter",function(i,x){var Z;const[k,$]=x,Y=(Z=D.current)==null?void 0:Z.getBoundingClientRect();Y&&C({habit:a,date:k.toISOString().split("T")[0],value:$,x:m(k)+y.left+Y.left,y:l($)+y.top+Y.top}),z(o.node()).selectAll(`.circle-${a}-${s.indexOf(k)}`).attr("r",6)}).on("mouseleave",function(i,x){C(null),z(o.node()).selectAll('[class*="circle-'+a+'"]').attr("r",4)}).on("click",function(i,x){const[k,$]=x;W&&W(a,k.toISOString().split("T")[0],$)}),o.selectAll(`.circle-${a}`).data(d).enter().append("circle").attr("class",(i,x)=>`${t.dataPoint} circle-${a}-${x}`).attr("cx",i=>m(i[0])).attr("cy",i=>l(i[1])).attr("r",4).attr("fill",j(a)).attr("opacity",S&&S!==a?.3:1).style("pointer-events","none")});const p=a=>{const d=new Date(a);d.setHours(0,0,0,0),d.setDate(d.getDate()+3-(d.getDay()+6)%7);const i=new Date(d.getFullYear(),0,4);return 1+Math.round(((d.getTime()-i.getTime())/864e5-3+(i.getDay()+6)%7)/7)},L=(()=>{switch(g){case"daily":return Q("%Y-%m-%d");case"weekly":return a=>{const d=p(a);return`${a.getFullYear()}-W${d.toString().padStart(2,"0")}`};case"monthly":return Q("%Y-%m");case"quarterly":return a=>{const d=Math.floor(a.getMonth()/3)+1;return`${a.getFullYear()}-Q${d}`};default:return Q("%Y-%m-%d")}})(),J=(()=>{switch(g){case"daily":return Math.min(10,f.dates.length);case"weekly":return Math.min(12,f.dates.length);case"monthly":return Math.min(12,f.dates.length);case"quarterly":return f.dates.length;default:return}})(),O=ke(m).tickFormat(a=>L(a));g==="quarterly"?O.tickValues(s):J&&O.ticks(J);const xe=o.append("g").attr("class",t.xAxis).attr("transform",`translate(0,${R})`).call(O);(g==="daily"||g==="weekly")&&xe.selectAll("text").style("text-anchor","end").attr("dx","-.8em").attr("dy",".15em").attr("transform","rotate(-45)"),o.append("g").attr("class",t.yAxis).call(De(l))},[f,E,B,R,y,S,W,j,v,g,_]);const ve=(e,o)=>{const s=new Date(e);switch(o){case"daily":return s.toLocaleDateString("en-US",{month:"short",day:"numeric",year:"numeric"});case"weekly":return new Date(s).setDate(s.getDate()+6),`Week of ${s.toLocaleDateString("en-US",{month:"short",day:"numeric"})}`;case"monthly":return s.toLocaleDateString("en-US",{month:"long",year:"numeric"});case"quarterly":return`Q${Math.floor(s.getMonth()/3)+1} ${s.getFullYear()}`;default:return e}},H={daily:{icon:"📅",label:"Daily"},weekly:{icon:"📆",label:"Weekly"},monthly:{icon:"🗓️",label:"Monthly"},quarterly:{icon:"📊",label:"Quarterly"}},we=g!=="daily";return r.jsxs("div",{className:t.container,children:[!me&&r.jsxs("div",{className:t.controls,children:[r.jsx("div",{className:t.viewToggle,children:fe.map(e=>r.jsxs("button",{className:`${t.viewButton} ${g===e?t.active:""}`,onClick:()=>ye(e),title:H[e].label,children:[r.jsx("span",{className:t.viewIcon,children:H[e].icon}),r.jsx("span",{className:t.viewLabel,children:H[e].label})]},e))}),we&&r.jsxs("div",{className:t.aggregationToggle,children:[r.jsxs("button",{className:`${t.aggregationButton} ${q==="average"?t.active:""}`,onClick:()=>X("average"),title:"Show average values for each period",children:[r.jsx("span",{className:t.aggregationIcon,children:"📊"}),r.jsx("span",{className:t.aggregationLabel,children:"Average"})]}),r.jsxs("button",{className:`${t.aggregationButton} ${q==="sum"?t.active:""}`,onClick:()=>X("sum"),title:"Show total values for each period",children:[r.jsx("span",{className:t.aggregationIcon,children:"➕"}),r.jsx("span",{className:t.aggregationLabel,children:"Sum"})]})]})]}),r.jsx("div",{className:`${t.legend}${pe?` ${t.compactLegend}`:""}`,children:T.map(e=>r.jsxs("button",{className:`${t.legendItem} ${E.includes(e)?"":t.inactive}`,onClick:()=>_e(e),onMouseEnter:()=>K(e),onMouseLeave:()=>K(null),children:[r.jsx("span",{className:t.legendEmoji,children:P[e]||"📊"}),r.jsx("span",{className:t.legendColor,style:{backgroundColor:j(e)}}),r.jsx("span",{className:t.legendLabel,children:e})]},e))}),r.jsx("svg",{ref:D,width:_,height:v,className:t.chart}),h&&r.jsxs("div",{ref:he,className:`${t.tooltip} ${h?t.visible:""}`,style:{left:`${h.x}px`,top:`${h.y-80}px`},children:[r.jsxs("div",{className:t.tooltipHeader,children:[r.jsx("span",{className:t.tooltipEmoji,children:P[h.habit]||"📊"}),r.jsx("span",{className:t.tooltipDot,style:{backgroundColor:j(h.habit)}}),r.jsx("span",{children:h.habit})]}),r.jsxs("div",{className:t.tooltipInfo,children:[r.jsx("div",{className:t.tooltipDate,children:ve(h.date,g)}),r.jsxs("div",{className:t.tooltipValue,children:[r.jsx("strong",{children:Math.round(h.value*10)/10}),r.jsx("span",{style:{fontSize:"12px",fontWeight:"normal",opacity:.6},children:"units"})]})]})]})]})};ge.__docgenInfo={description:"",methods:[],displayName:"QuantifiableHabitsChart",props:{data:{required:!0,tsType:{name:"ChartData"},description:""},width:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"800",computed:!1}},height:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"400",computed:!1}},defaultViewType:{required:!1,tsType:{name:"union",raw:"'daily' | 'weekly' | 'monthly' | 'quarterly'",elements:[{name:"literal",value:"'daily'"},{name:"literal",value:"'weekly'"},{name:"literal",value:"'monthly'"},{name:"literal",value:"'quarterly'"}]},description:"",defaultValue:{value:"'daily'",computed:!1}},periodType:{required:!1,tsType:{name:"union",raw:"'week' | 'month' | 'quarter' | 'year' | 'allTime'",elements:[{name:"literal",value:"'week'"},{name:"literal",value:"'month'"},{name:"literal",value:"'quarter'"},{name:"literal",value:"'year'"},{name:"literal",value:"'allTime'"}]},description:"",defaultValue:{value:"'month'",computed:!1}},habitColors:{required:!1,tsType:{name:"signature",type:"object",raw:"{ [key: string]: string }",signature:{properties:[{key:{name:"string"},value:{name:"string",required:!0}}]}},description:"",defaultValue:{value:"{}",computed:!1}},habitEmojis:{required:!1,tsType:{name:"signature",type:"object",raw:"{ [key: string]: string }",signature:{properties:[{key:{name:"string"},value:{name:"string",required:!0}}]}},description:"",defaultValue:{value:"{}",computed:!1}},onDataPointClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(habit: string, date: string, value: number) => void",signature:{arguments:[{type:{name:"string"},name:"habit"},{type:{name:"string"},name:"date"},{type:{name:"number"},name:"value"}],return:{name:"void"}}},description:""},hideControls:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}},compactLegend:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"false",computed:!1}}}};const ft={title:"Organisms/Charts/QuantifiableHabitsChart",component:ge,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:400,max:1200,step:50}},height:{control:{type:"number",min:200,max:600,step:50}},defaultViewType:{control:{type:"select"},options:["daily","weekly","monthly","quarterly"]},periodType:{control:{type:"select"},options:["week","month","quarter","year","allTime"]}}},F=n=>{const _=[],v=new Date;for(let M=n-1;M>=0;M--){const b=new Date(v);b.setDate(b.getDate()-M),_.push(b.toISOString().split("T")[0])}return _},N={args:{data:(()=>{const n=F(30);return{dates:n,Exercise:n.map(()=>Math.floor(Math.random()*60)+20),Reading:n.map(()=>Math.floor(Math.random()*120)+30),Water:n.map(()=>Math.floor(Math.random()*8)+2),Steps:n.map(()=>Math.floor(Math.random()*15e3)+5e3)}})(),width:900,height:400,defaultViewType:"daily",periodType:"month",habitColors:{Exercise:"#10b981",Reading:"#8b5cf6",Water:"#3b82f6",Steps:"#f59e0b"},habitEmojis:{Exercise:"🏃",Reading:"📚",Water:"💧",Steps:"👟"}}},A={args:{data:(()=>{const n=F(90);return{dates:n,Meditation:n.map(()=>Math.floor(Math.random()*30)+10),Study:n.map(()=>Math.floor(Math.random()*180)+60),Sleep:n.map(()=>Math.floor(Math.random()*3)+6)}})(),width:900,height:400,defaultViewType:"weekly",periodType:"quarter",habitColors:{Meditation:"#a78bfa",Study:"#34d399",Sleep:"#60a5fa"},habitEmojis:{Meditation:"🧘",Study:"📖",Sleep:"😴"}}},V={args:{data:(()=>{const n=F(365);return{dates:n,Coding:n.map(()=>Math.floor(Math.random()*240)+120),Exercise:n.map(()=>Math.floor(Math.random()*90)+30),Learning:n.map(()=>Math.floor(Math.random()*120)+60),Socializing:n.map(()=>Math.floor(Math.random()*180)+60)}})(),width:1e3,height:450,defaultViewType:"monthly",periodType:"year",habitColors:{Coding:"#7c3aed",Exercise:"#10b981",Learning:"#f59e0b",Socializing:"#ec4899"},habitEmojis:{Coding:"💻",Exercise:"💪",Learning:"🎓",Socializing:"👥"}}},I={args:{data:(()=>{const n=F(30);return{dates:n,Weight:n.map((_,v)=>70+Math.sin(v/5)*2+Math.random())}})(),width:800,height:300,defaultViewType:"daily",periodType:"month",habitColors:{Weight:"#3b82f6"},habitEmojis:{Weight:"⚖️"}}};var ee,te,ae;N.parameters={...N.parameters,docs:{...(ee=N.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
data: (() => {
|
|
4
4
|
const dates = generateDateRange(30);
|
|
@@ -102,4 +102,4 @@ import{r as u,j as r}from"./iframe-B8pH-Lvr.js";import{s as z}from"./transform-B
|
|
|
102
102
|
Weight: '⚖️'
|
|
103
103
|
}
|
|
104
104
|
}
|
|
105
|
-
}`,...(ue=(de=I.parameters)==null?void 0:de.docs)==null?void 0:ue.source}}};const
|
|
105
|
+
}`,...(ue=(de=I.parameters)==null?void 0:de.docs)==null?void 0:ue.source}}};const _t=["DailyHabits","WeeklyAverages","YearlyOverview","SingleHabit"];export{N as DailyHabits,I as SingleHabit,A as WeeklyAverages,V as YearlyOverview,_t as __namedExportsOrder,ft as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as y,j as W}from"./iframe-
|
|
1
|
+
import{r as y,j as W}from"./iframe-Cw8dCV4Z.js";import{R as D,P as G,M as U}from"./Mesh-CwXV3WjE.js";import{T as z}from"./Triangle-64ffRKNB.js";import"./preload-helper-C1FmrZbK.js";const j={"radar-container":"_radar-container_51ksp_1"};function L(n){const o=n.replace("#","");return[parseInt(o.slice(0,2),16)/255,parseInt(o.slice(2,4),16)/255,parseInt(o.slice(4,6),16)/255]}const N=`
|
|
2
2
|
attribute vec2 uv;
|
|
3
3
|
attribute vec2 position;
|
|
4
4
|
varying vec2 vUv;
|
|
@@ -67,7 +67,7 @@ void main() {
|
|
|
67
67
|
float alpha = clamp(length(col), 0.0, 1.0);
|
|
68
68
|
gl_FragColor = vec4(col, alpha);
|
|
69
69
|
}
|
|
70
|
-
`;function F({speed:n=1,scale:
|
|
70
|
+
`;function F({speed:n=1,scale:o=.5,ringCount:v=10,spokeCount:h=10,ringThickness:g=.05,spokeThickness:w=.01,sweepSpeed:S=1,sweepWidth:k=2,sweepLobes:C=1,color:R="#9f29ff",backgroundColor:x="#000000",falloff:T=2,brightness:M=1,enableMouseInteraction:s=!0,mouseInfluence:q=.1}){const c=y.useRef(null);return y.useEffect(()=>{if(!c.current)return;const l=c.current,d=new D({alpha:!0,premultipliedAlpha:!1}),e=d.gl;e.clearColor(0,0,0,0);let a,t=[.5,.5],r=[.5,.5];function b(u){const i=e.canvas.getBoundingClientRect();r=[(u.clientX-i.left)/i.width,1-(u.clientY-i.top)/i.height]}function V(){r=[.5,.5]}function m(){d.setSize(l.offsetWidth,l.offsetHeight),a&&(a.uniforms.uResolution.value=[e.canvas.width,e.canvas.height,e.canvas.width/e.canvas.height])}window.addEventListener("resize",m),m();const I=new z(e);a=new G(e,{vertex:N,fragment:H,uniforms:{uTime:{value:0},uResolution:{value:[e.canvas.width,e.canvas.height,e.canvas.width/e.canvas.height]},uSpeed:{value:n},uScale:{value:o},uRingCount:{value:v},uSpokeCount:{value:h},uRingThickness:{value:g},uSpokeThickness:{value:w},uSweepSpeed:{value:S},uSweepWidth:{value:k},uSweepLobes:{value:C},uColor:{value:L(R)},uBgColor:{value:L(x)},uFalloff:{value:T},uBrightness:{value:M},uMouse:{value:new Float32Array([.5,.5])},uMouseInfluence:{value:q},uEnableMouse:{value:s}}});const P=new U(e,{geometry:I,program:a});l.appendChild(e.canvas),s&&(e.canvas.addEventListener("mousemove",b),e.canvas.addEventListener("mouseleave",V));let p;function E(u){p=requestAnimationFrame(E),a.uniforms.uTime.value=u*.001,s?(t[0]+=.05*(r[0]-t[0]),t[1]+=.05*(r[1]-t[1]),a.uniforms.uMouse.value[0]=t[0],a.uniforms.uMouse.value[1]=t[1]):(a.uniforms.uMouse.value[0]=.5,a.uniforms.uMouse.value[1]=.5),d.render({scene:P})}return p=requestAnimationFrame(E),()=>{var u;cancelAnimationFrame(p),window.removeEventListener("resize",m),s&&(e.canvas.removeEventListener("mousemove",b),e.canvas.removeEventListener("mouseleave",V)),l.removeChild(e.canvas),(u=e.getExtension("WEBGL_lose_context"))==null||u.loseContext()}},[n,o,v,h,g,w,S,k,C,R,x,T,M,s,q]),W.jsx("div",{ref:c,className:`${j["radar-container"]}`})}F.__docgenInfo={description:"",methods:[],displayName:"Radar",props:{speed:{defaultValue:{value:"1.0",computed:!1},required:!1},scale:{defaultValue:{value:"0.5",computed:!1},required:!1},ringCount:{defaultValue:{value:"10.0",computed:!1},required:!1},spokeCount:{defaultValue:{value:"10.0",computed:!1},required:!1},ringThickness:{defaultValue:{value:"0.05",computed:!1},required:!1},spokeThickness:{defaultValue:{value:"0.01",computed:!1},required:!1},sweepSpeed:{defaultValue:{value:"1.0",computed:!1},required:!1},sweepWidth:{defaultValue:{value:"2.0",computed:!1},required:!1},sweepLobes:{defaultValue:{value:"1.0",computed:!1},required:!1},color:{defaultValue:{value:"'#9f29ff'",computed:!1},required:!1},backgroundColor:{defaultValue:{value:"'#000000'",computed:!1},required:!1},falloff:{defaultValue:{value:"2.0",computed:!1},required:!1},brightness:{defaultValue:{value:"1.0",computed:!1},required:!1},enableMouseInteraction:{defaultValue:{value:"true",computed:!1},required:!1},mouseInfluence:{defaultValue:{value:"0.1",computed:!1},required:!1}}};const J={title:"ReactBits/Backgrounds/Radar",component:F,parameters:{layout:"fullscreen"}},f={args:{speed:1,scale:.5,ringCount:10,spokeCount:10,ringThickness:.05,spokeThickness:.01,sweepSpeed:1,sweepWidth:2,sweepLobes:1,color:"#9f29ff",backgroundColor:"#000000",falloff:2,brightness:1,enableMouseInteraction:!0,mouseInfluence:.1}};var B,_,A;f.parameters={...f.parameters,docs:{...(B=f.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
71
71
|
args: {
|
|
72
72
|
speed: 1.0,
|
|
73
73
|
scale: 0.5,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as D,j as X}from"./iframe-
|
|
1
|
+
import{r as D,j as X}from"./iframe-Cw8dCV4Z.js";import{G as Y,P as $,M as J,V as m,R as K,T as Q}from"./Mesh-CwXV3WjE.js";import{V as Z}from"./Vec2-Cf1C3GIc.js";import{C as j}from"./Color-YRkaOI4u.js";import"./preload-helper-C1FmrZbK.js";const v=new m;class ee{constructor(o,{points:t,vertex:w=te,fragment:E=oe,uniforms:r={},attributes:R={}}){this.gl=o,this.points=t,this.count=t.length,this.position=new Float32Array(this.count*3*2),this.prev=new Float32Array(this.count*3*2),this.next=new Float32Array(this.count*3*2);const h=new Float32Array(this.count*1*2),y=new Float32Array(this.count*2*2),p=new Uint16Array((this.count-1)*3*2);for(let l=0;l<this.count;l++){h.set([-1,1],l*2);const n=l/(this.count-1);if(y.set([0,n,1,n],l*4),l===this.count-1)continue;const s=l*2;p.set([s+0,s+1,s+2],(s+0)*3),p.set([s+2,s+1,s+3],(s+1)*3)}const A=this.geometry=new Y(o,Object.assign(R,{position:{size:3,data:this.position},prev:{size:3,data:this.prev},next:{size:3,data:this.next},side:{size:1,data:h},uv:{size:2,data:y},index:{size:1,data:p}}));this.updateGeometry(),r.uResolution||(this.resolution=r.uResolution={value:new Z}),r.uDPR||(this.dpr=r.uDPR={value:1}),r.uThickness||(this.thickness=r.uThickness={value:1}),r.uColor||(this.color=r.uColor={value:new j("#000")}),r.uMiter||(this.miter=r.uMiter={value:1}),this.resize();const u=this.program=new $(o,{vertex:w,fragment:E,uniforms:r});this.mesh=new J(o,{geometry:A,program:u})}updateGeometry(){this.points.forEach((o,t)=>{o.toArray(this.position,t*3*2),o.toArray(this.position,t*3*2+3),t?(o.toArray(this.next,(t-1)*3*2),o.toArray(this.next,(t-1)*3*2+3)):(v.copy(o).sub(this.points[t+1]).add(o),v.toArray(this.prev,t*3*2),v.toArray(this.prev,t*3*2+3)),t===this.points.length-1?(v.copy(o).sub(this.points[t-1]).add(o),v.toArray(this.next,t*3*2),v.toArray(this.next,t*3*2+3)):(o.toArray(this.prev,(t+1)*3*2),o.toArray(this.prev,(t+1)*3*2+3))}),this.geometry.attributes.position.needsUpdate=!0,this.geometry.attributes.prev.needsUpdate=!0,this.geometry.attributes.next.needsUpdate=!0}resize(){this.resolution&&this.resolution.value.set(this.gl.canvas.width,this.gl.canvas.height),this.dpr&&(this.dpr.value=this.gl.renderer.dpr)}}const te=`
|
|
2
2
|
precision highp float;
|
|
3
3
|
|
|
4
4
|
attribute vec3 position;
|
|
@@ -58,7 +58,7 @@ import{r as D,j as X}from"./iframe-B8pH-Lvr.js";import{G as Y,P as $,M as J,V as
|
|
|
58
58
|
gl_FragColor.rgb = uColor;
|
|
59
59
|
gl_FragColor.a = 1.0;
|
|
60
60
|
}
|
|
61
|
-
`,ne={"ribbons-container":"_ribbons-container_pcfby_1"},G=({colors:b=["#FC8EAC"],baseSpring:o=.03,baseFriction:t=.9,baseThickness:w=30,offsetFactor:E=.05,maxAge:r=500,pointCount:R=50,speedMultiplier:h=.6,enableFade:y=!1,enableShaderEffect:p=!1,effectAmplitude:A=2,backgroundColor:
|
|
61
|
+
`,ne={"ribbons-container":"_ribbons-container_pcfby_1"},G=({colors:b=["#FC8EAC"],baseSpring:o=.03,baseFriction:t=.9,baseThickness:w=30,offsetFactor:E=.05,maxAge:r=500,pointCount:R=50,speedMultiplier:h=.6,enableFade:y=!1,enableShaderEffect:p=!1,effectAmplitude:A=2,backgroundColor:u=[0,0,0,0]})=>{const l=D.useRef(null);return D.useEffect(()=>{const n=l.current;if(!n)return;const s=new K({dpr:window.devicePixelRatio||2,alpha:!0}),c=s.gl;Array.isArray(u)&&u.length===4?c.clearColor(u[0],u[1],u[2],u[3]):c.clearColor(0,0,0,0),c.canvas.style.position="absolute",c.canvas.style.top="0",c.canvas.style.left="0",c.canvas.style.width="100%",c.canvas.style.height="100%",n.appendChild(c.canvas);const T=new Q,C=[],N=`
|
|
62
62
|
precision highp float;
|
|
63
63
|
|
|
64
64
|
attribute vec3 position;
|
|
@@ -114,7 +114,7 @@ import{r as D,j as X}from"./iframe-B8pH-Lvr.js";import{G as Y,P as $,M as J,V as
|
|
|
114
114
|
}
|
|
115
115
|
gl_FragColor = vec4(uColor, uOpacity * fadeFactor);
|
|
116
116
|
}
|
|
117
|
-
`;function P(){const a=n.clientWidth,d=n.clientHeight;
|
|
117
|
+
`;function P(){const a=n.clientWidth,d=n.clientHeight;s.setSize(a,d),C.forEach(e=>e.polyline.resize())}window.addEventListener("resize",P);const H=(b.length-1)/2;b.forEach((a,d)=>{const e=o+(Math.random()-.5)*.05,i=t+(Math.random()-.5)*.05,g=w+(Math.random()-.5)*3,x=new m((d-H)*E+(Math.random()-.5)*.01,(Math.random()-.5)*.1,0),F={spring:e,friction:i,mouseVelocity:new m,mouseOffset:x},I=R,S=[];for(let W=0;W<I;W++)S.push(new m);F.points=S,F.polyline=new ee(c,{points:S,vertex:N,fragment:B,uniforms:{uColor:{value:new j(a)},uThickness:{value:g},uOpacity:{value:1},uTime:{value:0},uEnableShaderEffect:{value:p?1:0},uEffectAmplitude:{value:A},uEnableFade:{value:y?1:0}}}),F.polyline.mesh.setParent(T),C.push(F)}),P();const M=new m;function f(a){let d,e;const i=n.getBoundingClientRect();a.changedTouches&&a.changedTouches.length?(d=a.changedTouches[0].clientX-i.left,e=a.changedTouches[0].clientY-i.top):(d=a.clientX-i.left,e=a.clientY-i.top);const g=n.clientWidth,x=n.clientHeight;M.set(d/g*2-1,e/x*-2+1,0)}n.addEventListener("mousemove",f),n.addEventListener("touchstart",f),n.addEventListener("touchmove",f);const z=new m;let q,_=performance.now();function U(){q=requestAnimationFrame(U);const a=performance.now(),d=a-_;_=a,C.forEach(e=>{z.copy(M).add(e.mouseOffset).sub(e.points[0]).multiply(e.spring),e.mouseVelocity.add(z).multiply(e.friction),e.points[0].add(e.mouseVelocity);for(let i=1;i<e.points.length;i++)if(isFinite(r)&&r>0){const g=r/(e.points.length-1),x=Math.min(1,d*h/g);e.points[i].lerp(e.points[i-1],x)}else e.points[i].lerp(e.points[i-1],.9);e.polyline.mesh.program.uniforms.uTime&&(e.polyline.mesh.program.uniforms.uTime.value=a*.001),e.polyline.updateGeometry()}),s.render({scene:T})}return U(),()=>{window.removeEventListener("resize",P),n.removeEventListener("mousemove",f),n.removeEventListener("touchstart",f),n.removeEventListener("touchmove",f),cancelAnimationFrame(q),c.canvas&&c.canvas.parentNode===n&&n.removeChild(c.canvas)}},[b,o,t,w,E,r,R,h,y,p,A,u]),X.jsx("div",{ref:l,className:`${ne["ribbons-container"]}`})};G.__docgenInfo={description:"",methods:[],displayName:"Ribbons",props:{colors:{defaultValue:{value:"['#FC8EAC']",computed:!1},required:!1},baseSpring:{defaultValue:{value:"0.03",computed:!1},required:!1},baseFriction:{defaultValue:{value:"0.9",computed:!1},required:!1},baseThickness:{defaultValue:{value:"30",computed:!1},required:!1},offsetFactor:{defaultValue:{value:"0.05",computed:!1},required:!1},maxAge:{defaultValue:{value:"500",computed:!1},required:!1},pointCount:{defaultValue:{value:"50",computed:!1},required:!1},speedMultiplier:{defaultValue:{value:"0.6",computed:!1},required:!1},enableFade:{defaultValue:{value:"false",computed:!1},required:!1},enableShaderEffect:{defaultValue:{value:"false",computed:!1},required:!1},effectAmplitude:{defaultValue:{value:"2",computed:!1},required:!1},backgroundColor:{defaultValue:{value:"[0, 0, 0, 0]",computed:!1},required:!1}}};const le={title:"ReactBits/Animations/Ribbons",component:G,parameters:{layout:"fullscreen"}},V={args:{colors:["#FC8EAC"],baseSpring:.03,baseFriction:.9,baseThickness:30,offsetFactor:.05,maxAge:500,pointCount:50,speedMultiplier:.6,enableFade:!1,enableShaderEffect:!1,effectAmplitude:2,backgroundColor:[0,0,0,0]}};var k,L,O;V.parameters={...V.parameters,docs:{...(k=V.parameters)==null?void 0:k.docs,source:{originalSource:`{
|
|
118
118
|
args: {
|
|
119
119
|
colors: ['#FC8EAC'],
|
|
120
120
|
baseSpring: 0.03,
|
|
@@ -129,4 +129,4 @@ import{r as D,j as X}from"./iframe-B8pH-Lvr.js";import{G as Y,P as $,M as J,V as
|
|
|
129
129
|
effectAmplitude: 2,
|
|
130
130
|
backgroundColor: [0, 0, 0, 0]
|
|
131
131
|
}
|
|
132
|
-
}`,...(O=(L=V.parameters)==null?void 0:L.docs)==null?void 0:O.source}}};const
|
|
132
|
+
}`,...(O=(L=V.parameters)==null?void 0:L.docs)==null?void 0:O.source}}};const ue=["Default"];export{V as Default,ue as __namedExportsOrder,le as default};
|
package/storybook-static/assets/{RippleGrid.stories-QV9Doq9P.js → RippleGrid.stories-CFh8tigy.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as u,j as N}from"./iframe-
|
|
1
|
+
import{r as u,j as N}from"./iframe-Cw8dCV4Z.js";import{R as G,P as j,M as H}from"./Mesh-CwXV3WjE.js";import{T as $}from"./Triangle-64ffRKNB.js";import"./preload-helper-C1FmrZbK.js";const O={"ripple-grid-container":"_ripple-grid-container_1783h_1"},P=({enableRainbow:d=!1,gridColor:v="#ffffff",rippleIntensity:m=.05,gridSize:p=10,gridThickness:g=15,fadeDistance:h=1.5,vignetteStrength:R=2,glowIntensity:y=.1,opacity:x=1,gridRotation:I=0,mouseInteraction:i=!0,mouseInteractionRadius:w=1})=>{const r=u.useRef(null),l=u.useRef({x:.5,y:.5}),T=u.useRef({x:.5,y:.5}),b=u.useRef(0),n=u.useRef(null);return u.useEffect(()=>{if(!r.current)return;const E=o=>{const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(o);return t?[parseInt(t[1],16)/255,parseInt(t[2],16)/255,parseInt(t[3],16)/255]:[1,1,1]},c=new G({dpr:Math.min(window.devicePixelRatio,2),alpha:!0}),e=c.gl;e.enable(e.BLEND),e.blendFunc(e.SRC_ALPHA,e.ONE_MINUS_SRC_ALPHA),e.canvas.style.width="100%",e.canvas.style.height="100%",r.current.appendChild(e.canvas);const z=`
|
|
2
2
|
attribute vec2 position;
|
|
3
3
|
varying vec2 vUv;
|
|
4
4
|
void main() {
|
|
@@ -95,7 +95,7 @@ void main() {
|
|
|
95
95
|
float finalFade = ddd * vignette;
|
|
96
96
|
float alpha = length(color) * finalFade * opacity;
|
|
97
97
|
gl_FragColor = vec4(color * t * finalFade * opacity, alpha);
|
|
98
|
-
}`,a={iTime:{value:0},iResolution:{value:[1,1]},enableRainbow:{value:d},gridColor:{value:E(v)},rippleIntensity:{value:m},gridSize:{value:p},gridThickness:{value:g},fadeDistance:{value:h},vignetteStrength:{value:R},glowIntensity:{value:y},opacity:{value:x},gridRotation:{value:I},mouseInteraction:{value:i},mousePosition:{value:[.5,.5]},mouseInfluence:{value:0},mouseInteractionRadius:{value:w}};n.current=a;const F=new $(e),W=new j(e,{vertex:z,fragment:M,uniforms:a}),A=new H(e,{geometry:F,program:W}),S=()=>{const{clientWidth:o,clientHeight:t}=r.current;c.setSize(o,t),a.iResolution.value=[o,t]},C=o=>{if(!i||!r.current)return;const t=r.current.getBoundingClientRect(),_=(o.clientX-t.left)/t.width,q=1-(o.clientY-t.top)/t.height;T.current={x:_,y:q}},D=()=>{i&&(b.current=1)},L=()=>{i&&(b.current=0)};window.addEventListener("resize",S),i&&(r.current.addEventListener("mousemove",C),r.current.addEventListener("mouseenter",D),r.current.addEventListener("mouseleave",L)),S();const U=o=>{a.iTime.value=o*.001;const t=.1;l.current.x+=(T.current.x-l.current.x)*t,l.current.y+=(T.current.y-l.current.y)*t;const _=a.mouseInfluence.value,q=b.current;a.mouseInfluence.value+=(q-_)*.05,a.mousePosition.value=[l.current.x,l.current.y],c.render({scene:A}),requestAnimationFrame(U)};requestAnimationFrame(U);const s=r.current;return()=>{var o;window.removeEventListener("resize",S),i&&s&&(s.removeEventListener("mousemove",C),s.removeEventListener("mouseenter",D),s.removeEventListener("mouseleave",L)),(o=c.gl.getExtension("WEBGL_lose_context"))==null||o.loseContext(),s==null||s.removeChild(e.canvas)}},[]),u.useEffect(()=>{if(!n.current)return;const E=c=>{const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(c);return e?[parseInt(e[1],16)/255,parseInt(e[2],16)/255,parseInt(e[3],16)/255]:[1,1,1]};n.current.enableRainbow.value=d,n.current.gridColor.value=E(v),n.current.rippleIntensity.value=m,n.current.gridSize.value=p,n.current.gridThickness.value=g,n.current.fadeDistance.value=h,n.current.vignetteStrength.value=R,n.current.glowIntensity.value=y,n.current.opacity.value=x,n.current.gridRotation.value=I,n.current.mouseInteraction.value=i,n.current.mouseInteractionRadius.value=w},[d,v,m,p,g,h,R,y,x,I,i,w]),N.jsx("div",{ref:r,className:`${O["ripple-grid-container"]}`})};P.__docgenInfo={description:"",methods:[],displayName:"RippleGrid",props:{enableRainbow:{defaultValue:{value:"false",computed:!1},required:!1},gridColor:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},rippleIntensity:{defaultValue:{value:"0.05",computed:!1},required:!1},gridSize:{defaultValue:{value:"10.0",computed:!1},required:!1},gridThickness:{defaultValue:{value:"15.0",computed:!1},required:!1},fadeDistance:{defaultValue:{value:"1.5",computed:!1},required:!1},vignetteStrength:{defaultValue:{value:"2.0",computed:!1},required:!1},glowIntensity:{defaultValue:{value:"0.1",computed:!1},required:!1},opacity:{defaultValue:{value:"1.0",computed:!1},required:!1},gridRotation:{defaultValue:{value:"0",computed:!1},required:!1},mouseInteraction:{defaultValue:{value:"true",computed:!1},required:!1},mouseInteractionRadius:{defaultValue:{value:"1",computed:!1},required:!1}}};const Q={title:"ReactBits/Backgrounds/RippleGrid",component:P,parameters:{layout:"fullscreen"}
|
|
98
|
+
}`,a={iTime:{value:0},iResolution:{value:[1,1]},enableRainbow:{value:d},gridColor:{value:E(v)},rippleIntensity:{value:m},gridSize:{value:p},gridThickness:{value:g},fadeDistance:{value:h},vignetteStrength:{value:R},glowIntensity:{value:y},opacity:{value:x},gridRotation:{value:I},mouseInteraction:{value:i},mousePosition:{value:[.5,.5]},mouseInfluence:{value:0},mouseInteractionRadius:{value:w}};n.current=a;const F=new $(e),W=new j(e,{vertex:z,fragment:M,uniforms:a}),A=new H(e,{geometry:F,program:W}),S=()=>{const{clientWidth:o,clientHeight:t}=r.current;c.setSize(o,t),a.iResolution.value=[o,t]},C=o=>{if(!i||!r.current)return;const t=r.current.getBoundingClientRect(),_=(o.clientX-t.left)/t.width,q=1-(o.clientY-t.top)/t.height;T.current={x:_,y:q}},D=()=>{i&&(b.current=1)},L=()=>{i&&(b.current=0)};window.addEventListener("resize",S),i&&(r.current.addEventListener("mousemove",C),r.current.addEventListener("mouseenter",D),r.current.addEventListener("mouseleave",L)),S();const U=o=>{a.iTime.value=o*.001;const t=.1;l.current.x+=(T.current.x-l.current.x)*t,l.current.y+=(T.current.y-l.current.y)*t;const _=a.mouseInfluence.value,q=b.current;a.mouseInfluence.value+=(q-_)*.05,a.mousePosition.value=[l.current.x,l.current.y],c.render({scene:A}),requestAnimationFrame(U)};requestAnimationFrame(U);const s=r.current;return()=>{var o;window.removeEventListener("resize",S),i&&s&&(s.removeEventListener("mousemove",C),s.removeEventListener("mouseenter",D),s.removeEventListener("mouseleave",L)),(o=c.gl.getExtension("WEBGL_lose_context"))==null||o.loseContext(),s==null||s.removeChild(e.canvas)}},[]),u.useEffect(()=>{if(!n.current)return;const E=c=>{const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(c);return e?[parseInt(e[1],16)/255,parseInt(e[2],16)/255,parseInt(e[3],16)/255]:[1,1,1]};n.current.enableRainbow.value=d,n.current.gridColor.value=E(v),n.current.rippleIntensity.value=m,n.current.gridSize.value=p,n.current.gridThickness.value=g,n.current.fadeDistance.value=h,n.current.vignetteStrength.value=R,n.current.glowIntensity.value=y,n.current.opacity.value=x,n.current.gridRotation.value=I,n.current.mouseInteraction.value=i,n.current.mouseInteractionRadius.value=w},[d,v,m,p,g,h,R,y,x,I,i,w]),N.jsx("div",{ref:r,className:`${O["ripple-grid-container"]}`})};P.__docgenInfo={description:"",methods:[],displayName:"RippleGrid",props:{enableRainbow:{defaultValue:{value:"false",computed:!1},required:!1},gridColor:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},rippleIntensity:{defaultValue:{value:"0.05",computed:!1},required:!1},gridSize:{defaultValue:{value:"10.0",computed:!1},required:!1},gridThickness:{defaultValue:{value:"15.0",computed:!1},required:!1},fadeDistance:{defaultValue:{value:"1.5",computed:!1},required:!1},vignetteStrength:{defaultValue:{value:"2.0",computed:!1},required:!1},glowIntensity:{defaultValue:{value:"0.1",computed:!1},required:!1},opacity:{defaultValue:{value:"1.0",computed:!1},required:!1},gridRotation:{defaultValue:{value:"0",computed:!1},required:!1},mouseInteraction:{defaultValue:{value:"true",computed:!1},required:!1},mouseInteractionRadius:{defaultValue:{value:"1",computed:!1},required:!1}}};const Q={title:"ReactBits/Backgrounds/RippleGrid",component:P,parameters:{layout:"fullscreen"}},f={args:{enableRainbow:!1,gridColor:"#ffffff",rippleIntensity:.05,gridSize:10,gridThickness:15,fadeDistance:1.5,vignetteStrength:2,glowIntensity:.1,opacity:1,gridRotation:0,mouseInteraction:!0,mouseInteractionRadius:1}};var B,V,k;f.parameters={...f.parameters,docs:{...(B=f.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
99
99
|
args: {
|
|
100
100
|
enableRainbow: false,
|
|
101
101
|
gridColor: '#ffffff',
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import{r as s,j as
|
|
2
|
-
`).map((a,r,n)=>({characters:[a],needsSpace:r!==n.length-1})):t.split(p).map((a,r,n)=>({characters:[a],needsSpace:r!==n.length-1}))},[o,e,p]),J=s.useCallback((t,a)=>{const r=a;if(u==="first")return t*m;if(u==="last")return(r-1-t)*m;if(u==="center"){const n=Math.floor(r/2);return Math.abs(n-t)*m}if(u==="random"){const n=Math.floor(Math.random()*r);return Math.abs(n-t)*m}return Math.abs(u-t)*m},[u,m]),
|
|
1
|
+
import{r as s,j as c}from"./iframe-Cw8dCV4Z.js";import{m as C}from"./proxy-p8L3T_Zy.js";import{A as Q}from"./index-CzApopWo.js";import"./preload-helper-C1FmrZbK.js";import"./MotionConfigContext-BCa1jVYq.js";const i={"text-rotate":"_text-rotate_1n8cd_1","text-rotate-sr-only":"_text-rotate-sr-only_1n8cd_8","text-rotate-word":"_text-rotate-word_1n8cd_20","text-rotate-lines":"_text-rotate-lines_1n8cd_24","text-rotate-element":"_text-rotate-element_1n8cd_30","text-rotate-space":"_text-rotate-space_1n8cd_34"};function h(...y){return y.filter(Boolean).join(" ")}const v=s.forwardRef((y,D)=>{const{texts:o,transition:N={type:"spring",damping:25,stiffness:300},initial:w={y:"100%",opacity:0},animate:A={y:0,opacity:1},exit:E={y:"-120%",opacity:0},animatePresenceMode:F="wait",animatePresenceInitial:H=!1,rotationInterval:j=2e3,staggerDuration:m=0,staggerFrom:u="first",loop:d=!0,auto:M=!0,splitBy:p="characters",onNext:_,mainClassName:P,splitLevelClassName:L,elementLevelClassName:W,...$}=y,[e,q]=s.useState(0),z=t=>{if(typeof Intl<"u"&&Intl.Segmenter){const a=new Intl.Segmenter("en",{granularity:"grapheme"});return Array.from(a.segment(t),r=>r.segment)}return Array.from(t)},G=s.useMemo(()=>{const t=o[e];if(p==="characters"){const a=t.split(" ");return a.map((r,n)=>({characters:z(r),needsSpace:n!==a.length-1}))}return p==="words"?t.split(" ").map((a,r,n)=>({characters:[a],needsSpace:r!==n.length-1})):p==="lines"?t.split(`
|
|
2
|
+
`).map((a,r,n)=>({characters:[a],needsSpace:r!==n.length-1})):t.split(p).map((a,r,n)=>({characters:[a],needsSpace:r!==n.length-1}))},[o,e,p]),J=s.useCallback((t,a)=>{const r=a;if(u==="first")return t*m;if(u==="last")return(r-1-t)*m;if(u==="center"){const n=Math.floor(r/2);return Math.abs(n-t)*m}if(u==="random"){const n=Math.floor(Math.random()*r);return Math.abs(n-t)*m}return Math.abs(u-t)*m},[u,m]),l=s.useCallback(t=>{q(t),_&&_(t)},[_]),x=s.useCallback(()=>{const t=e===o.length-1?d?0:e:e+1;t!==e&&l(t)},[e,o.length,d,l]),S=s.useCallback(()=>{const t=e===0?d?o.length-1:e:e-1;t!==e&&l(t)},[e,o.length,d,l]),R=s.useCallback(t=>{const a=Math.max(0,Math.min(t,o.length-1));a!==e&&l(a)},[o.length,e,l]),T=s.useCallback(()=>{e!==0&&l(0)},[e,l]);return s.useImperativeHandle(D,()=>({next:x,previous:S,jumpTo:R,reset:T}),[x,S,R,T]),s.useEffect(()=>{if(!M)return;const t=setInterval(x,j);return()=>clearInterval(t)},[x,j,M]),c.jsxs(C.span,{className:h(i["text-rotate"],P),...$,layout:!0,transition:N,children:[c.jsx("span",{className:`${i["text-rotate-sr-only"]}`,children:o[e]}),c.jsx(Q,{mode:F,initial:H,children:c.jsx(C.span,{className:h(p==="lines"?i["text-rotate-lines"]:i["text-rotate"]),layout:!0,"aria-hidden":"true",children:G.map((t,a,r)=>{const n=r.slice(0,a).reduce((I,g)=>I+g.characters.length,0);return c.jsxs("span",{className:h(i["text-rotate-word"],L),children:[t.characters.map((I,g)=>c.jsx(C.span,{initial:w,animate:A,exit:E,transition:{...N,delay:J(n+g,r.reduce((K,O)=>K+O.characters.length,0))},className:h(i["text-rotate-element"],W),children:I},g)),t.needsSpace&&c.jsx("span",{className:`${i["text-rotate-space"]}`,children:" "})]},a)})},e)})]})});v.displayName="RotatingText";v.__docgenInfo={description:"",methods:[],displayName:"RotatingText"};const tt={title:"ReactBits/TextAnimations/RotatingText",component:v,parameters:{layout:"fullscreen"}},f={args:{texts:["Hello","World","React","Bits"],rotationInterval:2e3,loop:!0,auto:!0,splitBy:"characters",staggerDuration:0,staggerFrom:"first"}};var b,B,k;f.parameters={...f.parameters,docs:{...(b=f.parameters)==null?void 0:b.docs,source:{originalSource:`{
|
|
3
3
|
args: {
|
|
4
4
|
texts: ['Hello', 'World', 'React', 'Bits'],
|
|
5
5
|
rotationInterval: 2000,
|
package/storybook-static/assets/{ScrollFloat.stories-BaX43Ike.js → ScrollFloat.stories-Ct_ZkL7k.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as s,j as c}from"./iframe-
|
|
1
|
+
import{r as s,j as c}from"./iframe-Cw8dCV4Z.js";import{g as _}from"./index-C8pce-KX.js";import{S as q}from"./ScrollTrigger-D1XJUMov.js";import"./preload-helper-C1FmrZbK.js";const v="_char_46mmt_13",n={"scroll-float":"_scroll-float_46mmt_1","scroll-float-text":"_scroll-float-text_46mmt_5",char:v};_.registerPlugin(q);const h=({children:l,scrollContainerRef:e,containerClassName:S="",textClassName:y="",animationDuration:u=1,ease:m="back.inOut(2)",scrollStart:i="center bottom+=50%",scrollEnd:f="bottom bottom-=40%",stagger:d=.03})=>{const p=s.useRef(null),N=s.useMemo(()=>(typeof l=="string"?l:"").split("").map((a,o)=>c.jsx("span",{className:`${n.char}`,children:a===" "?" ":a},o)),[l]);return s.useEffect(()=>{const t=p.current;if(!t)return;const a=e&&e.current?e.current:window,o=t.querySelectorAll(".char");_.fromTo(o,{willChange:"opacity, transform",opacity:0,yPercent:120,scaleY:2.3,scaleX:.7,transformOrigin:"50% 0%"},{duration:u,ease:m,opacity:1,yPercent:0,scaleY:1,scaleX:1,stagger:d,scrollTrigger:{trigger:t,scroller:a,start:i,end:f,scrub:!0}})},[e,u,m,i,f,d]),c.jsx("h2",{ref:p,className:`${n["scroll-float"]} ${S}`,children:c.jsx("span",{className:`${n["scroll-float-text"]} ${y}`,children:N})})};h.__docgenInfo={description:"",methods:[],displayName:"ScrollFloat",props:{containerClassName:{defaultValue:{value:"''",computed:!1},required:!1},textClassName:{defaultValue:{value:"''",computed:!1},required:!1},animationDuration:{defaultValue:{value:"1",computed:!1},required:!1},ease:{defaultValue:{value:"'back.inOut(2)'",computed:!1},required:!1},scrollStart:{defaultValue:{value:"'center bottom+=50%'",computed:!1},required:!1},scrollEnd:{defaultValue:{value:"'bottom bottom-=40%'",computed:!1},required:!1},stagger:{defaultValue:{value:"0.03",computed:!1},required:!1}}};const C={title:"ReactBits/TextAnimations/ScrollFloat",component:h,parameters:{layout:"fullscreen"}},r={args:{children:"Hello World",containerClassName:"",textClassName:"",animationDuration:1,ease:"back.inOut(2)",scrollStart:"center bottom+=50%",scrollEnd:"bottom bottom-=40%",stagger:.03}};var g,x,b;r.parameters={...r.parameters,docs:{...(g=r.parameters)==null?void 0:g.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
children: 'Hello World',
|
|
4
4
|
containerClassName: '',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as
|
|
1
|
+
import{r as u,j as c}from"./iframe-Cw8dCV4Z.js";import{g as l}from"./index-C8pce-KX.js";import{S as _}from"./ScrollTrigger-D1XJUMov.js";import"./preload-helper-C1FmrZbK.js";const T="_word_1yrz7_11",m={"scroll-reveal":"_scroll-reveal_1yrz7_1","scroll-reveal-text":"_scroll-reveal-text_1yrz7_5",word:T};l.registerPlugin(_);const h=({children:s,scrollContainerRef:r,enableBlur:i=!0,baseOpacity:d=.1,baseRotation:f=3,blurStrength:p=4,containerClassName:S="",textClassName:N="",rotationEnd:b="bottom bottom",wordAnimationEnd:n="bottom bottom"})=>{const g=u.useRef(null),q=u.useMemo(()=>(typeof s=="string"?s:"").split(/(\s+)/).map((t,o)=>t.match(/^\s+$/)?t:c.jsx("span",{className:`${m.word}`,children:t},o)),[s]);return u.useEffect(()=>{const e=g.current;if(!e)return;const t=r&&r.current?r.current:window;l.fromTo(e,{transformOrigin:"0% 50%",rotate:f},{ease:"none",rotate:0,scrollTrigger:{trigger:e,scroller:t,start:"top bottom",end:b,scrub:!0}});const o=e.querySelectorAll(".word");return l.fromTo(o,{opacity:d,willChange:"opacity"},{ease:"none",opacity:1,stagger:.05,scrollTrigger:{trigger:e,scroller:t,start:"top bottom-=20%",end:n,scrub:!0}}),i&&l.fromTo(o,{filter:`blur(${p}px)`},{ease:"none",filter:"blur(0px)",stagger:.05,scrollTrigger:{trigger:e,scroller:t,start:"top bottom-=20%",end:n,scrub:!0}}),()=>{_.getAll().forEach(E=>E.kill())}},[r,i,f,d,b,n,p]),c.jsx("h2",{ref:g,className:`${m["scroll-reveal"]} ${S}`,children:c.jsx("p",{className:`${m["scroll-reveal-text"]} ${N}`,children:q})})};h.__docgenInfo={description:"",methods:[],displayName:"ScrollReveal",props:{enableBlur:{defaultValue:{value:"true",computed:!1},required:!1},baseOpacity:{defaultValue:{value:"0.1",computed:!1},required:!1},baseRotation:{defaultValue:{value:"3",computed:!1},required:!1},blurStrength:{defaultValue:{value:"4",computed:!1},required:!1},containerClassName:{defaultValue:{value:"''",computed:!1},required:!1},textClassName:{defaultValue:{value:"''",computed:!1},required:!1},rotationEnd:{defaultValue:{value:"'bottom bottom'",computed:!1},required:!1},wordAnimationEnd:{defaultValue:{value:"'bottom bottom'",computed:!1},required:!1}}};const j={title:"ReactBits/TextAnimations/ScrollReveal",component:h,parameters:{layout:"fullscreen"}},a={args:{children:"Hello World",enableBlur:!0,baseOpacity:.1,baseRotation:3,blurStrength:4,containerClassName:"",textClassName:"",rotationEnd:"bottom bottom",wordAnimationEnd:"bottom bottom"}};var x,v,y;a.parameters={...a.parameters,docs:{...(x=a.parameters)==null?void 0:x.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
children: 'Hello World',
|
|
4
4
|
enableBlur: true,
|