@stfrigerio/sito-template 0.1.72 → 0.1.73
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/organisms/Calendar/Calendar.d.ts.map +1 -1
- package/dist/index.esm.js +104 -20
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +104 -20
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
- package/storybook-static/assets/{ASCIIText.stories-BJyiZESR.js → ASCIIText.stories-yWdkeCFw.js} +1 -1
- package/storybook-static/assets/{AllAtoms.stories-CgOD8m3f.js → AllAtoms.stories-D4-SQUuu.js} +1 -1
- package/storybook-static/assets/{AnimatedContent.stories-DH-SARB9.js → AnimatedContent.stories-DSYIR5wN.js} +1 -1
- package/storybook-static/assets/{AnimatedList.stories-Ry_skUA3.js → AnimatedList.stories-T24AuVkv.js} +1 -1
- package/storybook-static/assets/{Antigravity.stories-BicJnuw8.js → Antigravity.stories-DzTXGWmi.js} +1 -1
- package/storybook-static/assets/{ArrayInput.stories-DYpCCBNb.js → ArrayInput.stories-eKRDos-X.js} +1 -1
- package/storybook-static/assets/{Aurora.stories-DPq2ByaS.js → Aurora.stories-BPsqLAWZ.js} +1 -1
- package/storybook-static/assets/{Beams.stories-C-BOpddV.js → Beams.stories-BENy-_Vw.js} +1 -1
- package/storybook-static/assets/{BlobCursor.stories-DD-byYja.js → BlobCursor.stories-DIZuQWFz.js} +1 -1
- package/storybook-static/assets/{BlurText.stories-CI-bIIKc.js → BlurText.stories-Dlg4TOUG.js} +1 -1
- package/storybook-static/assets/{BooleansHeatmap.stories-CEV0eftd.js → BooleansHeatmap.stories-ByVDEzqb.js} +1 -1
- package/storybook-static/assets/{BorderGlow.stories-BE-ilp94.js → BorderGlow.stories-K5M4QBQS.js} +1 -1
- package/storybook-static/assets/{BubbleMenu.stories-D30td5QP.js → BubbleMenu.stories-Bq-yo3V9.js} +1 -1
- package/storybook-static/assets/{Button-B8IhEFx4.js → Button-DQla6H3P.js} +1 -1
- package/storybook-static/assets/{Button.stories-DE36U0Qh.js → Button.stories-Cwm1uSEe.js} +1 -1
- package/storybook-static/assets/Calendar-Dk5RRsIK.css +1 -0
- package/storybook-static/assets/Calendar.stories-D6ud0VBm.js +367 -0
- package/storybook-static/assets/{Card-BBPiO_B4.js → Card-D2W3wjZy.js} +1 -1
- package/storybook-static/assets/{Card.stories-TNOJS00N.js → Card.stories-CN0Pj86n.js} +1 -1
- package/storybook-static/assets/{CardNav.stories-t1Bp6iKB.js → CardNav.stories-DkSfKCJm.js} +1 -1
- package/storybook-static/assets/{Carousel.stories-D3TV54aM.js → Carousel.stories-CVfRELzK.js} +1 -1
- package/storybook-static/assets/{Checkbox-5p-zbzmi.js → Checkbox-BEMCpJLS.js} +1 -1
- package/storybook-static/assets/{Checkbox.stories-8znsCJhi.js → Checkbox.stories-DGfYhJ6B.js} +1 -1
- package/storybook-static/assets/{ChromaGrid.stories-o3p8Qdx1.js → ChromaGrid.stories-Xh0Hxk6c.js} +1 -1
- package/storybook-static/assets/{CircularGallery.stories-BEcnb56N.js → CircularGallery.stories-B_tKlhmW.js} +1 -1
- package/storybook-static/assets/{CircularText.stories-Cac0HQ7O.js → CircularText.stories-CIdtjRj7.js} +1 -1
- package/storybook-static/assets/{ClickSpark.stories-DS6RKm32.js → ClickSpark.stories-DK3dh5eA.js} +1 -1
- package/storybook-static/assets/{ColorBends.stories-BLXOpDDP.js → ColorBends.stories-QHDx5sTz.js} +1 -1
- package/storybook-static/assets/{CountUp.stories-D0hVlNjf.js → CountUp.stories-D378Y8W_.js} +1 -1
- package/storybook-static/assets/{Counter.stories-D-AgJaFb.js → Counter.stories-Dk5Bv8Ct.js} +1 -1
- package/storybook-static/assets/{Crosshair.stories-DuRxpkAA.js → Crosshair.stories-MUN171O-.js} +1 -1
- package/storybook-static/assets/{Cubes.stories-B2K-6Pv7.js → Cubes.stories-CviQtL5y.js} +1 -1
- package/storybook-static/assets/{CurvedLoop.stories-EBWj-ut7.js → CurvedLoop.stories-C36zkO4M.js} +1 -1
- package/storybook-static/assets/{DarkVeil.stories-BJfxCPIF.js → DarkVeil.stories-C29cMn-f.js} +1 -1
- package/storybook-static/assets/{DateInput-Bl7y2Kqk.js → DateInput-Drx-2LV9.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-C2Lar4bv.js → DateInput.stories-CLKAciVQ.js} +1 -1
- package/storybook-static/assets/{DecayCard.stories-DS3y0loD.js → DecayCard.stories-Bd5Ps1i9.js} +1 -1
- package/storybook-static/assets/{DecryptedText.stories-B5vYLMUi.js → DecryptedText.stories-Ch69Dvsk.js} +1 -1
- package/storybook-static/assets/{Dither.stories-CmPrb3rv.js → Dither.stories-B3capSS0.js} +1 -1
- package/storybook-static/assets/{Dock.stories-CakFuVyb.js → Dock.stories-DBCaOR4C.js} +1 -1
- package/storybook-static/assets/{EditFAB.stories-CFhxg94J.js → EditFAB.stories-C1xqWa6A.js} +1 -1
- package/storybook-static/assets/{EvilEye.stories-BleX83nU.js → EvilEye.stories-AVy76OJG.js} +1 -1
- package/storybook-static/assets/{FadeContent.stories-D2-4qOlC.js → FadeContent.stories-CPAlDBs2.js} +1 -1
- package/storybook-static/assets/{FaultyTerminal.stories-CFARBPp4.js → FaultyTerminal.stories-CB1Njw7i.js} +1 -1
- package/storybook-static/assets/{Fbo-CfnU58r6.js → Fbo-C0SB2kdr.js} +1 -1
- package/storybook-static/assets/{FloatingLines.stories-Bc0U4qae.js → FloatingLines.stories-D-LG1m2I.js} +1 -1
- package/storybook-static/assets/{FlowingMenu.stories-BKmUrbe6.js → FlowingMenu.stories-BG1HFESz.js} +1 -1
- package/storybook-static/assets/{FluidGlass.stories-BLJOG8Vu.js → FluidGlass.stories-CXIPm5cg.js} +1 -1
- package/storybook-static/assets/{Folder.stories-Cxdi_wWi.js → Folder.stories-DB3U5hwH.js} +1 -1
- package/storybook-static/assets/{FuzzyText.stories-CUpUQ6nZ.js → FuzzyText.stories-vPc5htX9.js} +1 -1
- package/storybook-static/assets/{Galaxy.stories-D7DFTFa9.js → Galaxy.stories-DcKUuMT9.js} +1 -1
- package/storybook-static/assets/{GhostCursor.stories-7NVzAeAI.js → GhostCursor.stories-Duc7utXe.js} +1 -1
- package/storybook-static/assets/{GlareHover.stories-DZiYzLd8.js → GlareHover.stories-Dl0knsPD.js} +1 -1
- package/storybook-static/assets/{GlassSurface.stories-CGVfI4xp.js → GlassSurface.stories-BHaCO3AU.js} +1 -1
- package/storybook-static/assets/{GlitchText.stories-DHeDmX4A.js → GlitchText.stories-B9fHTPEu.js} +1 -1
- package/storybook-static/assets/{GooeyNav.stories-CM8SswAh.js → GooeyNav.stories-B4Hl3OTw.js} +1 -1
- package/storybook-static/assets/{GradientBlinds.stories-dLv1UfQ7.js → GradientBlinds.stories-Damik9Et.js} +1 -1
- package/storybook-static/assets/{GradientText.stories-1BJgOxi2.js → GradientText.stories-DVB5Ndfl.js} +1 -1
- package/storybook-static/assets/{Grainient.stories-CzG5cjll.js → Grainient.stories-q7QyYCRC.js} +1 -1
- package/storybook-static/assets/{GridMotion.stories-ItIwnA44.js → GridMotion.stories-BR97TB5W.js} +1 -1
- package/storybook-static/assets/{ImageSlideshow.stories-C-_yjmyr.js → ImageSlideshow.stories-C4yxI9Hk.js} +1 -1
- package/storybook-static/assets/{Iridescence.stories-B1aSL1Oh.js → Iridescence.stories-CqLa7JSo.js} +1 -1
- package/storybook-static/assets/{LaserFlow.stories-CRvKzX4a.js → LaserFlow.stories-DZ03d3Kr.js} +1 -1
- package/storybook-static/assets/{LetterGlitch.stories-iTeRYMuB.js → LetterGlitch.stories-B1kZwfV4.js} +1 -1
- package/storybook-static/assets/{LightPillar.stories-XpkpeiMs.js → LightPillar.stories-BH8CW99c.js} +1 -1
- package/storybook-static/assets/{LightRays.stories-lQANYMqj.js → LightRays.stories-sSdy_g-K.js} +1 -1
- package/storybook-static/assets/{Lightning.stories-ChKmI-y_.js → Lightning.stories-Un6LCgoZ.js} +1 -1
- package/storybook-static/assets/{LineWaves.stories-DhGVNsQB.js → LineWaves.stories-CLV_4WSt.js} +1 -1
- package/storybook-static/assets/{LiquidChrome.stories-CnkZ7Wr3.js → LiquidChrome.stories-ChQhK7Dy.js} +1 -1
- package/storybook-static/assets/{LiquidEther.stories-BU1_utEW.js → LiquidEther.stories-B4OmA7LY.js} +1 -1
- package/storybook-static/assets/{LoadingSpinner-j8Mi9qAD.js → LoadingSpinner-qzqD3jTR.js} +1 -1
- package/storybook-static/assets/{LoadingSpinner.stories-D_3FCjkK.js → LoadingSpinner.stories-8P7Z55GB.js} +1 -1
- package/storybook-static/assets/{MagicRings.stories-mxBWDoWy.js → MagicRings.stories-D2GXRX-H.js} +1 -1
- package/storybook-static/assets/{Magnet.stories-Dz0t_1eS.js → Magnet.stories-Bgu6hV9i.js} +1 -1
- package/storybook-static/assets/{MagnetLines.stories-Jy4OaYyY.js → MagnetLines.stories-Bekn7PzV.js} +1 -1
- package/storybook-static/assets/{Masonry.stories-BRjBN5H3.js → Masonry.stories-BymDnqyf.js} +1 -1
- package/storybook-static/assets/{MetaBalls.stories-Dfk1k_wH.js → MetaBalls.stories-C_KyJ7W7.js} +1 -1
- package/storybook-static/assets/{MetallicPaint.stories-C1bMxsZM.js → MetallicPaint.stories-DgMk50WF.js} +1 -1
- package/storybook-static/assets/{MoodChart.stories-C324AbEU.js → MoodChart.stories-C9m0jJCs.js} +1 -1
- package/storybook-static/assets/{MotionConfigContext-BgQoFUhc.js → MotionConfigContext-E6BOCyHu.js} +1 -1
- package/storybook-static/assets/{Navbar.stories-sGOUKXXC.js → Navbar.stories-DhlE0kvG.js} +1 -1
- package/storybook-static/assets/{Noise.stories-_7O9uBP8.js → Noise.stories-CDvf3xOK.js} +1 -1
- package/storybook-static/assets/{NumberStepper-DMw68Bdj.js → NumberStepper-DwezmIn_.js} +1 -1
- package/storybook-static/assets/{NumberStepper.stories-C34Q1o9V.js → NumberStepper.stories-Dk53N2J7.js} +1 -1
- package/storybook-static/assets/{Orb.stories-Dy5JbOzp.js → Orb.stories-BrzRPQ1u.js} +1 -1
- package/storybook-static/assets/{OrbitImages.stories-FfsyN9Iu.js → OrbitImages.stories-NOI2oLj0.js} +1 -1
- package/storybook-static/assets/{PieChart.stories-OHDVp0RT.js → PieChart.stories-MtaCNzgT.js} +1 -1
- package/storybook-static/assets/{PixelBlast.stories-DFKSutAz.js → PixelBlast.stories-XJEIYKKu.js} +1 -1
- package/storybook-static/assets/{PixelCard.stories-CTsY_vyI.js → PixelCard.stories-QbZqQ88B.js} +1 -1
- package/storybook-static/assets/{PixelSnow.stories-BlJBcWYF.js → PixelSnow.stories-WV68wNlK.js} +1 -1
- package/storybook-static/assets/{PixelTransition.stories-CmBbK0DM.js → PixelTransition.stories-vqzvdubI.js} +1 -1
- package/storybook-static/assets/{Plasma.stories-QX3D_L78.js → Plasma.stories--U6_YBdM.js} +1 -1
- package/storybook-static/assets/{Prism.stories-D48sGYp7.js → Prism.stories-IWJ0w1dQ.js} +1 -1
- package/storybook-static/assets/{PrismaticBurst.stories-Dn2F2mIk.js → PrismaticBurst.stories-CB_t4CWR.js} +1 -1
- package/storybook-static/assets/{ProfileCard.stories-Ct8ww3Sq.js → ProfileCard.stories-BbJ6gRsy.js} +1 -1
- package/storybook-static/assets/{QuantifiableHabitsChart.stories-DuL527Qx.js → QuantifiableHabitsChart.stories-DgWJAXZB.js} +1 -1
- package/storybook-static/assets/{Radar.stories-ClTlR1N5.js → Radar.stories-GN-SIfi1.js} +1 -1
- package/storybook-static/assets/{Ribbons.stories-R7WgM-S8.js → Ribbons.stories-BwQB19FG.js} +1 -1
- package/storybook-static/assets/{RippleGrid.stories-DhMFo-nj.js → RippleGrid.stories-DSt8ch11.js} +1 -1
- package/storybook-static/assets/{RotatingText.stories-BDF0Yr7Z.js → RotatingText.stories-CvaRE13z.js} +1 -1
- package/storybook-static/assets/{ScrollFloat.stories-Cyf50ogn.js → ScrollFloat.stories-BI0-boMm.js} +1 -1
- package/storybook-static/assets/{ScrollReveal.stories-DzCw2cHi.js → ScrollReveal.stories-CqAwHxWZ.js} +1 -1
- package/storybook-static/assets/{ScrollVelocity.stories-BofLpgQE.js → ScrollVelocity.stories-CxfPVUdO.js} +1 -1
- package/storybook-static/assets/{SearchBar.stories-B5r2LH16.js → SearchBar.stories-BYGPQpKV.js} +1 -1
- package/storybook-static/assets/{SearchableDropdown-B6k12izZ.js → SearchableDropdown-DKGXHEST.js} +1 -1
- package/storybook-static/assets/{SearchableDropdown.stories-Bopbhioo.js → SearchableDropdown.stories-BSIq785F.js} +1 -1
- package/storybook-static/assets/{SelectInput-DRue6-AH.js → SelectInput-BTaSD4pV.js} +1 -1
- package/storybook-static/assets/{SelectInput.stories-BTJwfB38.js → SelectInput.stories-BWCsGvSv.js} +1 -1
- package/storybook-static/assets/{ShapeBlur.stories-DT3G8P3a.js → ShapeBlur.stories-CfUXU0Hu.js} +1 -1
- package/storybook-static/assets/{ShapeGrid.stories-DlmncXQS.js → ShapeGrid.stories-BvZ4Ujrn.js} +1 -1
- package/storybook-static/assets/{ShinyText.stories-D2oMmZfL.js → ShinyText.stories-CkM26rCA.js} +1 -1
- package/storybook-static/assets/{Silk.stories-Dxqi0p3h.js → Silk.stories-heCaR9ri.js} +1 -1
- package/storybook-static/assets/{SleepChart.stories-DotKmS0C.js → SleepChart.stories-C_BQZ1zn.js} +1 -1
- package/storybook-static/assets/{Slider-DeiM0g6-.js → Slider-DFt4SqGe.js} +1 -1
- package/storybook-static/assets/{Slider.stories-D88AA3EG.js → Slider.stories-CZOftn_6.js} +1 -1
- package/storybook-static/assets/{SoftAurora.stories-BEnpasA2.js → SoftAurora.stories-CRCK1t7L.js} +1 -1
- package/storybook-static/assets/{SoundDemo.stories-C11x2srG.js → SoundDemo.stories-B9TGtTa3.js} +1 -1
- package/storybook-static/assets/{SplashCursor.stories-Cwszrlxd.js → SplashCursor.stories-CNr5fovk.js} +1 -1
- package/storybook-static/assets/{SpotlightCard.stories-DCt3hEip.js → SpotlightCard.stories-OU6sEeI7.js} +1 -1
- package/storybook-static/assets/{Stack.stories-By_aMVjW.js → Stack.stories-Cl0pCvmS.js} +1 -1
- package/storybook-static/assets/{StaggeredMenu.stories-eF4uJ1MS.js → StaggeredMenu.stories-CEhjZpSE.js} +1 -1
- package/storybook-static/assets/{StarBorder.stories-2kJPpjuh.js → StarBorder.stories-Cu8Vh6JV.js} +1 -1
- package/storybook-static/assets/{SunburstChart.stories-DwZaIIku.js → SunburstChart.stories-CaaCz4D5.js} +1 -1
- package/storybook-static/assets/{Table.stories-pZd9DvuZ.js → Table.stories-DEvZCR8b.js} +1 -1
- package/storybook-static/assets/{Tabs.stories-DQtCc0JU.js → Tabs.stories-ByrHcH_w.js} +1 -1
- package/storybook-static/assets/{TargetCursor.stories-KNijJURB.js → TargetCursor.stories-DflPhQr7.js} +1 -1
- package/storybook-static/assets/{TextArea-BsBttKqQ.js → TextArea-DCv2oVEi.js} +1 -1
- package/storybook-static/assets/{TextArea.stories-oB8MzoXg.js → TextArea.stories-C8XpFNeS.js} +1 -1
- package/storybook-static/assets/{TextCursor.stories-D67PSwe-.js → TextCursor.stories-BBRGtRGy.js} +1 -1
- package/storybook-static/assets/{TextInput-CjoPiwWi.js → TextInput-CiEBs1p7.js} +1 -1
- package/storybook-static/assets/{TextInput.stories-B8VwO9KM.js → TextInput.stories-sDjzvv_r.js} +1 -1
- package/storybook-static/assets/{TextPressure.stories-0-6_dNGJ.js → TextPressure.stories-6hWaU46K.js} +1 -1
- package/storybook-static/assets/{TextType.stories-D7wi-Xoy.js → TextType.stories-B96GIAfl.js} +1 -1
- package/storybook-static/assets/{ThemeSwitcher.stories-DEUFGF9B.js → ThemeSwitcher.stories-D4T-JeUC.js} +1 -1
- package/storybook-static/assets/{Threads.stories-BYTbEuF6.js → Threads.stories-DFj3LyR_.js} +1 -1
- package/storybook-static/assets/{TimeInput.stories-_1M5i4X_.js → TimeInput.stories-D29y9r9_.js} +1 -1
- package/storybook-static/assets/{Toggle-CaV_CmDs.js → Toggle-BQYsA6ul.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-DBdNHwn1.js → Toggle.stories-CUbp5Jsr.js} +1 -1
- package/storybook-static/assets/{ToggleButton-jv6c5ezW.js → ToggleButton-BfEkXfyM.js} +1 -1
- package/storybook-static/assets/{ToggleButton.stories-D6AsjlA7.js → ToggleButton.stories-DV2MLkN7.js} +1 -1
- package/storybook-static/assets/{TrueFocus.stories-CKc72PLP.js → TrueFocus.stories-pHR04Ohp.js} +1 -1
- package/storybook-static/assets/{VariableProximity.stories-fbDCLDLp.js → VariableProximity.stories-8BBD-zO6.js} +1 -1
- package/storybook-static/assets/{Waves.stories-C_VysexU.js → Waves.stories-Ch2WIT1y.js} +1 -1
- package/storybook-static/assets/{check-CV4xXNXR.js → check-5UELpswJ.js} +1 -1
- package/storybook-static/assets/{chevron-down-CkJFLecG.js → chevron-down-DJrhvjuh.js} +1 -1
- package/storybook-static/assets/{chevron-right-BpRTWC1z.js → chevron-right-BXPuFhNR.js} +1 -1
- package/storybook-static/assets/client-CUSQMWIi.js +1 -0
- package/storybook-static/assets/{createLucideIcon-CltDwvOP.js → createLucideIcon-OIz9nbID.js} +1 -1
- package/storybook-static/assets/{download-SJcs72V4.js → download-CKNX6tcv.js} +1 -1
- package/storybook-static/assets/{folder-6SjOmErA.js → folder-UmgN-wpw.js} +1 -1
- package/storybook-static/assets/{iconBase-DtvD0saU.js → iconBase-l6iBLek9.js} +1 -1
- package/storybook-static/assets/{iframe-Bipsh9dY.js → iframe-BLM9gPKH.js} +3 -3
- package/storybook-static/assets/{index-BEA1mHaT.js → index-4lYlkM-D.js} +1 -1
- package/storybook-static/assets/{index-CTm0VtvQ.js → index-b5igbCec.js} +1 -1
- package/storybook-static/assets/{index-Cia0c3io.js → index-vIkE6dHF.js} +1 -1
- package/storybook-static/assets/{proxy-D9bljBhB.js → proxy-BsV6quUP.js} +1 -1
- package/storybook-static/assets/{react-18-JTQzpdif.js → react-18-DDy7qzUT.js} +1 -1
- package/storybook-static/assets/{react-three-fiber.esm-Dc5EQDgd.js → react-three-fiber.esm-DEhbi0-x.js} +1 -1
- package/storybook-static/assets/{search-DH8smCRL.js → search-BkBVkJzD.js} +1 -1
- package/storybook-static/assets/{settings-D99Exe-t.js → settings-CMsrEzJS.js} +1 -1
- package/storybook-static/assets/{sun-B6fJHO8-.js → sun-WxYEV1-R.js} +1 -1
- package/storybook-static/assets/{trash-2-Bc-vtAZE.js → trash-2-BvLXiygc.js} +1 -1
- package/storybook-static/assets/{use-animation-frame-CD6uZr8a.js → use-animation-frame-B3QUdFyW.js} +1 -1
- package/storybook-static/assets/{use-in-view-DrFhenAa.js → use-in-view-DxORwu3d.js} +1 -1
- package/storybook-static/assets/{use-motion-value-wsIqdv-r.js → use-motion-value-CYCvXY5m.js} +1 -1
- package/storybook-static/assets/{use-spring-C6saxCCT.js → use-spring-Cdrlm-bg.js} +1 -1
- package/storybook-static/assets/{use-transform-DuAStHvG.js → use-transform-CxdHJNbN.js} +1 -1
- package/storybook-static/assets/{useSound-BwsWxODM.js → useSound-SuqbUlad.js} +1 -1
- package/storybook-static/assets/{users-GH_nMWDP.js → users-Br1MtzUW.js} +1 -1
- package/storybook-static/assets/{x-DwbjixG_.js → x-p0fEn4Nq.js} +1 -1
- package/storybook-static/iframe.html +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/assets/Calendar-E_-F3UEV.css +0 -1
- package/storybook-static/assets/Calendar.stories-BgzQTcGv.js +0 -367
- package/storybook-static/assets/client-Cor4ozso.js +0 -1
|
@@ -0,0 +1,367 @@
|
|
|
1
|
+
import{r as T,j as e}from"./iframe-BLM9gPKH.js";import{u as lt}from"./use-motion-value-CYCvXY5m.js";import{u as on}from"./use-transform-CxdHJNbN.js";import{m as We}from"./proxy-BsV6quUP.js";import{T as rn}from"./trash-2-BvLXiygc.js";import{c as zt}from"./createLucideIcon-OIz9nbID.js";import{C as sn}from"./check-5UELpswJ.js";import{a as ke}from"./index-4lYlkM-D.js";import{D as ln}from"./download-CKNX6tcv.js";import"./preload-helper-C1FmrZbK.js";import"./MotionConfigContext-E6BOCyHu.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 dn=[["circle",{cx:"9",cy:"12",r:"1",key:"1vctgf"}],["circle",{cx:"9",cy:"5",r:"1",key:"hp0tcf"}],["circle",{cx:"9",cy:"19",r:"1",key:"fkjjf6"}],["circle",{cx:"15",cy:"12",r:"1",key:"1tmaij"}],["circle",{cx:"15",cy:"5",r:"1",key:"19l28e"}],["circle",{cx:"15",cy:"19",r:"1",key:"f4zoj3"}]],cn=zt("grip-vertical",dn);/**
|
|
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 mn=[["path",{d:"M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z",key:"1a8usu"}],["path",{d:"m15 5 4 4",key:"1mk7zo"}]],un=zt("pencil",mn),gn="_calendar_givdb_2",pn="_loading_givdb_14",vn="_loadingSpinner_givdb_21",fn="_header_givdb_27",hn="_navigation_givdb_35",yn="_navButton_givdb_41",wn="_title_givdb_60",Dn="_controls_givdb_70",_n="_exportDropdown_givdb_76",bn="_exportButton_givdb_80",xn="_exportMenu_givdb_98",Sn="_exportMenuItem_givdb_113",kn="_todayButton_givdb_130",Cn="_viewToggle_givdb_146",En="_viewButton_givdb_153",Tn="_active_givdb_167",jn="_filterBar_givdb_177",Nn="_filterPill_givdb_186",Mn="_filterPillActive_givdb_205",Hn="_filterDot_givdb_211",$n="_weekDays_givdb_219",Ln="_withWeekNumbers_givdb_226",In="_weekNumberHeader_givdb_230",Pn="_weekDay_givdb_219",Bn="_daysGrid_givdb_247",Fn="_dayCell_givdb_263",Wn="_dayNumber_givdb_292",An="_today_givdb_130",Rn="_events_givdb_311",On="_event_givdb_311",qn="_eventTitle_givdb_338",Vn="_eventTime_givdb_347",zn="_otherMonth_givdb_392",Gn="_selected_givdb_397",Un="_compact_givdb_409",Yn="_dots_givdb_432",Xn="_dot_givdb_432",Jn="_dotMore_givdb_447",Kn="_weekNumberCell_givdb_454",Qn="_completed_givdb_500",Zn="_completedIcon_givdb_521",ea="_moreEvents_givdb_528",ta="_emptyState_givdb_538",na="_dayView_givdb_548",aa="_dayViewHeader_givdb_557",oa="_timeColumnHeader_givdb_567",ra="_dayColumnHeader_givdb_574",sa="_allDayStrip_givdb_584",ia="_allDayLabel_givdb_592",la="_allDayList_givdb_603",da="_dayViewScrollContainer_givdb_626",ca="_dayTimelineGrid_givdb_635",ma="_hourRow_givdb_640",ua="_hourLabel_givdb_646",ga="_hourSlots_givdb_657",pa="_halfHourSlot_givdb_664",va="_halfHourSlotBottom_givdb_674",fa="_dayEventAnchor_givdb_679",ha="_weekTimeline_givdb_687",ya="_weekTimelineHeader_givdb_696",wa="_weekDayColumnHeader_givdb_708",Da="_weekDayLabel_givdb_742",_a="_weekDayNumber_givdb_750",ba="_weekTimelineScroll_givdb_755",xa="_weekTimelineGrid_givdb_763",Sa="_weekTimeColumn_givdb_769",ka="_weekTimeSlot_givdb_777",Ca="_weekHourLabel_givdb_784",Ea="_weekDayColumns_givdb_790",Ta="_weekDayColumn_givdb_708",ja="_weekHourRow_givdb_808",Na="_weekEventAnchor_givdb_814",Ma="_currentTimeIndicator_givdb_822",n={calendar:gn,loading:pn,loadingSpinner:vn,header:fn,navigation:hn,navButton:yn,title:wn,controls:Dn,exportDropdown:_n,exportButton:bn,exportMenu:xn,exportMenuItem:Sn,todayButton:kn,viewToggle:Cn,viewButton:En,active:Tn,filterBar:jn,filterPill:Nn,filterPillActive:Mn,filterDot:Hn,weekDays:$n,withWeekNumbers:Ln,weekNumberHeader:In,weekDay:Pn,daysGrid:Bn,dayCell:Fn,dayNumber:Wn,today:An,events:Rn,event:On,eventTitle:qn,eventTime:Vn,otherMonth:zn,selected:Gn,compact:Un,dots:Yn,dot:Xn,dotMore:Jn,weekNumberCell:Kn,completed:Qn,completedIcon:Zn,moreEvents:ea,emptyState:ta,dayView:na,dayViewHeader:aa,timeColumnHeader:oa,dayColumnHeader:ra,allDayStrip:sa,allDayLabel:ia,allDayList:la,dayViewScrollContainer:da,dayTimelineGrid:ca,hourRow:ma,hourLabel:ua,hourSlots:ga,halfHourSlot:pa,halfHourSlotBottom:va,dayEventAnchor:fa,weekTimeline:ha,weekTimelineHeader:ya,weekDayColumnHeader:wa,weekDayLabel:Da,weekDayNumber:_a,weekTimelineScroll:ba,weekTimelineGrid:xa,weekTimeColumn:Sa,weekTimeSlot:ka,weekHourLabel:Ca,weekDayColumns:Ea,weekDayColumn:Ta,weekHourRow:ja,weekEventAnchor:Na,currentTimeIndicator:Ma},Ha="_wrapper_nyv1b_1",$a="_deleteUnderlay_nyv1b_7",La="_card_nyv1b_23",Ia="_dragging_nyv1b_43",Pa="_completed_nyv1b_49",Ba="_text_nyv1b_53",Fa="_grip_nyv1b_57",Wa="_checkIcon_nyv1b_77",Aa="_time_nyv1b_89",Ra="_editButton_nyv1b_96",q={wrapper:Ha,deleteUnderlay:$a,card:La,dragging:Ia,completed:Pa,text:Ba,grip:Fa,checkIcon:Wa,time:Aa,editButton:Ra},Oa=-80,Fe=({event:o,color:a,textColor:s,onComplete:d,onEdit:m,onDelete:p,onDragEnd:u,draggable:y=!0})=>{const b=lt(0),k=lt(0),x=on(b,[-80,0],[1,0]),[j,H]=T.useState(!1),W=T.useRef(!1),I=T.useRef(null),ae=o.status==="completed",Y=(g,J)=>{p&&J.offset.x<Oa?ke(b,-1e3,{duration:.2,onComplete:()=>p(o)}):ke(b,0,{type:"spring",stiffness:400,damping:30})},oe=()=>{if(W.current){W.current=!1;return}j||d==null||d(o)},pe=g=>{!y||!u||(g.stopPropagation(),g.preventDefault(),I.current={x:g.clientX,y:g.clientY,pointerId:g.pointerId},g.currentTarget.setPointerCapture(g.pointerId),H(!0))},re=g=>{I.current&&(b.set(g.clientX-I.current.x),k.set(g.clientY-I.current.y))},ve=g=>{if(!I.current)return;const J=g.clientY,_=g.clientX;try{g.currentTarget.releasePointerCapture(I.current.pointerId)}catch{}I.current=null,H(!1),ke(k,0,{type:"spring",stiffness:400,damping:30}),ke(b,0,{type:"spring",stiffness:400,damping:30}),u==null||u(J,_)},X=!!p,fe=y&&!!u;return e.jsxs("div",{className:q.wrapper,children:[X&&e.jsxs(We.div,{className:q.deleteUnderlay,style:{opacity:x},children:[e.jsx(rn,{size:16}),e.jsx("span",{children:"Delete"})]}),e.jsxs(We.div,{className:`${q.card} ${ae?q.completed:""} ${j?q.dragging:""}`,style:{x:b,y:k,background:a,color:s,borderLeftColor:a},drag:X&&!j?"x":!1,dragConstraints:X?{left:-200,right:0}:void 0,dragElastic:.15,dragDirectionLock:!0,onDragStart:()=>{W.current=!0},onDragEnd:Y,whileTap:j?void 0:{scale:.98},animate:j?{scale:1.03}:{scale:1},onClick:oe,children:[fe&&e.jsx("div",{className:q.grip,onPointerDown:pe,onPointerMove:re,onPointerUp:ve,onPointerCancel:ve,onClick:g=>g.stopPropagation(),children:e.jsx(cn,{size:14})}),ae&&e.jsx(sn,{size:14,className:q.checkIcon,strokeWidth:3}),e.jsx("span",{className:q.text,children:o.title}),o.time&&e.jsx("span",{className:q.time,children:o.time}),m&&e.jsx("button",{className:q.editButton,onClick:g=>{g.stopPropagation(),m(o)},"aria-label":"Edit event",children:e.jsx(un,{size:13})})]})]})};Fe.__docgenInfo={description:"",methods:[],displayName:"DayEventCard",props:{draggable:{defaultValue:{value:"true",computed:!1},required:!1}}};const ye=["id","title","date","time","endTime","allDay","type","status","priority","category"],qa=o=>(typeof o=="string"?new Date(o):o).toISOString(),Ye=o=>{const a={};for(const s of ye){const d=o[s];d!==void 0&&(a[s]=s==="date"?qa(d):d)}return a},Va=o=>{if(o==null)return"";const a=String(o);return/[",\n\r]/.test(a)?`"${a.replace(/"/g,'""')}"`:a},za=o=>{const a=ye.join(","),s=o.map(d=>{const m=Ye(d);return ye.map(p=>Va(m[p])).join(",")});return[a,...s].join(`
|
|
12
|
+
`)},Ga=o=>JSON.stringify(o.map(Ye),null,2),Ua=o=>{if(o==null)return"";const a=String(o);return/[",\n\r]/.test(a)?`"${a.replace(/"/g,'""')}"`:a},Ya=o=>{const a=`events[${o.length}]{${ye.join(",")}}:`,s=o.map(d=>{const m=Ye(d);return" "+ye.map(p=>Ua(m[p])).join(",")});return[a,...s].join(`
|
|
13
|
+
`)},Xa={csv:"text/csv;charset=utf-8;",json:"application/json;charset=utf-8;",toon:"text/plain;charset=utf-8;"},Ja={csv:"csv",json:"json",toon:"toon"},Ka=(o,a)=>a==="csv"?za(o):a==="json"?Ga(o):Ya(o),Qa=(o,a,s)=>{const d=Ka(o,a),m=new Blob([d],{type:Xa[a]}),p=URL.createObjectURL(m),u=document.createElement("a");u.href=p,u.download=`events-${new Date().toISOString().slice(0,10)}.${Ja[a]}`,document.body.appendChild(u),u.click(),document.body.removeChild(u),URL.revokeObjectURL(p)};function ue({events:o,onEventClick:a,onDateClick:s,onEventClickByView:d,onDateClickByView:m,onTimeSlotClick:p,onEventDrop:u,onEventComplete:y,onEventDelete:b,onEventEdit:k,viewMode:x="month",initialDate:j=new Date,config:H={},className:W="",style:I={},loading:ae=!1,emptyState:Y,hideHeader:oe=!1,compact:pe=!1,selectedDate:re,selectedCategoryId:ve,onCategoryChange:X,exportFormats:fe}){const[g,J]=T.useState(j),[_,Re]=T.useState(x),[Ut,Yt]=T.useState(null),Xe=ve!==void 0,se=Xe?ve??null:Ut,Je=t=>{Xe||Yt(t),X==null||X(t)},Oe=T.useRef(null),qe=T.useRef(null),[we,Ve]=T.useState(!1),ze=T.useRef(null);T.useEffect(()=>{if(!we)return;const t=r=>{ze.current&&!ze.current.contains(r.target)&&Ve(!1)};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[we]);const{eventColors:Ke={},iconRenderer:Qe,maxEventsPerDay:K=3,mondayStart:Q=!1,showWeekNumbers:De=!1,dateFormat:Ze={month:"long",year:"numeric"},locale:Z="en-US",dayLabels:Xt,monthNames:_e,startHour:R=0,endHour:et=24,hourHeight:N=60,halfHourSlots:O=!1,categories:ie}=H,tt=T.useMemo(()=>!ie||ie.length===0||se===null?o:o.filter(t=>!t.category||t.category===se),[o,ie,se]),Jt=Xt||(Q?["Mon","Tue","Wed","Thu","Fri","Sat","Sun"]:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]),nt=(H==null?void 0:H.hourHeight)??60,at=(H==null?void 0:H.startHour)??0,Ge=T.useMemo(()=>{const t=g.getFullYear(),r=g.getMonth();let v,i,S;if(_==="week"){v=new Date(g);const D=v.getDay(),h=Q?v.getDate()-D+(D===0?-6:1):v.getDate()-D;v=new Date(v.setDate(h)),v.setHours(0,0,0,0),i=new Date(v),i.setDate(i.getDate()+6);const C=v.toLocaleDateString(Z,{day:"numeric",month:"short"}),$=i.toLocaleDateString(Z,{day:"numeric",month:"short"});S=`${C} - ${$}`}else if(_==="day")v=new Date(g),v.setHours(0,0,0,0),i=new Date(g),i.setHours(23,59,59,999),S=g.toLocaleDateString(Z,{weekday:"long",year:"numeric",month:"long",day:"numeric"});else{const D=new Date(t,r,1),h=new Date(t,r+1,0);v=new Date(D);const C=Q?(D.getDay()+6)%7:D.getDay();v.setDate(v.getDate()-C),i=new Date(h);const $=Q?(h.getDay()+6)%7:h.getDay();i.setDate(i.getDate()+(6-$)),_e&&_e[r]?S=`${_e[r]} ${t}`:S=g.toLocaleDateString(Z,Ze)}const M=[],c=new Date(v);for(;c<=i;)M.push(new Date(c)),c.setDate(c.getDate()+1);return{days:M,displayTitle:S}},[g,_,Q,Z,Ze,_e]),ot=T.useRef("");T.useEffect(()=>{if(_!=="day"&&_!=="week")return;const t=_==="day"?Oe:qe;if(!t.current)return;const r=new Date;if(!(()=>{if(_==="day")return g.toDateString()===r.toDateString();const c=new Date(g),D=c.getDay(),h=Q?D===0?-6:1-D:-D;c.setDate(c.getDate()+h),c.setHours(0,0,0,0);const C=new Date(c);return C.setDate(c.getDate()+7),r>=c&&r<C})())return;const i=`${_}-${g.toDateString()}`;if(ot.current===i)return;ot.current=i;const S=(r.getHours()-at)*60+r.getMinutes(),M=Math.max(0,S/60*nt-100);setTimeout(()=>{t.current&&(t.current.scrollTop=M)},0)},[_,g,at,nt,Q]);const Ue=t=>tt.filter(v=>new Date(v.date).toDateString()===t.toDateString()).sort((v,i)=>{const S=v.time?be(v.time):999999,M=i.time?be(i.time):999999;return S-M}),be=t=>{const[r,v]=t.split(":").map(Number);return r*60+v},rt=t=>{const r=new Map,v=t.filter(c=>c.time).map(c=>{const D=be(c.time),h=c.endTime?be(c.endTime):D+30;return{event:c,start:D,end:Math.max(h,D+1)}});v.sort((c,D)=>c.start-D.start||c.end-D.end);let i=[],S=-1;const M=()=>{if(i.length===0)return;const c=[],D=[];for(const C of i){let $=!1;for(let z=0;z<c.length;z++)if(c[z]<=C.start){c[z]=C.end,D.push({id:C.event.id,col:z}),$=!0;break}$||(c.push(C.end),D.push({id:C.event.id,col:c.length-1}))}const h=c.length;for(const C of D)r.set(C.id,{col:C.col,totalCols:h});i=[],S=-1};for(const c of v)i.length===0||c.start<S?(i.push(c),S=Math.max(S,c.end)):(M(),i.push(c),S=c.end);return M(),r},Kt=()=>{const t=new Date(g);_==="week"?t.setDate(t.getDate()-7):_==="day"?t.setDate(t.getDate()-1):t.setMonth(t.getMonth()-1),J(t)},Qt=()=>{const t=new Date(g);_==="week"?t.setDate(t.getDate()+7):_==="day"?t.setDate(t.getDate()+1):t.setMonth(t.getMonth()+1),J(t)},Zt=()=>{J(new Date)},le=t=>{if(t.color)return t.color;if(t.type&&Ke[t.type])return Ke[t.type];const r={high:"#FF4444",medium:"#FFA500",low:"#4A90E2"};return t.priority&&r[t.priority]?r[t.priority]:"#4A90E2"},en=t=>{const r=t.replace("#",""),v=parseInt(r.substring(0,2),16),i=parseInt(r.substring(2,4),16),S=parseInt(r.substring(4,6),16);return(.299*v+.587*i+.114*S)/255>.5?"#000000":"#FFFFFF"},xe=t=>{if(t.textColor)return t.textColor;const r=le(t);return en(r)},Se=t=>{d&&d[_]?d[_](t):a&&a(t)},st=t=>{m&&m[_]?m[_](t):s&&s(t)},tn=t=>{const r=new Date;return t.toDateString()===r.toDateString()},nn=t=>t.getMonth()===g.getMonth(),an=t=>{const r=new Date(t.getFullYear(),0,1),v=t.getTime()-r.getTime(),i=1e3*60*60*24*7;return Math.floor(v/i)+1};return ae?e.jsx("div",{className:`${n.calendar} ${n.loading} ${W}`,style:I,children:e.jsx("div",{className:n.loadingSpinner,children:"Loading..."})}):e.jsxs("div",{className:`${n.calendar} ${pe?n.compact:""} ${W}`,style:I,children:[!oe&&e.jsxs("div",{className:n.header,children:[e.jsxs("div",{className:n.navigation,children:[e.jsx("button",{onClick:Kt,className:n.navButton,"aria-label":"Previous",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:e.jsx("polyline",{points:"15,18 9,12 15,6"})})}),e.jsx("h3",{className:n.title,children:Ge.displayTitle}),e.jsx("button",{onClick:Qt,className:n.navButton,"aria-label":"Next",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:e.jsx("polyline",{points:"9,6 15,12 9,18"})})})]}),ie&&ie.length>0&&e.jsxs("div",{className:n.filterBar,role:"tablist","aria-label":"Filter by category",children:[e.jsx("button",{type:"button",role:"tab","aria-selected":se===null,className:`${n.filterPill} ${se===null?n.filterPillActive:""}`,onClick:()=>Je(null),children:"All"}),ie.map(t=>{const r=se===t.id;return e.jsxs("button",{type:"button",role:"tab","aria-selected":r,className:`${n.filterPill} ${r?n.filterPillActive:""}`,style:r?{background:t.color,borderColor:t.color,color:"#ffffff"}:void 0,onClick:()=>Je(t.id),children:[!r&&e.jsx("span",{className:n.filterDot,style:{background:t.color}}),t.label]},t.id)})]}),e.jsxs("div",{className:n.controls,children:[fe&&fe.length>0&&e.jsxs("div",{className:n.exportDropdown,ref:ze,children:[e.jsx("button",{type:"button",className:n.exportButton,onClick:()=>Ve(t=>!t),"aria-haspopup":"menu","aria-expanded":we,"aria-label":"Export events",title:"Export events",children:e.jsx(ln,{size:16})}),we&&e.jsx("div",{className:n.exportMenu,role:"menu",children:fe.map(t=>e.jsx("button",{type:"button",role:"menuitem",className:n.exportMenuItem,onClick:()=>{Qa(tt,t),Ve(!1)},children:t.toUpperCase()},t))})]}),e.jsx("button",{onClick:Zt,className:n.todayButton,children:"Today"}),e.jsxs("div",{className:n.viewToggle,children:[e.jsx("button",{className:`${n.viewButton} ${_==="month"?n.active:""}`,onClick:()=>Re("month"),children:"Month"}),e.jsx("button",{className:`${n.viewButton} ${_==="week"?n.active:""}`,onClick:()=>Re("week"),children:"Week"}),e.jsx("button",{className:`${n.viewButton} ${_==="day"?n.active:""}`,onClick:()=>Re("day"),children:"Day"})]})]})]}),_==="month"&&e.jsxs("div",{className:`${n.weekDays} ${De?n.withWeekNumbers:""}`,children:[De&&e.jsx("div",{className:n.weekNumberHeader,children:"Wk"}),Jt.map(t=>e.jsx("div",{className:n.weekDay,children:t},t))]}),_==="day"?(()=>{const t=Ue(g),r=t.filter(l=>!l.allDay&&l.time),v=t.filter(l=>l.allDay||!l.time),i=Array.from({length:et-R},(l,f)=>R+f),S=i.length*N,M=new Date,c=g.toDateString()===M.toDateString(),h=((M.getHours()-R)*60+M.getMinutes())/60*N,C=c&&h>=0&&h<=S,$=l=>{const[f,L]=l.split(":").map(Number);return f*60+L},z=l=>{if(!l.time||!l.endTime)return 30;const f=$(l.endTime)-$(l.time);return f>0?f:30},w=rt(r),E=(l,f)=>{if(p){const L=new Date(g);L.setHours(l,f,0,0);const G=`${l.toString().padStart(2,"0")}:${f.toString().padStart(2,"0")}`;p(L,l,G)}},P=(l,f)=>{var he;if(!u)return;const L=(he=Oe.current)==null?void 0:he.querySelector(`.${n.dayTimelineGrid}`);if(!L)return;const G=L.getBoundingClientRect(),ee=f-G.top,te=O?N/2:N,B=Math.max(0,Math.floor(ee/te)),F=O?i.length*2:i.length,U=Math.min(F-1,B),A=R+Math.floor(O?U/2:U),ne=O&&U%2===1?30:0,de=new Date(g);de.setHours(A,ne,0,0),u(l,de)};return e.jsxs("div",{className:n.dayView,children:[e.jsxs("div",{className:n.dayViewHeader,children:[e.jsx("div",{className:n.timeColumnHeader}),e.jsx("div",{className:n.dayColumnHeader,children:g.toLocaleDateString(Z,{weekday:"short",day:"numeric"})})]}),v.length>0&&e.jsxs("div",{className:n.allDayStrip,children:[e.jsx("span",{className:n.allDayLabel,children:"All day"}),e.jsx("div",{className:n.allDayList,children:v.map(l=>e.jsx(Fe,{event:l,color:le(l),textColor:xe(l),onComplete:y??(a?Se:void 0),onEdit:k,onDelete:b,draggable:!1},l.id))})]}),e.jsx("div",{className:n.dayViewScrollContainer,ref:Oe,children:e.jsxs("div",{className:n.dayTimelineGrid,style:{height:S},children:[i.map(l=>e.jsxs("div",{className:n.hourRow,style:{height:N},children:[e.jsxs("span",{className:n.hourLabel,children:[l.toString().padStart(2,"0"),":00"]}),e.jsx("div",{className:n.hourSlots,children:O?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:n.halfHourSlot,onClick:()=>E(l,0)}),e.jsx("div",{className:`${n.halfHourSlot} ${n.halfHourSlotBottom}`,onClick:()=>E(l,30)})]}):e.jsx("div",{className:n.halfHourSlot,onClick:()=>E(l,0)})})]},l)),r.map(l=>{const[f,L]=l.time.split(":").map(Number),G=(f-R)*N+L/60*N,ee=z(l),te=Math.max(24,ee/60*N-2),B=w.get(l.id),F=(B==null?void 0:B.totalCols)??1,U=(B==null?void 0:B.col)??0;return e.jsx("div",{className:n.dayEventAnchor,style:{top:G,height:te,"--lane-col":U,"--lane-total":F},onClick:A=>A.stopPropagation(),children:e.jsx(Fe,{event:l,color:le(l),textColor:xe(l),onComplete:y??(a?Se:void 0),onEdit:k,onDelete:b,onDragEnd:u?A=>P(l,A):void 0})},l.id)}),C&&e.jsx("div",{className:n.currentTimeIndicator,style:{top:`${h}px`}})]})})]})})():_==="week"?(()=>{const t=Ge.days,r=Array.from({length:et-R},(w,E)=>R+E),v=r.length*N,i=new Date,S=t.findIndex(w=>w.toDateString()===i.toDateString()),c=((i.getHours()-R)*60+i.getMinutes())/60*N,D=S>=0&&c>=0&&c<=v,h=w=>{const[E,P]=w.split(":").map(Number);return E*60+P},C=w=>{if(!w.time||!w.endTime)return 30;const E=h(w.endTime)-h(w.time);return E>0?E:30},$=(w,E,P)=>{if(!p)return;const l=new Date(w);l.setHours(E,P,0,0);const f=`${E.toString().padStart(2,"0")}:${P.toString().padStart(2,"0")}`;p(l,E,f)},z=(w,E,P)=>{var it;if(!u)return;const l=(it=qe.current)==null?void 0:it.querySelector(`.${n.weekDayColumns}`);if(!l)return;const f=l.getBoundingClientRect(),L=P-f.left,G=E-f.top,ee=f.width/7,te=Math.min(6,Math.max(0,Math.floor(L/ee))),B=t[te],F=O?N/2:N,U=O?r.length*2:r.length,A=Math.min(U-1,Math.max(0,Math.floor(G/F))),ne=R+Math.floor(O?A/2:A),de=O&&A%2===1?30:0,he=new Date(B);he.setHours(ne,de,0,0),u(w,he)};return e.jsxs("div",{className:n.weekTimeline,children:[e.jsxs("div",{className:n.weekTimelineHeader,children:[e.jsx("div",{className:n.timeColumnHeader}),t.map(w=>{const E=w.toDateString()===i.toDateString(),P=re&&w.toDateString()===re.toDateString();return e.jsxs("button",{type:"button",className:`${n.weekDayColumnHeader} ${E?n.today:""} ${P?n.selected:""}`,onClick:()=>st(w),children:[e.jsx("span",{className:n.weekDayLabel,children:w.toLocaleDateString(Z,{weekday:"short"})}),e.jsx("span",{className:n.weekDayNumber,children:w.getDate()})]},w.toISOString())})]}),e.jsx("div",{className:n.weekTimelineScroll,ref:qe,children:e.jsxs("div",{className:n.weekTimelineGrid,style:{height:v},children:[e.jsx("div",{className:n.weekTimeColumn,children:r.map(w=>e.jsx("div",{className:n.weekTimeSlot,style:{height:N},children:e.jsxs("span",{className:n.weekHourLabel,children:[w.toString().padStart(2,"0"),":00"]})},w))}),e.jsx("div",{className:n.weekDayColumns,children:t.map(w=>{const E=Ue(w).filter(f=>!f.allDay&&f.time),P=w.toDateString()===i.toDateString(),l=rt(E);return e.jsxs("div",{className:n.weekDayColumn,children:[r.map(f=>e.jsx("div",{className:n.weekHourRow,style:{height:N},children:O?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:n.halfHourSlot,onClick:()=>$(w,f,0)}),e.jsx("div",{className:`${n.halfHourSlot} ${n.halfHourSlotBottom}`,onClick:()=>$(w,f,30)})]}):e.jsx("div",{className:n.halfHourSlot,onClick:()=>$(w,f,0)})},f)),E.map(f=>{const[L,G]=f.time.split(":").map(Number),ee=(L-R)*N+G/60*N,te=C(f),B=Math.max(24,te/60*N-2),F=l.get(f.id),U=(F==null?void 0:F.totalCols)??1,A=(F==null?void 0:F.col)??0;return e.jsx("div",{className:n.weekEventAnchor,style:{top:ee,height:B,"--lane-col":A,"--lane-total":U},onClick:ne=>ne.stopPropagation(),children:e.jsx(Fe,{event:f,color:le(f),textColor:xe(f),onComplete:y??(a?Se:void 0),onEdit:k,onDelete:b,onDragEnd:u?(ne,de)=>z(f,ne,de):void 0})},f.id)}),P&&D&&e.jsx("div",{className:n.currentTimeIndicator,style:{top:`${c}px`,left:0}})]},w.toISOString())})})]})})]})})():(()=>{const t=pe?void 0:40+K*24;return e.jsx("div",{className:`${n.daysGrid} ${De?n.withWeekNumbers:""}`,children:Ge.days.map((r,v)=>{const i=Ue(r),S=tn(r),M=nn(r),c=De&&v%7===0,D=re&&r.toDateString()===re.toDateString();return e.jsxs(T.Fragment,{children:[c&&e.jsx("div",{className:n.weekNumberCell,style:t!==void 0?{height:t,minHeight:t}:void 0,children:an(r)}),e.jsxs(We.div,{className:`${n.dayCell} ${S?n.today:""} ${M?"":n.otherMonth} ${D?n.selected:""}`,style:t!==void 0?{height:t,minHeight:t}:void 0,initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{duration:.3,delay:v*.02,ease:"easeOut"},onClick:()=>st(r),children:[e.jsx("div",{className:n.dayNumber,children:r.getDate()}),i.length>0&&pe&&_==="month"?e.jsxs("div",{className:n.dots,children:[i.slice(0,K).map(h=>e.jsx("span",{className:n.dot,style:{backgroundColor:le(h)}},h.id)),i.length>K&&e.jsxs("span",{className:n.dotMore,children:["+",i.length-K]})]}):i.length>0?e.jsxs("div",{className:n.events,children:[i.slice(0,K).map((h,C)=>e.jsxs(We.div,{className:`${n.event} ${h.status==="completed"?n.completed:""}`,style:{backgroundColor:le(h),color:xe(h),opacity:h.status==="completed"?.7:1},onClick:$=>{$.stopPropagation(),Se(h)},initial:{opacity:0,x:-10},animate:{opacity:1,x:0},transition:{duration:.2,delay:C*.05,ease:"easeOut"},whileHover:{scale:1.02,y:-1,transition:{duration:.1}},whileTap:{scale:.98,transition:{duration:.1}},children:[Qe&&Qe(h),e.jsxs("span",{className:n.eventTitle,children:[h.time&&e.jsx("span",{className:n.eventTime,children:h.time}),h.title]}),h.status==="completed"&&e.jsx("svg",{className:n.completedIcon,width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",children:e.jsx("polyline",{points:"20,6 9,17 4,12"})})]},h.id)),i.length>K&&e.jsxs("div",{className:n.moreEvents,children:["+",i.length-K," more"]})]}):Y?e.jsx("div",{className:n.emptyState,children:Y}):null]})]},`${r.getFullYear()}-${r.getMonth()}-${r.getDate()}`)})})})()]})}ue.__docgenInfo={description:`Calendar component - A flexible, reusable calendar for displaying events
|
|
14
|
+
|
|
15
|
+
@component
|
|
16
|
+
@description
|
|
17
|
+
A highly customizable calendar component that can display events in month or week view.
|
|
18
|
+
Supports custom event types, colors, icons, and localization. Perfect for scheduling,
|
|
19
|
+
project management, habit tracking, or any date-based data visualization.
|
|
20
|
+
|
|
21
|
+
@example
|
|
22
|
+
// Basic usage
|
|
23
|
+
<Calendar
|
|
24
|
+
events={myEvents}
|
|
25
|
+
onEventClick={handleEventClick}
|
|
26
|
+
viewMode="month"
|
|
27
|
+
/>
|
|
28
|
+
|
|
29
|
+
@example
|
|
30
|
+
// With custom configuration
|
|
31
|
+
<Calendar
|
|
32
|
+
events={projectEvents}
|
|
33
|
+
config={{
|
|
34
|
+
eventColors: { task: '#4A90E2', meeting: '#7ED321' },
|
|
35
|
+
maxEventsPerDay: 5,
|
|
36
|
+
mondayStart: true
|
|
37
|
+
}}
|
|
38
|
+
onEventClick={handleEventClick}
|
|
39
|
+
/>`,methods:[],displayName:"Calendar",props:{events:{required:!0,tsType:{name:"Array",elements:[{name:"CalendarEvent"}],raw:"CalendarEvent[]"},description:"Array of events to display"},onEventClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}}},description:"Callback when an event is clicked"},onDateClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(date: Date) => void",signature:{arguments:[{type:{name:"Date"},name:"date"}],return:{name:"void"}}},description:"Callback when a date is clicked"},onEventClickByView:{required:!1,tsType:{name:"signature",type:"object",raw:`{
|
|
40
|
+
month?: (event: CalendarEvent) => void;
|
|
41
|
+
week?: (event: CalendarEvent) => void;
|
|
42
|
+
day?: (event: CalendarEvent) => void;
|
|
43
|
+
}`,signature:{properties:[{key:"month",value:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}},required:!1}},{key:"week",value:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}},required:!1}},{key:"day",value:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}},required:!1}}]}},description:"View-specific event click handlers"},onDateClickByView:{required:!1,tsType:{name:"signature",type:"object",raw:`{
|
|
44
|
+
month?: (date: Date) => void;
|
|
45
|
+
week?: (date: Date) => void;
|
|
46
|
+
day?: (date: Date) => void;
|
|
47
|
+
}`,signature:{properties:[{key:"month",value:{name:"signature",type:"function",raw:"(date: Date) => void",signature:{arguments:[{type:{name:"Date"},name:"date"}],return:{name:"void"}},required:!1}},{key:"week",value:{name:"signature",type:"function",raw:"(date: Date) => void",signature:{arguments:[{type:{name:"Date"},name:"date"}],return:{name:"void"}},required:!1}},{key:"day",value:{name:"signature",type:"function",raw:"(date: Date) => void",signature:{arguments:[{type:{name:"Date"},name:"date"}],return:{name:"void"}},required:!1}}]}},description:"View-specific date click handlers"},onTimeSlotClick:{required:!1,tsType:{name:"signature",type:"function",raw:"(date: Date, hour: number, time: string) => void",signature:{arguments:[{type:{name:"Date"},name:"date"},{type:{name:"number"},name:"hour"},{type:{name:"string"},name:"time"}],return:{name:"void"}}},description:"Callback when a time slot is clicked in day view"},onEventDrop:{required:!1,tsType:{name:"signature",type:"function",raw:"(event: CalendarEvent, newDate: Date) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"},{type:{name:"Date"},name:"newDate"}],return:{name:"void"}}},description:"Callback when an event is dropped (drag-rescheduled) in day view"},onEventComplete:{required:!1,tsType:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}}},description:"Day view: callback when an event body is tapped to toggle complete"},onEventDelete:{required:!1,tsType:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}}},description:"Day view: callback when an event is swiped left to delete"},onEventEdit:{required:!1,tsType:{name:"signature",type:"function",raw:"(event: CalendarEvent) => void",signature:{arguments:[{type:{name:"CalendarEvent"},name:"event"}],return:{name:"void"}}},description:"Day view: callback when an event's edit button is clicked"},viewMode:{required:!1,tsType:{name:"union",raw:"'month' | 'week' | 'day'",elements:[{name:"literal",value:"'month'"},{name:"literal",value:"'week'"},{name:"literal",value:"'day'"}]},description:"Initial view mode",defaultValue:{value:"'month'",computed:!1}},initialDate:{required:!1,tsType:{name:"Date"},description:"Initial date to display",defaultValue:{value:"new Date()",computed:!1}},config:{required:!1,tsType:{name:"CalendarConfig"},description:"Configuration options",defaultValue:{value:"{}",computed:!1}},className:{required:!1,tsType:{name:"string"},description:"Custom CSS class",defaultValue:{value:"''",computed:!1}},style:{required:!1,tsType:{name:"ReactCSSProperties",raw:"React.CSSProperties"},description:"Custom styles",defaultValue:{value:"{}",computed:!1}},loading:{required:!1,tsType:{name:"boolean"},description:"Loading state",defaultValue:{value:"false",computed:!1}},emptyState:{required:!1,tsType:{name:"ReactReactNode",raw:"React.ReactNode"},description:"Custom empty state component"},hideHeader:{required:!1,tsType:{name:"boolean"},description:"Hide the calendar header (navigation, title, view controls)",defaultValue:{value:"false",computed:!1}},compact:{required:!1,tsType:{name:"boolean"},description:"Compact mode - renders colored dots instead of event blocks in month view",defaultValue:{value:"false",computed:!1}},selectedDate:{required:!1,tsType:{name:"Date"},description:"Externally controlled selected date highlight (distinct from initialDate which controls navigation)"},selectedCategoryId:{required:!1,tsType:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},description:'Controlled category filter selection. `null` means "All". Omit for uncontrolled.'},onCategoryChange:{required:!1,tsType:{name:"signature",type:"function",raw:"(categoryId: string | null) => void",signature:{arguments:[{type:{name:"union",raw:"string | null",elements:[{name:"string"},{name:"null"}]},name:"categoryId"}],return:{name:"void"}}},description:'Called when the user picks a pill in the category filter. `null` = "All".'},exportFormats:{required:!1,tsType:{name:"Array",elements:[{name:"union",raw:"'csv' | 'json' | 'toon'",elements:[{name:"literal",value:"'csv'"},{name:"literal",value:"'json'"},{name:"literal",value:"'toon'"}]}],raw:"ExportFormat[]"},description:'Offer an "Export" dropdown in the header with the given formats. Exports the currently\nfiltered events (respects category filter). Omit or pass `[]` to hide the button.'}}};const po={title:"Organisms/Calendar",component:ue,parameters:{layout:"padded"},argTypes:{viewMode:{control:"radio",options:["month","week","day"]},compact:{control:"boolean"},config:{control:"object"},onEventClick:{action:"event-clicked"},onDateClick:{action:"date-clicked"},onTimeSlotClick:{action:"slot-clicked"}}},ce=["#4A90E2","#7ED321","#BD10E0","#F5B829","#FF6B6B","#4ECDC4","#7C6FBF"],me=["Morning standup","Sprint planning","Code review","1:1 with manager","Design critique","Client demo","Deep work","Lunch with Ava","Architecture review","Release sign-off","Interview (FE)","Write weekly summary","Bug triage","Pairing session","Retro","Security debrief"],Ae=["meeting","task","review","deadline"],V=(o,a=0)=>`${o.toString().padStart(2,"0")}:${a.toString().padStart(2,"0")}`,Za=o=>{let a=o;return()=>{a|=0,a=a+1831565813|0;let s=Math.imul(a^a>>>15,1|a);return s=s+Math.imul(s^s>>>7,61|s)^s,((s^s>>>14)>>>0)/4294967296}},ge=(o=42)=>{const a=Za(o),s=new Date,d=[];for(let m=0;m<28;m++){const p=new Date(s);p.setDate(s.getDate()+Math.floor(a()*30)-15);const u=8+Math.floor(a()*10),y=a()>.5?0:30;d.push({id:`m-${m}`,title:me[m%me.length],date:p,time:a()>.35?V(u,y):void 0,type:Ae[Math.floor(a()*Ae.length)],status:a()>.75?"completed":"pending",color:ce[m%ce.length],textColor:"#ffffff"})}return d},Gt=()=>{const o=new Date,a=(s,d=0)=>{const m=new Date(o);return m.setHours(s,d,0,0),m};return[{id:"ad-1",title:"Offsite — Q2 planning",date:a(0),allDay:!0,color:"#7C6FBF",textColor:"#ffffff"},{id:"d-1",title:"Morning standup",date:a(9),time:"09:00",endTime:"09:30",status:"completed",color:"#4A90E2",textColor:"#ffffff"},{id:"d-2",title:"Deep work: refactor auth",date:a(10),time:"10:00",endTime:"12:00",color:"#F5B829",textColor:"#1a1a1a"},{id:"d-3",title:"Lunch with Ava",date:a(12,30),time:"12:30",endTime:"13:30",color:"#4ECDC4",textColor:"#1a1a1a"},{id:"d-4",title:"1:1 with manager",date:a(14),time:"14:00",endTime:"14:30",color:"#BD10E0",textColor:"#ffffff"},{id:"d-5",title:"Design review",date:a(15),time:"15:00",endTime:"16:30",color:"#FF6B6B",textColor:"#ffffff"},{id:"d-6",title:"Write weekly summary",date:a(17,30),time:"17:30",endTime:"18:00",color:"#10b981",textColor:"#ffffff"}]},eo=o=>{const a={meeting:"👥",task:"✓",review:"👀",deadline:"⏰"};return e.jsx("span",{style:{fontSize:11},children:a[o.type??""]??"📅"})},Ce={args:{events:ge(),viewMode:"month",config:{mondayStart:!0,maxEventsPerDay:3,iconRenderer:eo}},render:o=>{const[a,s]=T.useState(o.events??[]);return e.jsx(ue,{...o,events:a,onEventClick:d=>{s(m=>m.map(p=>p.id===d.id?{...p,status:p.status==="completed"?"pending":"completed"}:p))},onDateClick:d=>{s(m=>[...m,{id:`new-${Date.now()}`,title:"New event",date:d,time:"15:00",type:"task",status:"pending",color:"#6366f1",textColor:"#ffffff"}])}})}},Ee={args:{events:[],viewMode:"week",config:{mondayStart:!0,startHour:7,endHour:22,hourHeight:56,halfHourSlots:!0}},render:o=>{const a=new Date,s=(a.getDay()+6)%7,d=new Date(a);d.setDate(a.getDate()-s),d.setHours(0,0,0,0);const m=[];for(let y=0;y<7;y++){const b=new Date(d);b.setDate(d.getDate()+y);const k=y*2%3+1;for(let x=0;x<k;x++){const j=9+x*3+y%2;m.push({id:`w-${y}-${x}`,title:me[(y*3+x)%me.length],date:new Date(b),time:V(j,x%2===0?0:30),endTime:V(j+1,x%2===0?0:30),color:ce[(y+x)%ce.length],textColor:"#ffffff"})}}const[p,u]=T.useState(m);return e.jsx(ue,{...o,events:p,onTimeSlotClick:(y,b,k)=>{const x=Math.min(23,y.getHours()+1);u(j=>[...j,{id:`new-${Date.now()}`,title:`New @ ${k}`,date:y,time:k,endTime:V(x,y.getMinutes()),color:"#6366f1",textColor:"#ffffff"}])},onEventComplete:y=>u(b=>b.map(k=>k.id===y.id?{...k,status:k.status==="completed"?"pending":"completed"}:k)),onEventDelete:y=>u(b=>b.filter(k=>k.id!==y.id)),onEventDrop:(y,b)=>{u(k=>k.map(x=>{if(x.id!==y.id)return x;const j=new Date(x.date),H=b.getTime()-j.getTime(),W=(()=>{if(!x.endTime||!x.time)return x.endTime;const[I,ae]=x.endTime.split(":").map(Number),Y=new Date(j);Y.setHours(I,ae,0,0);const oe=new Date(Y.getTime()+H);return V(oe.getHours(),oe.getMinutes())})();return{...x,date:b,time:V(b.getHours(),b.getMinutes()),endTime:W}}))}})}},Te={args:{events:[],viewMode:"day",config:{startHour:6,endHour:24,hourHeight:72,halfHourSlots:!0,mondayStart:!0}},render:o=>{const[a,s]=T.useState(Gt());return e.jsx(ue,{...o,events:a,onTimeSlotClick:(d,m,p)=>{const u=Math.min(23,d.getHours()+1);s(y=>[...y,{id:`new-${Date.now()}`,title:`New @ ${p}`,date:d,time:p,endTime:V(u,d.getMinutes()),color:"#6366f1",textColor:"#ffffff"}])},onEventComplete:d=>s(m=>m.map(p=>p.id===d.id?{...p,status:p.status==="completed"?"pending":"completed"}:p)),onEventDelete:d=>s(m=>m.filter(p=>p.id!==d.id)),onEventEdit:d=>{const m=window.prompt("Rename event",d.title);m&&s(p=>p.map(u=>u.id===d.id?{...u,title:m}:u))},onEventDrop:(d,m)=>{s(p=>p.map(u=>{if(u.id!==d.id)return u;const y=new Date(u.date),b=m.getTime()-y.getTime(),k=(()=>{if(!u.endTime||!u.time)return u.endTime;const[x,j]=u.endTime.split(":").map(Number),H=new Date(y);H.setHours(x,j,0,0);const W=new Date(H.getTime()+b);return V(W.getHours(),W.getMinutes())})();return{...u,date:m,time:V(m.getHours(),m.getMinutes()),endTime:k}}))}})}},je={args:{events:ge(1).map((a,s)=>({...a,category:s%3===0?"work":s%3===1?"life":"side"})),viewMode:"month",compact:!0,config:{mondayStart:!0,maxEventsPerDay:4,categories:[{id:"life",label:"Life",color:"#F5B829"},{id:"work",label:"Work",color:"#7C6FBF"},{id:"side",label:"Side",color:"#4ECDC4"}]},style:{maxWidth:420}}},Ne={args:{events:Gt(),viewMode:"day",compact:!0,config:{startHour:7,endHour:22,hourHeight:56,halfHourSlots:!0},style:{maxWidth:520}}},Me={args:{events:ge(3),viewMode:"month",config:{mondayStart:!0,showWeekNumbers:!0,maxEventsPerDay:3}}},He={args:{events:(()=>{const o=new Date;return Array.from({length:9},(a,s)=>({id:`over-${s}`,title:me[s%me.length],date:new Date(o),time:V(8+s),type:Ae[s%Ae.length],color:ce[s%ce.length],textColor:"#ffffff"}))})(),viewMode:"month",config:{mondayStart:!0,maxEventsPerDay:3}}},$e={args:{events:[],loading:!0}},Le={args:{events:[],viewMode:"month",config:{mondayStart:!0},emptyState:e.jsx("span",{style:{color:"var(--color-text-tertiary)",fontSize:11},children:"No events"})}},Ie={args:{events:ge(5),viewMode:"month",exportFormats:["csv","json","toon"],config:{mondayStart:!0,maxEventsPerDay:3}}},Pe={args:{events:ge(11).map((a,s)=>({...a,category:s%3===0?"work":s%3===1?"life":"side"})),viewMode:"month",config:{mondayStart:!0,maxEventsPerDay:3,categories:[{id:"life",label:"Life",color:"#F5B829"},{id:"work",label:"Work",color:"#7C6FBF"},{id:"side",label:"Side projects",color:"#4ECDC4"}]}}},Be={args:{events:[]},render:()=>{const[o,a]=T.useState(new Date),s=T.useMemo(()=>ge(9),[]);return e.jsxs("div",{style:{display:"grid",gap:"var(--spacing-md)"},children:[e.jsxs("div",{style:{fontSize:"var(--font-size-sm)",color:"var(--color-text-secondary)"},children:["Selected: ",e.jsx("strong",{children:o.toLocaleDateString()})]}),e.jsx(ue,{events:s,viewMode:"month",selectedDate:o,onDateClick:a,config:{mondayStart:!0,maxEventsPerDay:3}})]})}};var dt,ct,mt;Ce.parameters={...Ce.parameters,docs:{...(dt=Ce.parameters)==null?void 0:dt.docs,source:{originalSource:`{
|
|
48
|
+
args: {
|
|
49
|
+
events: buildMonthEvents(),
|
|
50
|
+
viewMode: 'month',
|
|
51
|
+
config: {
|
|
52
|
+
mondayStart: true,
|
|
53
|
+
maxEventsPerDay: 3,
|
|
54
|
+
iconRenderer: iconForType
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
render: args => {
|
|
58
|
+
const [events, setEvents] = useState<CalendarEvent[]>(args.events ?? []);
|
|
59
|
+
return <Calendar {...args} events={events} onEventClick={e => {
|
|
60
|
+
setEvents(prev => prev.map(ev => ev.id === e.id ? {
|
|
61
|
+
...ev,
|
|
62
|
+
status: ev.status === 'completed' ? 'pending' : 'completed'
|
|
63
|
+
} : ev));
|
|
64
|
+
}} onDateClick={date => {
|
|
65
|
+
setEvents(prev => [...prev, {
|
|
66
|
+
id: \`new-\${Date.now()}\`,
|
|
67
|
+
title: 'New event',
|
|
68
|
+
date,
|
|
69
|
+
time: '15:00',
|
|
70
|
+
type: 'task',
|
|
71
|
+
status: 'pending',
|
|
72
|
+
color: '#6366f1',
|
|
73
|
+
textColor: '#ffffff'
|
|
74
|
+
}]);
|
|
75
|
+
}} />;
|
|
76
|
+
}
|
|
77
|
+
}`,...(mt=(ct=Ce.parameters)==null?void 0:ct.docs)==null?void 0:mt.source}}};var ut,gt,pt;Ee.parameters={...Ee.parameters,docs:{...(ut=Ee.parameters)==null?void 0:ut.docs,source:{originalSource:`{
|
|
78
|
+
args: {
|
|
79
|
+
events: [],
|
|
80
|
+
viewMode: 'week',
|
|
81
|
+
config: {
|
|
82
|
+
mondayStart: true,
|
|
83
|
+
startHour: 7,
|
|
84
|
+
endHour: 22,
|
|
85
|
+
hourHeight: 56,
|
|
86
|
+
halfHourSlots: true
|
|
87
|
+
}
|
|
88
|
+
},
|
|
89
|
+
render: args => {
|
|
90
|
+
// Build 7 days of timed events around "today" so drag has neighbours to land on
|
|
91
|
+
const today = new Date();
|
|
92
|
+
const mondayOffset = (today.getDay() + 6) % 7;
|
|
93
|
+
const weekStart = new Date(today);
|
|
94
|
+
weekStart.setDate(today.getDate() - mondayOffset);
|
|
95
|
+
weekStart.setHours(0, 0, 0, 0);
|
|
96
|
+
const initial: CalendarEvent[] = [];
|
|
97
|
+
for (let i = 0; i < 7; i++) {
|
|
98
|
+
const d = new Date(weekStart);
|
|
99
|
+
d.setDate(weekStart.getDate() + i);
|
|
100
|
+
const count = i * 2 % 3 + 1;
|
|
101
|
+
for (let j = 0; j < count; j++) {
|
|
102
|
+
const startH = 9 + j * 3 + i % 2;
|
|
103
|
+
initial.push({
|
|
104
|
+
id: \`w-\${i}-\${j}\`,
|
|
105
|
+
title: TITLES[(i * 3 + j) % TITLES.length],
|
|
106
|
+
date: new Date(d),
|
|
107
|
+
time: hhmm(startH, j % 2 === 0 ? 0 : 30),
|
|
108
|
+
endTime: hhmm(startH + 1, j % 2 === 0 ? 0 : 30),
|
|
109
|
+
color: PALETTE[(i + j) % PALETTE.length],
|
|
110
|
+
textColor: '#ffffff'
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
const [events, setEvents] = useState<CalendarEvent[]>(initial);
|
|
115
|
+
return <Calendar {...args} events={events} onTimeSlotClick={(date, _h, time) => {
|
|
116
|
+
const endH = Math.min(23, date.getHours() + 1);
|
|
117
|
+
setEvents(prev => [...prev, {
|
|
118
|
+
id: \`new-\${Date.now()}\`,
|
|
119
|
+
title: \`New @ \${time}\`,
|
|
120
|
+
date,
|
|
121
|
+
time,
|
|
122
|
+
endTime: hhmm(endH, date.getMinutes()),
|
|
123
|
+
color: '#6366f1',
|
|
124
|
+
textColor: '#ffffff'
|
|
125
|
+
}]);
|
|
126
|
+
}} onEventComplete={e => setEvents(prev => prev.map(ev => ev.id === e.id ? {
|
|
127
|
+
...ev,
|
|
128
|
+
status: ev.status === 'completed' ? 'pending' : 'completed'
|
|
129
|
+
} : ev))} onEventDelete={e => setEvents(prev => prev.filter(ev => ev.id !== e.id))} onEventDrop={(e, newDate) => {
|
|
130
|
+
setEvents(prev => prev.map(ev => {
|
|
131
|
+
if (ev.id !== e.id) return ev;
|
|
132
|
+
const oldStart = new Date(ev.date);
|
|
133
|
+
const deltaMs = newDate.getTime() - oldStart.getTime();
|
|
134
|
+
const nextEndTime = (() => {
|
|
135
|
+
if (!ev.endTime || !ev.time) return ev.endTime;
|
|
136
|
+
const [oh, om] = ev.endTime.split(':').map(Number);
|
|
137
|
+
const endOld = new Date(oldStart);
|
|
138
|
+
endOld.setHours(oh, om, 0, 0);
|
|
139
|
+
const endNew = new Date(endOld.getTime() + deltaMs);
|
|
140
|
+
return hhmm(endNew.getHours(), endNew.getMinutes());
|
|
141
|
+
})();
|
|
142
|
+
return {
|
|
143
|
+
...ev,
|
|
144
|
+
date: newDate,
|
|
145
|
+
time: hhmm(newDate.getHours(), newDate.getMinutes()),
|
|
146
|
+
endTime: nextEndTime
|
|
147
|
+
};
|
|
148
|
+
}));
|
|
149
|
+
}} />;
|
|
150
|
+
}
|
|
151
|
+
}`,...(pt=(gt=Ee.parameters)==null?void 0:gt.docs)==null?void 0:pt.source}}};var vt,ft,ht;Te.parameters={...Te.parameters,docs:{...(vt=Te.parameters)==null?void 0:vt.docs,source:{originalSource:`{
|
|
152
|
+
args: {
|
|
153
|
+
events: [],
|
|
154
|
+
viewMode: 'day',
|
|
155
|
+
config: {
|
|
156
|
+
startHour: 6,
|
|
157
|
+
endHour: 24,
|
|
158
|
+
hourHeight: 72,
|
|
159
|
+
halfHourSlots: true,
|
|
160
|
+
mondayStart: true
|
|
161
|
+
}
|
|
162
|
+
},
|
|
163
|
+
render: args => {
|
|
164
|
+
const [events, setEvents] = useState<CalendarEvent[]>(buildDayEvents());
|
|
165
|
+
return <Calendar {...args} events={events} onTimeSlotClick={(date, _h, time) => {
|
|
166
|
+
const endH = Math.min(23, date.getHours() + 1);
|
|
167
|
+
setEvents(prev => [...prev, {
|
|
168
|
+
id: \`new-\${Date.now()}\`,
|
|
169
|
+
title: \`New @ \${time}\`,
|
|
170
|
+
date,
|
|
171
|
+
time,
|
|
172
|
+
endTime: hhmm(endH, date.getMinutes()),
|
|
173
|
+
color: '#6366f1',
|
|
174
|
+
textColor: '#ffffff'
|
|
175
|
+
}]);
|
|
176
|
+
}} onEventComplete={e => setEvents(prev => prev.map(ev => ev.id === e.id ? {
|
|
177
|
+
...ev,
|
|
178
|
+
status: ev.status === 'completed' ? 'pending' : 'completed'
|
|
179
|
+
} : ev))} onEventDelete={e => setEvents(prev => prev.filter(ev => ev.id !== e.id))} onEventEdit={e => {
|
|
180
|
+
const next = window.prompt('Rename event', e.title);
|
|
181
|
+
if (!next) return;
|
|
182
|
+
setEvents(prev => prev.map(ev => ev.id === e.id ? {
|
|
183
|
+
...ev,
|
|
184
|
+
title: next
|
|
185
|
+
} : ev));
|
|
186
|
+
}} onEventDrop={(e, newDate) => {
|
|
187
|
+
setEvents(prev => prev.map(ev => {
|
|
188
|
+
if (ev.id !== e.id) return ev;
|
|
189
|
+
const oldStart = new Date(ev.date);
|
|
190
|
+
const deltaMs = newDate.getTime() - oldStart.getTime();
|
|
191
|
+
const nextEndTime = (() => {
|
|
192
|
+
if (!ev.endTime || !ev.time) return ev.endTime;
|
|
193
|
+
const [oh, om] = ev.endTime.split(':').map(Number);
|
|
194
|
+
const endOld = new Date(oldStart);
|
|
195
|
+
endOld.setHours(oh, om, 0, 0);
|
|
196
|
+
const endNew = new Date(endOld.getTime() + deltaMs);
|
|
197
|
+
return hhmm(endNew.getHours(), endNew.getMinutes());
|
|
198
|
+
})();
|
|
199
|
+
return {
|
|
200
|
+
...ev,
|
|
201
|
+
date: newDate,
|
|
202
|
+
time: hhmm(newDate.getHours(), newDate.getMinutes()),
|
|
203
|
+
endTime: nextEndTime
|
|
204
|
+
};
|
|
205
|
+
}));
|
|
206
|
+
}} />;
|
|
207
|
+
}
|
|
208
|
+
}`,...(ht=(ft=Te.parameters)==null?void 0:ft.docs)==null?void 0:ht.source}}};var yt,wt,Dt;je.parameters={...je.parameters,docs:{...(yt=je.parameters)==null?void 0:yt.docs,source:{originalSource:`{
|
|
209
|
+
args: {
|
|
210
|
+
events: (() => {
|
|
211
|
+
const base = buildMonthEvents(1);
|
|
212
|
+
return base.map((e, i) => ({
|
|
213
|
+
...e,
|
|
214
|
+
category: i % 3 === 0 ? 'work' : i % 3 === 1 ? 'life' : 'side'
|
|
215
|
+
}));
|
|
216
|
+
})(),
|
|
217
|
+
viewMode: 'month',
|
|
218
|
+
compact: true,
|
|
219
|
+
config: {
|
|
220
|
+
mondayStart: true,
|
|
221
|
+
maxEventsPerDay: 4,
|
|
222
|
+
categories: [{
|
|
223
|
+
id: 'life',
|
|
224
|
+
label: 'Life',
|
|
225
|
+
color: '#F5B829'
|
|
226
|
+
}, {
|
|
227
|
+
id: 'work',
|
|
228
|
+
label: 'Work',
|
|
229
|
+
color: '#7C6FBF'
|
|
230
|
+
}, {
|
|
231
|
+
id: 'side',
|
|
232
|
+
label: 'Side',
|
|
233
|
+
color: '#4ECDC4'
|
|
234
|
+
}]
|
|
235
|
+
},
|
|
236
|
+
style: {
|
|
237
|
+
maxWidth: 420
|
|
238
|
+
}
|
|
239
|
+
}
|
|
240
|
+
}`,...(Dt=(wt=je.parameters)==null?void 0:wt.docs)==null?void 0:Dt.source}}};var _t,bt,xt;Ne.parameters={...Ne.parameters,docs:{...(_t=Ne.parameters)==null?void 0:_t.docs,source:{originalSource:`{
|
|
241
|
+
args: {
|
|
242
|
+
events: buildDayEvents(),
|
|
243
|
+
viewMode: 'day',
|
|
244
|
+
compact: true,
|
|
245
|
+
config: {
|
|
246
|
+
startHour: 7,
|
|
247
|
+
endHour: 22,
|
|
248
|
+
hourHeight: 56,
|
|
249
|
+
halfHourSlots: true
|
|
250
|
+
},
|
|
251
|
+
style: {
|
|
252
|
+
maxWidth: 520
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
}`,...(xt=(bt=Ne.parameters)==null?void 0:bt.docs)==null?void 0:xt.source}}};var St,kt,Ct;Me.parameters={...Me.parameters,docs:{...(St=Me.parameters)==null?void 0:St.docs,source:{originalSource:`{
|
|
256
|
+
args: {
|
|
257
|
+
events: buildMonthEvents(3),
|
|
258
|
+
viewMode: 'month',
|
|
259
|
+
config: {
|
|
260
|
+
mondayStart: true,
|
|
261
|
+
showWeekNumbers: true,
|
|
262
|
+
maxEventsPerDay: 3
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
}`,...(Ct=(kt=Me.parameters)==null?void 0:kt.docs)==null?void 0:Ct.source}}};var Et,Tt,jt;He.parameters={...He.parameters,docs:{...(Et=He.parameters)==null?void 0:Et.docs,source:{originalSource:`{
|
|
266
|
+
args: {
|
|
267
|
+
events: (() => {
|
|
268
|
+
const today = new Date();
|
|
269
|
+
return Array.from({
|
|
270
|
+
length: 9
|
|
271
|
+
}, (_, i) => ({
|
|
272
|
+
id: \`over-\${i}\`,
|
|
273
|
+
title: TITLES[i % TITLES.length],
|
|
274
|
+
date: new Date(today),
|
|
275
|
+
time: hhmm(8 + i),
|
|
276
|
+
type: TYPES[i % TYPES.length],
|
|
277
|
+
color: PALETTE[i % PALETTE.length],
|
|
278
|
+
textColor: '#ffffff'
|
|
279
|
+
}));
|
|
280
|
+
})(),
|
|
281
|
+
viewMode: 'month',
|
|
282
|
+
config: {
|
|
283
|
+
mondayStart: true,
|
|
284
|
+
maxEventsPerDay: 3
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
}`,...(jt=(Tt=He.parameters)==null?void 0:Tt.docs)==null?void 0:jt.source}}};var Nt,Mt,Ht;$e.parameters={...$e.parameters,docs:{...(Nt=$e.parameters)==null?void 0:Nt.docs,source:{originalSource:`{
|
|
288
|
+
args: {
|
|
289
|
+
events: [],
|
|
290
|
+
loading: true
|
|
291
|
+
}
|
|
292
|
+
}`,...(Ht=(Mt=$e.parameters)==null?void 0:Mt.docs)==null?void 0:Ht.source}}};var $t,Lt,It;Le.parameters={...Le.parameters,docs:{...($t=Le.parameters)==null?void 0:$t.docs,source:{originalSource:`{
|
|
293
|
+
args: {
|
|
294
|
+
events: [],
|
|
295
|
+
viewMode: 'month',
|
|
296
|
+
config: {
|
|
297
|
+
mondayStart: true
|
|
298
|
+
},
|
|
299
|
+
emptyState: <span style={{
|
|
300
|
+
color: 'var(--color-text-tertiary)',
|
|
301
|
+
fontSize: 11
|
|
302
|
+
}}>
|
|
303
|
+
No events
|
|
304
|
+
</span>
|
|
305
|
+
}
|
|
306
|
+
}`,...(It=(Lt=Le.parameters)==null?void 0:Lt.docs)==null?void 0:It.source}}};var Pt,Bt,Ft;Ie.parameters={...Ie.parameters,docs:{...(Pt=Ie.parameters)==null?void 0:Pt.docs,source:{originalSource:`{
|
|
307
|
+
args: {
|
|
308
|
+
events: buildMonthEvents(5),
|
|
309
|
+
viewMode: 'month',
|
|
310
|
+
exportFormats: ['csv', 'json', 'toon'],
|
|
311
|
+
config: {
|
|
312
|
+
mondayStart: true,
|
|
313
|
+
maxEventsPerDay: 3
|
|
314
|
+
}
|
|
315
|
+
}
|
|
316
|
+
}`,...(Ft=(Bt=Ie.parameters)==null?void 0:Bt.docs)==null?void 0:Ft.source}}};var Wt,At,Rt;Pe.parameters={...Pe.parameters,docs:{...(Wt=Pe.parameters)==null?void 0:Wt.docs,source:{originalSource:`{
|
|
317
|
+
args: {
|
|
318
|
+
events: (() => {
|
|
319
|
+
const base = buildMonthEvents(11);
|
|
320
|
+
return base.map((e, i) => ({
|
|
321
|
+
...e,
|
|
322
|
+
category: i % 3 === 0 ? 'work' : i % 3 === 1 ? 'life' : 'side'
|
|
323
|
+
}));
|
|
324
|
+
})(),
|
|
325
|
+
viewMode: 'month',
|
|
326
|
+
config: {
|
|
327
|
+
mondayStart: true,
|
|
328
|
+
maxEventsPerDay: 3,
|
|
329
|
+
categories: [{
|
|
330
|
+
id: 'life',
|
|
331
|
+
label: 'Life',
|
|
332
|
+
color: '#F5B829'
|
|
333
|
+
}, {
|
|
334
|
+
id: 'work',
|
|
335
|
+
label: 'Work',
|
|
336
|
+
color: '#7C6FBF'
|
|
337
|
+
}, {
|
|
338
|
+
id: 'side',
|
|
339
|
+
label: 'Side projects',
|
|
340
|
+
color: '#4ECDC4'
|
|
341
|
+
}]
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
}`,...(Rt=(At=Pe.parameters)==null?void 0:At.docs)==null?void 0:Rt.source}}};var Ot,qt,Vt;Be.parameters={...Be.parameters,docs:{...(Ot=Be.parameters)==null?void 0:Ot.docs,source:{originalSource:`{
|
|
345
|
+
args: {
|
|
346
|
+
events: []
|
|
347
|
+
},
|
|
348
|
+
render: () => {
|
|
349
|
+
const [selected, setSelected] = useState(new Date());
|
|
350
|
+
const events = useMemo(() => buildMonthEvents(9), []);
|
|
351
|
+
return <div style={{
|
|
352
|
+
display: 'grid',
|
|
353
|
+
gap: 'var(--spacing-md)'
|
|
354
|
+
}}>
|
|
355
|
+
<div style={{
|
|
356
|
+
fontSize: 'var(--font-size-sm)',
|
|
357
|
+
color: 'var(--color-text-secondary)'
|
|
358
|
+
}}>
|
|
359
|
+
Selected: <strong>{selected.toLocaleDateString()}</strong>
|
|
360
|
+
</div>
|
|
361
|
+
<Calendar events={events} viewMode="month" selectedDate={selected} onDateClick={setSelected} config={{
|
|
362
|
+
mondayStart: true,
|
|
363
|
+
maxEventsPerDay: 3
|
|
364
|
+
}} />
|
|
365
|
+
</div>;
|
|
366
|
+
}
|
|
367
|
+
}`,...(Vt=(qt=Be.parameters)==null?void 0:qt.docs)==null?void 0:Vt.source}}};const vo=["Default","WeekView","DayView","CompactMonth","CompactDay","WithWeekNumbers","OverflowDay","Loading","Empty","WithExport","WithCategoryFilter","ControlledSelection"];export{Ne as CompactDay,je as CompactMonth,Be as ControlledSelection,Te as DayView,Ce as Default,Le as Empty,$e as Loading,He as OverflowDay,Ee as WeekView,Pe as WithCategoryFilter,Ie as WithExport,Me as WithWeekNumbers,vo as __namedExportsOrder,po as default};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as I,j as e}from"./iframe-
|
|
1
|
+
import{r as I,j as e}from"./iframe-BLM9gPKH.js";import{A as M}from"./index-vIkE6dHF.js";import{m as _}from"./proxy-BsV6quUP.js";const B="_card_k0xft_1",V="_hoverable_k0xft_50",A="_elevated_k0xft_65",L="_outlined_k0xft_78",S="_flat_k0xft_111",E="_glass_k0xft_156",W="_imageContainer_k0xft_187",F="_image_k0xft_187",H="_header_k0xft_233",R="_headerContent_k0xft_248",O="_expandButton_k0xft_254",D="_expandIcon_k0xft_285",J="_expandableContent_k0xft_289",U="_expandable_k0xft_289",X="_body_k0xft_313",z="_footer_k0xft_319",G="_title_k0xft_350",K="_subtitle_k0xft_366",Q="_clickable_k0xft_380",Y="_padding_k0xft_394",Z="_noPadding_k0xft_398",$="_loading_k0xft_403",ee="_loadingShimmer_k0xft_1",ae="_loadingPulse_k0xft_1",a={card:B,hoverable:V,elevated:A,outlined:L,flat:S,glass:E,imageContainer:W,image:F,header:H,headerContent:R,expandButton:O,expandIcon:D,expandableContent:J,expandable:U,body:X,footer:z,title:G,subtitle:K,clickable:Q,padding:Y,noPadding:Z,loading:$,loadingShimmer:ee,loadingPulse:ae},te=({variant:g="elevated",hoverable:d=!1,clickable:l=!1,padding:c=!0,image:p,imageAlt:v="",title:o,subtitle:s,header:u,footer:m,children:f,expandable:t=!1,defaultExpanded:C=!1,expanded:i,onExpandChange:r,className:b="",onClick:k,motionProps:y,...j})=>{const[T,N]=I.useState(C),n=i!==void 0?i:T,h=()=>{const x=!n;i===void 0&&N(x),r==null||r(x)},q=[a.card,a[g],d&&a.hoverable,l&&a.clickable,!c&&a.noPadding,t&&a.expandable,b].filter(Boolean).join(" "),w=()=>u?e.jsxs("div",{className:a.header,children:[e.jsx("div",{className:a.headerContent,children:u}),t&&e.jsx("button",{className:a.expandButton,onClick:h,"aria-label":n?"Collapse card":"Expand card",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:a.expandIcon,style:{transform:n?"rotate(180deg)":"rotate(0deg)"},children:e.jsx("path",{d:"M6 9l6 6 6-6"})})})]}):o||s?e.jsxs("div",{className:a.header,children:[e.jsxs("div",{className:a.headerContent,children:[o&&e.jsx("h3",{className:a.title,children:o}),s&&e.jsx("p",{className:a.subtitle,children:s})]}),t&&e.jsx("button",{className:a.expandButton,onClick:h,"aria-label":n?"Collapse card":"Expand card",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:a.expandIcon,style:{transform:n?"rotate(180deg)":"rotate(0deg)"},children:e.jsx("path",{d:"M6 9l6 6 6-6"})})})]}):null,P=e.jsxs(e.Fragment,{children:[p&&e.jsx("div",{className:a.imageContainer,children:e.jsx("img",{src:p,alt:v,className:a.image})}),w(),e.jsx(M,{initial:!1,children:(!t||n)&&e.jsxs(_.div,{initial:t?{height:0,opacity:0}:void 0,animate:t?{height:"auto",opacity:1}:void 0,exit:t?{height:0,opacity:0}:void 0,transition:{duration:.3,ease:"easeInOut"},className:a.expandableContent,children:[f&&e.jsx("div",{className:c?a.body:void 0,children:f}),m&&e.jsx("div",{className:a.footer,children:m})]},"content")})]});return e.jsx(_.div,{className:q,onClick:l?k:void 0,whileHover:d?{y:-4}:void 0,transition:{type:"spring",stiffness:400,damping:17},...y,...j,children:P})};te.__docgenInfo={description:`Card Component
|
|
2
2
|
|
|
3
3
|
@component
|
|
4
4
|
@description
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{j as e,r as T}from"./iframe-
|
|
1
|
+
import{j as e,r as T}from"./iframe-BLM9gPKH.js";import{C as a}from"./Card-D2W3wjZy.js";import{B as t}from"./Button-DQla6H3P.js";import"./preload-helper-C1FmrZbK.js";import"./index-vIkE6dHF.js";import"./proxy-BsV6quUP.js";import"./MotionConfigContext-E6BOCyHu.js";import"./useSound-SuqbUlad.js";const D={title:"Atoms/Card",component:a,parameters:{layout:"centered",docs:{description:{component:"A flexible container component with various styling options and animation support."}}},argTypes:{variant:{control:"select",options:["elevated","outlined","flat","glass"],description:"Visual style variant of the card"},padding:{control:"boolean"},hoverable:{control:"boolean"},clickable:{control:"boolean"},expandable:{control:"boolean"},defaultExpanded:{control:"boolean"},title:{control:"text"},subtitle:{control:"text"},onClick:{action:"clicked"},onExpandChange:{action:"expand-changed"}}},r={args:{title:"Card Title",subtitle:"Optional subtitle",hoverable:!0,children:e.jsx("p",{children:"Card content goes here. Use controls to switch between elevated, outlined, flat, and glass variants."})}},n={args:{variant:"elevated",hoverable:!0,image:"https://via.placeholder.com/350x200",imageAlt:"Feature image",children:e.jsxs("div",{style:{maxWidth:"350px"},children:[e.jsx("h2",{style:{marginBottom:"0.5rem"},children:"Feature Card"}),e.jsx("p",{style:{marginBottom:"1rem",color:"#666"},children:"Image, title, description, and action buttons composed together."}),e.jsxs("div",{style:{display:"flex",gap:"0.5rem"},children:[e.jsx(t,{variant:"primary",size:"small",children:"Learn More"}),e.jsx(t,{variant:"outline",size:"small",children:"Share"})]})]})}},l={render:()=>e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:"1rem",maxWidth:"800px"},children:[e.jsxs(a,{variant:"elevated",hoverable:!0,children:[e.jsx("h4",{children:"Elevated"}),e.jsx("p",{children:"With shadow"})]}),e.jsxs(a,{variant:"outlined",hoverable:!0,children:[e.jsx("h4",{children:"Outlined"}),e.jsx("p",{children:"With border"})]}),e.jsxs(a,{variant:"glass",hoverable:!0,children:[e.jsx("h4",{children:"Glass"}),e.jsx("p",{children:"Glassmorphism"})]})]}),parameters:{controls:{disable:!0},layout:"padded"}},s={args:{title:"Expandable Card",subtitle:"Click the arrow to expand",expandable:!0,variant:"outlined",children:e.jsxs("div",{children:[e.jsx("p",{children:"This content is collapsible. Useful for FAQ sections, settings panels, or progressive disclosure."}),e.jsxs("div",{style:{display:"flex",gap:"0.5rem",marginTop:"1rem"},children:[e.jsx(t,{variant:"primary",size:"small",children:"Action"}),e.jsx(t,{variant:"outline",size:"small",children:"Secondary"})]})]})}},i={render:()=>{const[d,p]=T.useState(!1);return e.jsxs("div",{style:{width:"400px"},children:[e.jsxs(a,{title:"Controlled Expandable",subtitle:"State managed externally",expandable:!0,expanded:d,onExpandChange:p,variant:"glass",hoverable:!0,children:[e.jsx("p",{children:"Expanded state is controlled via props."}),e.jsxs("p",{children:["Current: ",e.jsx("strong",{children:d?"Expanded":"Collapsed"})]})]}),e.jsx("div",{style:{marginTop:"1rem",textAlign:"center"},children:e.jsx(t,{variant:"primary",onClick:()=>p(!d),children:"External Toggle"})})]})},parameters:{controls:{disable:!0}}},o={render:()=>e.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"1rem",maxWidth:"600px"},children:[e.jsx(a,{title:"Getting Started",expandable:!0,variant:"outlined",children:e.jsx("p",{children:"Create an account and follow the onboarding tutorial to get started."})}),e.jsx(a,{title:"Account Management",expandable:!0,variant:"outlined",children:e.jsx("p",{children:"Manage settings from the profile page: personal info, password, notifications."})}),e.jsx(a,{title:"Billing & Payments",expandable:!0,defaultExpanded:!0,variant:"outlined",children:e.jsx("p",{children:"We accept all major credit cards and PayPal. Billing is monthly or annual."})})]}),parameters:{controls:{disable:!0},layout:"padded"}};var c,m,u;r.parameters={...r.parameters,docs:{...(c=r.parameters)==null?void 0:c.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
title: 'Card Title',
|
|
4
4
|
subtitle: 'Optional subtitle',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as o,j as t}from"./iframe-
|
|
1
|
+
import{r as o,j as t}from"./iframe-BLM9gPKH.js";import{g as u}from"./index-C8pce-KX.js";import{G as M}from"./iconBase-l6iBLek9.js";import"./preload-helper-C1FmrZbK.js";function U(f){return M({attr:{viewBox:"0 0 24 24"},child:[{tag:"path",attr:{d:"M18.25 15.5a.75.75 0 0 1-.75-.75V7.56L7.28 17.78a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L16.44 6.5H9.25a.75.75 0 0 1 0-1.5h9a.75.75 0 0 1 .75.75v9a.75.75 0 0 1-.75.75Z"},child:[]}]})(f)}const G="_open_87iwp_63",O="_logo_87iwp_71",n={"card-nav-container":"_card-nav-container_87iwp_1","card-nav":"_card-nav_87iwp_1","card-nav-top":"_card-nav-top_87iwp_25","hamburger-menu":"_hamburger-menu_87iwp_38","hamburger-line":"_hamburger-line_87iwp_48",open:G,"logo-container":"_logo-container_87iwp_71",logo:O,"card-nav-cta-button":"_card-nav-cta-button_87iwp_84","card-nav-content":"_card-nav-content_87iwp_101","nav-card":"_nav-card_87iwp_121","nav-card-label":"_nav-card-label_87iwp_134","nav-card-links":"_nav-card-links_87iwp_140","nav-card-link":"_nav-card-link_87iwp_140"},L=({logo:f,logoAlt:$="Logo",items:m,className:N="",ease:b="power3.out",baseColor:k="#fff",menuColor:R,buttonBgColor:j,buttonTextColor:E})=>{const[A,g]=o.useState(!1),[s,_]=o.useState(!1),c=o.useRef(null),p=o.useRef([]),l=o.useRef(null),C=()=>{const e=c.current;if(!e)return 260;if(window.matchMedia("(max-width: 768px)").matches){const a=e.querySelector(".card-nav-content");if(a){const i=a.style.visibility,v=a.style.pointerEvents,S=a.style.position,T=a.style.height;a.style.visibility="visible",a.style.pointerEvents="auto",a.style.position="static",a.style.height="auto",a.offsetHeight;const V=60,q=16,I=a.scrollHeight;return a.style.visibility=i,a.style.pointerEvents=v,a.style.position=S,a.style.height=T,V+I+q}}return 260},h=()=>{const e=c.current;if(!e)return null;u.set(e,{height:60,overflow:"hidden"}),u.set(p.current,{y:50,opacity:0});const r=u.timeline({paused:!0});return r.to(e,{height:C,duration:.4,ease:b}),r.to(p.current,{y:0,opacity:1,duration:.4,ease:b,stagger:.08},"-=0.1"),r};o.useLayoutEffect(()=>{const e=h();return l.current=e,()=>{e==null||e.kill(),l.current=null}},[b,m]),o.useLayoutEffect(()=>{const e=()=>{if(l.current)if(s){const r=C();u.set(c.current,{height:r}),l.current.kill();const a=h();a&&(a.progress(1),l.current=a)}else{l.current.kill();const r=h();r&&(l.current=r)}};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[s]);const D=()=>{const e=l.current;e&&(s?(g(!1),e.eventCallback("onReverseComplete",()=>_(!1)),e.reverse()):(g(!0),_(!0),e.play(0)))},H=e=>r=>{r&&(p.current[e]=r)};return t.jsx("div",{className:`${n["card-nav-container"]} ${N}`,children:t.jsxs("nav",{ref:c,className:`${n["card-nav"]} ${s?n.open:""}`,style:{backgroundColor:k},children:[t.jsxs("div",{className:`${n["card-nav-top"]}`,children:[t.jsxs("div",{className:`${n["hamburger-menu"]} ${A?n.open:""}`,onClick:D,role:"button","aria-label":s?"Close menu":"Open menu",tabIndex:0,style:{color:R||"#000"},children:[t.jsx("div",{className:`${n["hamburger-line"]}`}),t.jsx("div",{className:`${n["hamburger-line"]}`})]}),t.jsx("div",{className:`${n["logo-container"]}`,children:t.jsx("img",{src:f,alt:$,className:`${n.logo}`})}),t.jsx("button",{type:"button",className:`${n["card-nav-cta-button"]}`,style:{backgroundColor:j,color:E},children:"Get Started"})]}),t.jsx("div",{className:`${n["card-nav-content"]}`,"aria-hidden":!s,children:(m||[]).slice(0,3).map((e,r)=>{var a;return t.jsxs("div",{className:`${n["nav-card"]}`,ref:H(r),style:{backgroundColor:e.bgColor,color:e.textColor},children:[t.jsx("div",{className:`${n["nav-card-label"]}`,children:e.label}),t.jsx("div",{className:`${n["nav-card-links"]}`,children:(a=e.links)==null?void 0:a.map((i,v)=>t.jsxs("a",{className:`${n["nav-card-link"]}`,href:i.href,"aria-label":i.ariaLabel,children:[t.jsx(U,{className:"nav-card-link-icon","aria-hidden":"true"}),i.label]},`${i.label}-${v}`))})]},`${e.label}-${r}`)})})]})})};L.__docgenInfo={description:"",methods:[],displayName:"CardNav",props:{logoAlt:{defaultValue:{value:"'Logo'",computed:!1},required:!1},className:{defaultValue:{value:"''",computed:!1},required:!1},ease:{defaultValue:{value:"'power3.out'",computed:!1},required:!1},baseColor:{defaultValue:{value:"'#fff'",computed:!1},required:!1}}};const Z={title:"ReactBits/Components/CardNav",component:L,parameters:{layout:"fullscreen"}},d={args:{logoAlt:"Logo",items:[{label:"Products",bgColor:"#1a1a2e",textColor:"#fff",links:[{label:"Analytics",href:"#",ariaLabel:"Analytics"},{label:"Dashboard",href:"#",ariaLabel:"Dashboard"},{label:"Reports",href:"#",ariaLabel:"Reports"}]},{label:"Resources",bgColor:"#16213e",textColor:"#fff",links:[{label:"Documentation",href:"#",ariaLabel:"Documentation"},{label:"Tutorials",href:"#",ariaLabel:"Tutorials"}]},{label:"Company",bgColor:"#0f3460",textColor:"#fff",links:[{label:"About Us",href:"#",ariaLabel:"About Us"},{label:"Careers",href:"#",ariaLabel:"Careers"},{label:"Contact",href:"#",ariaLabel:"Contact"}]}],ease:"power3.out",baseColor:"#fff"}};var y,w,x;d.parameters={...d.parameters,docs:{...(y=d.parameters)==null?void 0:y.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
logoAlt: 'Logo',
|
|
4
4
|
items: [{
|
package/storybook-static/assets/{Carousel.stories-D3TV54aM.js → Carousel.stories-CVfRELzK.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as c,j as i}from"./iframe-
|
|
1
|
+
import{r as c,j as i}from"./iframe-BLM9gPKH.js";import{G as v}from"./iconBase-l6iBLek9.js";import{u as Y}from"./use-motion-value-CYCvXY5m.js";import{m as k}from"./proxy-BsV6quUP.js";import{u as z}from"./use-transform-CxdHJNbN.js";import"./preload-helper-C1FmrZbK.js";import"./MotionConfigContext-E6BOCyHu.js";function K(e){return v({attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"rect",attr:{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"},child:[]},{tag:"line",attr:{x1:"3",y1:"9",x2:"21",y2:"9"},child:[]},{tag:"line",attr:{x1:"9",y1:"21",x2:"9",y2:"9"},child:[]}]})(e)}function Q(e){return v({attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"polygon",attr:{points:"12 2 2 7 12 12 22 7 12 2"},child:[]},{tag:"polyline",attr:{points:"2 17 12 22 22 17"},child:[]},{tag:"polyline",attr:{points:"2 12 12 17 22 12"},child:[]}]})(e)}function X(e){return v({attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"path",attr:{d:"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"},child:[]},{tag:"polyline",attr:{points:"14 2 14 8 20 8"},child:[]},{tag:"line",attr:{x1:"16",y1:"13",x2:"8",y2:"13"},child:[]},{tag:"line",attr:{x1:"16",y1:"17",x2:"8",y2:"17"},child:[]},{tag:"polyline",attr:{points:"10 9 9 9 8 9"},child:[]}]})(e)}function Z(e){return v({attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"polyline",attr:{points:"16 18 22 12 16 6"},child:[]},{tag:"polyline",attr:{points:"8 6 2 12 8 18"},child:[]}]})(e)}function ee(e){return v({attr:{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"circle",attr:{cx:"12",cy:"12",r:"10"},child:[]}]})(e)}const te="_round_14jni_33",ne="_active_14jni_60",oe="_inactive_14jni_64",n={"carousel-container":"_carousel-container_14jni_1","carousel-track":"_carousel-track_14jni_11","carousel-item":"_carousel-item_14jni_15",round:te,"carousel-item-header":"_carousel-item-header_14jni_47","carousel-indicators-container":"_carousel-indicators-container_14jni_52","carousel-indicator":"_carousel-indicator_14jni_52",active:ne,inactive:oe,"carousel-icon-container":"_carousel-icon-container_14jni_74","carousel-icon":"_carousel-icon_14jni_74","carousel-item-content":"_carousel-item-content_14jni_90","carousel-item-title":"_carousel-item-title_14jni_95","carousel-item-description":"_carousel-item-description_14jni_102","carousel-indicators":"_carousel-indicators_14jni_52"},ie=[{title:"Text Animations",description:"Cool text animations for your projects.",id:1,icon:i.jsx(X,{className:`${n["carousel-icon"]}`})},{title:"Animations",description:"Smooth animations for your projects.",id:2,icon:i.jsx(ee,{className:`${n["carousel-icon"]}`})},{title:"Components",description:"Reusable components for your projects.",id:3,icon:i.jsx(Q,{className:`${n["carousel-icon"]}`})},{title:"Backgrounds",description:"Beautiful backgrounds and patterns for your projects.",id:4,icon:i.jsx(K,{className:`${n["carousel-icon"]}`})},{title:"Common UI",description:"Common UI components are coming soon!",id:5,icon:i.jsx(Z,{className:`${n["carousel-icon"]}`})}],S=0,B=500,T=16,se={type:"spring",stiffness:300,damping:30};function ae({item:e,index:l,itemWidth:g,round:m,trackItemOffset:u,x:s,transition:f}){const N=[-(l+1)*u,-l*u,-(l-1)*u],r=z(s,N,[90,0,-90],{clamp:!1});return i.jsxs(k.div,{className:`${n["carousel-item"]} ${m?n.round:""}`,style:{width:g,height:m?g:"100%",rotateY:r,...m&&{borderRadius:"50%"}},transition:f,children:[i.jsx("div",{className:`${n["carousel-item-header"]} ${m?n.round:""}`,children:i.jsx("span",{className:`${n["carousel-icon-container"]}`,children:e.icon})}),i.jsxs("div",{className:`${n["carousel-item-content"]}`,children:[i.jsx("div",{className:`${n["carousel-item-title"]}`,children:e.title}),i.jsx("p",{className:`${n["carousel-item-description"]}`,children:e.description})]})]},`${(e==null?void 0:e.id)??l}-${l}`)}function V({items:e=ie,baseWidth:l=300,autoplay:g=!1,autoplayDelay:m=3e3,pauseOnHover:u=!1,loop:s=!1,round:f=!1}){const x=l-32,r=x+T,a=c.useMemo(()=>s?e.length===0?[]:[e[e.length-1],...e,e[0]]:e,[e,s]),[d,p]=c.useState(s?1:0),h=Y(0),[L,A]=c.useState(!1),[q,j]=c.useState(!1),[w,_]=c.useState(!1),C=c.useRef(null);c.useEffect(()=>{if(u&&C.current){const o=C.current,t=()=>A(!0),y=()=>A(!1);return o.addEventListener("mouseenter",t),o.addEventListener("mouseleave",y),()=>{o.removeEventListener("mouseenter",t),o.removeEventListener("mouseleave",y)}}},[u]),c.useEffect(()=>{if(!g||a.length<=1||u&&L)return;const o=setInterval(()=>{p(t=>Math.min(t+1,a.length-1))},m);return()=>clearInterval(o)},[g,m,L,u,a.length]),c.useEffect(()=>{const o=s?1:0;p(o),h.set(-o*r)},[e.length,s,r,h]),c.useEffect(()=>{!s&&d>a.length-1&&p(Math.max(0,a.length-1))},[a.length,s,d]);const E=q?{duration:0}:se,P=()=>{_(!0)},U=()=>{if(!s||a.length<=1){_(!1);return}const o=a.length-1;if(d===o){j(!0);const t=1;p(t),h.set(-t*r),requestAnimationFrame(()=>{j(!1),_(!1)});return}if(d===0){j(!0);const t=e.length;p(t),h.set(-t*r),requestAnimationFrame(()=>{j(!1),_(!1)});return}_(!1)},W=(o,t)=>{const{offset:y,velocity:I}=t,R=y.x<-S||I.x<-B?1:y.x>S||I.x>B?-1:0;R!==0&&p(H=>{const O=H+R,J=a.length-1;return Math.max(0,Math.min(O,J))})},G=s?{}:{dragConstraints:{left:-r*Math.max(a.length-1,0),right:0}},F=e.length===0?0:s?(d-1+e.length)%e.length:Math.min(d,e.length-1);return i.jsxs("div",{ref:C,className:`${n["carousel-container"]} ${f?n.round:""}`,style:{width:`${l}px`,...f&&{height:`${l}px`,borderRadius:"50%"}},children:[i.jsx(k.div,{className:`${n["carousel-track"]}`,drag:w?!1:"x",...G,style:{width:x,gap:`${T}px`,perspective:1e3,perspectiveOrigin:`${d*r+x/2}px 50%`,x:h},onDragEnd:W,animate:{x:-(d*r)},transition:E,onAnimationStart:P,onAnimationComplete:U,children:a.map((o,t)=>i.jsx(ae,{item:o,index:t,itemWidth:x,round:f,trackItemOffset:r,x:h,transition:E},`${(o==null?void 0:o.id)??t}-${t}`))}),i.jsx("div",{className:`${n["carousel-indicators-container"]} ${f?n.round:""}`,children:i.jsx("div",{className:`${n["carousel-indicators"]}`,children:e.map((o,t)=>i.jsx(k.div,{className:`${n["carousel-indicator"]} ${F===t?n.active:n.inactive}`,animate:{scale:F===t?1.2:1},onClick:()=>p(s?t+1:t),transition:{duration:.15}},t))})})]})}V.__docgenInfo={description:"",methods:[],displayName:"Carousel",props:{items:{defaultValue:{value:`[
|
|
2
2
|
{
|
|
3
3
|
title: 'Text Animations',
|
|
4
4
|
description: 'Cool text animations for your projects.',
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as i,j as a}from"./iframe-
|
|
1
|
+
import{r as i,j as a}from"./iframe-BLM9gPKH.js";import{u as k}from"./useSound-SuqbUlad.js";const x="_checkboxLabel_kh8g9_1",f="_checkbox_kh8g9_1",g="_checkboxText_kh8g9_92",c={checkboxLabel:x,checkbox:f,checkboxText:g},C=({checked:o,onChange:r,label:s,disabled:h=!1,indeterminate:n=!1,id:l,name:d,value:b,soundConfig:e})=>{const t=i.useRef(null),{playSound:u}=k(e);return i.useEffect(()=>{t.current&&(t.current.indeterminate=n)},[n]),a.jsxs("label",{className:c.checkboxLabel,children:[a.jsx("input",{ref:t,type:"checkbox",checked:o,onChange:m=>{const p=m.target.checked;r(p),(e==null?void 0:e.onClick)!==!1&&u("toggle")},className:c.checkbox,disabled:h,id:l,name:d,value:b,"aria-checked":n?"mixed":o}),s&&a.jsx("span",{className:c.checkboxText,children:s})]})};C.__docgenInfo={description:`Checkbox component - Modern interactive checkbox with animations
|
|
2
2
|
|
|
3
3
|
@component
|
|
4
4
|
@description
|
package/storybook-static/assets/{Checkbox.stories-8znsCJhi.js → Checkbox.stories-DGfYhJ6B.js}
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as g,j as t}from"./iframe-
|
|
1
|
+
import{r as g,j as t}from"./iframe-BLM9gPKH.js";import{C as s}from"./Checkbox-BEMCpJLS.js";import"./preload-helper-C1FmrZbK.js";import"./useSound-SuqbUlad.js";const E={title:"Atoms/Checkbox",component:s,parameters:{layout:"centered",docs:{description:{component:"A simple checkbox component with optional label."}}},tags:["autodocs"],argTypes:{checked:{control:"boolean"},label:{control:"text"},disabled:{control:"boolean"},onChange:{action:"changed"}}},n={args:{checked:!1,label:"Accept terms and conditions",onChange:()=>{}}},c={args:{checked:!1,label:"This option is disabled",disabled:!0,onChange:()=>{}}},i={args:{checked:!1,label:"Multiple checkboxes example",onChange:()=>{}},render:()=>{const[e,a]=g.useState({option1:!1,option2:!0,option3:!1,option4:!1});return t.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"0.5rem"},children:[t.jsx(s,{checked:e.option1,onChange:o=>a({...e,option1:o}),label:"Enable notifications"}),t.jsx(s,{checked:e.option2,onChange:o=>a({...e,option2:o}),label:"Receive marketing emails"}),t.jsx(s,{checked:e.option3,onChange:o=>a({...e,option3:o}),label:"Share usage statistics"}),t.jsx(s,{checked:e.option4,onChange:o=>a({...e,option4:o}),label:"Enable dark mode",disabled:!0})]})},parameters:{controls:{disable:!0}}};var l,r,p;n.parameters={...n.parameters,docs:{...(l=n.parameters)==null?void 0:l.docs,source:{originalSource:`{
|
|
2
2
|
args: {
|
|
3
3
|
checked: false,
|
|
4
4
|
label: 'Accept terms and conditions',
|