@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
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as p,j as v}from"./iframe-B8pH-Lvr.js";import{u as re}from"./use-motion-value--XhiA2Gt.js";import{h as ne,j as le,i as Te,r as Ce,m as Oe}from"./proxy-BA3VZtN5.js";import{f as h,I as k,N as Ne,a3 as Pe,Y as He,$ as Be,j as Ae,c as oe,R as ke,U as Re,o as W,u as be,a as q}from"./MotionConfigContext-D5hZdVGx.js";import{u as ze}from"./use-spring-CrWzlBMd.js";import{u as D}from"./use-transform-vyDqMhf-.js";import{u as je}from"./use-animation-frame-CF42h0i5.js";import"./preload-helper-C1FmrZbK.js";function ce(e,t){let s;const r=()=>{const{currentTime:n}=t,o=(n===null?0:n.value)/100;s!==o&&e(o),s=o};return h.preUpdate(r,!0),()=>k(r)}function Ie(e,t,s){p.useInsertionEffect(()=>e.on(t,s),[e,t,s])}function O(e){return typeof window>"u"?!1:e?ne():le()}const _e=50,F=()=>({current:0,offset:[],progress:0,scrollLength:0,targetOffset:0,targetLength:0,containerLength:0,velocity:0}),qe=()=>({time:0,x:F(),y:F()}),De={x:{length:"Width",position:"Left"},y:{length:"Height",position:"Top"}};function $(e,t,s,r){const n=s[t],{length:l,position:o}=De[t],c=n.current,a=s.time;n.current=Math.abs(e[`scroll${o}`]),n.scrollLength=e[`scroll${l}`]-e[`client${l}`],n.offset.length=0,n.offset[0]=0,n.offset[1]=n.scrollLength,n.progress=Ne(0,n.scrollLength,n.current);const i=r-a;n.velocity=i>_e?0:Pe(n.current-c,i)}function Fe(e,t,s){$(e,"x",t,s),$(e,"y",t,s),t.time=s}function $e(e,t){const s={x:0,y:0};let r=e;for(;r&&r!==t;)if(Te(r))s.x+=r.offsetLeft,s.y+=r.offsetTop,r=r.offsetParent;else if(r.tagName==="svg"){const n=r.getBoundingClientRect();r=r.parentElement;const l=r.getBoundingClientRect();s.x+=n.left-l.left,s.y+=n.top-l.top}else if(r instanceof SVGGraphicsElement){const{x:n,y:l}=r.getBBox();s.x+=n,s.y+=l;let o=null,c=r.parentNode;for(;!o;)c.tagName==="svg"&&(o=c),c=r.parentNode;r=o}else break;return s}const R={start:0,center:.5,end:1};function Y(e,t,s=0){let r=0;if(e in R&&(e=R[e]),typeof e=="string"){const n=parseFloat(e);e.endsWith("px")?r=n:e.endsWith("%")?e=n/100:e.endsWith("vw")?r=n/100*document.documentElement.clientWidth:e.endsWith("vh")?r=n/100*document.documentElement.clientHeight:e=n}return typeof e=="number"&&(r=t*e),s+r}const Ye=[0,0];function Xe(e,t,s,r){let n=Array.isArray(e)?e:Ye,l=0,o=0;return typeof e=="number"?n=[e,e]:typeof e=="string"&&(e=e.trim(),e.includes(" ")?n=e.split(" "):n=[e,R[e]?e:"0"]),l=Y(n[0],s,r),o=Y(n[1],t),l-o}const E={Enter:[[0,1],[1,1]],Exit:[[0,0],[1,0]],Any:[[1,0],[0,1]],All:[[0,0],[1,1]]},Me={x:0,y:0};function Ue(e){return"getBBox"in e&&e.tagName!=="svg"?e.getBBox():{width:e.clientWidth,height:e.clientHeight}}function Ge(e,t,s){const{offset:r=E.All}=s,{target:n=e,axis:l="y"}=s,o=l==="y"?"height":"width",c=n!==e?$e(n,e):Me,a=n===e?{width:e.scrollWidth,height:e.scrollHeight}:Ue(n),i={width:e.clientWidth,height:e.clientHeight};t[l].offset.length=0;let u=!t[l].interpolate;const m=r.length;for(let f=0;f<m;f++){const g=Xe(r[f],i[o],a[o],c[l]);!u&&g!==t[l].interpolatorOffsets[f]&&(u=!0),t[l].offset[f]=g}u&&(t[l].interpolate=He(t[l].offset,Be(r),{clamp:!1}),t[l].interpolatorOffsets=[...t[l].offset]),t[l].progress=Ae(0,1,t[l].interpolate(t[l].current))}function Ke(e,t=e,s){if(s.x.targetOffset=0,s.y.targetOffset=0,t!==e){let r=t;for(;r&&r!==e;)s.x.targetOffset+=r.offsetLeft,s.y.targetOffset+=r.offsetTop,r=r.offsetParent}s.x.targetLength=t===e?t.scrollWidth:t.clientWidth,s.y.targetLength=t===e?t.scrollHeight:t.clientHeight,s.x.containerLength=e.clientWidth,s.y.containerLength=e.clientHeight}function Je(e,t,s,r={}){return{measure:n=>{Ke(e,r.target,s),Fe(e,s,n),(r.offset||r.target)&&Ge(e,s,r)},notify:()=>t(s)}}const x=new WeakMap,X=new WeakMap,A=new WeakMap,M=new WeakMap,L=new WeakMap,U=e=>e===document.scrollingElement?window:e;function ie(e,{container:t=document.scrollingElement,trackContentSize:s=!1,...r}={}){if(!t)return oe;let n=A.get(t);n||(n=new Set,A.set(t,n));const l=qe(),o=Je(t,e,l,r);if(n.add(o),!x.has(t)){const a=()=>{for(const f of n)f.measure(ke.timestamp);h.preUpdate(i)},i=()=>{for(const f of n)f.notify()},u=()=>h.read(a);x.set(t,u);const m=U(t);window.addEventListener("resize",u),t!==document.documentElement&&X.set(t,Ce(t,u)),m.addEventListener("scroll",u),u()}if(s&&!L.has(t)){const a=x.get(t),i={width:t.scrollWidth,height:t.scrollHeight};M.set(t,i);const u=()=>{const f=t.scrollWidth,g=t.scrollHeight;(i.width!==f||i.height!==g)&&(a(),i.width=f,i.height=g)},m=h.read(u,!0);L.set(t,m)}const c=x.get(t);return h.read(c,!1,!0),()=>{var m;k(c);const a=A.get(t);if(!a||(a.delete(o),a.size))return;const i=x.get(t);x.delete(t),i&&(U(t).removeEventListener("scroll",i),(m=X.get(t))==null||m(),window.removeEventListener("resize",i));const u=L.get(t);u&&(k(u),L.delete(t)),M.delete(t)}}const Qe=[[E.Enter,"entry"],[E.Exit,"exit"],[E.Any,"cover"],[E.All,"contain"]],G={start:0,end:1};function Ze(e){const t=e.trim().split(/\s+/);if(t.length!==2)return;const s=G[t[0]],r=G[t[1]];if(!(s===void 0||r===void 0))return[s,r]}function et(e){if(e.length!==2)return;const t=[];for(const s of e)if(Array.isArray(s))t.push(s);else if(typeof s=="string"){const r=Ze(s);if(!r)return;t.push(r)}else return;return t}function tt(e,t){const s=et(e);if(!s)return!1;for(let r=0;r<2;r++){const n=s[r],l=t[r];if(n[0]!==l[0]||n[1]!==l[1])return!1}return!0}function b(e){if(!e)return{rangeStart:"contain 0%",rangeEnd:"contain 100%"};for(const[t,s]of Qe)if(tt(e,t))return{rangeStart:`${s} 0%`,rangeEnd:`${s} 100%`}}const K=new Map;function J(e){const t={value:0},s=ie(r=>{t.value=r[e.axis].progress*100},e);return{currentTime:t,cancel:s}}function ae({source:e,container:t,...s}){const{axis:r}=s;e&&(t=e);let n=K.get(t);n||(n=new Map,K.set(t,n));const l=s.target??"self";let o=n.get(l);o||(o={},n.set(l,o));const c=r+(s.offset??[]).join(",");return o[c]||(s.target&&O(s.target)?b(s.offset)?o[c]=new ViewTimeline({subject:s.target,axis:r}):o[c]=J({container:t,...s}):O()?o[c]=new ScrollTimeline({source:t,axis:r}):o[c]=J({container:t,...s})),o[c]}function st(e,t){const s=ae(t),r=t.target?b(t.offset):void 0,n=t.target?O(t.target)&&!!r:O();return e.attachTimeline({timeline:n?s:void 0,...r&&n&&{rangeStart:r.rangeStart,rangeEnd:r.rangeEnd},observe:l=>(l.pause(),ce(o=>{l.time=l.iterationDuration*o},s))})}function rt(e){return e.length===2}function nt(e,t){return rt(e)?ie(s=>{e(s[t.axis].progress,s)},t):ce(e,ae(t))}function ue(e,{axis:t="y",container:s=document.scrollingElement,...r}={}){if(!s)return oe;const n={axis:t,container:s,...r};return typeof e=="function"?nt(e,n):st(e,n)}const lt=()=>({scrollX:W(0),scrollY:W(0),scrollXProgress:W(0),scrollYProgress:W(0)}),T=e=>e?!e.current:!1;function Q(e,t,s,r){return{factory:n=>ue(n,{...t,axis:e,container:(s==null?void 0:s.current)||void 0,target:(r==null?void 0:r.current)||void 0}),times:[0,1],keyframes:[0,1],ease:n=>n,duration:1}}function ot(e,t){return typeof window>"u"?!1:e?ne()&&!!b(t):le()}function ct({container:e,target:t,...s}={}){const r=Re(lt);ot(t,s.offset)&&(r.scrollXProgress.accelerate=Q("x",s,e,t),r.scrollYProgress.accelerate=Q("y",s,e,t));const n=p.useRef(null),l=p.useRef(!1),o=p.useCallback(()=>(n.current=ue((c,{x:a,y:i})=>{r.scrollX.set(a.current),r.scrollXProgress.set(a.progress),r.scrollY.set(i.current),r.scrollYProgress.set(i.progress)},{...s,container:(e==null?void 0:e.current)||void 0,target:(t==null?void 0:t.current)||void 0}),()=>{var c;(c=n.current)==null||c.call(n)}),[e,t,JSON.stringify(s.offset)]);return be(()=>{if(l.current=!1,T(e)||T(t)){l.current=!0;return}else return o()},[o]),p.useEffect(()=>{if(l.current)return q(!T(e)),q(!T(t)),o()},[o]),r}function it(e){const t=re(e.getVelocity()),s=()=>{const r=e.getVelocity();t.set(r),r&&h.update(s)};return Ie(e,"change",()=>{h.update(s,!1,!0)}),t}const at="_parallax_1s8d6_1",ut="_scroller_1s8d6_6",Z={parallax:at,scroller:ut};function ft(e){const[t,s]=p.useState(0);return p.useLayoutEffect(()=>{function r(){e.current&&s(e.current.offsetWidth)}return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[e]),t}const fe=({scrollContainerRef:e,texts:t=[],velocity:s=100,className:r="",damping:n=50,stiffness:l=400,numCopies:o=6,velocityMapping:c={input:[0,1e3],output:[0,5]},parallaxClassName:a=Z.parallax,scrollerClassName:i=Z.scroller,parallaxStyle:u,scrollerStyle:m})=>{function f({children:g,baseVelocity:S=s,scrollContainerRef:z,className:de="",damping:me,stiffness:ge,numCopies:pe,velocityMapping:y,parallaxClassName:he,scrollerClassName:ye,parallaxStyle:xe,scrollerStyle:we}){const N=re(0),ve=z?{container:z}:{},{scrollY:Ee}=ct(ve),Se=it(Ee),Ve=ze(Se,{damping:me??50,stiffness:ge??400}),P=D(Ve,(y==null?void 0:y.input)||[0,1e3],(y==null?void 0:y.output)||[0,5],{clamp:!1}),j=p.useRef(null),I=ft(j);function We(d,H,w){const B=H-d;return((w-d)%B+B)%B+d}const Le=D(N,d=>I===0?"0px":`${We(-I,0,d)}px`),V=p.useRef(1);je((d,H)=>{let w=V.current*S*(H/1e3);P.get()<0?V.current=-1:P.get()>0&&(V.current=1),w+=V.current*w*P.get(),N.set(N.get()+w)});const _=[];for(let d=0;d<pe;d++)_.push(v.jsxs("span",{className:de,ref:d===0?j:null,children:[g," "]},d));return v.jsx("div",{className:he,style:xe,children:v.jsx(Oe.div,{className:ye,style:{x:Le,...we},children:_})})}return v.jsx("section",{children:t.map((g,S)=>v.jsx(f,{className:r,baseVelocity:S%2!==0?-s:s,scrollContainerRef:e,damping:n,stiffness:l,numCopies:o,velocityMapping:c,parallaxClassName:a,scrollerClassName:i,parallaxStyle:u,scrollerStyle:m,children:g},S))})};fe.__docgenInfo={description:"",methods:[],displayName:"ScrollVelocity",props:{texts:{defaultValue:{value:"[]",computed:!1},required:!1},velocity:{defaultValue:{value:"100",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},damping:{defaultValue:{value:"50",computed:!1},required:!1},stiffness:{defaultValue:{value:"400",computed:!1},required:!1},numCopies:{defaultValue:{value:"6",computed:!1},required:!1},velocityMapping:{defaultValue:{value:"{ input: [0, 1000], output: [0, 5] }",computed:!1},required:!1},parallaxClassName:{defaultValue:{value:"styles['parallax']",computed:!0},required:!1},scrollerClassName:{defaultValue:{value:"styles['scroller']",computed:!0},required:!1}}};const Et={title:"ReactBits/TextAnimations/ScrollVelocity",component:fe,parameters:{layout:"fullscreen"},tags:["autodocs"]},C={args:{texts:["React Bits","Scroll Velocity"],velocity:100,damping:50,stiffness:400,numCopies:6}};var ee,te,se;C.parameters={...C.parameters,docs:{...(ee=C.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
1
|
+
import{r as g,j as v}from"./iframe-Cw8dCV4Z.js";import{u as re}from"./use-motion-value-BVm7csqA.js";import{h as ne,j as le,i as Te,r as Ce,m as Oe}from"./proxy-p8L3T_Zy.js";import{f as h,I as k,N as Ne,a3 as Pe,Y as He,$ as Be,j as Ae,c as oe,R as ke,U as Re,o as W,u as be,a as q}from"./MotionConfigContext-BCa1jVYq.js";import{u as ze}from"./use-spring-BkrdNVnG.js";import{u as D}from"./use-transform-CQNghMvr.js";import{u as je}from"./use-animation-frame-DovyG_Es.js";import"./preload-helper-C1FmrZbK.js";function ce(e,t){let s;const r=()=>{const{currentTime:n}=t,o=(n===null?0:n.value)/100;s!==o&&e(o),s=o};return h.preUpdate(r,!0),()=>k(r)}function Ie(e,t,s){g.useInsertionEffect(()=>e.on(t,s),[e,t,s])}function O(e){return typeof window>"u"?!1:e?ne():le()}const _e=50,F=()=>({current:0,offset:[],progress:0,scrollLength:0,targetOffset:0,targetLength:0,containerLength:0,velocity:0}),qe=()=>({time:0,x:F(),y:F()}),De={x:{length:"Width",position:"Left"},y:{length:"Height",position:"Top"}};function $(e,t,s,r){const n=s[t],{length:l,position:o}=De[t],c=n.current,a=s.time;n.current=Math.abs(e[`scroll${o}`]),n.scrollLength=e[`scroll${l}`]-e[`client${l}`],n.offset.length=0,n.offset[0]=0,n.offset[1]=n.scrollLength,n.progress=Ne(0,n.scrollLength,n.current);const i=r-a;n.velocity=i>_e?0:Pe(n.current-c,i)}function Fe(e,t,s){$(e,"x",t,s),$(e,"y",t,s),t.time=s}function $e(e,t){const s={x:0,y:0};let r=e;for(;r&&r!==t;)if(Te(r))s.x+=r.offsetLeft,s.y+=r.offsetTop,r=r.offsetParent;else if(r.tagName==="svg"){const n=r.getBoundingClientRect();r=r.parentElement;const l=r.getBoundingClientRect();s.x+=n.left-l.left,s.y+=n.top-l.top}else if(r instanceof SVGGraphicsElement){const{x:n,y:l}=r.getBBox();s.x+=n,s.y+=l;let o=null,c=r.parentNode;for(;!o;)c.tagName==="svg"&&(o=c),c=r.parentNode;r=o}else break;return s}const R={start:0,center:.5,end:1};function Y(e,t,s=0){let r=0;if(e in R&&(e=R[e]),typeof e=="string"){const n=parseFloat(e);e.endsWith("px")?r=n:e.endsWith("%")?e=n/100:e.endsWith("vw")?r=n/100*document.documentElement.clientWidth:e.endsWith("vh")?r=n/100*document.documentElement.clientHeight:e=n}return typeof e=="number"&&(r=t*e),s+r}const Ye=[0,0];function Xe(e,t,s,r){let n=Array.isArray(e)?e:Ye,l=0,o=0;return typeof e=="number"?n=[e,e]:typeof e=="string"&&(e=e.trim(),e.includes(" ")?n=e.split(" "):n=[e,R[e]?e:"0"]),l=Y(n[0],s,r),o=Y(n[1],t),l-o}const E={Enter:[[0,1],[1,1]],Exit:[[0,0],[1,0]],Any:[[1,0],[0,1]],All:[[0,0],[1,1]]},Me={x:0,y:0};function Ue(e){return"getBBox"in e&&e.tagName!=="svg"?e.getBBox():{width:e.clientWidth,height:e.clientHeight}}function Ge(e,t,s){const{offset:r=E.All}=s,{target:n=e,axis:l="y"}=s,o=l==="y"?"height":"width",c=n!==e?$e(n,e):Me,a=n===e?{width:e.scrollWidth,height:e.scrollHeight}:Ue(n),i={width:e.clientWidth,height:e.clientHeight};t[l].offset.length=0;let u=!t[l].interpolate;const m=r.length;for(let f=0;f<m;f++){const p=Xe(r[f],i[o],a[o],c[l]);!u&&p!==t[l].interpolatorOffsets[f]&&(u=!0),t[l].offset[f]=p}u&&(t[l].interpolate=He(t[l].offset,Be(r),{clamp:!1}),t[l].interpolatorOffsets=[...t[l].offset]),t[l].progress=Ae(0,1,t[l].interpolate(t[l].current))}function Ke(e,t=e,s){if(s.x.targetOffset=0,s.y.targetOffset=0,t!==e){let r=t;for(;r&&r!==e;)s.x.targetOffset+=r.offsetLeft,s.y.targetOffset+=r.offsetTop,r=r.offsetParent}s.x.targetLength=t===e?t.scrollWidth:t.clientWidth,s.y.targetLength=t===e?t.scrollHeight:t.clientHeight,s.x.containerLength=e.clientWidth,s.y.containerLength=e.clientHeight}function Je(e,t,s,r={}){return{measure:n=>{Ke(e,r.target,s),Fe(e,s,n),(r.offset||r.target)&&Ge(e,s,r)},notify:()=>t(s)}}const x=new WeakMap,X=new WeakMap,A=new WeakMap,M=new WeakMap,L=new WeakMap,U=e=>e===document.scrollingElement?window:e;function ie(e,{container:t=document.scrollingElement,trackContentSize:s=!1,...r}={}){if(!t)return oe;let n=A.get(t);n||(n=new Set,A.set(t,n));const l=qe(),o=Je(t,e,l,r);if(n.add(o),!x.has(t)){const a=()=>{for(const f of n)f.measure(ke.timestamp);h.preUpdate(i)},i=()=>{for(const f of n)f.notify()},u=()=>h.read(a);x.set(t,u);const m=U(t);window.addEventListener("resize",u),t!==document.documentElement&&X.set(t,Ce(t,u)),m.addEventListener("scroll",u),u()}if(s&&!L.has(t)){const a=x.get(t),i={width:t.scrollWidth,height:t.scrollHeight};M.set(t,i);const u=()=>{const f=t.scrollWidth,p=t.scrollHeight;(i.width!==f||i.height!==p)&&(a(),i.width=f,i.height=p)},m=h.read(u,!0);L.set(t,m)}const c=x.get(t);return h.read(c,!1,!0),()=>{var m;k(c);const a=A.get(t);if(!a||(a.delete(o),a.size))return;const i=x.get(t);x.delete(t),i&&(U(t).removeEventListener("scroll",i),(m=X.get(t))==null||m(),window.removeEventListener("resize",i));const u=L.get(t);u&&(k(u),L.delete(t)),M.delete(t)}}const Qe=[[E.Enter,"entry"],[E.Exit,"exit"],[E.Any,"cover"],[E.All,"contain"]],G={start:0,end:1};function Ze(e){const t=e.trim().split(/\s+/);if(t.length!==2)return;const s=G[t[0]],r=G[t[1]];if(!(s===void 0||r===void 0))return[s,r]}function et(e){if(e.length!==2)return;const t=[];for(const s of e)if(Array.isArray(s))t.push(s);else if(typeof s=="string"){const r=Ze(s);if(!r)return;t.push(r)}else return;return t}function tt(e,t){const s=et(e);if(!s)return!1;for(let r=0;r<2;r++){const n=s[r],l=t[r];if(n[0]!==l[0]||n[1]!==l[1])return!1}return!0}function b(e){if(!e)return{rangeStart:"contain 0%",rangeEnd:"contain 100%"};for(const[t,s]of Qe)if(tt(e,t))return{rangeStart:`${s} 0%`,rangeEnd:`${s} 100%`}}const K=new Map;function J(e){const t={value:0},s=ie(r=>{t.value=r[e.axis].progress*100},e);return{currentTime:t,cancel:s}}function ae({source:e,container:t,...s}){const{axis:r}=s;e&&(t=e);let n=K.get(t);n||(n=new Map,K.set(t,n));const l=s.target??"self";let o=n.get(l);o||(o={},n.set(l,o));const c=r+(s.offset??[]).join(",");return o[c]||(s.target&&O(s.target)?b(s.offset)?o[c]=new ViewTimeline({subject:s.target,axis:r}):o[c]=J({container:t,...s}):O()?o[c]=new ScrollTimeline({source:t,axis:r}):o[c]=J({container:t,...s})),o[c]}function st(e,t){const s=ae(t),r=t.target?b(t.offset):void 0,n=t.target?O(t.target)&&!!r:O();return e.attachTimeline({timeline:n?s:void 0,...r&&n&&{rangeStart:r.rangeStart,rangeEnd:r.rangeEnd},observe:l=>(l.pause(),ce(o=>{l.time=l.iterationDuration*o},s))})}function rt(e){return e.length===2}function nt(e,t){return rt(e)?ie(s=>{e(s[t.axis].progress,s)},t):ce(e,ae(t))}function ue(e,{axis:t="y",container:s=document.scrollingElement,...r}={}){if(!s)return oe;const n={axis:t,container:s,...r};return typeof e=="function"?nt(e,n):st(e,n)}const lt=()=>({scrollX:W(0),scrollY:W(0),scrollXProgress:W(0),scrollYProgress:W(0)}),T=e=>e?!e.current:!1;function Q(e,t,s,r){return{factory:n=>ue(n,{...t,axis:e,container:(s==null?void 0:s.current)||void 0,target:(r==null?void 0:r.current)||void 0}),times:[0,1],keyframes:[0,1],ease:n=>n,duration:1}}function ot(e,t){return typeof window>"u"?!1:e?ne()&&!!b(t):le()}function ct({container:e,target:t,...s}={}){const r=Re(lt);ot(t,s.offset)&&(r.scrollXProgress.accelerate=Q("x",s,e,t),r.scrollYProgress.accelerate=Q("y",s,e,t));const n=g.useRef(null),l=g.useRef(!1),o=g.useCallback(()=>(n.current=ue((c,{x:a,y:i})=>{r.scrollX.set(a.current),r.scrollXProgress.set(a.progress),r.scrollY.set(i.current),r.scrollYProgress.set(i.progress)},{...s,container:(e==null?void 0:e.current)||void 0,target:(t==null?void 0:t.current)||void 0}),()=>{var c;(c=n.current)==null||c.call(n)}),[e,t,JSON.stringify(s.offset)]);return be(()=>{if(l.current=!1,T(e)||T(t)){l.current=!0;return}else return o()},[o]),g.useEffect(()=>{if(l.current)return q(!T(e)),q(!T(t)),o()},[o]),r}function it(e){const t=re(e.getVelocity()),s=()=>{const r=e.getVelocity();t.set(r),r&&h.update(s)};return Ie(e,"change",()=>{h.update(s,!1,!0)}),t}const at="_parallax_1s8d6_1",ut="_scroller_1s8d6_6",Z={parallax:at,scroller:ut};function ft(e){const[t,s]=g.useState(0);return g.useLayoutEffect(()=>{function r(){e.current&&s(e.current.offsetWidth)}return r(),window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[e]),t}const fe=({scrollContainerRef:e,texts:t=[],velocity:s=100,className:r="",damping:n=50,stiffness:l=400,numCopies:o=6,velocityMapping:c={input:[0,1e3],output:[0,5]},parallaxClassName:a=Z.parallax,scrollerClassName:i=Z.scroller,parallaxStyle:u,scrollerStyle:m})=>{function f({children:p,baseVelocity:S=s,scrollContainerRef:z,className:de="",damping:me,stiffness:pe,numCopies:ge,velocityMapping:y,parallaxClassName:he,scrollerClassName:ye,parallaxStyle:xe,scrollerStyle:we}){const N=re(0),ve=z?{container:z}:{},{scrollY:Ee}=ct(ve),Se=it(Ee),Ve=ze(Se,{damping:me??50,stiffness:pe??400}),P=D(Ve,(y==null?void 0:y.input)||[0,1e3],(y==null?void 0:y.output)||[0,5],{clamp:!1}),j=g.useRef(null),I=ft(j);function We(d,H,w){const B=H-d;return((w-d)%B+B)%B+d}const Le=D(N,d=>I===0?"0px":`${We(-I,0,d)}px`),V=g.useRef(1);je((d,H)=>{let w=V.current*S*(H/1e3);P.get()<0?V.current=-1:P.get()>0&&(V.current=1),w+=V.current*w*P.get(),N.set(N.get()+w)});const _=[];for(let d=0;d<ge;d++)_.push(v.jsxs("span",{className:de,ref:d===0?j:null,children:[p," "]},d));return v.jsx("div",{className:he,style:xe,children:v.jsx(Oe.div,{className:ye,style:{x:Le,...we},children:_})})}return v.jsx("section",{children:t.map((p,S)=>v.jsx(f,{className:r,baseVelocity:S%2!==0?-s:s,scrollContainerRef:e,damping:n,stiffness:l,numCopies:o,velocityMapping:c,parallaxClassName:a,scrollerClassName:i,parallaxStyle:u,scrollerStyle:m,children:p},S))})};fe.__docgenInfo={description:"",methods:[],displayName:"ScrollVelocity",props:{texts:{defaultValue:{value:"[]",computed:!1},required:!1},velocity:{defaultValue:{value:"100",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},damping:{defaultValue:{value:"50",computed:!1},required:!1},stiffness:{defaultValue:{value:"400",computed:!1},required:!1},numCopies:{defaultValue:{value:"6",computed:!1},required:!1},velocityMapping:{defaultValue:{value:"{ input: [0, 1000], output: [0, 5] }",computed:!1},required:!1},parallaxClassName:{defaultValue:{value:"styles['parallax']",computed:!0},required:!1},scrollerClassName:{defaultValue:{value:"styles['scroller']",computed:!0},required:!1}}};const Et={title:"ReactBits/TextAnimations/ScrollVelocity",component:fe,parameters:{layout:"fullscreen"}},C={args:{texts:["React Bits","Scroll Velocity"],velocity:100,damping:50,stiffness:400,numCopies:6}};var ee,te,se;C.parameters={...C.parameters,docs:{...(ee=C.parameters)==null?void 0:ee.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
texts: ['React Bits', 'Scroll Velocity'],
|
|
4
4
|
velocity: 100,
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import{r as o,j as t}from"./iframe-Cw8dCV4Z.js";import{S as ee}from"./search-7V6DOf2z.js";import{F as te}from"./folder-CCqkDvFG.js";import{U as se}from"./users-R6T-yLyH.js";import{c as P}from"./createLucideIcon-dvowvj4F.js";import{m as $}from"./proxy-p8L3T_Zy.js";import{X as ye}from"./x-CypMgsiv.js";import{A as fe}from"./index-CzApopWo.js";import"./preload-helper-C1FmrZbK.js";import"./MotionConfigContext-BCa1jVYq.js";/**
|
|
2
|
+
* @license lucide-react v0.539.0 - ISC
|
|
3
|
+
*
|
|
4
|
+
* This source code is licensed under the ISC license.
|
|
5
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
6
|
+
*/const ve=[["path",{d:"M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20",key:"k3hazp"}]],re=P("book",ve);/**
|
|
7
|
+
* @license lucide-react v0.539.0 - ISC
|
|
8
|
+
*
|
|
9
|
+
* This source code is licensed under the ISC license.
|
|
10
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
11
|
+
*/const Se=[["path",{d:"M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z",key:"18887p"}]],ne=P("message-square",Se);/**
|
|
12
|
+
* @license lucide-react v0.539.0 - ISC
|
|
13
|
+
*
|
|
14
|
+
* This source code is licensed under the ISC license.
|
|
15
|
+
* See the LICENSE file in the root directory of this source tree.
|
|
16
|
+
*/const _e=[["path",{d:"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2",key:"1yyitq"}],["circle",{cx:"9",cy:"7",r:"4",key:"nufk8"}],["line",{x1:"19",x2:"19",y1:"8",y2:"14",key:"1bvyxn"}],["line",{x1:"22",x2:"16",y1:"11",y2:"11",key:"1shjgl"}]],ae=P("user-plus",_e),we="_searchContainer_on5sv_1",be="_searchInputWrapper_on5sv_7",xe="_searchIcon_on5sv_23",Ce="_searchInput_on5sv_7",je="_clearButton_on5sv_62",Ie="_filterSelect_on5sv_82",Te="_resultsDropdown_on5sv_98",ke="_loadingState_on5sv_112",Re="_emptyState_on5sv_113",De="_spinner_on5sv_123",Ne="_resultsGroups_on5sv_138",Ee="_resultGroup_on5sv_142",$e="_groupHeader_on5sv_150",Pe="_groupIcon_on5sv_161",Le="_groupTitle_on5sv_166",qe="_groupCount_on5sv_170",Ae="_groupResults_on5sv_177",Me="_resultItem_on5sv_181",Oe="_highlighted_on5sv_198",He="_resultTitle_on5sv_205",Fe="_resultSubtitle_on5sv_209",Be="_resultMeta_on5sv_213",Ge="_resultContent_on5sv_217",Ue="_highlight_on5sv_198",s={searchContainer:we,searchInputWrapper:be,searchIcon:xe,searchInput:Ce,clearButton:je,filterSelect:Ie,resultsDropdown:Te,loadingState:ke,emptyState:Re,spinner:De,resultsGroups:Ne,resultGroup:Ee,groupHeader:$e,groupIcon:Pe,groupTitle:Le,groupCount:qe,groupResults:Ae,resultItem:Me,highlighted:Oe,resultTitle:He,resultSubtitle:Fe,resultMeta:Be,resultContent:Ge,highlight:Ue},Qe=[{value:"all",label:"All",icon:ee},{value:"projects",label:"Projects",icon:te},{value:"clients",label:"Clients",icon:se},{value:"contacts",label:"Contacts",icon:re},{value:"interactions",label:"Interactions",icon:ne},{value:"team",label:"Team",icon:ae}],Ve={projects:te,clients:se,contacts:re,interactions:ne,team:ae},oe=({className:c,placeholder:f="Search (Ctrl+Space)...",onSearch:h,onResultClick:p,onClear:y,debounceDelay:a=300,minSearchLength:d=2,showFilter:C=!0,enableKeyboardShortcut:L=!0,filterOptions:le,entityIcons:ie})=>{var F;const q=le??Qe,ce=ie??Ve,[g,R]=o.useState(""),[D,ue]=o.useState(((F=q[0])==null?void 0:F.value)??"all"),[l,S]=o.useState([]),[pe,A]=o.useState(!1),[w,u]=o.useState(!1),[_,m]=o.useState(-1),N=o.useRef(null),b=o.useRef(null),x=o.useRef(),E=o.useRef(null),M=o.useCallback(async(e,r)=>{if(e.trim().length<d){S([]),u(!1);return}if(!h){S([]),u(!1);return}A(!0);try{const n=await h(e,r);S(n),u(n.length>0),m(-1)}catch(n){console.error("Search error:",n),S([]),u(!1)}finally{A(!1)}},[h,d]);o.useEffect(()=>(x.current&&clearTimeout(x.current),g.trim()?x.current=setTimeout(()=>{M(g,D)},a):(S([]),u(!1)),()=>{x.current&&clearTimeout(x.current)}),[g,D,M,a]),o.useEffect(()=>{const e=r=>{N.current&&!N.current.contains(r.target)&&(u(!1),m(-1))};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]),o.useEffect(()=>{if(!L)return;const e=r=>{var n,i;(r.ctrlKey||r.metaKey)&&r.code==="Space"&&(r.preventDefault(),(n=b.current)==null||n.focus(),(i=b.current)==null||i.select())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)},[L]),o.useEffect(()=>{if(_>=0&&E.current){const e=E.current.querySelector(`[data-result-index="${_}"]`);e&&e.scrollIntoView({behavior:"smooth",block:"nearest"})}},[_]);const de=e=>{var r;switch(e.key){case"ArrowDown":e.preventDefault(),!w&&l.length>0?(u(!0),m(0)):l.length>0&&m(n=>n<l.length-1?n+1:0);break;case"ArrowUp":e.preventDefault(),w&&l.length>0&&m(n=>n>0?n-1:l.length-1);break;case"Enter":if(e.preventDefault(),!w&&l.length>0)u(!0),m(0);else if(l.length>0){const n=_>=0?_:0;n<l.length&&O(l[n])}break;case"Escape":u(!1),m(-1),(r=b.current)==null||r.blur();break}},O=e=>{p&&p(e),R(""),u(!1),m(-1)},me=()=>{var e;R(""),S([]),u(!1),m(-1),(e=b.current)==null||e.focus(),y&&y()},he=l.reduce((e,r)=>(e[r.type]||(e[r.type]=[]),e[r.type].push(r),e),{}),H=(e,r)=>{if(!e||!r.trim())return e||"";const n=new RegExp(`(${r.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");return e.split(n).map((v,ge)=>n.test(v)?t.jsx("mark",{className:s.highlight,children:v},ge):v)};return t.jsxs("div",{ref:N,className:`${s.searchContainer} ${c||""}`,children:[t.jsxs("div",{className:s.searchInputWrapper,children:[t.jsx(ee,{className:s.searchIcon}),t.jsx("input",{ref:b,type:"text",value:g,onChange:e=>R(e.target.value),onKeyDown:de,onFocus:()=>g.trim()&&l.length>0&&u(!0),placeholder:f,className:s.searchInput,"aria-label":"Search","aria-expanded":w,"aria-controls":"search-results","aria-autocomplete":"list"}),g&&t.jsx($.button,{className:s.clearButton,onClick:me,whileHover:{scale:1.1},whileTap:{scale:.9},initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1},exit:{opacity:0,scale:.8},children:t.jsx(ye,{})}),C&&t.jsx("select",{value:D,onChange:e=>ue(e.target.value),className:s.filterSelect,"aria-label":"Filter search results",children:q.map(e=>t.jsx("option",{value:e.value,children:e.label},e.value))})]}),t.jsx(fe,{children:w&&t.jsx($.div,{ref:E,id:"search-results",className:s.resultsDropdown,initial:{opacity:0,y:-10},animate:{opacity:1,y:0},exit:{opacity:0,y:-10},transition:{duration:.2},children:pe?t.jsxs("div",{className:s.loadingState,children:[t.jsx("div",{className:s.spinner}),t.jsx("span",{children:"Searching..."})]}):l.length===0?t.jsxs("div",{className:s.emptyState,children:['No results found for "',g,'"']}):t.jsx("div",{className:s.resultsGroups,children:Object.entries(he).map(([e,r])=>{const n=ce[e];return t.jsxs("div",{className:s.resultGroup,children:[t.jsxs("div",{className:s.groupHeader,children:[n&&t.jsx(n,{className:s.groupIcon}),t.jsx("span",{className:s.groupTitle,children:e.charAt(0).toUpperCase()+e.slice(1)}),t.jsx("span",{className:s.groupCount,children:r.length})]}),t.jsx("div",{className:s.groupResults,children:r.map(i=>{const v=l.indexOf(i);return t.jsxs($.button,{"data-result-index":v,className:`${s.resultItem} ${_===v?s.highlighted:""}`,onClick:()=>O(i),whileHover:{x:4},onMouseEnter:()=>m(v),children:[t.jsxs("div",{className:s.resultContent,children:[t.jsx("div",{className:s.resultTitle,children:H(i.title||"Untitled",g)}),i.subtitle&&t.jsx("div",{className:s.resultSubtitle,children:H(i.subtitle,g)})]}),i.meta&&t.jsx("div",{className:s.resultMeta,children:i.meta})]},`${i.type}-${i.id}`)})})]},e)})})})})]})};oe.__docgenInfo={description:"",methods:[],displayName:"SearchBar",props:{className:{required:!1,tsType:{name:"string"},description:""},placeholder:{required:!1,tsType:{name:"string"},description:"",defaultValue:{value:'"Search (Ctrl+Space)..."',computed:!1}},onSearch:{required:!1,tsType:{name:"signature",type:"function",raw:"(query: string, filter: string) => Promise<SearchResult[]>",signature:{arguments:[{type:{name:"string"},name:"query"},{type:{name:"string"},name:"filter"}],return:{name:"Promise",elements:[{name:"Array",elements:[{name:"SearchResult"}],raw:"SearchResult[]"}],raw:"Promise<SearchResult[]>"}}},description:""},onResultClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(result: SearchResult) => void",signature:{arguments:[{type:{name:"SearchResult"},name:"result"}],return:{name:"void"}}},description:""},onClear:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:""},debounceDelay:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"300",computed:!1}},minSearchLength:{required:!1,tsType:{name:"number"},description:"",defaultValue:{value:"2",computed:!1}},showFilter:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},enableKeyboardShortcut:{required:!1,tsType:{name:"boolean"},description:"",defaultValue:{value:"true",computed:!1}},filterOptions:{required:!1,tsType:{name:"Array",elements:[{name:"FilterOption"}],raw:"FilterOption[]"},description:""},entityIcons:{required:!1,tsType:{name:"signature",type:"object",raw:"{ [key: string]: React.ElementType }",signature:{properties:[{key:{name:"string"},value:{name:"ReactElementType",raw:"React.ElementType",required:!0}}]}},description:""}}};const at={title:"Molecules/SearchBar",component:oe,parameters:{layout:"centered",docs:{description:{component:"A powerful search bar component with filtering, keyboard navigation, and grouped results display."}}},argTypes:{placeholder:{control:"text"},debounceDelay:{control:{type:"number",min:0,max:1e3,step:50}},minSearchLength:{control:{type:"number",min:1,max:5}},showFilter:{control:"boolean"},enableKeyboardShortcut:{control:"boolean"}}},Ke=[{id:"1",type:"projects",title:"Website Redesign",subtitle:"E-commerce Platform",meta:"Active"},{id:"2",type:"projects",title:"Mobile App Development",subtitle:"iOS & Android",meta:"In Progress"},{id:"3",type:"projects",title:"API Integration",subtitle:"Payment Gateway",meta:"Completed"},{id:"4",type:"projects",title:"Database Migration",subtitle:"PostgreSQL to MongoDB",meta:"Planning"},{id:"5",type:"clients",title:"Acme Corporation",subtitle:"Technology Partner",meta:"Premium"},{id:"6",type:"clients",title:"Global Industries",subtitle:"Manufacturing",meta:"Standard"},{id:"7",type:"clients",title:"StartUp Inc",subtitle:"SaaS Platform",meta:"Growth"},{id:"8",type:"contacts",title:"John Doe",subtitle:"john@example.com",meta:"CEO"},{id:"9",type:"contacts",title:"Jane Smith",subtitle:"jane@example.com",meta:"CTO"},{id:"10",type:"contacts",title:"Bob Johnson",subtitle:"bob@example.com",meta:"Developer"},{id:"11",type:"team",title:"Alice Williams",subtitle:"Frontend Developer",meta:"Senior"},{id:"12",type:"team",title:"Charlie Brown",subtitle:"Backend Developer",meta:"Mid-level"},{id:"13",type:"team",title:"Diana Prince",subtitle:"UI/UX Designer",meta:"Lead"},{id:"14",type:"interactions",title:"Meeting with Client",subtitle:"Discussed project scope",meta:"2 days ago"},{id:"15",type:"interactions",title:"Code Review",subtitle:"PR #123 approved",meta:"Yesterday"},{id:"16",type:"interactions",title:"Sprint Planning",subtitle:"Q4 roadmap defined",meta:"Last week"}],We=async(c,f)=>{await new Promise(p=>setTimeout(p,500));const h=c.toLowerCase();return Ke.filter(p=>{var y,a;return f!=="all"&&p.type!==f?!1:((y=p.title)==null?void 0:y.toLowerCase().includes(h))||((a=p.subtitle)==null?void 0:a.toLowerCase().includes(h))})},j={args:{placeholder:"Search...",showFilter:!0,onSearch:We,onResultClick:c=>{alert(`Selected: ${c.title}`)}}},I={args:{placeholder:"Search (always empty)...",onSearch:async()=>(await new Promise(c=>setTimeout(c,500)),[])}},T={args:{placeholder:"Search (will error)...",onSearch:async()=>{throw await new Promise(c=>setTimeout(c,500)),new Error("Search failed!")}}},k={args:{placeholder:"Search large dataset...",onSearch:async(c,f)=>{await new Promise(a=>setTimeout(a,300));const h=["projects","clients","contacts","team","interactions"],p=[];for(let a=0;a<100;a++){const d=h[a%h.length];(f==="all"||f===d)&&p.push({id:`large-${a}`,type:d,title:`${d.charAt(0).toUpperCase()+d.slice(1)} Item ${a}`,subtitle:`Description for item ${a} containing ${c}`,meta:`Meta ${a}`})}const y=c.toLowerCase();return p.filter(a=>{var d,C;return((d=a.title)==null?void 0:d.toLowerCase().includes(y))||((C=a.subtitle)==null?void 0:C.toLowerCase().includes(y))}).slice(0,20)}}};var B,G,U;j.parameters={...j.parameters,docs:{...(B=j.parameters)==null?void 0:B.docs,source:{originalSource:`{
|
|
17
|
+
args: {
|
|
18
|
+
placeholder: 'Search...',
|
|
19
|
+
showFilter: true,
|
|
20
|
+
onSearch: mockSearch,
|
|
21
|
+
onResultClick: result => {
|
|
22
|
+
alert(\`Selected: \${result.title}\`);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}`,...(U=(G=j.parameters)==null?void 0:G.docs)==null?void 0:U.source}}};var Q,V,K;I.parameters={...I.parameters,docs:{...(Q=I.parameters)==null?void 0:Q.docs,source:{originalSource:`{
|
|
26
|
+
args: {
|
|
27
|
+
placeholder: 'Search (always empty)...',
|
|
28
|
+
onSearch: async () => {
|
|
29
|
+
await new Promise(resolve => setTimeout(resolve, 500));
|
|
30
|
+
return [];
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
}`,...(K=(V=I.parameters)==null?void 0:V.docs)==null?void 0:K.source}}};var W,J,z;T.parameters={...T.parameters,docs:{...(W=T.parameters)==null?void 0:W.docs,source:{originalSource:`{
|
|
34
|
+
args: {
|
|
35
|
+
placeholder: 'Search (will error)...',
|
|
36
|
+
onSearch: async () => {
|
|
37
|
+
await new Promise(resolve => setTimeout(resolve, 500));
|
|
38
|
+
throw new Error('Search failed!');
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
}`,...(z=(J=T.parameters)==null?void 0:J.docs)==null?void 0:z.source}}};var X,Y,Z;k.parameters={...k.parameters,docs:{...(X=k.parameters)==null?void 0:X.docs,source:{originalSource:`{
|
|
42
|
+
args: {
|
|
43
|
+
placeholder: 'Search large dataset...',
|
|
44
|
+
onSearch: async (query: string, filter: string) => {
|
|
45
|
+
await new Promise(resolve => setTimeout(resolve, 300));
|
|
46
|
+
const types = ['projects', 'clients', 'contacts', 'team', 'interactions'];
|
|
47
|
+
const results: SearchResult[] = [];
|
|
48
|
+
for (let i = 0; i < 100; i++) {
|
|
49
|
+
const type = types[i % types.length];
|
|
50
|
+
if (filter === 'all' || filter === type) {
|
|
51
|
+
results.push({
|
|
52
|
+
id: \`large-\${i}\`,
|
|
53
|
+
type,
|
|
54
|
+
title: \`\${type.charAt(0).toUpperCase() + type.slice(1)} Item \${i}\`,
|
|
55
|
+
subtitle: \`Description for item \${i} containing \${query}\`,
|
|
56
|
+
meta: \`Meta \${i}\`
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
const lowerQuery = query.toLowerCase();
|
|
61
|
+
return results.filter(item => item.title?.toLowerCase().includes(lowerQuery) || item.subtitle?.toLowerCase().includes(lowerQuery)).slice(0, 20);
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}`,...(Z=(Y=k.parameters)==null?void 0:Y.docs)==null?void 0:Z.source}}};const ot=["Default","EmptyResults","ErrorHandling","LargeDataset"];export{j as Default,I as EmptyResults,T as ErrorHandling,k as LargeDataset,ot as __namedExportsOrder,at as default};
|
package/storybook-static/assets/{SearchableDropdown-4HgWY0Ck.js → SearchableDropdown-BtIsuxmT.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r,j as n}from"./iframe-
|
|
1
|
+
import{r,j as n}from"./iframe-Cw8dCV4Z.js";import{m as p}from"./proxy-p8L3T_Zy.js";import{C as V}from"./chevron-down-Ciks5pXx.js";import{A as R}from"./index-CzApopWo.js";import{S as A}from"./search-7V6DOf2z.js";import{C as T}from"./check-DLeHG_Da.js";const q="_searchableDropdown_13fbr_1",M="_dropdownTrigger_13fbr_17",$="_open_13fbr_45",L="_dropdownValue_13fbr_52",F="_placeholder_13fbr_61",K="_dropdownArrow_13fbr_67",H="_dropdownMenu_13fbr_83",P="_dropdownSearch_13fbr_101",z="_searchInput_13fbr_111",B="_searchIcon_13fbr_136",U="_dropdownOptions_13fbr_152",W="_dropdownOption_13fbr_152",G="_selected_13fbr_221",J="_highlighted_13fbr_243",Q="_checkIcon_13fbr_256",X="_dropdownNoResults_13fbr_276",Y="_loading_13fbr_390",o={searchableDropdown:q,dropdownTrigger:M,open:$,dropdownValue:L,placeholder:F,dropdownArrow:K,dropdownMenu:H,dropdownSearch:P,searchInput:z,searchIcon:B,dropdownOptions:U,dropdownOption:W,selected:G,highlighted:J,checkIcon:Q,dropdownNoResults:X,loading:Y};function Z({label:C,value:m,onChange:k,options:w,placeholder:N="Select...",allowEmpty:j=!0,disabled:u=!1,loading:g=!1,error:D=!1}){const[t,i]=r.useState(!1),[_,d]=r.useState(""),[c,l]=r.useState(-1),h=r.useRef(null),f=r.useRef(null),b=w.find(e=>e.value===m),y=b?b.label:"",v=w.filter(e=>e.label.toLowerCase().includes(_.toLowerCase())),s=j?[{label:"(none)",value:""},...v]:v;r.useEffect(()=>{function e(a){h.current&&!h.current.contains(a.target)&&(i(!1),d(""))}return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]),r.useEffect(()=>{t&&f.current&&f.current.focus()},[t]);const x=e=>{k(e),i(!1),d(""),l(-1)},I=e=>{if(t)switch(e.key){case"ArrowDown":e.preventDefault(),l(a=>a<s.length-1?a+1:0);break;case"ArrowUp":e.preventDefault(),l(a=>a>0?a-1:s.length-1);break;case"Enter":e.preventDefault(),c>=0&&c<s.length&&x(s[c].value);break;case"Escape":e.preventDefault(),i(!1),d(""),l(-1);break}},O=()=>{const e=[o.dropdownTrigger];return t&&e.push(o.open),g&&e.push(o.loading),D&&e.push(o.error),e.join(" ")};return n.jsxs("div",{className:o.searchableDropdown,ref:h,onKeyDown:I,children:[n.jsx("label",{children:C}),n.jsxs(p.button,{type:"button",className:O(),onClick:()=>!u&&!g&&i(!t),whileTap:{scale:u?1:.98},style:{willChange:"transform"},disabled:u,children:[n.jsx("span",{className:`${o.dropdownValue} ${y?"":o.placeholder}`,children:y||N}),n.jsx(V,{className:o.dropdownArrow})]}),n.jsx(R,{children:t&&n.jsxs(p.div,{className:o.dropdownMenu,initial:{opacity:0,y:-10,scale:.95},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:-10,scale:.95},transition:{duration:.2,ease:"easeOut"},children:[n.jsxs("div",{className:o.dropdownSearch,children:[n.jsx(A,{className:o.searchIcon}),n.jsx("input",{ref:f,type:"text",className:o.searchInput,placeholder:"Cerca...",value:_,onChange:e=>d(e.target.value),onClick:e=>e.stopPropagation()})]}),n.jsxs("div",{className:o.dropdownOptions,children:[s.map((e,a)=>{const S=m===e.value,E=c===a;return n.jsxs(p.button,{type:"button",className:`${o.dropdownOption} ${S?o.selected:""} ${E?o.highlighted:""}`,onClick:()=>x(e.value),onMouseEnter:()=>l(a),initial:{opacity:0,x:-20},animate:{opacity:1,x:0},transition:{delay:a*.02},whileTap:{scale:.98},style:{willChange:"transform"},children:[n.jsx("span",{children:e.label}),S&&n.jsx(T,{className:o.checkIcon})]},`${e.value}-${a}`)}),s.length===0&&n.jsx(p.div,{className:o.dropdownNoResults,initial:{opacity:0},animate:{opacity:1},children:"No results found"})]})]})})]})}Z.__docgenInfo={description:`SearchableDropdown component - Modern filterable dropdown with animations
|
|
2
2
|
|
|
3
3
|
@component
|
|
4
4
|
@description
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import{j as e}from"./iframe-Cw8dCV4Z.js";import{S as a}from"./SearchableDropdown-BtIsuxmT.js";import"./preload-helper-C1FmrZbK.js";import"./proxy-p8L3T_Zy.js";import"./MotionConfigContext-BCa1jVYq.js";import"./chevron-down-Ciks5pXx.js";import"./createLucideIcon-dvowvj4F.js";import"./index-CzApopWo.js";import"./search-7V6DOf2z.js";import"./check-DLeHG_Da.js";const j={title:"Atoms/SearchableDropdown",component:a,parameters:{layout:"centered",docs:{description:{component:"A dropdown component with built-in search functionality and smooth animations."}}},tags:["autodocs"],argTypes:{label:{control:"text"},value:{control:"text"},placeholder:{control:"text"},allowEmpty:{control:"boolean"},onChange:{action:"changed"}}},n=[{label:"United States",value:"us"},{label:"United Kingdom",value:"uk"},{label:"Canada",value:"ca"},{label:"Germany",value:"de"},{label:"France",value:"fr"},{label:"Italy",value:"it"},{label:"Spain",value:"es"},{label:"Japan",value:"jp"},{label:"Australia",value:"au"},{label:"Brazil",value:"br"}],r=[{label:"React",value:"react"},{label:"Vue.js",value:"vue"},{label:"Angular",value:"angular"},{label:"Svelte",value:"svelte"},{label:"TypeScript",value:"typescript"},{label:"JavaScript",value:"javascript"},{label:"Node.js",value:"nodejs"},{label:"Python",value:"python"},{label:"Java",value:"java"},{label:"C#",value:"csharp"},{label:"Go",value:"go"},{label:"Rust",value:"rust"}],l={args:{label:"Select Country",value:"",options:n,placeholder:"Choose a country",allowEmpty:!0,onChange:()=>{}}},o={args:{label:"Technology Stack",value:"",options:r,placeholder:"Search technologies...",allowEmpty:!0,onChange:()=>{}}},t={args:{label:"With Empty Option",value:"",options:n.slice(0,5),placeholder:"Choose...",allowEmpty:!0,onChange:()=>{}},render:()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",width:"300px"},children:[e.jsx(a,{label:"With Empty Option",value:"",onChange:()=>{},options:n.slice(0,5),placeholder:"Choose...",allowEmpty:!0}),e.jsx(a,{label:"No Empty Option",value:"react",onChange:()=>{},options:r.slice(0,5),placeholder:"Choose...",allowEmpty:!1}),e.jsx(a,{label:"Pre-selected",value:"us",onChange:()=>{},options:n.slice(0,5),placeholder:"Choose...",allowEmpty:!0}),e.jsx(a,{label:"Long Options List",value:"",onChange:()=>{},options:r,placeholder:"Search technologies...",allowEmpty:!0})]}),parameters:{controls:{disable:!0}}};var s,p,c;l.parameters={...l.parameters,docs:{...(s=l.parameters)==null?void 0:s.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
label: 'Select Country',
|
|
4
|
+
value: '',
|
|
5
|
+
options: countryOptions,
|
|
6
|
+
placeholder: 'Choose a country',
|
|
7
|
+
allowEmpty: true,
|
|
8
|
+
onChange: () => {}
|
|
9
|
+
}
|
|
10
|
+
}`,...(c=(p=l.parameters)==null?void 0:p.docs)==null?void 0:c.source}}};var i,u,h;o.parameters={...o.parameters,docs:{...(i=o.parameters)==null?void 0:i.docs,source:{originalSource:`{
|
|
11
|
+
args: {
|
|
12
|
+
label: 'Technology Stack',
|
|
13
|
+
value: '',
|
|
14
|
+
options: techStackOptions,
|
|
15
|
+
placeholder: 'Search technologies...',
|
|
16
|
+
allowEmpty: true,
|
|
17
|
+
onChange: () => {}
|
|
18
|
+
}
|
|
19
|
+
}`,...(h=(u=o.parameters)==null?void 0:u.docs)==null?void 0:h.source}}};var m,d,b;t.parameters={...t.parameters,docs:{...(m=t.parameters)==null?void 0:m.docs,source:{originalSource:`{
|
|
20
|
+
args: {
|
|
21
|
+
label: 'With Empty Option',
|
|
22
|
+
value: '',
|
|
23
|
+
options: countryOptions.slice(0, 5),
|
|
24
|
+
placeholder: 'Choose...',
|
|
25
|
+
allowEmpty: true,
|
|
26
|
+
onChange: () => {}
|
|
27
|
+
},
|
|
28
|
+
render: () => <div style={{
|
|
29
|
+
display: 'flex',
|
|
30
|
+
flexDirection: 'column',
|
|
31
|
+
gap: '1rem',
|
|
32
|
+
width: '300px'
|
|
33
|
+
}}>
|
|
34
|
+
<SearchableDropdown label="With Empty Option" value="" onChange={() => {}} options={countryOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={true} />
|
|
35
|
+
<SearchableDropdown label="No Empty Option" value="react" onChange={() => {}} options={techStackOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={false} />
|
|
36
|
+
<SearchableDropdown label="Pre-selected" value="us" onChange={() => {}} options={countryOptions.slice(0, 5)} placeholder="Choose..." allowEmpty={true} />
|
|
37
|
+
<SearchableDropdown label="Long Options List" value="" onChange={() => {}} options={techStackOptions} placeholder="Search technologies..." allowEmpty={true} />
|
|
38
|
+
</div>,
|
|
39
|
+
parameters: {
|
|
40
|
+
controls: {
|
|
41
|
+
disable: true
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}`,...(b=(d=t.parameters)==null?void 0:d.docs)==null?void 0:b.source}}};const D=["Default","LongList","AllVariants"];export{t as AllVariants,l as Default,o as LongList,D as __namedExportsOrder,j as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as s}from"./iframe-
|
|
1
|
+
import{j as s}from"./iframe-Cw8dCV4Z.js";import{u as g}from"./useSound-D23BsIr4.js";import{C as I}from"./chevron-down-Ciks5pXx.js";const S="_selectInput_evuah_1",x="_selectWrapper_evuah_16",j="_selectIcon_evuah_68",C="_error_evuah_134",V="_success_evuah_163",q="_loading_evuah_190",l={selectInput:S,selectWrapper:x,selectIcon:j,error:C,success:V,loading:q};function w({label:r,value:c,onChange:u,options:i,placeholder:p="Select...",disabled:d=!1,error:f=!1,success:v=!1,loading:a=!1,required:t=!1,soundConfig:h,className:n}){const{handlers:m,playSound:_}=g(h),b=()=>{const e=[l.selectInput];return f&&e.push(l.error),v&&e.push(l.success),a&&e.push(l.loading),e.join(" ")};return s.jsxs("div",{className:`${b()}${n?` ${n}`:""}`,children:[s.jsxs("label",{children:[r,t&&s.jsx("span",{style:{color:"var(--color-error)"},children:" *"})]}),s.jsxs("div",{className:l.selectWrapper,children:[s.jsxs("select",{value:c,onChange:e=>{_("click"),u(e.target.value)},disabled:d||a,required:t,...m,children:[s.jsx("option",{value:"",children:p}),i.map(e=>{const o=typeof e=="string"?e:e.value,y=typeof e=="string"?e:e.label;return s.jsx("option",{value:o,children:y},o)})]}),s.jsx(I,{className:l.selectIcon})]})]})}w.__docgenInfo={description:`SelectInput component - Styled dropdown selector with flexible option format
|
|
2
2
|
|
|
3
3
|
@component
|
|
4
4
|
@description
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import{r as h,j as o}from"./iframe-Cw8dCV4Z.js";import{S as t}from"./SelectInput-C0kBLYgX.js";import"./preload-helper-C1FmrZbK.js";import"./useSound-D23BsIr4.js";import"./chevron-down-Ciks5pXx.js";import"./createLucideIcon-dvowvj4F.js";const F={title:"Atoms/SelectInput",component:t,parameters:{layout:"centered",docs:{description:{component:"A simple dropdown select component with customizable options."}}},tags:["autodocs"],argTypes:{label:{control:"text"},value:{control:"text"},placeholder:{control:"text"},onChange:{action:"changed"}}},y=["Option 1","Option 2","Option 3","Option 4"],S=[{label:"United States",value:"us"},{label:"United Kingdom",value:"uk"},{label:"Canada",value:"ca"},{label:"Australia",value:"au"},{label:"Germany",value:"de"},{label:"France",value:"fr"},{label:"Italy",value:"it"},{label:"Spain",value:"es"}],r={args:{label:"Select an option",value:"",onChange:()=>{},options:y,placeholder:"Choose..."}},n={args:{label:"Country",value:"uk",onChange:()=>{},options:S,placeholder:"Select a country"}},s={args:{label:"Form Example",value:"",onChange:()=>{},options:["Option 1","Option 2"]},render:()=>{const[e,l]=h.useState({title:"",category:"",priority:"",assignee:""});return o.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",padding:"1.5rem",background:"var(--color-background-secondary)",borderRadius:"var(--radius-md)",minWidth:"300px"},children:[o.jsx("h3",{style:{marginTop:0},children:"Create Task"}),o.jsx(t,{label:"Title",value:e.title,onChange:a=>l({...e,title:a}),options:["Mr","Mrs","Ms","Dr","Prof"],placeholder:"Select title"}),o.jsx(t,{label:"Category",value:e.category,onChange:a=>l({...e,category:a}),options:[{label:"Bug",value:"bug"},{label:"Feature",value:"feature"},{label:"Documentation",value:"docs"},{label:"Testing",value:"test"}],placeholder:"Select category"}),o.jsx(t,{label:"Priority",value:e.priority,onChange:a=>l({...e,priority:a}),options:["Low","Medium","High","Critical"],placeholder:"Select priority"}),o.jsx(t,{label:"Assignee",value:e.assignee,onChange:a=>l({...e,assignee:a}),options:[{label:"John Doe",value:"john"},{label:"Jane Smith",value:"jane"},{label:"Bob Johnson",value:"bob"},{label:"Alice Brown",value:"alice"}],placeholder:"Select assignee"})]})},parameters:{controls:{disable:!0}}};var i,c,u;r.parameters={...r.parameters,docs:{...(i=r.parameters)==null?void 0:i.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
label: 'Select an option',
|
|
4
|
+
value: '',
|
|
5
|
+
onChange: () => {},
|
|
6
|
+
options: simpleOptions,
|
|
7
|
+
placeholder: 'Choose...'
|
|
8
|
+
}
|
|
9
|
+
}`,...(u=(c=r.parameters)==null?void 0:c.docs)==null?void 0:u.source}}};var p,m,d;n.parameters={...n.parameters,docs:{...(p=n.parameters)==null?void 0:p.docs,source:{originalSource:`{
|
|
10
|
+
args: {
|
|
11
|
+
label: 'Country',
|
|
12
|
+
value: 'uk',
|
|
13
|
+
onChange: () => {},
|
|
14
|
+
options: countryOptions,
|
|
15
|
+
placeholder: 'Select a country'
|
|
16
|
+
}
|
|
17
|
+
}`,...(d=(m=n.parameters)==null?void 0:m.docs)==null?void 0:d.source}}};var g,b,v;s.parameters={...s.parameters,docs:{...(g=s.parameters)==null?void 0:g.docs,source:{originalSource:`{
|
|
18
|
+
args: {
|
|
19
|
+
label: 'Form Example',
|
|
20
|
+
value: '',
|
|
21
|
+
onChange: () => {},
|
|
22
|
+
options: ['Option 1', 'Option 2']
|
|
23
|
+
},
|
|
24
|
+
render: () => {
|
|
25
|
+
const [formData, setFormData] = useState({
|
|
26
|
+
title: '',
|
|
27
|
+
category: '',
|
|
28
|
+
priority: '',
|
|
29
|
+
assignee: ''
|
|
30
|
+
});
|
|
31
|
+
return <div style={{
|
|
32
|
+
display: 'flex',
|
|
33
|
+
flexDirection: 'column',
|
|
34
|
+
gap: '1rem',
|
|
35
|
+
padding: '1.5rem',
|
|
36
|
+
background: 'var(--color-background-secondary)',
|
|
37
|
+
borderRadius: 'var(--radius-md)',
|
|
38
|
+
minWidth: '300px'
|
|
39
|
+
}}>
|
|
40
|
+
<h3 style={{
|
|
41
|
+
marginTop: 0
|
|
42
|
+
}}>Create Task</h3>
|
|
43
|
+
|
|
44
|
+
<SelectInput label="Title" value={formData.title} onChange={value => setFormData({
|
|
45
|
+
...formData,
|
|
46
|
+
title: value
|
|
47
|
+
})} options={['Mr', 'Mrs', 'Ms', 'Dr', 'Prof']} placeholder="Select title" />
|
|
48
|
+
|
|
49
|
+
<SelectInput label="Category" value={formData.category} onChange={value => setFormData({
|
|
50
|
+
...formData,
|
|
51
|
+
category: value
|
|
52
|
+
})} options={[{
|
|
53
|
+
label: 'Bug',
|
|
54
|
+
value: 'bug'
|
|
55
|
+
}, {
|
|
56
|
+
label: 'Feature',
|
|
57
|
+
value: 'feature'
|
|
58
|
+
}, {
|
|
59
|
+
label: 'Documentation',
|
|
60
|
+
value: 'docs'
|
|
61
|
+
}, {
|
|
62
|
+
label: 'Testing',
|
|
63
|
+
value: 'test'
|
|
64
|
+
}]} placeholder="Select category" />
|
|
65
|
+
|
|
66
|
+
<SelectInput label="Priority" value={formData.priority} onChange={value => setFormData({
|
|
67
|
+
...formData,
|
|
68
|
+
priority: value
|
|
69
|
+
})} options={['Low', 'Medium', 'High', 'Critical']} placeholder="Select priority" />
|
|
70
|
+
|
|
71
|
+
<SelectInput label="Assignee" value={formData.assignee} onChange={value => setFormData({
|
|
72
|
+
...formData,
|
|
73
|
+
assignee: value
|
|
74
|
+
})} options={[{
|
|
75
|
+
label: 'John Doe',
|
|
76
|
+
value: 'john'
|
|
77
|
+
}, {
|
|
78
|
+
label: 'Jane Smith',
|
|
79
|
+
value: 'jane'
|
|
80
|
+
}, {
|
|
81
|
+
label: 'Bob Johnson',
|
|
82
|
+
value: 'bob'
|
|
83
|
+
}, {
|
|
84
|
+
label: 'Alice Brown',
|
|
85
|
+
value: 'alice'
|
|
86
|
+
}]} placeholder="Select assignee" />
|
|
87
|
+
</div>;
|
|
88
|
+
},
|
|
89
|
+
parameters: {
|
|
90
|
+
controls: {
|
|
91
|
+
disable: true
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
}`,...(v=(b=s.parameters)==null?void 0:b.docs)==null?void 0:v.source}}};const k=["Default","WithObjectOptions","FormExample"];export{r as Default,s as FormExample,n as WithObjectOptions,k as __namedExportsOrder,F as default};
|
package/storybook-static/assets/{ShapeBlur.stories-ZQV0yHkn.js → ShapeBlur.stories-C3RyLvBh.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as M,j}from"./iframe-
|
|
1
|
+
import{r as M,j}from"./iframe-Cw8dCV4Z.js";import{d as m,S as B,a as D,W as N,q as T,i as k,M as G,r as H}from"./three.module--_vTUKhS.js";import"./preload-helper-C1FmrZbK.js";const U=`
|
|
2
2
|
varying vec2 v_texcoord;
|
|
3
3
|
void main() {
|
|
4
4
|
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
|
|
@@ -118,7 +118,7 @@ void main() {
|
|
|
118
118
|
float alpha = sdf;
|
|
119
119
|
gl_FragColor = vec4(color.rgb, alpha);
|
|
120
120
|
}
|
|
121
|
-
`,I=({className:L="",variation:p=0,pixelRatioProp:v=2,shapeSize:h=1.2,roundness:x=.4,borderSize:_=.05,circleSize:g=.3,circleEdge:z=.5})=>{const w=M.useRef();return M.useEffect(()=>{const t=w.current;if(!t)return;let l=!0,S,f=0,R=0;const y=new m,c=new m,C=new m;let s=1,a=1;const E=new B,r=new D;r.position.z=1;const e=new N({alpha:!0});e.setClearColor(0,0),t.appendChild(e.domElement);const W=new T(1,1),b=new k({vertexShader:U,fragmentShader:X,uniforms:{u_mouse:{value:c},u_resolution:{value:C},u_pixelRatio:{value:v},u_shapeSize:{value:h},u_roundness:{value:x},u_borderSize:{value:_},u_circleSize:{value:g},u_circleEdge:{value:z}},defines:{VAR:p},transparent:!0}),V=new G(W,b);E.add(V);const n=o=>{const i=t.getBoundingClientRect();y.set(o.clientX-i.left,o.clientY-i.top)};document.addEventListener("mousemove",n),document.addEventListener("pointermove",n);const d=()=>{if(!l)return;s=t.clientWidth,a=t.clientHeight;const o=Math.min(window.devicePixelRatio,2);e.setSize(s,a),e.setPixelRatio(o),r.left=-s/2,r.right=s/2,r.top=a/2,r.bottom=-a/2,r.updateProjectionMatrix(),V.scale.set(s,a,1),C.set(s,a).multiplyScalar(o),b.uniforms.u_pixelRatio.value=o};d(),window.addEventListener("resize",d);const A=new ResizeObserver(()=>{l&&d()});A.observe(t);const P=()=>{if(!l)return;f=performance.now()*.001;const o=f-R;R=f,["x","y"].forEach(i=>{c[i]=H.damp(c[i],y[i],8,o)}),e.render(E,r),S=requestAnimationFrame(P)};return P(),()=>{l=!1,cancelAnimationFrame(S),window.removeEventListener("resize",d),A.disconnect(),document.removeEventListener("mousemove",n),document.removeEventListener("pointermove",n),t.contains(e.domElement)&&t.removeChild(e.domElement),e.dispose(),e.forceContextLoss()}},[p,v,h,x,_,g,z]),j.jsx("div",{className:L,ref:w,style:{width:"100%",minHeight:"100vh",position:"relative"}})};I.__docgenInfo={description:"",methods:[],displayName:"ShapeBlur",props:{className:{defaultValue:{value:"''",computed:!1},required:!1},variation:{defaultValue:{value:"0",computed:!1},required:!1},pixelRatioProp:{defaultValue:{value:"2",computed:!1},required:!1},shapeSize:{defaultValue:{value:"1.2",computed:!1},required:!1},roundness:{defaultValue:{value:"0.4",computed:!1},required:!1},borderSize:{defaultValue:{value:"0.05",computed:!1},required:!1},circleSize:{defaultValue:{value:"0.3",computed:!1},required:!1},circleEdge:{defaultValue:{value:"0.5",computed:!1},required:!1}}};const Q={title:"ReactBits/Animations/ShapeBlur",component:I,parameters:{layout:"fullscreen"}
|
|
121
|
+
`,I=({className:L="",variation:p=0,pixelRatioProp:v=2,shapeSize:h=1.2,roundness:x=.4,borderSize:_=.05,circleSize:g=.3,circleEdge:z=.5})=>{const w=M.useRef();return M.useEffect(()=>{const t=w.current;if(!t)return;let l=!0,S,f=0,R=0;const y=new m,c=new m,C=new m;let s=1,a=1;const E=new B,r=new D;r.position.z=1;const e=new N({alpha:!0});e.setClearColor(0,0),t.appendChild(e.domElement);const W=new T(1,1),b=new k({vertexShader:U,fragmentShader:X,uniforms:{u_mouse:{value:c},u_resolution:{value:C},u_pixelRatio:{value:v},u_shapeSize:{value:h},u_roundness:{value:x},u_borderSize:{value:_},u_circleSize:{value:g},u_circleEdge:{value:z}},defines:{VAR:p},transparent:!0}),V=new G(W,b);E.add(V);const n=o=>{const i=t.getBoundingClientRect();y.set(o.clientX-i.left,o.clientY-i.top)};document.addEventListener("mousemove",n),document.addEventListener("pointermove",n);const d=()=>{if(!l)return;s=t.clientWidth,a=t.clientHeight;const o=Math.min(window.devicePixelRatio,2);e.setSize(s,a),e.setPixelRatio(o),r.left=-s/2,r.right=s/2,r.top=a/2,r.bottom=-a/2,r.updateProjectionMatrix(),V.scale.set(s,a,1),C.set(s,a).multiplyScalar(o),b.uniforms.u_pixelRatio.value=o};d(),window.addEventListener("resize",d);const A=new ResizeObserver(()=>{l&&d()});A.observe(t);const P=()=>{if(!l)return;f=performance.now()*.001;const o=f-R;R=f,["x","y"].forEach(i=>{c[i]=H.damp(c[i],y[i],8,o)}),e.render(E,r),S=requestAnimationFrame(P)};return P(),()=>{l=!1,cancelAnimationFrame(S),window.removeEventListener("resize",d),A.disconnect(),document.removeEventListener("mousemove",n),document.removeEventListener("pointermove",n),t.contains(e.domElement)&&t.removeChild(e.domElement),e.dispose(),e.forceContextLoss()}},[p,v,h,x,_,g,z]),j.jsx("div",{className:L,ref:w,style:{width:"100%",minHeight:"100vh",position:"relative"}})};I.__docgenInfo={description:"",methods:[],displayName:"ShapeBlur",props:{className:{defaultValue:{value:"''",computed:!1},required:!1},variation:{defaultValue:{value:"0",computed:!1},required:!1},pixelRatioProp:{defaultValue:{value:"2",computed:!1},required:!1},shapeSize:{defaultValue:{value:"1.2",computed:!1},required:!1},roundness:{defaultValue:{value:"0.4",computed:!1},required:!1},borderSize:{defaultValue:{value:"0.05",computed:!1},required:!1},circleSize:{defaultValue:{value:"0.3",computed:!1},required:!1},circleEdge:{defaultValue:{value:"0.5",computed:!1},required:!1}}};const Q={title:"ReactBits/Animations/ShapeBlur",component:I,parameters:{layout:"fullscreen"}},u={args:{variation:0,pixelRatioProp:2,shapeSize:1.2,roundness:.4,borderSize:.05,circleSize:.3,circleEdge:.5}};var q,F,O;u.parameters={...u.parameters,docs:{...(q=u.parameters)==null?void 0:q.docs,source:{originalSource:`{
|
|
122
122
|
args: {
|
|
123
123
|
variation: 0,
|
|
124
124
|
pixelRatioProp: 2,
|
package/storybook-static/assets/{ShapeGrid.stories-G_tZAcp9.js → ShapeGrid.stories-ltmu466o.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as v,j as q}from"./iframe-
|
|
1
|
+
import{r as v,j as q}from"./iframe-Cw8dCV4Z.js";import"./preload-helper-C1FmrZbK.js";const z={"shapegrid-canvas":"_shapegrid-canvas_ilyut_1"},J=({direction:P="right",speed:L=1,borderColor:k="#999",squareSize:t=40,hoverFillColor:b="#222",shape:X="square",hoverTrailAmount:y=0,className:Q=""})=>{const _=v.useRef(null),j=v.useRef(null),U=v.useRef(),Z=v.useRef(),r=v.useRef({x:0,y:0}),o=v.useRef(null),p=v.useRef([]),M=v.useRef(new Map);return v.useEffect(()=>{const s=_.current,n=s.getContext("2d"),Y=X==="hexagon",E=X==="triangle",w=t*1.5,m=t*Math.sqrt(3),V=()=>{s.width=s.offsetWidth,s.height=s.offsetHeight,U.current=Math.ceil(s.width/t)+1,Z.current=Math.ceil(s.height/t)+1};window.addEventListener("resize",V),V();const C=(l,e,c)=>{n.beginPath();for(let u=0;u<6;u++){const h=Math.PI/3*u,d=l+c*Math.cos(h),f=e+c*Math.sin(h);u===0?n.moveTo(d,f):n.lineTo(d,f)}n.closePath()},G=(l,e,c)=>{n.beginPath(),n.arc(l,e,c/2,0,Math.PI*2),n.closePath()},O=(l,e,c,u)=>{n.beginPath(),u?(n.moveTo(l,e+c/2),n.lineTo(l+c/2,e-c/2),n.lineTo(l-c/2,e-c/2)):(n.moveTo(l,e-c/2),n.lineTo(l+c/2,e+c/2),n.lineTo(l-c/2,e+c/2)),n.closePath()},A=()=>{if(n.clearRect(0,0,s.width,s.height),Y){const e=Math.floor(r.current.x/w),c=(r.current.x%w+w)%w,u=(r.current.y%m+m)%m,h=Math.ceil(s.width/w)+3,d=Math.ceil(s.height/m)+3;for(let f=-2;f<h;f++)for(let g=-2;g<d;g++){const i=f*w+c,a=g*m+((f+e)%2!==0?m/2:0)+u,x=`${f},${g}`,R=M.current.get(x);R&&(n.globalAlpha=R,C(i,a,t),n.fillStyle=b,n.fill(),n.globalAlpha=1),C(i,a,t),n.strokeStyle=k,n.stroke()}}else if(E){const e=t/2,c=Math.floor(r.current.x/e),u=Math.floor(r.current.y/t),h=(r.current.x%e+e)%e,d=(r.current.y%t+t)%t,f=Math.ceil(s.width/e)+4,g=Math.ceil(s.height/t)+4;for(let i=-2;i<f;i++)for(let a=-2;a<g;a++){const x=i*e+h,R=a*t+t/2+d,I=((i+c+a+u)%2+2)%2!==0,S=`${i},${a}`,N=M.current.get(S);N&&(n.globalAlpha=N,O(x,R,t,I),n.fillStyle=b,n.fill(),n.globalAlpha=1),O(x,R,t,I),n.strokeStyle=k,n.stroke()}}else if(X==="circle"){const e=(r.current.x%t+t)%t,c=(r.current.y%t+t)%t,u=Math.ceil(s.width/t)+3,h=Math.ceil(s.height/t)+3;for(let d=-2;d<u;d++)for(let f=-2;f<h;f++){const g=d*t+t/2+e,i=f*t+t/2+c,a=`${d},${f}`,x=M.current.get(a);x&&(n.globalAlpha=x,G(g,i,t),n.fillStyle=b,n.fill(),n.globalAlpha=1),G(g,i,t),n.strokeStyle=k,n.stroke()}}else{const e=(r.current.x%t+t)%t,c=(r.current.y%t+t)%t,u=Math.ceil(s.width/t)+3,h=Math.ceil(s.height/t)+3;for(let d=-2;d<u;d++)for(let f=-2;f<h;f++){const g=d*t+e,i=f*t+c,a=`${d},${f}`,x=M.current.get(a);x&&(n.globalAlpha=x,n.fillStyle=b,n.fillRect(g,i,t,t),n.globalAlpha=1),n.strokeStyle=k,n.strokeRect(g,i,t,t)}}const l=n.createRadialGradient(s.width/2,s.height/2,0,s.width/2,s.height/2,Math.sqrt(s.width**2+s.height**2)/2);l.addColorStop(0,"rgba(0, 0, 0, 0)"),n.fillStyle=l,n.fillRect(0,0,s.width,s.height)},H=()=>{const l=Math.max(L,.1),e=Y?w*2:t,c=Y?m:E?t*2:t;switch(P){case"right":r.current.x=(r.current.x-l+e)%e;break;case"left":r.current.x=(r.current.x+l+e)%e;break;case"up":r.current.y=(r.current.y+l+c)%c;break;case"down":r.current.y=(r.current.y-l+c)%c;break;case"diagonal":r.current.x=(r.current.x-l+e)%e,r.current.y=(r.current.y-l+c)%c;break}T(),A(),j.current=requestAnimationFrame(H)},T=()=>{const l=new Map;if(o.current&&l.set(`${o.current.x},${o.current.y}`,1),y>0)for(let e=0;e<p.current.length;e++){const c=p.current[e],u=`${c.x},${c.y}`;l.has(u)||l.set(u,(p.current.length-e)/(p.current.length+1))}for(const[e]of l)M.current.has(e)||M.current.set(e,0);for(const[e,c]of M.current){const u=l.get(e)||0,h=c+(u-c)*.15;h<.005?M.current.delete(e):M.current.set(e,h)}},K=l=>{const e=s.getBoundingClientRect(),c=l.clientX-e.left,u=l.clientY-e.top;if(Y){const h=Math.floor(r.current.x/w),d=(r.current.x%w+w)%w,f=(r.current.y%m+m)%m,g=c-d,i=u-f,a=Math.round(g/w),x=(a+h)%2!==0?m/2:0,R=Math.round((i-x)/m);(!o.current||o.current.x!==a||o.current.y!==R)&&(o.current&&y>0&&(p.current.unshift({...o.current}),p.current.length>y&&(p.current.length=y)),o.current={x:a,y:R})}else if(E){const h=t/2,d=(r.current.x%h+h)%h,f=(r.current.y%t+t)%t,g=c-d,i=u-f,a=Math.round(g/h),x=Math.floor(i/t);(!o.current||o.current.x!==a||o.current.y!==x)&&(o.current&&y>0&&(p.current.unshift({...o.current}),p.current.length>y&&(p.current.length=y)),o.current={x:a,y:x})}else if(X==="circle"){const h=(r.current.x%t+t)%t,d=(r.current.y%t+t)%t,f=c-h,g=u-d,i=Math.round(f/t),a=Math.round(g/t);(!o.current||o.current.x!==i||o.current.y!==a)&&(o.current&&y>0&&(p.current.unshift({...o.current}),p.current.length>y&&(p.current.length=y)),o.current={x:i,y:a})}else{const h=(r.current.x%t+t)%t,d=(r.current.y%t+t)%t,f=c-h,g=u-d,i=Math.floor(f/t),a=Math.floor(g/t);(!o.current||o.current.x!==i||o.current.y!==a)&&(o.current&&y>0&&(p.current.unshift({...o.current}),p.current.length>y&&(p.current.length=y)),o.current={x:i,y:a})}},B=()=>{o.current&&y>0&&(p.current.unshift({...o.current}),p.current.length>y&&(p.current.length=y)),o.current=null};return s.addEventListener("mousemove",K),s.addEventListener("mouseleave",B),j.current=requestAnimationFrame(H),()=>{window.removeEventListener("resize",V),cancelAnimationFrame(j.current),s.removeEventListener("mousemove",K),s.removeEventListener("mouseleave",B)}},[P,L,k,b,t,X,y]),q.jsx("canvas",{ref:_,className:`${z["shapegrid-canvas"]} ${Q}`})};J.__docgenInfo={description:"",methods:[],displayName:"ShapeGrid",props:{direction:{defaultValue:{value:"'right'",computed:!1},required:!1},speed:{defaultValue:{value:"1",computed:!1},required:!1},borderColor:{defaultValue:{value:"'#999'",computed:!1},required:!1},squareSize:{defaultValue:{value:"40",computed:!1},required:!1},hoverFillColor:{defaultValue:{value:"'#222'",computed:!1},required:!1},shape:{defaultValue:{value:"'square'",computed:!1},required:!1},hoverTrailAmount:{defaultValue:{value:"0",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1}}};const nt={title:"ReactBits/Backgrounds/ShapeGrid",component:J,parameters:{layout:"fullscreen"}},$={args:{direction:"right",speed:1,borderColor:"#999",squareSize:40,hoverFillColor:"#222",shape:"square",hoverTrailAmount:0}};var W,D,F;$.parameters={...$.parameters,docs:{...(W=$.parameters)==null?void 0:W.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
direction: 'right',
|
|
4
4
|
speed: 1,
|
package/storybook-static/assets/{ShinyText.stories-C6BrLI0x.js → ShinyText.stories-JO2F4CpJ.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r,j as N}from"./iframe-
|
|
1
|
+
import{r,j as N}from"./iframe-Cw8dCV4Z.js";import{u as P}from"./use-motion-value-BVm7csqA.js";import{u as z}from"./use-animation-frame-DovyG_Es.js";import{u as A}from"./use-transform-CQNghMvr.js";import{m as B}from"./proxy-p8L3T_Zy.js";import"./preload-helper-C1FmrZbK.js";import"./MotionConfigContext-BCa1jVYq.js";const F={"shiny-text":"_shiny-text_183zx_1"},T=({text:V,disabled:q=!1,speed:k=2,className:C="",color:u="#b5b5b5",shineColor:$="#ffffff",spread:R=120,yoyo:S=!1,pauseOnHover:f=!1,direction:m="left",delay:_=0})=>{const[D,y]=r.useState(!1),e=P(0),c=r.useRef(0),n=r.useRef(null),a=r.useRef(m==="left"?1:-1),t=k*1e3,b=_*1e3;z(o=>{if(q||D){n.current=null;return}if(n.current===null){n.current=o;return}const I=o-n.current;if(n.current=o,c.current+=I,S){const l=t+b,i=l*2,s=c.current%i;if(s<t){const p=s/t*100;e.set(a.current===1?p:100-p)}else if(s<l)e.set(a.current===1?100:0);else if(s<l+t){const x=100-(s-l)/t*100;e.set(a.current===1?x:100-x)}else e.set(a.current===1?0:100)}else{const l=t+b,i=c.current%l;if(i<t){const s=i/t*100;e.set(a.current===1?s:100-s)}else e.set(a.current===1?100:0)}}),r.useEffect(()=>{a.current=m==="left"?1:-1,c.current=0,e.set(0)},[m]);const E=A(e,o=>`${150-o*2}% center`),M=r.useCallback(()=>{f&&y(!0)},[f]),W=r.useCallback(()=>{f&&y(!1)},[f]),j={backgroundImage:`linear-gradient(${R}deg, ${u} 0%, ${u} 35%, ${$} 50%, ${u} 65%, ${u} 100%)`,backgroundSize:"200% auto",WebkitBackgroundClip:"text",backgroundClip:"text",WebkitTextFillColor:"transparent"};return N.jsx(B.span,{className:`${F["shiny-text"]} ${C}`,style:{...j,backgroundPosition:E},onMouseEnter:M,onMouseLeave:W,children:V})};T.__docgenInfo={description:"",methods:[],displayName:"ShinyText",props:{disabled:{defaultValue:{value:"false",computed:!1},required:!1},speed:{defaultValue:{value:"2",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},color:{defaultValue:{value:"'#b5b5b5'",computed:!1},required:!1},shineColor:{defaultValue:{value:"'#ffffff'",computed:!1},required:!1},spread:{defaultValue:{value:"120",computed:!1},required:!1},yoyo:{defaultValue:{value:"false",computed:!1},required:!1},pauseOnHover:{defaultValue:{value:"false",computed:!1},required:!1},direction:{defaultValue:{value:"'left'",computed:!1},required:!1},delay:{defaultValue:{value:"0",computed:!1},required:!1}}};const Q={title:"ReactBits/TextAnimations/ShinyText",component:T,parameters:{layout:"fullscreen"}},d={args:{text:"Hello World",disabled:!1,speed:2,color:"#b5b5b5",shineColor:"#ffffff",spread:120,yoyo:!1,pauseOnHover:!1,direction:"left",delay:0}};var g,v,h;d.parameters={...d.parameters,docs:{...(g=d.parameters)==null?void 0:g.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
text: 'Hello World',
|
|
4
4
|
disabled: false,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as n,j as a}from"./iframe-
|
|
1
|
+
import{r as n,j as a}from"./iframe-Cw8dCV4Z.js";import{C as p,u as x,a as y}from"./react-three-fiber.esm-BnMrba87.js";import{n as g}from"./three.module--_vTUKhS.js";import"./preload-helper-C1FmrZbK.js";const S=e=>(e=e.replace("#",""),[parseInt(e.slice(0,2),16)/255,parseInt(e.slice(2,4),16)/255,parseInt(e.slice(4,6),16)/255]),C=`
|
|
2
2
|
varying vec2 vUv;
|
|
3
3
|
varying vec3 vPosition;
|
|
4
4
|
|
|
@@ -51,7 +51,7 @@ void main() {
|
|
|
51
51
|
col.a = 1.0;
|
|
52
52
|
gl_FragColor = col;
|
|
53
53
|
}
|
|
54
|
-
`,v=n.forwardRef(function({uniforms:r},t){const{viewport:o}=x();return n.useLayoutEffect(()=>{t.current&&t.current.scale.set(o.width,o.height,1)},[t,o]),
|
|
54
|
+
`,v=n.forwardRef(function({uniforms:r},t){const{viewport:o}=x();return n.useLayoutEffect(()=>{t.current&&t.current.scale.set(o.width,o.height,1)},[t,o]),y((l,i)=>{t.current.material.uniforms.uTime.value+=.1*i}),a.jsxs("mesh",{ref:t,children:[a.jsx("planeGeometry",{args:[1,1,1,1]}),a.jsx("shaderMaterial",{uniforms:r,vertexShader:C,fragmentShader:h})]})});v.displayName="SilkPlane";const d=({speed:e=5,scale:r=1,color:t="#7B7481",noiseIntensity:o=1.5,rotation:l=0})=>{const i=n.useRef(),m=n.useMemo(()=>({uSpeed:{value:e},uScale:{value:r},uNoiseIntensity:{value:o},uColor:{value:new g(...S(t))},uRotation:{value:l},uTime:{value:0}}),[e,r,o,t,l]);return a.jsx(p,{dpr:[1,2],frameloop:"always",children:a.jsx(v,{ref:i,uniforms:m})})};d.__docgenInfo={description:"",methods:[],displayName:"Silk",props:{speed:{defaultValue:{value:"5",computed:!1},required:!1},scale:{defaultValue:{value:"1",computed:!1},required:!1},color:{defaultValue:{value:"'#7B7481'",computed:!1},required:!1},noiseIntensity:{defaultValue:{value:"1.5",computed:!1},required:!1},rotation:{defaultValue:{value:"0",computed:!1},required:!1}}};const k={title:"ReactBits/Backgrounds/Silk",component:d,parameters:{layout:"fullscreen"}},s={args:{speed:5,scale:1,color:"#7B7481",noiseIntensity:1.5,rotation:0}};var u,c,f;s.parameters={...s.parameters,docs:{...(u=s.parameters)==null?void 0:u.docs,source:{originalSource:`{
|
|
55
55
|
args: {
|
|
56
56
|
speed: 5,
|
|
57
57
|
scale: 1,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._container_wk2zd_1{background:transparent;border-radius:var(--radius-lg);padding:var(--spacing-xl)}._header_wk2zd_7{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl)}._title_wk2zd_14{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text)}._legend_wk2zd_20{display:flex;gap:var(--spacing-xl)}._legendItem_wk2zd_25{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary)}._sleepDot_wk2zd_33{width:14px;height:14px;border-radius:var(--radius-full);background:linear-gradient(135deg,#9b59b6,#8e44ad);box-shadow:0 2px 6px #9b59b666;border:2px solid #ffffff}._wakeDot_wk2zd_42{width:14px;height:14px;border-radius:var(--radius-full);background:linear-gradient(135deg,#3498db,#2980b9);box-shadow:0 2px 6px #3498db66;border:2px solid #ffffff}._chart_wk2zd_51{display:block}._gridLine_wk2zd_55{stroke:var(--color-border);stroke-opacity:.1}._sleepBar_wk2zd_60{transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer}._sleepBar_wk2zd_60:hover{transform:scaleY(1.05);filter:brightness(1.15)}._xAxis_wk2zd_70,._yAxis_wk2zd_71{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:500}._xAxis_wk2zd_70 line,._xAxis_wk2zd_70 path,._yAxis_wk2zd_71 line,._yAxis_wk2zd_71 path{stroke:var(--color-border)}._xAxis_wk2zd_70 text,._yAxis_wk2zd_71 text{fill:var(--color-text-secondary);transition:all .2s ease}._xAxis_wk2zd_70 text:hover,._yAxis_wk2zd_71 text:hover{fill:var(--color-text);font-weight:600}._tooltip_wk2zd_96{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_wk2zd_96._visible_wk2zd_117{opacity:1;transform:translateY(-4px) translate(-50%)}._tooltipHeader_wk2zd_122{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_wk2zd_133{font-size:18px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.1))}._tooltipInfo_wk2zd_138{display:flex;flex-direction:column;gap:6px}._tooltipRow_wk2zd_144{display:flex;align-items:center;gap:8px;color:var(--color-text-secondary);font-size:13px}._tooltipLabel_wk2zd_152{display:flex;align-items:center;gap:6px}._tooltipValue_wk2zd_158{color:var(--color-text);font-weight:600}._tooltipDuration_wk2zd_163{margin-top:8px;padding-top:8px;border-top:1px solid var(--color-border);color:var(--color-text);font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import{r as b,j as i}from"./iframe-Cw8dCV4Z.js";import{s as v,a as ut}from"./transform-BKmuZieF.js";import{i as it,l as ht}from"./linear-dkJHgUri.js";import{a as mt,b as ft}from"./axis-D3QohQNI.js";import"./preload-helper-C1FmrZbK.js";class V extends Map{constructor(t,r=wt){if(super(),Object.defineProperties(this,{_intern:{value:new Map},_key:{value:r}}),t!=null)for(const[a,n]of t)this.set(a,n)}get(t){return super.get(W(this,t))}has(t){return super.has(W(this,t))}set(t,r){return super.set(gt(this,t),r)}delete(t){return super.delete(Mt(this,t))}}function W({_intern:e,_key:t},r){const a=t(r);return e.has(a)?e.get(a):r}function gt({_intern:e,_key:t},r){const a=t(r);return e.has(a)?e.get(a):(e.set(a,r),r)}function Mt({_intern:e,_key:t},r){const a=t(r);return e.has(a)&&(r=e.get(a),e.delete(a)),r}function wt(e){return e!==null&&typeof e=="object"?e.valueOf():e}function E(e,t,r){e=+e,t=+t,r=(n=arguments.length)<2?(t=e,e=0,1):n<3?1:+r;for(var a=-1,n=Math.max(0,Math.ceil((t-e)/r))|0,s=new Array(n);++a<n;)s[a]=e+a*r;return s}var O=1.70158;(function e(t){t=+t;function r(a){return(a=+a)*a*(t*(a-1)+a)}return r.overshoot=e,r})(O);var P=function e(t){t=+t;function r(a){return--a*a*((a+1)*t+a)+1}return r.overshoot=e,r}(O);(function e(t){t=+t;function r(a){return((a*=2)<1?a*a*((t+1)*a-t):(a-=2)*a*((t+1)*a+t)+2)/2}return r.overshoot=e,r})(O);const q=Symbol("implicit");function lt(){var e=new V,t=[],r=[],a=q;function n(s){let p=e.get(s);if(p===void 0){if(a!==q)return a;e.set(s,p=t.push(s)-1)}return r[p%r.length]}return n.domain=function(s){if(!arguments.length)return t.slice();t=[],e=new V;for(const p of s)e.has(p)||e.set(p,t.push(p)-1);return n},n.range=function(s){return arguments.length?(r=Array.from(s),n):r.slice()},n.unknown=function(s){return arguments.length?(a=s,n):a},n.copy=function(){return lt(t,r).unknown(a)},it.apply(n,arguments),n}function dt(){var e=lt().unknown(void 0),t=e.domain,r=e.range,a=0,n=1,s,p,h=!1,M=0,w=0,g=.5;delete e.unknown;function m(){var l=t().length,k=n<a,x=k?n:a,T=k?a:n;s=(T-x)/Math.max(1,l-M+w*2),h&&(s=Math.floor(s)),x+=(T-x-s*(l-M))*g,p=s*(1-M),h&&(x=Math.round(x),p=Math.round(p));var y=E(l).map(function($){return x+s*$});return r(k?y.reverse():y)}return e.domain=function(l){return arguments.length?(t(l),m()):t()},e.range=function(l){return arguments.length?([a,n]=l,a=+a,n=+n,m()):[a,n]},e.rangeRound=function(l){return[a,n]=l,a=+a,n=+n,h=!0,m()},e.bandwidth=function(){return p},e.step=function(){return s},e.round=function(l){return arguments.length?(h=!!l,m()):h},e.padding=function(l){return arguments.length?(M=Math.min(1,w=+l),m()):M},e.paddingInner=function(l){return arguments.length?(M=Math.min(1,l),m()):M},e.paddingOuter=function(l){return arguments.length?(w=+l,m()):w},e.align=function(l){return arguments.length?(g=Math.max(0,Math.min(1,l)),m()):g},e.copy=function(){return dt(t(),[a,n]).round(h).paddingInner(M).paddingOuter(w).align(g)},it.apply(m(),arguments)}const xt="_container_wk2zd_1",_t="_header_wk2zd_7",kt="_title_wk2zd_14",yt="_legend_wk2zd_20",St="_legendItem_wk2zd_25",bt="_sleepDot_wk2zd_33",vt="_wakeDot_wk2zd_42",$t="_chart_wk2zd_51",Dt="_gridLine_wk2zd_55",jt="_sleepBar_wk2zd_60",At="_xAxis_wk2zd_70",zt="_yAxis_wk2zd_71",Nt="_tooltip_wk2zd_96",Ht="_visible_wk2zd_117",It="_tooltipHeader_wk2zd_122",Tt="_tooltipEmoji_wk2zd_133",Rt="_tooltipInfo_wk2zd_138",Et="_tooltipRow_wk2zd_144",Ot="_tooltipLabel_wk2zd_152",Bt="_tooltipValue_wk2zd_158",Lt="_tooltipDuration_wk2zd_163",c={container:xt,header:_t,title:kt,legend:yt,legendItem:St,sleepDot:bt,wakeDot:vt,chart:$t,gridLine:Dt,sleepBar:jt,xAxis:At,yAxis:zt,tooltip:Nt,visible:Ht,tooltipHeader:It,tooltipEmoji:Tt,tooltipInfo:Rt,tooltipRow:Et,tooltipLabel:Ot,tooltipValue:Bt,tooltipDuration:Lt},G=e=>{const[t,r]=e.split(":").map(Number);return t+r/60},C=e=>{const t=Math.floor(e%24),r=t===0?12:t>12?t-12:t,a=t>=12?"PM":"AM",n=Math.round(e%1*60);return`${Math.floor(r)}:${n.toString().padStart(2,"0")} ${a}`},ct=({sleepData:e,width:t=800,height:r=400,onDateClick:a})=>{const n=b.useRef(null),[s,p]=b.useState(null),h=b.useMemo(()=>({top:30,right:30,bottom:50,left:80}),[]),M=t-h.left-h.right,w=r-h.top-h.bottom;return b.useEffect(()=>{const g=()=>{p(null)};return window.addEventListener("scroll",g,!0),()=>{window.removeEventListener("scroll",g,!0)}},[]),b.useEffect(()=>{if(!n.current||e.length===0)return;const g=v(n.current);g.selectAll("*").remove(),g.append("rect").attr("width",t).attr("height",r).attr("fill","transparent").style("pointer-events","all").on("mouseleave",()=>{p(null)});const m=g.append("g").attr("transform",`translate(${h.left},${h.top})`),l=ht().domain([18,42]).range([0,M]),k=e.map(o=>o.date),x=dt().domain(k).range([0,w]).paddingInner(.2).paddingOuter(.1);m.selectAll(".grid-line-x").data(E(18,43,1)).enter().append("line").attr("class",c.gridLine).attr("x1",o=>l(o)).attr("y1",0).attr("x2",o=>l(o)).attr("y2",w).style("stroke",o=>{const d=o%24;return"var(--color-border)"}).style("stroke-opacity",o=>{const d=o%24;return d===0||d===12?.3:d%3===0?.15:.05}).style("stroke-width",o=>{const d=o%24;return d===0||d===12?2:1}),e.forEach(o=>{const d=x(o.date);if(d===void 0)return;const S=x.bandwidth(),D=m.append("g").attr("class",c.sleepBar).style("cursor","pointer").on("click",()=>a==null?void 0:a(o.date));let u=null,f=null;o.sleep_time&&(u=G(o.sleep_time),u<18&&(u+=24)),o.wake_hour&&(f=G(o.wake_hour),u!==null?(f<u||u>=18&&f<18)&&(f+=24):f<12&&(f+=24)),u!==null&&f!==null&&D.append("rect").attr("x",l(u)).attr("y",d).attr("width",0).attr("height",S).attr("rx",S/2).attr("fill","url(#sleepGradient)").attr("opacity",0).attr("stroke","rgba(255,255,255,0.3)").attr("stroke-width",1).style("filter","drop-shadow(0 2px 8px rgba(155, 89, 182, 0.3))").transition().duration(800).delay(Math.random()*200).ease(ut).attr("width",Math.max(0,l(f)-l(u))).attr("opacity",.85),u!==null&&D.append("circle").attr("cx",l(u)).attr("cy",d+S/2).attr("r",0).attr("fill","#9B59B6").attr("stroke","#ffffff").attr("stroke-width",2).style("filter","drop-shadow(0 3px 6px rgba(155, 89, 182, 0.4))").style("transition","all 0.3s ease").transition().duration(400).delay(300+Math.random()*100).ease(P).attr("r",6),f!==null&&D.append("circle").attr("cx",l(f)).attr("cy",d+S/2).attr("r",0).attr("fill","#3498DB").attr("stroke","#ffffff").attr("stroke-width",2).style("filter","drop-shadow(0 3px 6px rgba(52, 152, 219, 0.4))").style("transition","all 0.3s ease").transition().duration(400).delay(500+Math.random()*100).ease(P).attr("r",6),D.on("mouseenter",function(_){var B;if(v(this).select("rect").transition().duration(200).attr("opacity",1).style("filter","drop-shadow(0 4px 12px rgba(155, 89, 182, 0.5)) brightness(1.1)"),v(this).selectAll("circle").transition().duration(200).attr("r",8),(B=n.current)==null?void 0:B.getBoundingClientRect()){const L=u!==null&&f!==null?f-u:null;p({date:o.date,sleepTime:u!==null?C(u):null,wakeTime:f!==null?C(f):null,duration:L!==null?Math.round(L*100)/100:null,x:_.pageX,y:_.pageY-80})}}).on("mouseleave",function(){v(this).select("rect").transition().duration(200).attr("opacity",.85).style("filter","drop-shadow(0 2px 8px rgba(155, 89, 182, 0.3))"),v(this).selectAll("circle").transition().duration(200).attr("r",6),p(null)}).on("mousemove",function(_){p(R=>R?{...R,x:_.pageX,y:_.pageY-80}:null)})});const y=g.append("defs").append("linearGradient").attr("id","sleepGradient").attr("x1","0%").attr("x2","100%");y.append("stop").attr("offset","0%").attr("stop-color","#9B59B6").attr("stop-opacity",1),y.append("stop").attr("offset","50%").attr("stop-color","#7B68A6").attr("stop-opacity",1),y.append("stop").attr("offset","100%").attr("stop-color","#3498DB").attr("stop-opacity",1);const $=E(18,43,3).map(o=>({value:o,label:o===24?"12 AM":o===36?"12 PM":o%24===0?"12 AM":o%24<12?`${o%24} AM`:o%24===12?"12 PM":`${o%24-12} PM`}));m.append("g").attr("class",c.xAxis).attr("transform",`translate(0,${w})`).call(mt(l).tickValues($.map(o=>o.value)).tickFormat(o=>{const d=$.find(S=>S.value===o);return d?d.label:""}).tickSizeOuter(0)).selectAll("text").style("font-weight",o=>{const d=o%24;return d===0||d===12?"600":"400"});const pt=k.filter((o,d)=>d%Math.ceil(k.length/10)===0);m.append("g").attr("class",c.yAxis).call(ft(x).tickValues(pt).tickFormat(o=>{const d=new Date(o);return`${(d.getMonth()+1).toString().padStart(2,"0")}/${d.getDate().toString().padStart(2,"0")}`}))},[e,M,w,h,a,r,t]),i.jsxs("div",{className:c.container,children:[i.jsxs("div",{className:c.header,children:[i.jsx("h3",{className:c.title,children:"Sleep Pattern"}),i.jsxs("div",{className:c.legend,children:[i.jsxs("div",{className:c.legendItem,children:[i.jsx("span",{className:c.sleepDot}),i.jsx("span",{children:"Sleep Time"})]}),i.jsxs("div",{className:c.legendItem,children:[i.jsx("span",{className:c.wakeDot}),i.jsx("span",{children:"Wake Time"})]})]})]}),i.jsx("svg",{ref:n,width:t,height:r,className:c.chart}),s&&i.jsxs("div",{className:`${c.tooltip} ${s?c.visible:""}`,style:{left:`${s.x}px`,top:`${s.y}px`},children:[i.jsxs("div",{className:c.tooltipHeader,children:[i.jsx("span",{className:c.tooltipEmoji,children:"😴"}),i.jsx("span",{children:new Date(s.date).toLocaleDateString("en-US",{weekday:"short",month:"short",day:"numeric"})})]}),i.jsxs("div",{className:c.tooltipInfo,children:[s.sleepTime&&i.jsxs("div",{className:c.tooltipRow,children:[i.jsxs("span",{className:c.tooltipLabel,children:[i.jsx("span",{children:"🌙"}),i.jsx("span",{children:"Sleep:"})]}),i.jsx("span",{className:c.tooltipValue,children:s.sleepTime})]}),s.wakeTime&&i.jsxs("div",{className:c.tooltipRow,children:[i.jsxs("span",{className:c.tooltipLabel,children:[i.jsx("span",{children:"☀️"}),i.jsx("span",{children:"Wake:"})]}),i.jsx("span",{className:c.tooltipValue,children:s.wakeTime})]}),s.duration!==null&&i.jsxs("div",{className:c.tooltipDuration,children:[i.jsx("span",{children:"⏱️"}),i.jsxs("span",{children:[Math.floor(s.duration),"h ",Math.round(s.duration%1*60),"m"]})]})]})]})]})};ct.__docgenInfo={description:"",methods:[],displayName:"SleepChart",props:{sleepData:{required:!0,tsType:{name:"Array",elements:[{name:"SleepData"}],raw:"SleepData[]"},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}},onDateClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(date: string) => void",signature:{arguments:[{type:{name:"string"},name:"date"}],return:{name:"void"}}},description:""}}};const Ft={title:"Organisms/Charts/SleepChart",component:ct,parameters:{layout:"centered"},argTypes:{width:{control:{type:"number",min:400,max:1200,step:50}},height:{control:{type:"number",min:200,max:600,step:50}},onDateClick:{action:"dateClicked"}}},I=e=>{const t=[],r=new Date;for(let a=e-1;a>=0;a--){const n=new Date(r);n.setDate(n.getDate()-a),t.push(n.toISOString().split("T")[0])}return t},j={args:{sleepData:I(7).map(e=>{const t=Math.floor(Math.random()*3)+22,r=Math.floor(Math.random()*3)+6;return{date:e,sleep_time:`${t%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${r}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`}}),width:800,height:400}},A={args:{sleepData:I(30).map(e=>({date:e,sleep_time:`${(Math.floor(Math.random()*3)+22)%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${Math.floor(Math.random()*2)+7}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`})),width:900,height:400}},z={args:{sleepData:I(14).map((e,t)=>{const r=t%7===5||t%7===6,a=r?Math.floor(Math.random()*4)+24:Math.floor(Math.random()*2)+22,n=r?Math.floor(Math.random()*3)+9:Math.floor(Math.random()*2)+6;return{date:e,sleep_time:`${a%24}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`,wake_hour:`${n}:${Math.floor(Math.random()*60).toString().padStart(2,"0")}`}}),width:850,height:400}},N={args:{sleepData:I(14).map((e,t)=>({date:e,sleep_time:t%3===0?null:`${(Math.floor(Math.random()*3)+22)%24}:30`,wake_hour:t%3===0?null:`${Math.floor(Math.random()*2)+7}:00`})),width:800,height:400}},H={args:{sleepData:[],width:800,height:400}};var F,X,Y;j.parameters={...j.parameters,docs:{...(F=j.parameters)==null?void 0:F.docs,source:{originalSource:`{
|
|
2
|
+
args: {
|
|
3
|
+
sleepData: generateDateRange(7).map(date => {
|
|
4
|
+
const bedHour = Math.floor(Math.random() * 3) + 22;
|
|
5
|
+
const wakeHour = Math.floor(Math.random() * 3) + 6;
|
|
6
|
+
return {
|
|
7
|
+
date,
|
|
8
|
+
sleep_time: \`\${bedHour % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
|
|
9
|
+
wake_hour: \`\${wakeHour}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
|
|
10
|
+
};
|
|
11
|
+
}),
|
|
12
|
+
width: 800,
|
|
13
|
+
height: 400
|
|
14
|
+
}
|
|
15
|
+
}`,...(Y=(X=j.parameters)==null?void 0:X.docs)==null?void 0:Y.source}}};var U,J,K;A.parameters={...A.parameters,docs:{...(U=A.parameters)==null?void 0:U.docs,source:{originalSource:`{
|
|
16
|
+
args: {
|
|
17
|
+
sleepData: generateDateRange(30).map(date => ({
|
|
18
|
+
date,
|
|
19
|
+
sleep_time: \`\${(Math.floor(Math.random() * 3) + 22) % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
|
|
20
|
+
wake_hour: \`\${Math.floor(Math.random() * 2) + 7}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
|
|
21
|
+
})),
|
|
22
|
+
width: 900,
|
|
23
|
+
height: 400
|
|
24
|
+
}
|
|
25
|
+
}`,...(K=(J=A.parameters)==null?void 0:J.docs)==null?void 0:K.source}}};var Q,Z,tt;z.parameters={...z.parameters,docs:{...(Q=z.parameters)==null?void 0:Q.docs,source:{originalSource:`{
|
|
26
|
+
args: {
|
|
27
|
+
sleepData: generateDateRange(14).map((date, i) => {
|
|
28
|
+
// Simulate irregular sleep pattern
|
|
29
|
+
const isWeekend = i % 7 === 5 || i % 7 === 6;
|
|
30
|
+
const bedHour = isWeekend ? Math.floor(Math.random() * 4) + 24 : Math.floor(Math.random() * 2) + 22;
|
|
31
|
+
const wakeHour = isWeekend ? Math.floor(Math.random() * 3) + 9 : Math.floor(Math.random() * 2) + 6;
|
|
32
|
+
return {
|
|
33
|
+
date,
|
|
34
|
+
sleep_time: \`\${bedHour % 24}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`,
|
|
35
|
+
wake_hour: \`\${wakeHour}:\${Math.floor(Math.random() * 60).toString().padStart(2, '0')}\`
|
|
36
|
+
};
|
|
37
|
+
}),
|
|
38
|
+
width: 850,
|
|
39
|
+
height: 400
|
|
40
|
+
}
|
|
41
|
+
}`,...(tt=(Z=z.parameters)==null?void 0:Z.docs)==null?void 0:tt.source}}};var et,at,rt;N.parameters={...N.parameters,docs:{...(et=N.parameters)==null?void 0:et.docs,source:{originalSource:`{
|
|
42
|
+
args: {
|
|
43
|
+
sleepData: generateDateRange(14).map((date, i) => ({
|
|
44
|
+
date,
|
|
45
|
+
// Some days have missing data
|
|
46
|
+
sleep_time: i % 3 === 0 ? null : \`\${(Math.floor(Math.random() * 3) + 22) % 24}:30\`,
|
|
47
|
+
wake_hour: i % 3 === 0 ? null : \`\${Math.floor(Math.random() * 2) + 7}:00\`
|
|
48
|
+
})),
|
|
49
|
+
width: 800,
|
|
50
|
+
height: 400
|
|
51
|
+
}
|
|
52
|
+
}`,...(rt=(at=N.parameters)==null?void 0:at.docs)==null?void 0:rt.source}}};var nt,ot,st;H.parameters={...H.parameters,docs:{...(nt=H.parameters)==null?void 0:nt.docs,source:{originalSource:`{
|
|
53
|
+
args: {
|
|
54
|
+
sleepData: [],
|
|
55
|
+
width: 800,
|
|
56
|
+
height: 400
|
|
57
|
+
}
|
|
58
|
+
}`,...(st=(ot=H.parameters)==null?void 0:ot.docs)==null?void 0:st.source}}};const Xt=["WeeklySleep","MonthlySleep","IrregularSleep","MissingSleepData","EmptyState"];export{H as EmptyState,z as IrregularSleep,N as MissingSleepData,A as MonthlySleep,j as WeeklySleep,Xt as __namedExportsOrder,Ft as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._slider_134f2_2{display:flex;flex-direction:column;gap:var(--spacing-sm);font-family:var(--font-family-primary);width:100%}._label_134f2_11{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);margin:0}._sliderContainer_134f2_19{position:relative;display:flex;align-items:center;width:100%;height:24px;cursor:pointer}._track_134f2_29{position:absolute;width:100%;height:6px;background:var(--color-border);border-radius:3px;overflow:hidden}._fill_134f2_41{height:100%;background:var(--color-primary);border-radius:3px;position:relative;overflow:hidden}._fill_134f2_41:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,rgba(255,255,255,.2) 0%,transparent 50%,rgba(255,255,255,.2) 100%);animation:_shimmer_134f2_1 2s infinite}@keyframes _shimmer_134f2_1{0%{transform:translate(-100%)}to{transform:translate(100%)}}._input_134f2_69{position:absolute;width:100%;height:100%;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;outline:none;z-index:2}._input_134f2_69::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0;background:transparent}._input_134f2_69::-moz-range-thumb{width:0;height:0;background:transparent;border:none;cursor:pointer}._thumb_134f2_96{position:absolute;width:20px;height:20px;background:var(--color-primary);border:3px solid var(--color-background);border-radius:50%;transform:translate(-50%);cursor:pointer;z-index:3;box-shadow:0 2px 8px #0003}._thumb_134f2_96:before{content:"";position:absolute;top:50%;left:50%;width:6px;height:6px;background:var(--color-background);border-radius:50%;transform:translate(-50%,-50%)}._ripple_134f2_122{position:absolute;top:50%;left:50%;width:40px;height:40px;border-radius:50%;background:currentColor;transform:translate(-50%,-50%);pointer-events:none}._tooltip_134f2_135{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:12px;padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-primary);color:var(--color-text-inverse);font-size:var(--font-size-xs);font-weight:600;border-radius:var(--radius-md);white-space:nowrap;z-index:10;box-shadow:var(--shadow-md)}._tooltipArrow_134f2_152{position:absolute;top:100%;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--color-primary)}._valueDisplay_134f2_165{font-size:var(--font-size-md);font-weight:600;color:var(--color-primary);text-align:center;min-height:24px;display:flex;align-items:center;justify-content:center}._labelsContainer_134f2_177{position:relative;width:100%;height:24px;margin-top:var(--spacing-xs)}._labelItem_134f2_184{position:absolute;transform:translate(-50%);font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;min-width:20px;height:20px}._size-sm_134f2_199{font-size:var(--font-size-xs)}._size-sm_134f2_199 ._track_134f2_29{height:4px}._size-sm_134f2_199 ._sliderContainer_134f2_19:hover ._track_134f2_29{height:6px}._size-sm_134f2_199 ._thumb_134f2_96{width:16px;height:16px;border-width:2px}._size-sm_134f2_199 ._thumb_134f2_96:before{width:4px;height:4px}._size-sm_134f2_199 ._sliderContainer_134f2_19{height:20px}._size-lg_134f2_226{font-size:var(--font-size-lg)}._size-lg_134f2_226 ._track_134f2_29{height:8px}._size-lg_134f2_226 ._sliderContainer_134f2_19:hover ._track_134f2_29{height:10px}._size-lg_134f2_226 ._thumb_134f2_96{width:24px;height:24px;border-width:4px}._size-lg_134f2_226 ._thumb_134f2_96:before{width:8px;height:8px}._size-lg_134f2_226 ._sliderContainer_134f2_19{height:28px}._disabled_134f2_254{opacity:.5;pointer-events:none;cursor:not-allowed}._disabled_134f2_254 ._sliderContainer_134f2_19,._disabled_134f2_254 ._thumb_134f2_96{cursor:not-allowed}._loading_134f2_269{opacity:.7;pointer-events:none}._loadingTrack_134f2_274{position:relative;width:100%;height:6px;background:var(--color-border);border-radius:3px;overflow:hidden}._loadingIndicator_134f2_283{position:absolute;top:0;left:0;width:30%;height:100%;background:linear-gradient(90deg,transparent,var(--color-primary),transparent);border-radius:3px}._input_134f2_69:focus-visible+._thumb_134f2_96{outline:2px solid var(--color-primary);outline-offset:2px}@media (prefers-color-scheme: dark){._track_134f2_29{background:var(--color-border);box-shadow:inset 0 1px 2px #0000004d}._thumb_134f2_96{box-shadow:0 2px 8px #0006,0 0 0 1px #ffffff1a}._sliderContainer_134f2_19:hover ._thumb_134f2_96{box-shadow:0 4px 12px #00000080,0 0 0 1px #fff3}._fill_134f2_41:after{background:linear-gradient(90deg,rgba(255,255,255,.1) 0%,transparent 50%,rgba(255,255,255,.1) 100%)}}@media (prefers-contrast: high){._track_134f2_29{border:1px solid var(--color-text)}._thumb_134f2_96{border-width:2px;border-color:var(--color-text)}._fill_134f2_41{border:1px solid var(--color-text)}}@media (prefers-reduced-motion: reduce){._fill_134f2_41:after{animation:none}}@media (max-width: 768px){._thumb_134f2_96{width:24px;height:24px}._size-sm_134f2_199 ._thumb_134f2_96{width:20px;height:20px}._size-lg_134f2_226 ._thumb_134f2_96{width:28px;height:28px}._sliderContainer_134f2_19{height:32px}._size-sm_134f2_199 ._sliderContainer_134f2_19{height:28px}._size-lg_134f2_226 ._sliderContainer_134f2_19{height:36px}._labelItem_134f2_184{min-width:32px;height:32px;font-size:var(--font-size-md)}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as h,j as
|
|
1
|
+
import{r as h,j as n}from"./iframe-Cw8dCV4Z.js";import{u as J}from"./useSound-D23BsIr4.js";import{m as t}from"./proxy-p8L3T_Zy.js";import{A as K}from"./index-CzApopWo.js";const Q="_slider_134f2_2",W="_label_134f2_11",X="_sliderContainer_134f2_19",Y="_track_134f2_29",Z="_fill_134f2_41",ee="_shimmer_134f2_1",ne="_input_134f2_69",ae="_thumb_134f2_96",te="_ripple_134f2_122",ie="_tooltip_134f2_135",se="_tooltipArrow_134f2_152",oe="_valueDisplay_134f2_165",re="_labelsContainer_134f2_177",le="_labelItem_134f2_184",ue="_size-sm_134f2_199",de="_size-lg_134f2_226",ce="_disabled_134f2_254",me="_loading_134f2_269",pe="_loadingTrack_134f2_274",fe="_loadingIndicator_134f2_283",e={slider:Q,label:W,sliderContainer:X,track:Y,fill:Z,shimmer:ee,input:ne,thumb:ae,ripple:te,tooltip:ie,tooltipArrow:se,valueDisplay:oe,labelsContainer:re,labelItem:le,"size-sm":"_size-sm_134f2_199",sizeSm:ue,"size-lg":"_size-lg_134f2_226",sizeLg:de,disabled:ce,loading:me,loadingTrack:pe,loadingIndicator:fe};function ge({value:s,onChange:N,min:g=0,max:l=100,step:q=1,label:o,showValue:V=!1,valueFormatter:b,labels:v=[],config:z={},disabled:u=!1,className:C="",style:x={},loading:y=!1,colorFunction:S,showTooltip:d=!1,tooltipContent:w,soundConfig:k}){const{handlers:I,playSound:M}=J(k),[c,T]=h.useState(!1),[D,m]=h.useState(!1),A=h.useRef(null),{colors:_={},size:L="md",animations:R={}}=z,{duration:H=.2}=R,r=(s-g)/(l-g)*100,E=()=>S?S(s):_.fill?_.fill:`hsl(${r*1.2}, 70%, 50%)`,j=a=>b?b(a):`${a}${l<=10?`/${l}`:""}`,P=a=>{if(u||y)return;const p=Number(a.target.value);M("click"),N(p)},F=()=>{T(!0),d&&m(!0)},O=()=>{T(!1),d&&setTimeout(()=>m(!1),500)},U=()=>{d&&!u&&m(!0)},B=()=>{d&&!c&&m(!1)},i=E(),$=e[`size-${L}`],G=u?e.disabled:y?e.loading:"";return y?n.jsxs("div",{className:`${e.slider} ${$} ${e.loading} ${C}`,style:x,children:[o&&n.jsx("label",{className:e.label,children:o}),n.jsx("div",{className:e.loadingTrack,children:n.jsx(t.div,{className:e.loadingIndicator,animate:{x:["-100%","200%"]},transition:{repeat:1/0,duration:1.5,ease:"easeInOut"}})})]}):n.jsxs("div",{className:`${e.slider} ${$} ${G} ${C}`,style:x,children:[o&&n.jsx(t.label,{className:e.label,initial:{opacity:0,y:-10},animate:{opacity:1,y:0},transition:{duration:.3},children:o}),n.jsxs(t.div,{className:e.sliderContainer,ref:A,onMouseEnter:U,onMouseLeave:B,whileHover:{scale:1.02},transition:{duration:.1},children:[n.jsx(t.div,{className:e.track,whileHover:{height:8,marginTop:-1},transition:{duration:.1},children:n.jsx(t.div,{className:e.fill,style:{width:`${r}%`,backgroundColor:i},initial:{width:0},animate:{width:`${r}%`},transition:{duration:H,type:"spring",stiffness:300,damping:30},whileHover:{boxShadow:"inset 0 0 0 1px rgba(255,255,255,0.2)"}})}),n.jsx("input",{type:"range",min:g,max:l,step:q,value:s,onChange:P,onMouseDown:F,onMouseUp:O,...I,className:e.input,disabled:u,"aria-label":o}),n.jsx(t.div,{className:e.thumb,style:{left:`${r}%`,backgroundColor:i,borderColor:_.thumb||i},animate:{scale:c?1.3:1,boxShadow:c?`0 0 20px ${i}40`:`0 2px 8px ${i}30`},transition:{duration:.1,type:"spring",stiffness:400,damping:25},whileHover:{scale:1.1,transition:{duration:.1}},children:c&&n.jsx(t.div,{className:e.ripple,initial:{scale:0,opacity:.6},animate:{scale:2,opacity:0},transition:{duration:.5}})}),n.jsx(K,{children:D&&n.jsxs(t.div,{className:e.tooltip,style:{left:`${r}%`,backgroundColor:i},initial:{opacity:0,y:10,scale:.8},animate:{opacity:1,y:0,scale:1},exit:{opacity:0,y:10,scale:.8},transition:{duration:.2},children:[w?w(s):j(s),n.jsx("div",{className:e.tooltipArrow,style:{borderTopColor:i}})]})})]}),V&&n.jsx(t.div,{className:e.valueDisplay,style:{color:i},initial:{scale:.8},animate:{scale:1},transition:{duration:.2,type:"spring",stiffness:300},children:j(s)},s),v.length>0&&n.jsx("div",{className:e.labelsContainer,children:v.map((a,p)=>{let f=0;return a.position==="start"?f=0:a.position==="end"?f=100:typeof a.position=="number"&&(f=a.position),n.jsx(t.div,{className:e.labelItem,style:{left:`${f}%`,color:a.color},initial:{opacity:0,y:5},animate:{opacity:1,y:0},transition:{duration:.3,delay:p*.1},whileHover:{scale:1.2,transition:{duration:.1}},children:a.label},p)})})]})}ge.__docgenInfo={description:`Slider component - A beautiful, animated range input
|
|
2
2
|
|
|
3
3
|
@component
|
|
4
4
|
@description
|