@stfrigerio/sito-template 0.1.55 → 0.1.57
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/molecules/Tabs/Tabs.stories.d.ts +1 -3
- package/dist/components/molecules/Tabs/Tabs.stories.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/Calendar.d.ts +7 -1
- package/dist/components/organisms/Calendar/Calendar.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/Calendar.stories.d.ts +16 -16
- package/dist/components/organisms/Calendar/Calendar.stories.d.ts.map +1 -1
- package/dist/components/organisms/Calendar/DayEventCard.d.ts +14 -0
- package/dist/components/organisms/Calendar/DayEventCard.d.ts.map +1 -0
- package/dist/index.esm.js +256 -201
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +254 -199
- 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-Cb8HvABR.js → ASCIIText.stories-LbmvFzzv.js} +1 -1
- package/storybook-static/assets/{AllAtoms.stories-Disxvghm.js → AllAtoms.stories-CLunFOjI.js} +1 -1
- package/storybook-static/assets/{AnimatedContent.stories-jVAgBFE2.js → AnimatedContent.stories-B8hBaVkK.js} +1 -1
- package/storybook-static/assets/{AnimatedList.stories-Di-vE601.js → AnimatedList.stories-D8a9eYqH.js} +1 -1
- package/storybook-static/assets/{Antigravity.stories-CE90HCpY.js → Antigravity.stories-D_mJbWK0.js} +1 -1
- package/storybook-static/assets/{ArrayInput.stories-DgSsXJly.js → ArrayInput.stories-Cshz2s-a.js} +1 -1
- package/storybook-static/assets/{Aurora.stories-DrVAkdjt.js → Aurora.stories-BN4MataE.js} +1 -1
- package/storybook-static/assets/{Beams.stories-BSVIpqQ0.js → Beams.stories-CCtZOw8G.js} +1 -1
- package/storybook-static/assets/{BlobCursor.stories-C3EgjAh2.js → BlobCursor.stories-CdB55R5G.js} +1 -1
- package/storybook-static/assets/{BlurText.stories-DJVDRdFo.js → BlurText.stories-Bg2Ih2Je.js} +1 -1
- package/storybook-static/assets/{BooleansHeatmap.stories-B_9cPYMM.js → BooleansHeatmap.stories-CpNxqSED.js} +1 -1
- package/storybook-static/assets/{BorderGlow.stories-B_wdQUgw.js → BorderGlow.stories-CUxbrsvW.js} +1 -1
- package/storybook-static/assets/{BubbleMenu.stories-DpLYYw_z.js → BubbleMenu.stories-DuVDLBsV.js} +1 -1
- package/storybook-static/assets/{Button-DK4vPDdE.js → Button-CQGdvhpN.js} +1 -1
- package/storybook-static/assets/Button.stories-D8Xx3I9p.js +88 -0
- package/storybook-static/assets/Calendar-tbpzwSIm.css +1 -0
- package/storybook-static/assets/Calendar.stories-Cx2JEddO.js +229 -0
- package/storybook-static/assets/{Card--7bShmQv.js → Card-DNp-cUnt.js} +1 -1
- package/storybook-static/assets/{Card.stories-C9cPoCVI.js → Card.stories-D1f1NTVU.js} +1 -1
- package/storybook-static/assets/{CardNav.stories-1WFeombk.js → CardNav.stories-Cd4zEw8p.js} +1 -1
- package/storybook-static/assets/{Carousel.stories-CPp1bcnx.js → Carousel.stories-BxbGwXE5.js} +1 -1
- package/storybook-static/assets/{Checkbox-BZ4OK19r.js → Checkbox-Dw8W2w74.js} +1 -1
- package/storybook-static/assets/{Checkbox.stories-pzFmZn7E.js → Checkbox.stories-BwsnN3CP.js} +1 -1
- package/storybook-static/assets/{ChromaGrid.stories-Nunq8QCK.js → ChromaGrid.stories-DBHYiDPV.js} +1 -1
- package/storybook-static/assets/{CircularGallery.stories-C6B3QdGe.js → CircularGallery.stories-TJN6o_RG.js} +1 -1
- package/storybook-static/assets/{CircularText.stories-x-CZkrWE.js → CircularText.stories-rNjRUNn2.js} +1 -1
- package/storybook-static/assets/{ClickSpark.stories-BgEy72nd.js → ClickSpark.stories-BfqByoGe.js} +1 -1
- package/storybook-static/assets/{Color-AVL7NMMY-BH2T5gYv.js → Color-AVL7NMMY-CoWQkAiP.js} +1 -1
- package/storybook-static/assets/{ColorBends.stories-l5hP9mw3.js → ColorBends.stories-IEMOWAyf.js} +1 -1
- package/storybook-static/assets/{CountUp.stories-f4Xo5-1D.js → CountUp.stories-DXPrKAQb.js} +1 -1
- package/storybook-static/assets/{Counter.stories-Cq0esRYp.js → Counter.stories-DMdecsw_.js} +1 -1
- package/storybook-static/assets/{Crosshair.stories-cmjX8jB1.js → Crosshair.stories-CYzDxRSn.js} +1 -1
- package/storybook-static/assets/{Cubes.stories-Deum-zPK.js → Cubes.stories-Drq4ULo3.js} +1 -1
- package/storybook-static/assets/{CurvedLoop.stories-CaRb6vtE.js → CurvedLoop.stories-C9GMKnIw.js} +1 -1
- package/storybook-static/assets/{DarkVeil.stories-DtKNrEKT.js → DarkVeil.stories-BtLNfEH8.js} +1 -1
- package/storybook-static/assets/{DateInput-Dhe5jlzS.js → DateInput-CW4PsZAQ.js} +1 -1
- package/storybook-static/assets/{DateInput.stories-tMfHI-jT.js → DateInput.stories-d46zYiZA.js} +1 -1
- package/storybook-static/assets/{DecayCard.stories-DOejb79q.js → DecayCard.stories-CAU_wTc7.js} +1 -1
- package/storybook-static/assets/{DecryptedText.stories-ZJFOqvcs.js → DecryptedText.stories-Dvba9C1V.js} +1 -1
- package/storybook-static/assets/{Dither.stories-BteQ8qaz.js → Dither.stories-B5KfMprl.js} +1 -1
- package/storybook-static/assets/{Dock.stories-CjgGmbrT.js → Dock.stories-oyQGRzlM.js} +1 -1
- package/storybook-static/assets/{DocsRenderer-PQXLIZUC-CDqlUQhE.js → DocsRenderer-PQXLIZUC-C2AYT361.js} +4 -4
- package/storybook-static/assets/{EditFAB.stories-HiEYPWDM.js → EditFAB.stories-DvtpW34v.js} +1 -1
- package/storybook-static/assets/{EvilEye.stories-Dh40voJH.js → EvilEye.stories-C1820-DG.js} +1 -1
- package/storybook-static/assets/{FadeContent.stories-APJ9w9po.js → FadeContent.stories-B4z_JRy9.js} +1 -1
- package/storybook-static/assets/{FaultyTerminal.stories-B1QU0me7.js → FaultyTerminal.stories-DmkguJql.js} +1 -1
- package/storybook-static/assets/{Fbo-C7_12zi1.js → Fbo-CTQm-4Bw.js} +1 -1
- package/storybook-static/assets/{FloatingLines.stories-BoZu0Eil.js → FloatingLines.stories-CQvqKSpH.js} +1 -1
- package/storybook-static/assets/{FlowingMenu.stories-CIsIyO9J.js → FlowingMenu.stories-DmOspv0B.js} +1 -1
- package/storybook-static/assets/{FluidGlass.stories-vH3qnmEk.js → FluidGlass.stories-CZSqxrNt.js} +1 -1
- package/storybook-static/assets/{Folder.stories-HkOOEOjb.js → Folder.stories-7vb52Lfi.js} +1 -1
- package/storybook-static/assets/{FuzzyText.stories-By8q6YQt.js → FuzzyText.stories-BdXN4VK1.js} +1 -1
- package/storybook-static/assets/{Galaxy.stories-07G7jp_6.js → Galaxy.stories-BhT1GZh5.js} +1 -1
- package/storybook-static/assets/{GhostCursor.stories-BC-trpJu.js → GhostCursor.stories-DkXqCjE9.js} +1 -1
- package/storybook-static/assets/{GlareHover.stories-B_MjE5aX.js → GlareHover.stories-CznX3yTV.js} +1 -1
- package/storybook-static/assets/{GlassSurface.stories-rPXwGZOW.js → GlassSurface.stories-BnwwYK95.js} +1 -1
- package/storybook-static/assets/{GlitchText.stories-BN308waP.js → GlitchText.stories-CVcTBUVS.js} +1 -1
- package/storybook-static/assets/{GooeyNav.stories-C5lqZx3I.js → GooeyNav.stories-C0abTHBc.js} +1 -1
- package/storybook-static/assets/{GradientBlinds.stories-D9l7Ayxs.js → GradientBlinds.stories-CpSguKtv.js} +1 -1
- package/storybook-static/assets/{GradientText.stories-BiDAn88F.js → GradientText.stories-B4hMx13h.js} +1 -1
- package/storybook-static/assets/{Grainient.stories-CSCcWH0M.js → Grainient.stories-5EakpvU2.js} +1 -1
- package/storybook-static/assets/{GridMotion.stories-heG3R9uG.js → GridMotion.stories-Bm3DD7cb.js} +1 -1
- package/storybook-static/assets/{ImageSlideshow.stories-RDcrjCte.js → ImageSlideshow.stories-BasuECRV.js} +1 -1
- package/storybook-static/assets/{Iridescence.stories-iJ26He9j.js → Iridescence.stories-Cykk3hHZ.js} +1 -1
- package/storybook-static/assets/{LaserFlow.stories-H_kwxAaY.js → LaserFlow.stories-CfiM4ZZ5.js} +1 -1
- package/storybook-static/assets/{LetterGlitch.stories-BY9P1wPN.js → LetterGlitch.stories-BXb7iSeX.js} +1 -1
- package/storybook-static/assets/{LightPillar.stories-Bb4DN5XV.js → LightPillar.stories-CwI-8_BF.js} +1 -1
- package/storybook-static/assets/{LightRays.stories-Cc6Y1X_k.js → LightRays.stories-BIIfv6Ky.js} +1 -1
- package/storybook-static/assets/{Lightning.stories-CpSHxlp7.js → Lightning.stories-B8GNkzSN.js} +1 -1
- package/storybook-static/assets/{LineWaves.stories-COm5OuGf.js → LineWaves.stories-CjxdD_yt.js} +1 -1
- package/storybook-static/assets/{LiquidChrome.stories-C88ONVOT.js → LiquidChrome.stories-G7bVFJM9.js} +1 -1
- package/storybook-static/assets/{LiquidEther.stories-CPSMWSN9.js → LiquidEther.stories-C8n27zuA.js} +1 -1
- package/storybook-static/assets/{LoadingSpinner-C4MXlRnC.js → LoadingSpinner-Br8TYFlF.js} +1 -1
- package/storybook-static/assets/{LoadingSpinner.stories-CCyN9n1T.js → LoadingSpinner.stories-Dj0bMFhR.js} +1 -1
- package/storybook-static/assets/{MagicRings.stories-NQSwG8Yn.js → MagicRings.stories-D50m_2UF.js} +1 -1
- package/storybook-static/assets/{Magnet.stories-BAwXSJEW.js → Magnet.stories-BP9fjpzP.js} +1 -1
- package/storybook-static/assets/{MagnetLines.stories-CJqMXg51.js → MagnetLines.stories-DvbytV0Y.js} +1 -1
- package/storybook-static/assets/{Masonry.stories-DAl8CRm6.js → Masonry.stories-xXYQw2uD.js} +1 -1
- package/storybook-static/assets/{MetaBalls.stories-BY7Ilvw5.js → MetaBalls.stories-DKD3gVUH.js} +1 -1
- package/storybook-static/assets/{MetallicPaint.stories-iuclFGy4.js → MetallicPaint.stories-Bz-uS-L_.js} +1 -1
- package/storybook-static/assets/{MoodChart.stories-T8Td91vu.js → MoodChart.stories-Bk0jtB4g.js} +1 -1
- package/storybook-static/assets/{MotionConfigContext-D_4LMwJ5.js → MotionConfigContext-D5hZdVGx.js} +1 -1
- package/storybook-static/assets/{Navbar.stories-SRGoJhYx.js → Navbar.stories-Dos3kovt.js} +14 -19
- package/storybook-static/assets/{Noise.stories-B5_Jt1t3.js → Noise.stories-D6C6-k8-.js} +1 -1
- package/storybook-static/assets/{NumberStepper-BaK5ZScA.js → NumberStepper--0cJcLNZ.js} +1 -1
- package/storybook-static/assets/{NumberStepper.stories-BZIrFbrQ.js → NumberStepper.stories-BvFwBEjt.js} +1 -1
- package/storybook-static/assets/{Orb.stories-Ci1HMLUW.js → Orb.stories-CS__2PJW.js} +1 -1
- package/storybook-static/assets/OrbitImages.stories-CcaelcY5.js +26 -0
- package/storybook-static/assets/{PieChart.stories-ByRTgKp3.js → PieChart.stories-XZqxh_GW.js} +1 -1
- package/storybook-static/assets/{PixelBlast.stories-C83D_GSk.js → PixelBlast.stories-CyK8BxPq.js} +1 -1
- package/storybook-static/assets/{PixelCard.stories-B8DdUCQe.js → PixelCard.stories-D_Og1Eve.js} +1 -1
- package/storybook-static/assets/{PixelSnow.stories-BOHNVU80.js → PixelSnow.stories-CoCZucVV.js} +1 -1
- package/storybook-static/assets/{PixelTransition.stories-D8VH3ukb.js → PixelTransition.stories-DmVJ4jdu.js} +1 -1
- package/storybook-static/assets/{Plasma.stories-CatIdRAD.js → Plasma.stories-DUqrW-qq.js} +1 -1
- package/storybook-static/assets/{Prism.stories-Bg6GLExD.js → Prism.stories-DWdVDcBG.js} +1 -1
- package/storybook-static/assets/{PrismaticBurst.stories-BNdrAv89.js → PrismaticBurst.stories-BEVYTjXo.js} +1 -1
- package/storybook-static/assets/{ProfileCard.stories-CyaTrCeK.js → ProfileCard.stories-CAoKQpAZ.js} +1 -1
- package/storybook-static/assets/{QuantifiableHabitsChart.stories-C86yjHJm.js → QuantifiableHabitsChart.stories-CMexb5Ij.js} +1 -1
- package/storybook-static/assets/{Radar.stories-CvzRcw-C.js → Radar.stories-Dcjnm9Bu.js} +1 -1
- package/storybook-static/assets/{Ribbons.stories-BRX9ZoeY.js → Ribbons.stories-Cs3Eg2Gz.js} +1 -1
- package/storybook-static/assets/{RippleGrid.stories-vnV8CCtp.js → RippleGrid.stories-QV9Doq9P.js} +1 -1
- package/storybook-static/assets/{RotatingText.stories-B8GsJWaC.js → RotatingText.stories-DkntoAXJ.js} +1 -1
- package/storybook-static/assets/{ScrollFloat.stories-DOlmhv7e.js → ScrollFloat.stories-BaX43Ike.js} +1 -1
- package/storybook-static/assets/{ScrollReveal.stories-Bm9KxbWm.js → ScrollReveal.stories-C2IWpLpI.js} +1 -1
- package/storybook-static/assets/ScrollVelocity.stories-LaYJ5WQN.js +9 -0
- package/storybook-static/assets/{SearchBar.stories-CfIOeCyX.js → SearchBar.stories-CGaj__zF.js} +1 -1
- package/storybook-static/assets/{SearchableDropdown--EWJF18v.js → SearchableDropdown-4HgWY0Ck.js} +1 -1
- package/storybook-static/assets/{SearchableDropdown.stories-B9KNxfZm.js → SearchableDropdown.stories-CfeFR5Rk.js} +1 -1
- package/storybook-static/assets/{SelectInput-CFM_N8VG.js → SelectInput-DvSeeIw5.js} +1 -1
- package/storybook-static/assets/{SelectInput.stories-D_5G5-0N.js → SelectInput.stories-DByYKCGI.js} +1 -1
- package/storybook-static/assets/{ShapeBlur.stories-DNg_BI9n.js → ShapeBlur.stories-ZQV0yHkn.js} +1 -1
- package/storybook-static/assets/{ShapeGrid.stories-D6mhsKbm.js → ShapeGrid.stories-G_tZAcp9.js} +1 -1
- package/storybook-static/assets/{ShinyText.stories-NtVkUqNB.js → ShinyText.stories-C6BrLI0x.js} +1 -1
- package/storybook-static/assets/{Silk.stories-BACMGa6I.js → Silk.stories-BpsR4txJ.js} +1 -1
- package/storybook-static/assets/{SleepChart.stories-S6pSldWo.js → SleepChart.stories-DcoBwiEm.js} +1 -1
- package/storybook-static/assets/{Slider-dqb2UNTZ.js → Slider-3iog5_du.js} +1 -1
- package/storybook-static/assets/{Slider.stories-4UkeTwoz.js → Slider.stories-C8eUZ7Ne.js} +1 -1
- package/storybook-static/assets/{SoftAurora.stories-DH8d39VG.js → SoftAurora.stories--Rcyqxiu.js} +1 -1
- package/storybook-static/assets/{SoundDemo.stories-Ci_Q1qDO.js → SoundDemo.stories-DvhKS2Fi.js} +1 -1
- package/storybook-static/assets/{SplashCursor.stories-BMBbSrDn.js → SplashCursor.stories-FzRIUaX9.js} +1 -1
- package/storybook-static/assets/{SpotlightCard.stories-Cy3mgAFZ.js → SpotlightCard.stories-CifqsSUc.js} +1 -1
- package/storybook-static/assets/{Stack.stories-C_qFRAvS.js → Stack.stories-Dq82x0TG.js} +1 -1
- package/storybook-static/assets/{StaggeredMenu.stories-BeqjTXCs.js → StaggeredMenu.stories-CsiTDJGG.js} +1 -1
- package/storybook-static/assets/{StarBorder.stories-BeLKjLZu.js → StarBorder.stories-Ba14_TPk.js} +1 -1
- package/storybook-static/assets/{SunburstChart.stories-DN8EQLMh.js → SunburstChart.stories-fREzDXM9.js} +1 -1
- package/storybook-static/assets/{Table.stories-BJ6FcfdD.js → Table.stories-CXsQAQrR.js} +1 -1
- package/storybook-static/assets/Tabs-D5ZPN7MM.css +1 -0
- package/storybook-static/assets/Tabs.stories-HeiG8gYN.js +37 -0
- package/storybook-static/assets/{TargetCursor.stories-CfxWRalc.js → TargetCursor.stories-B16pWZaP.js} +1 -1
- package/storybook-static/assets/{TextArea-DGywTJLt.js → TextArea-DKx3k6hV.js} +1 -1
- package/storybook-static/assets/{TextArea.stories-B-uYOZs4.js → TextArea.stories-Bpqlv7j5.js} +1 -1
- package/storybook-static/assets/{TextCursor.stories-61sj2bl9.js → TextCursor.stories-CY2eIn6Z.js} +1 -1
- package/storybook-static/assets/{TextInput-CiI38oLt.js → TextInput-CLyTHgK9.js} +1 -1
- package/storybook-static/assets/{TextInput.stories-DtG6MQod.js → TextInput.stories-BP1LSkLG.js} +1 -1
- package/storybook-static/assets/{TextPressure.stories-C1h8GiS8.js → TextPressure.stories-sH-cgdL2.js} +1 -1
- package/storybook-static/assets/{TextType.stories-BfUDVoY_.js → TextType.stories-B7Oy3P9u.js} +1 -1
- package/storybook-static/assets/{ThemeSwitcher.stories-gBLrYosz.js → ThemeSwitcher.stories-Bj0YQKM5.js} +1 -1
- package/storybook-static/assets/{Threads.stories-sZxNqPXX.js → Threads.stories-e52ErKbM.js} +1 -1
- package/storybook-static/assets/{TimeInput.stories-CjvGCAgd.js → TimeInput.stories-Cd28zwwR.js} +1 -1
- package/storybook-static/assets/{Toggle-DwTHl9Fm.js → Toggle-BntWdyUe.js} +1 -1
- package/storybook-static/assets/{Toggle.stories-DU0Scugu.js → Toggle.stories-DtqFmh3E.js} +1 -1
- package/storybook-static/assets/{ToggleButton-s2aFLlgS.js → ToggleButton-BQqJdlB_.js} +1 -1
- package/storybook-static/assets/{ToggleButton.stories-DgSqo96g.js → ToggleButton.stories-DkN_4qpp.js} +1 -1
- package/storybook-static/assets/{TrueFocus.stories-CuqOvqGj.js → TrueFocus.stories-wm4VXWCk.js} +1 -1
- package/storybook-static/assets/{VariableProximity.stories-CWLeFmxb.js → VariableProximity.stories-BNSYs_rC.js} +1 -1
- package/storybook-static/assets/{Waves.stories-zeyoHm5S.js → Waves.stories-Ce2ZJFsV.js} +1 -1
- package/storybook-static/assets/{check-7O6ar4SG.js → check-Cty-Z1Ib.js} +1 -1
- package/storybook-static/assets/{chevron-down-BC5Z9HYA.js → chevron-down-OhqRl4eJ.js} +1 -1
- package/storybook-static/assets/{chevron-right-CDwij0IV.js → chevron-right-CZm4bArI.js} +1 -1
- package/storybook-static/assets/client-0pKYCVHx.js +1 -0
- package/storybook-static/assets/{createLucideIcon-yjHXhSOm.js → createLucideIcon-BNUG5osq.js} +1 -1
- package/storybook-static/assets/{folder-CATSGh42.js → folder-BjriMpXc.js} +1 -1
- package/storybook-static/assets/{iconBase-D_x0Veg_.js → iconBase-DmcmY1l-.js} +1 -1
- package/storybook-static/assets/{iframe-LZvJb0BS.js → iframe-B8pH-Lvr.js} +5 -5
- package/storybook-static/assets/index-BN99WpBo.js +1 -0
- package/storybook-static/assets/{index-vc18hLoj.js → index-DBfrIdYd.js} +1 -1
- package/storybook-static/assets/{index-D9mC-cEf.js → index-PY_vM88c.js} +1 -1
- package/storybook-static/assets/{index-DSYnL-zq.js → index-bi5z6E3I.js} +1 -1
- package/storybook-static/assets/{layout-grid-Dyvnjtf9.js → layout-grid-TssXYNzv.js} +1 -1
- package/storybook-static/assets/{proxy-94dt0K2Y.js → proxy-BA3VZtN5.js} +1 -1
- package/storybook-static/assets/{react-18-C-ERT8YQ.js → react-18-7dGub68c.js} +1 -1
- package/storybook-static/assets/{react-three-fiber.esm-D_o7ZgN9.js → react-three-fiber.esm-DI-wNJmP.js} +1 -1
- package/storybook-static/assets/{search-BVmOcKZi.js → search-2YqBkJlG.js} +1 -1
- package/storybook-static/assets/settings-DvzICcFU.js +6 -0
- package/storybook-static/assets/{sun-s1P_-p6e.js → sun-DgDhCM_S.js} +1 -1
- package/storybook-static/assets/trash-2-BwI5jvsn.js +6 -0
- package/storybook-static/assets/{use-animation-frame-04H3dRpD.js → use-animation-frame-CF42h0i5.js} +1 -1
- package/storybook-static/assets/{use-in-view--MCxH20O.js → use-in-view-Zn8evg3J.js} +1 -1
- package/storybook-static/assets/{use-motion-value-Cic9xvrL.js → use-motion-value--XhiA2Gt.js} +1 -1
- package/storybook-static/assets/{use-spring-D4LsSJyy.js → use-spring-CrWzlBMd.js} +1 -1
- package/storybook-static/assets/use-transform-vyDqMhf-.js +1 -0
- package/storybook-static/assets/{useSound-Dc8S51xy.js → useSound-Bk2W5gkV.js} +1 -1
- package/storybook-static/assets/{users-DmRtN79P.js → users-aNPxMiig.js} +1 -1
- package/storybook-static/assets/{x-C7Ulr4p2.js → x-BC8LCdn9.js} +1 -1
- package/storybook-static/iframe.html +1 -1
- package/storybook-static/index.json +1 -1
- package/storybook-static/project.json +1 -1
- package/storybook-static/assets/Button.stories-dpSafIdz.js +0 -93
- package/storybook-static/assets/Calendar-CreieAui.css +0 -1
- package/storybook-static/assets/Calendar.stories-lRbXwh4f.js +0 -470
- package/storybook-static/assets/OrbitImages.stories-Bzf1HUks.js +0 -26
- package/storybook-static/assets/ScrollVelocity.stories-De4s_pOX.js +0 -9
- package/storybook-static/assets/Tabs-CLXu7F99.css +0 -1
- package/storybook-static/assets/Tabs.stories-7-b1PtWp.js +0 -64
- package/storybook-static/assets/client-C--dgtnn.js +0 -1
- package/storybook-static/assets/use-transform-D1fwdMmS.js +0 -1
package/dist/index.esm.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import { motion, AnimatePresence, LayoutGroup } from 'framer-motion';
|
|
2
|
+
import { motion, AnimatePresence, useMotionValue, useTransform, animate, LayoutGroup } from 'framer-motion';
|
|
3
3
|
import React, { useRef, useEffect, useCallback, useState, createContext, useContext, useMemo, memo } from 'react';
|
|
4
4
|
import { createPortal } from 'react-dom';
|
|
5
|
-
import { X, Calendar as Calendar$1, ChevronDown, Search, Check, Edit, Folder, Users, Book, MessageSquare, UserPlus, Clock, Sun, Moon, Info, Github, SquareKanban, ChevronRight, Plus, Menu, ChevronLeft, Maximize, Download, Share2, Pause, Play } from 'lucide-react';
|
|
5
|
+
import { X, Calendar as Calendar$1, ChevronDown, Search, Check, Edit, Folder, Users, Book, MessageSquare, UserPlus, Clock, Sun, Moon, Info, Github, SquareKanban, ChevronRight, Plus, Trash2, GripVertical, Pencil, Menu, ChevronLeft, Maximize, Download, Share2, Pause, Play } from 'lucide-react';
|
|
6
6
|
import * as d3 from 'd3';
|
|
7
7
|
|
|
8
|
-
var styles$
|
|
8
|
+
var styles$A = {"button":"Button-module_button__c6nkW","primary":"Button-module_primary__pMqAs","secondary":"Button-module_secondary__mBWx9","outline":"Button-module_outline__NGGGN","ghost":"Button-module_ghost__u2QBF","danger":"Button-module_danger__2ewhr","small":"Button-module_small__ZI9RX","medium":"Button-module_medium__Wnf9t","large":"Button-module_large__cQCpA","fullWidth":"Button-module_fullWidth__N8vYg","loading":"Button-module_loading__hcSI4","spinner":"Button-module_spinner__HtM96","spin":"Button-module_spin__jblrj","iconLeft":"Button-module_iconLeft__Fpz-y","iconRight":"Button-module_iconRight__kTfjS"};
|
|
9
9
|
|
|
10
10
|
const SOUND_PACKS = {
|
|
11
11
|
digital: {
|
|
@@ -570,11 +570,11 @@ function useComponentSound(config, options) {
|
|
|
570
570
|
const Button = ({ variant = 'primary', size = 'medium', fullWidth = false, loading = false, iconLeft, iconRight, children, className = '', disabled, motionProps, soundConfig, onClick, onMouseEnter, onFocus, ...rest }) => {
|
|
571
571
|
const { handlers } = useComponentSound(soundConfig);
|
|
572
572
|
const buttonClasses = [
|
|
573
|
-
styles$
|
|
574
|
-
styles$
|
|
575
|
-
styles$
|
|
576
|
-
fullWidth && styles$
|
|
577
|
-
loading && styles$
|
|
573
|
+
styles$A.button,
|
|
574
|
+
styles$A[variant],
|
|
575
|
+
styles$A[size],
|
|
576
|
+
fullWidth && styles$A.fullWidth,
|
|
577
|
+
loading && styles$A.loading,
|
|
578
578
|
className
|
|
579
579
|
].filter(Boolean).join(' ');
|
|
580
580
|
const handleClick = (e) => {
|
|
@@ -585,10 +585,10 @@ const Button = ({ variant = 'primary', size = 'medium', fullWidth = false, loadi
|
|
|
585
585
|
handlers.onMouseEnter?.();
|
|
586
586
|
onMouseEnter?.(e);
|
|
587
587
|
};
|
|
588
|
-
return (jsxs(motion.button, { className: buttonClasses, disabled: disabled || loading, whileHover: { scale: disabled || loading ? 1 : 1.02 }, whileTap: { scale: disabled || loading ? 1 : 0.98 }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: handleClick, onMouseEnter: handleMouseEnter, onFocus: onFocus, ...motionProps, ...rest, children: [loading && jsx("span", { className: styles$
|
|
588
|
+
return (jsxs(motion.button, { className: buttonClasses, disabled: disabled || loading, whileHover: { scale: disabled || loading ? 1 : 1.02 }, whileTap: { scale: disabled || loading ? 1 : 0.98 }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: handleClick, onMouseEnter: handleMouseEnter, onFocus: onFocus, ...motionProps, ...rest, children: [loading && jsx("span", { className: styles$A.spinner }), iconLeft && jsx("span", { className: styles$A.iconLeft, children: iconLeft }), children, iconRight && jsx("span", { className: styles$A.iconRight, children: iconRight })] }));
|
|
589
589
|
};
|
|
590
590
|
|
|
591
|
-
var styles$
|
|
591
|
+
var styles$z = {"card":"Card-module_card__r2DB2","hoverable":"Card-module_hoverable__X3OpS","elevated":"Card-module_elevated__hGV6-","outlined":"Card-module_outlined__ngRag","flat":"Card-module_flat__xy-xt","glass":"Card-module_glass__Sv-Vs","imageContainer":"Card-module_imageContainer__L4ma6","image":"Card-module_image__bQBt6","header":"Card-module_header__0dtj3","headerContent":"Card-module_headerContent__W7-jD","expandButton":"Card-module_expandButton__I7f49","expandIcon":"Card-module_expandIcon__Lu-OY","expandableContent":"Card-module_expandableContent__BFgO5","expandable":"Card-module_expandable__GMXzo","body":"Card-module_body__K7eL3","footer":"Card-module_footer__L5wO-","title":"Card-module_title__pW9g8","subtitle":"Card-module_subtitle__gejH4","clickable":"Card-module_clickable__Y6fm8","padding":"Card-module_padding__wtyDo","noPadding":"Card-module_noPadding__r5Qq0","loading":"Card-module_loading__S4Wng","loadingShimmer":"Card-module_loadingShimmer__Q1Osr","loadingPulse":"Card-module_loadingPulse__bXQmC"};
|
|
592
592
|
|
|
593
593
|
/**
|
|
594
594
|
* Card Component
|
|
@@ -653,28 +653,28 @@ const Card = ({ variant = 'elevated', hoverable = false, clickable = false, padd
|
|
|
653
653
|
onExpandChange?.(newExpanded);
|
|
654
654
|
};
|
|
655
655
|
const cardClasses = [
|
|
656
|
-
styles$
|
|
657
|
-
styles$
|
|
658
|
-
hoverable && styles$
|
|
659
|
-
clickable && styles$
|
|
660
|
-
!padding && styles$
|
|
661
|
-
expandable && styles$
|
|
656
|
+
styles$z.card,
|
|
657
|
+
styles$z[variant],
|
|
658
|
+
hoverable && styles$z.hoverable,
|
|
659
|
+
clickable && styles$z.clickable,
|
|
660
|
+
!padding && styles$z.noPadding,
|
|
661
|
+
expandable && styles$z.expandable,
|
|
662
662
|
className
|
|
663
663
|
].filter(Boolean).join(' ');
|
|
664
664
|
const renderHeader = () => {
|
|
665
665
|
if (header) {
|
|
666
|
-
return (jsxs("div", { className: styles$
|
|
666
|
+
return (jsxs("div", { className: styles$z.header, children: [jsx("div", { className: styles$z.headerContent, children: header }), expandable && (jsx("button", { className: styles$z.expandButton, onClick: handleToggleExpand, "aria-label": isExpanded ? 'Collapse card' : 'Expand card', children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: styles$z.expandIcon, style: { transform: isExpanded ? 'rotate(180deg)' : 'rotate(0deg)' }, children: jsx("path", { d: "M6 9l6 6 6-6" }) }) }))] }));
|
|
667
667
|
}
|
|
668
668
|
if (title || subtitle) {
|
|
669
|
-
return (jsxs("div", { className: styles$
|
|
669
|
+
return (jsxs("div", { className: styles$z.header, children: [jsxs("div", { className: styles$z.headerContent, children: [title && jsx("h3", { className: styles$z.title, children: title }), subtitle && jsx("p", { className: styles$z.subtitle, children: subtitle })] }), expandable && (jsx("button", { className: styles$z.expandButton, onClick: handleToggleExpand, "aria-label": isExpanded ? 'Collapse card' : 'Expand card', children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: styles$z.expandIcon, style: { transform: isExpanded ? 'rotate(180deg)' : 'rotate(0deg)' }, children: jsx("path", { d: "M6 9l6 6 6-6" }) }) }))] }));
|
|
670
670
|
}
|
|
671
671
|
return null;
|
|
672
672
|
};
|
|
673
|
-
const cardContent = (jsxs(Fragment, { children: [image && (jsx("div", { className: styles$
|
|
673
|
+
const cardContent = (jsxs(Fragment, { children: [image && (jsx("div", { className: styles$z.imageContainer, children: jsx("img", { src: image, alt: imageAlt, className: styles$z.image }) })), renderHeader(), jsx(AnimatePresence, { initial: false, children: (!expandable || isExpanded) && (jsxs(motion.div, { initial: expandable ? { height: 0, opacity: 0 } : undefined, animate: expandable ? { height: 'auto', opacity: 1 } : undefined, exit: expandable ? { height: 0, opacity: 0 } : undefined, transition: { duration: 0.3, ease: "easeInOut" }, className: styles$z.expandableContent, children: [children && (jsx("div", { className: padding ? styles$z.body : undefined, children: children })), footer && jsx("div", { className: styles$z.footer, children: footer })] }, "content")) })] }));
|
|
674
674
|
return (jsx(motion.div, { className: cardClasses, onClick: clickable ? onClick : undefined, whileHover: hoverable ? { y: -4 } : undefined, transition: { type: "spring", stiffness: 400, damping: 17 }, ...motionProps, ...rest, children: cardContent }));
|
|
675
675
|
};
|
|
676
676
|
|
|
677
|
-
var styles$
|
|
677
|
+
var styles$y = {"wrapper":"EmptyState-module_wrapper__h3Y2E","compact":"EmptyState-module_compact__HdYu1","default":"EmptyState-module_default__ACAbn","large":"EmptyState-module_large__H3ELo","icon":"EmptyState-module_icon__i7-3M","title":"EmptyState-module_title__xCyfH","message":"EmptyState-module_message__Bc5xK","action":"EmptyState-module_action__UpnvZ"};
|
|
678
678
|
|
|
679
679
|
/**
|
|
680
680
|
* EmptyState Component
|
|
@@ -711,11 +711,11 @@ var styles$x = {"wrapper":"EmptyState-module_wrapper__h3Y2E","compact":"EmptySta
|
|
|
711
711
|
* @returns {JSX.Element} The rendered EmptyState component
|
|
712
712
|
*/
|
|
713
713
|
const EmptyState = ({ icon, title, message, action, size = 'default', }) => {
|
|
714
|
-
const wrapperClass = [styles$
|
|
715
|
-
return (jsxs("div", { className: wrapperClass, children: [icon && jsx("div", { className: styles$
|
|
714
|
+
const wrapperClass = [styles$y.wrapper, styles$y[size]].filter(Boolean).join(' ');
|
|
715
|
+
return (jsxs("div", { className: wrapperClass, children: [icon && jsx("div", { className: styles$y.icon, children: icon }), title && jsx("h3", { className: styles$y.title, children: title }), jsx("p", { className: styles$y.message, children: message }), action && jsx("div", { className: styles$y.action, children: action })] }));
|
|
716
716
|
};
|
|
717
717
|
|
|
718
|
-
var styles$
|
|
718
|
+
var styles$x = {"backdrop":"Modal-module_backdrop__yOx-a","dialog":"Modal-module_dialog__yEXTq","dialogCompact":"Modal-module_dialogCompact__z1Wxp","dialogWide":"Modal-module_dialogWide__9PTXK","header":"Modal-module_header__NHHKd","title":"Modal-module_title__i3R0x","headerActions":"Modal-module_headerActions__g28UN","closeButton":"Modal-module_closeButton__siC-1","body":"Modal-module_body__U7jvM","bodyFlush":"Modal-module_bodyFlush__wtk3q"};
|
|
719
719
|
|
|
720
720
|
/**
|
|
721
721
|
* Modal Component
|
|
@@ -769,16 +769,16 @@ const Modal = ({ open, title, onClose, children, size = 'default', actions, padd
|
|
|
769
769
|
if (typeof document === 'undefined')
|
|
770
770
|
return null;
|
|
771
771
|
const dialogClass = [
|
|
772
|
-
styles$
|
|
773
|
-
size === 'compact' && styles$
|
|
774
|
-
size === 'wide' && styles$
|
|
772
|
+
styles$x.dialog,
|
|
773
|
+
size === 'compact' && styles$x.dialogCompact,
|
|
774
|
+
size === 'wide' && styles$x.dialogWide,
|
|
775
775
|
]
|
|
776
776
|
.filter(Boolean)
|
|
777
777
|
.join(' ');
|
|
778
|
-
return createPortal(jsx(AnimatePresence, { children: open && (jsx(motion.div, { className: styles$
|
|
778
|
+
return createPortal(jsx(AnimatePresence, { children: open && (jsx(motion.div, { className: styles$x.backdrop, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.15 }, onClick: onClose, "aria-hidden": "true", children: jsxs(motion.div, { className: dialogClass, role: "dialog", "aria-modal": "true", "aria-label": title, initial: { opacity: 0, scale: 0.96, y: 8 }, animate: { opacity: 1, scale: 1, y: 0 }, exit: { opacity: 0, scale: 0.96, y: 8 }, transition: { duration: 0.15, ease: 'easeOut' }, onClick: (e) => e.stopPropagation(), children: [jsxs("div", { className: styles$x.header, children: [jsx("span", { className: styles$x.title, children: title }), actions && jsx("div", { className: styles$x.headerActions, children: actions }), jsx("button", { className: styles$x.closeButton, onClick: onClose, "aria-label": "Close modal", type: "button", children: jsx(X, { size: 16 }) })] }), jsx("div", { className: padding ? styles$x.body : styles$x.bodyFlush, children: children })] }) })) }), document.body);
|
|
779
779
|
};
|
|
780
780
|
|
|
781
|
-
var styles$
|
|
781
|
+
var styles$w = {"checkboxLabel":"Checkbox-module_checkboxLabel__4tBVg","checkbox":"Checkbox-module_checkbox__BbJul","checkboxText":"Checkbox-module_checkboxText__oJsc9"};
|
|
782
782
|
|
|
783
783
|
/**
|
|
784
784
|
* Checkbox component - Modern interactive checkbox with animations
|
|
@@ -823,13 +823,13 @@ const Checkbox = ({ checked, onChange, label, disabled = false, indeterminate =
|
|
|
823
823
|
checkboxRef.current.indeterminate = indeterminate;
|
|
824
824
|
}
|
|
825
825
|
}, [indeterminate]);
|
|
826
|
-
return (jsxs("label", { className: styles$
|
|
826
|
+
return (jsxs("label", { className: styles$w.checkboxLabel, children: [jsx("input", { ref: checkboxRef, type: "checkbox", checked: checked, onChange: (e) => {
|
|
827
827
|
const isChecked = e.target.checked;
|
|
828
828
|
onChange(isChecked);
|
|
829
829
|
if (soundConfig?.onClick !== false) {
|
|
830
830
|
playSound('toggle');
|
|
831
831
|
}
|
|
832
|
-
}, className: styles$
|
|
832
|
+
}, className: styles$w.checkbox, disabled: disabled, id: id, name: name, value: value, "aria-checked": indeterminate ? 'mixed' : checked }), label && jsx("span", { className: styles$w.checkboxText, children: label })] }));
|
|
833
833
|
};
|
|
834
834
|
|
|
835
835
|
const formatDateToEuropean = (date) => {
|
|
@@ -860,7 +860,7 @@ const parseEuropeanDate = (dateString) => {
|
|
|
860
860
|
return '';
|
|
861
861
|
};
|
|
862
862
|
|
|
863
|
-
var styles$
|
|
863
|
+
var styles$v = {"dateInput":"DateInput-module_dateInput__54VPD","label":"DateInput-module_label__yDdUw","inputWrapper":"DateInput-module_inputWrapper__x-r1d","textInput":"DateInput-module_textInput__ToOSX","calendarButton":"DateInput-module_calendarButton__JzDGD","hiddenDateInput":"DateInput-module_hiddenDateInput__IWNg3","error":"DateInput-module_error__ieuPO","success":"DateInput-module_success__rPA93","loading":"DateInput-module_loading__1DAmD"};
|
|
864
864
|
|
|
865
865
|
/**
|
|
866
866
|
* DateInput component - European format date picker with manual input support
|
|
@@ -949,19 +949,19 @@ function DateInput({ label, value, onChange, placeholder = "25/12/2024", onFocus
|
|
|
949
949
|
}
|
|
950
950
|
};
|
|
951
951
|
const getClassName = () => {
|
|
952
|
-
const classes = [styles$
|
|
952
|
+
const classes = [styles$v.dateInput];
|
|
953
953
|
if (error)
|
|
954
|
-
classes.push(styles$
|
|
954
|
+
classes.push(styles$v.error);
|
|
955
955
|
if (success)
|
|
956
|
-
classes.push(styles$
|
|
956
|
+
classes.push(styles$v.success);
|
|
957
957
|
if (loading)
|
|
958
|
-
classes.push(styles$
|
|
958
|
+
classes.push(styles$v.loading);
|
|
959
959
|
return classes.join(' ');
|
|
960
960
|
};
|
|
961
|
-
return (jsxs("div", { className: getClassName(), children: [jsx("label", { className: styles$
|
|
961
|
+
return (jsxs("div", { className: getClassName(), children: [jsx("label", { className: styles$v.label, children: label }), jsxs("div", { className: styles$v.inputWrapper, children: [jsx("input", { type: "text", value: value.includes('-') ? formatDateToEuropean(value) : value, onChange: (e) => handleTextChange(e.target.value), onFocus: onFocus, onBlur: onBlur, placeholder: placeholder, className: styles$v.textInput, disabled: disabled || loading, ...handlers }), jsx("button", { type: "button", onClick: handleCalendarClick, className: styles$v.calendarButton, title: "Select date from calendar", disabled: disabled || loading, children: jsx(Calendar$1, {}) }), jsx("input", { ref: hiddenDateInputRef, type: "date", onChange: handleCalendarChange, className: styles$v.hiddenDateInput, tabIndex: -1, disabled: disabled || loading })] })] }));
|
|
962
962
|
}
|
|
963
963
|
|
|
964
|
-
var styles$
|
|
964
|
+
var styles$u = {"searchableDropdown":"SearchableDropdown-module_searchableDropdown__S2Nh5","dropdownTrigger":"SearchableDropdown-module_dropdownTrigger__dihdr","open":"SearchableDropdown-module_open__P7mRt","dropdownValue":"SearchableDropdown-module_dropdownValue__ydrc2","placeholder":"SearchableDropdown-module_placeholder__BwM2W","dropdownArrow":"SearchableDropdown-module_dropdownArrow__yd5fp","dropdownMenu":"SearchableDropdown-module_dropdownMenu__2Z5cc","dropdownSearch":"SearchableDropdown-module_dropdownSearch__NRk7j","searchInput":"SearchableDropdown-module_searchInput__VS2Hw","searchIcon":"SearchableDropdown-module_searchIcon__2vKFF","dropdownOptions":"SearchableDropdown-module_dropdownOptions__6YXqF","dropdownOption":"SearchableDropdown-module_dropdownOption__YwDr-","selected":"SearchableDropdown-module_selected__31JeB","highlighted":"SearchableDropdown-module_highlighted__P0bBq","checkIcon":"SearchableDropdown-module_checkIcon__YxowK","dropdownNoResults":"SearchableDropdown-module_dropdownNoResults__WW-Da","loading":"SearchableDropdown-module_loading__xlYf0"};
|
|
965
965
|
|
|
966
966
|
/**
|
|
967
967
|
* SearchableDropdown component - Modern filterable dropdown with animations
|
|
@@ -1066,23 +1066,23 @@ function SearchableDropdown({ label, value, onChange, options, placeholder = "Se
|
|
|
1066
1066
|
}
|
|
1067
1067
|
};
|
|
1068
1068
|
const getTriggerClassName = () => {
|
|
1069
|
-
const classes = [styles$
|
|
1069
|
+
const classes = [styles$u.dropdownTrigger];
|
|
1070
1070
|
if (isOpen)
|
|
1071
|
-
classes.push(styles$
|
|
1071
|
+
classes.push(styles$u.open);
|
|
1072
1072
|
if (loading)
|
|
1073
|
-
classes.push(styles$
|
|
1073
|
+
classes.push(styles$u.loading);
|
|
1074
1074
|
if (error)
|
|
1075
|
-
classes.push(styles$
|
|
1075
|
+
classes.push(styles$u.error);
|
|
1076
1076
|
return classes.join(' ');
|
|
1077
1077
|
};
|
|
1078
|
-
return (jsxs("div", { className: styles$
|
|
1078
|
+
return (jsxs("div", { className: styles$u.searchableDropdown, ref: dropdownRef, onKeyDown: handleKeyDown, children: [jsx("label", { children: label }), jsxs(motion.button, { type: "button", className: getTriggerClassName(), onClick: () => !disabled && !loading && setIsOpen(!isOpen), whileTap: { scale: disabled ? 1 : 0.98 }, style: { willChange: 'transform' }, disabled: disabled, children: [jsx("span", { className: `${styles$u.dropdownValue} ${!displayValue ? styles$u.placeholder : ''}`, children: displayValue || placeholder }), jsx(ChevronDown, { className: styles$u.dropdownArrow })] }), jsx(AnimatePresence, { children: isOpen && (jsxs(motion.div, { className: styles$u.dropdownMenu, initial: { opacity: 0, y: -10, scale: 0.95 }, animate: { opacity: 1, y: 0, scale: 1 }, exit: { opacity: 0, y: -10, scale: 0.95 }, transition: { duration: 0.2, ease: "easeOut" }, children: [jsxs("div", { className: styles$u.dropdownSearch, children: [jsx(Search, { className: styles$u.searchIcon }), jsx("input", { ref: inputRef, type: "text", className: styles$u.searchInput, placeholder: "Cerca...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), onClick: (e) => e.stopPropagation() })] }), jsxs("div", { className: styles$u.dropdownOptions, children: [allOptions.map((opt, index) => {
|
|
1079
1079
|
const isSelected = value === opt.value;
|
|
1080
1080
|
const isHighlighted = highlightedIndex === index;
|
|
1081
|
-
return (jsxs(motion.button, { type: "button", className: `${styles$
|
|
1082
|
-
}), allOptions.length === 0 && (jsx(motion.div, { className: styles$
|
|
1081
|
+
return (jsxs(motion.button, { type: "button", className: `${styles$u.dropdownOption} ${isSelected ? styles$u.selected : ''} ${isHighlighted ? styles$u.highlighted : ''}`, onClick: () => handleSelect(opt.value), onMouseEnter: () => setHighlightedIndex(index), initial: { opacity: 0, x: -20 }, animate: { opacity: 1, x: 0 }, transition: { delay: index * 0.02 }, whileTap: { scale: 0.98 }, style: { willChange: 'transform' }, children: [jsx("span", { children: opt.label }), isSelected && jsx(Check, { className: styles$u.checkIcon })] }, `${opt.value}-${index}`));
|
|
1082
|
+
}), allOptions.length === 0 && (jsx(motion.div, { className: styles$u.dropdownNoResults, initial: { opacity: 0 }, animate: { opacity: 1 }, children: "No results found" }))] })] })) })] }));
|
|
1083
1083
|
}
|
|
1084
1084
|
|
|
1085
|
-
var styles$
|
|
1085
|
+
var styles$t = {"selectInput":"SelectInput-module_selectInput__s6zEg","selectWrapper":"SelectInput-module_selectWrapper__Qr4pl","selectIcon":"SelectInput-module_selectIcon__9pjhf","error":"SelectInput-module_error__3WNJc","success":"SelectInput-module_success__WJ5ga","loading":"SelectInput-module_loading__n35N9"};
|
|
1086
1086
|
|
|
1087
1087
|
/**
|
|
1088
1088
|
* SelectInput component - Styled dropdown selector with flexible option format
|
|
@@ -1120,26 +1120,26 @@ var styles$s = {"selectInput":"SelectInput-module_selectInput__s6zEg","selectWra
|
|
|
1120
1120
|
function SelectInput({ label, value, onChange, options, placeholder = "Select...", disabled = false, error = false, success = false, loading = false, required = false, soundConfig, className }) {
|
|
1121
1121
|
const { handlers, playSound } = useComponentSound(soundConfig);
|
|
1122
1122
|
const getClassName = () => {
|
|
1123
|
-
const classes = [styles$
|
|
1123
|
+
const classes = [styles$t.selectInput];
|
|
1124
1124
|
if (error)
|
|
1125
|
-
classes.push(styles$
|
|
1125
|
+
classes.push(styles$t.error);
|
|
1126
1126
|
if (success)
|
|
1127
|
-
classes.push(styles$
|
|
1127
|
+
classes.push(styles$t.success);
|
|
1128
1128
|
if (loading)
|
|
1129
|
-
classes.push(styles$
|
|
1129
|
+
classes.push(styles$t.loading);
|
|
1130
1130
|
return classes.join(' ');
|
|
1131
1131
|
};
|
|
1132
|
-
return (jsxs("div", { className: `${getClassName()}${className ? ` ${className}` : ''}`, children: [jsxs("label", { children: [label, required && jsx("span", { style: { color: 'var(--color-error)' }, children: " *" })] }), jsxs("div", { className: styles$
|
|
1132
|
+
return (jsxs("div", { className: `${getClassName()}${className ? ` ${className}` : ''}`, children: [jsxs("label", { children: [label, required && jsx("span", { style: { color: 'var(--color-error)' }, children: " *" })] }), jsxs("div", { className: styles$t.selectWrapper, children: [jsxs("select", { value: value, onChange: e => {
|
|
1133
1133
|
playSound('click');
|
|
1134
1134
|
onChange(e.target.value);
|
|
1135
1135
|
}, disabled: disabled || loading, required: required, ...handlers, children: [jsx("option", { value: "", children: placeholder }), options.map(opt => {
|
|
1136
1136
|
const optionValue = typeof opt === 'string' ? opt : opt.value;
|
|
1137
1137
|
const optionLabel = typeof opt === 'string' ? opt : opt.label;
|
|
1138
1138
|
return (jsx("option", { value: optionValue, children: optionLabel }, optionValue));
|
|
1139
|
-
})] }), jsx(ChevronDown, { className: styles$
|
|
1139
|
+
})] }), jsx(ChevronDown, { className: styles$t.selectIcon })] })] }));
|
|
1140
1140
|
}
|
|
1141
1141
|
|
|
1142
|
-
var styles$
|
|
1142
|
+
var styles$s = {"textareaContainer":"TextArea-module_textareaContainer__AquFj","compact":"TextArea-module_compact__U5lPn","textareaLabel":"TextArea-module_textareaLabel__7Vmyx","requiredIndicator":"TextArea-module_requiredIndicator__3Fxyy","textareaInput":"TextArea-module_textareaInput__VCDZA","characterCount":"TextArea-module_characterCount__9FO5N","nearLimit":"TextArea-module_nearLimit__cUdnw","atLimit":"TextArea-module_atLimit__GoWCC","error":"TextArea-module_error__ciHgb","success":"TextArea-module_success__a0-xD","loading":"TextArea-module_loading__CSFBR","focusMode":"TextArea-module_focusMode__9A8U-"};
|
|
1143
1143
|
|
|
1144
1144
|
/**
|
|
1145
1145
|
* TextArea component - Multi-line text input with character counting
|
|
@@ -1174,38 +1174,38 @@ var styles$r = {"textareaContainer":"TextArea-module_textareaContainer__AquFj","
|
|
|
1174
1174
|
function TextArea({ label, value, onChange, rows = 5, placeholder = "", required = false, maxLength, disabled = false, error = false, success = false, loading = false, focusMode = false, compact = false, className = "" }) {
|
|
1175
1175
|
const textareaId = `textarea-${Math.random().toString(36).substr(2, 9)}`;
|
|
1176
1176
|
const getContainerClassName = () => {
|
|
1177
|
-
const classes = [styles$
|
|
1177
|
+
const classes = [styles$s.textareaContainer];
|
|
1178
1178
|
if (error)
|
|
1179
|
-
classes.push(styles$
|
|
1179
|
+
classes.push(styles$s.error);
|
|
1180
1180
|
if (success)
|
|
1181
|
-
classes.push(styles$
|
|
1181
|
+
classes.push(styles$s.success);
|
|
1182
1182
|
if (loading)
|
|
1183
|
-
classes.push(styles$
|
|
1183
|
+
classes.push(styles$s.loading);
|
|
1184
1184
|
if (focusMode)
|
|
1185
|
-
classes.push(styles$
|
|
1185
|
+
classes.push(styles$s.focusMode);
|
|
1186
1186
|
if (compact)
|
|
1187
|
-
classes.push(styles$
|
|
1187
|
+
classes.push(styles$s.compact);
|
|
1188
1188
|
if (className)
|
|
1189
1189
|
classes.push(className);
|
|
1190
1190
|
return classes.join(' ');
|
|
1191
1191
|
};
|
|
1192
1192
|
const getCharCountClassName = () => {
|
|
1193
1193
|
if (!maxLength)
|
|
1194
|
-
return styles$
|
|
1195
|
-
const classes = [styles$
|
|
1194
|
+
return styles$s.characterCount;
|
|
1195
|
+
const classes = [styles$s.characterCount];
|
|
1196
1196
|
const percentage = (value.length / maxLength) * 100;
|
|
1197
1197
|
if (percentage >= 100) {
|
|
1198
|
-
classes.push(styles$
|
|
1198
|
+
classes.push(styles$s.atLimit);
|
|
1199
1199
|
}
|
|
1200
1200
|
else if (percentage >= 80) {
|
|
1201
|
-
classes.push(styles$
|
|
1201
|
+
classes.push(styles$s.nearLimit);
|
|
1202
1202
|
}
|
|
1203
1203
|
return classes.join(' ');
|
|
1204
1204
|
};
|
|
1205
|
-
return (jsxs("div", { className: getContainerClassName(), children: [label && (jsxs("label", { htmlFor: textareaId, className: styles$
|
|
1205
|
+
return (jsxs("div", { className: getContainerClassName(), children: [label && (jsxs("label", { htmlFor: textareaId, className: styles$s.textareaLabel, children: [label, required && jsx("span", { className: styles$s.requiredIndicator, children: "*" })] })), jsx("textarea", { id: textareaId, value: value, onChange: (e) => onChange(e.target.value), rows: rows, placeholder: placeholder, maxLength: maxLength, className: styles$s.textareaInput, "aria-required": required, disabled: disabled || loading, "aria-invalid": error }), maxLength && (jsxs("div", { className: getCharCountClassName(), children: [jsx("span", { children: value.length }), jsx("span", { style: { opacity: 0.7 }, children: " / " }), jsx("span", { children: maxLength })] }))] }));
|
|
1206
1206
|
}
|
|
1207
1207
|
|
|
1208
|
-
var styles$
|
|
1208
|
+
var styles$r = {"textInput":"TextInput-module_textInput__b2LVM","required":"TextInput-module_required__7uLiM","inputError":"TextInput-module_inputError__QD0a-","errorMessage":"TextInput-module_errorMessage__nIDoQ","success":"TextInput-module_success__KbSS3","loading":"TextInput-module_loading__qXaca","withIcon":"TextInput-module_withIcon__-8swm","inputIcon":"TextInput-module_inputIcon__B4czN","withAction":"TextInput-module_withAction__JD3ku","actionButton":"TextInput-module_actionButton__zFJel"};
|
|
1209
1209
|
|
|
1210
1210
|
/**
|
|
1211
1211
|
* TextInput component - A versatile text input field with label and error handling
|
|
@@ -1242,21 +1242,21 @@ function TextInput({ label, value, onChange, type = "text", onBlur, placeholder,
|
|
|
1242
1242
|
const { handlers, playSound } = useComponentSound(soundConfig);
|
|
1243
1243
|
const prevValueRef = React.useRef(value);
|
|
1244
1244
|
const getContainerClassName = () => {
|
|
1245
|
-
const classes = [styles$
|
|
1245
|
+
const classes = [styles$r.textInput];
|
|
1246
1246
|
if (success)
|
|
1247
|
-
classes.push(styles$
|
|
1247
|
+
classes.push(styles$r.success);
|
|
1248
1248
|
if (loading)
|
|
1249
|
-
classes.push(styles$
|
|
1249
|
+
classes.push(styles$r.loading);
|
|
1250
1250
|
if (icon)
|
|
1251
|
-
classes.push(styles$
|
|
1251
|
+
classes.push(styles$r.withIcon);
|
|
1252
1252
|
if (actionButton)
|
|
1253
|
-
classes.push(styles$
|
|
1253
|
+
classes.push(styles$r.withAction);
|
|
1254
1254
|
return classes.join(' ');
|
|
1255
1255
|
};
|
|
1256
1256
|
React.useEffect(() => {
|
|
1257
1257
|
prevValueRef.current = value;
|
|
1258
1258
|
}, [value]);
|
|
1259
|
-
return (jsxs("div", { className: getContainerClassName(), children: [jsxs("label", { htmlFor: inputId, children: [label, required && jsx("span", { className: styles$
|
|
1259
|
+
return (jsxs("div", { className: getContainerClassName(), children: [jsxs("label", { htmlFor: inputId, children: [label, required && jsx("span", { className: styles$r.required, children: "*" })] }), jsxs("div", { style: { position: 'relative' }, children: [icon && jsx("div", { className: styles$r.inputIcon, children: icon }), jsx("input", { id: inputId, type: type, value: value, onChange: (e) => {
|
|
1260
1260
|
const newValue = e.target.value;
|
|
1261
1261
|
const oldValue = prevValueRef.current;
|
|
1262
1262
|
onChange(newValue);
|
|
@@ -1272,13 +1272,13 @@ function TextInput({ label, value, onChange, type = "text", onBlur, placeholder,
|
|
|
1272
1272
|
if (error && soundConfig?.onError) {
|
|
1273
1273
|
playSound(typeof soundConfig.onError === 'string' ? soundConfig.onError : 'error');
|
|
1274
1274
|
}
|
|
1275
|
-
}, onBlur: onBlur, placeholder: placeholder, className: error ? styles$
|
|
1275
|
+
}, onBlur: onBlur, placeholder: placeholder, className: error ? styles$r.inputError : '', "aria-invalid": !!error, "aria-describedby": error ? `${inputId}-error` : undefined, disabled: disabled || loading, maxLength: maxLength, autoComplete: autoComplete }), actionButton && (jsx("button", { type: "button", className: styles$r.actionButton, onClick: () => {
|
|
1276
1276
|
handlers.onClick?.();
|
|
1277
1277
|
actionButton.onClick();
|
|
1278
|
-
}, disabled: disabled || loading, children: actionButton.label }))] }), error && (jsx("span", { id: `${inputId}-error`, className: styles$
|
|
1278
|
+
}, disabled: disabled || loading, children: actionButton.label }))] }), error && (jsx("span", { id: `${inputId}-error`, className: styles$r.errorMessage, children: error }))] }));
|
|
1279
1279
|
}
|
|
1280
1280
|
|
|
1281
|
-
var styles$
|
|
1281
|
+
var styles$q = {"toggleContainer":"Toggle-module_toggleContainer__QxqQb","toggleButton":"Toggle-module_toggleButton__WUUf-","active":"Toggle-module_active__fX6Io"};
|
|
1282
1282
|
|
|
1283
1283
|
/**
|
|
1284
1284
|
* Toggle Component
|
|
@@ -1339,7 +1339,7 @@ function Toggle(props) {
|
|
|
1339
1339
|
justifyContent: 'center',
|
|
1340
1340
|
...style
|
|
1341
1341
|
};
|
|
1342
|
-
return (jsxs("div", { className: `${styles$
|
|
1342
|
+
return (jsxs("div", { className: `${styles$q.toggleContainer} ${className || ''}`, children: [jsxs(motion.button, { ref: leftButtonRef, className: `${styles$q.toggleButton} ${!isOn ? styles$q.active : ''}`, whileHover: { scale: 1.05 }, whileTap: { scale: 0.95 }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: () => {
|
|
1343
1343
|
if (!isOn) {
|
|
1344
1344
|
// Already on left
|
|
1345
1345
|
if (enableCelebration) {
|
|
@@ -1354,7 +1354,7 @@ function Toggle(props) {
|
|
|
1354
1354
|
playSound('toggle');
|
|
1355
1355
|
}
|
|
1356
1356
|
onToggle(false);
|
|
1357
|
-
}, onMouseEnter: () => handlers.onMouseEnter?.(), style: buttonStyle, children: [jsx(motion.div, { animate: { scale: !isOn ? 1.1 : 1, rotate: !isOn ? [0, -5, 5, 0] : 0 }, transition: { duration: 0.3 }, children: leftIcon }), leftLabel] }), jsxs(motion.button, { ref: rightButtonRef, className: `${styles$
|
|
1357
|
+
}, onMouseEnter: () => handlers.onMouseEnter?.(), style: buttonStyle, children: [jsx(motion.div, { animate: { scale: !isOn ? 1.1 : 1, rotate: !isOn ? [0, -5, 5, 0] : 0 }, transition: { duration: 0.3 }, children: leftIcon }), leftLabel] }), jsxs(motion.button, { ref: rightButtonRef, className: `${styles$q.toggleButton} ${isOn ? styles$q.active : ''}`, whileHover: { scale: 1.05 }, whileTap: { scale: 0.95 }, transition: { type: "spring", stiffness: 400, damping: 17 }, onClick: () => {
|
|
1358
1358
|
if (isOn) {
|
|
1359
1359
|
// Already on right
|
|
1360
1360
|
if (enableCelebration) {
|
|
@@ -1372,7 +1372,7 @@ function Toggle(props) {
|
|
|
1372
1372
|
}, onMouseEnter: () => handlers.onMouseEnter?.(), style: buttonStyle, children: [jsx(motion.div, { animate: { scale: isOn ? 1.1 : 1, rotate: isOn ? [0, 5, -5, 0] : 0 }, transition: { duration: 0.3 }, children: rightIcon }), rightLabel] })] }));
|
|
1373
1373
|
}
|
|
1374
1374
|
|
|
1375
|
-
var styles$
|
|
1375
|
+
var styles$p = {"container":"NumberStepper-module_container__WSGlU","header":"NumberStepper-module_header__qXI1Y","icon":"NumberStepper-module_icon__vHgsw","label":"NumberStepper-module_label__AYr3g","stepper":"NumberStepper-module_stepper__oQhTp","disabled":"NumberStepper-module_disabled__kGB-g","button":"NumberStepper-module_button__YcjRt","buttonIcon":"NumberStepper-module_buttonIcon__odXec","valueContainer":"NumberStepper-module_valueContainer__87w2D","valueWrapper":"NumberStepper-module_valueWrapper__TH65N","value":"NumberStepper-module_value__BxJeD","limits":"NumberStepper-module_limits__-UrRE","limit":"NumberStepper-module_limit__7nbIP","small":"NumberStepper-module_small__P-k96","large":"NumberStepper-module_large__Lz6lk","outlined":"NumberStepper-module_outlined__CIXv7","filled":"NumberStepper-module_filled__IxOg-","minimal":"NumberStepper-module_minimal__y47-W","custom":"NumberStepper-module_custom__XGSVg","vertical":"NumberStepper-module_vertical__nBcL7","pulse":"NumberStepper-module_pulse__51oUo"};
|
|
1376
1376
|
|
|
1377
1377
|
/**
|
|
1378
1378
|
* NumberStepper Component
|
|
@@ -1559,32 +1559,32 @@ const NumberStepper = ({ value, onChange, min = -Infinity, max = Infinity, step
|
|
|
1559
1559
|
setDisplayValue(finalValue);
|
|
1560
1560
|
}, [displayValue, min, max, step, onChange]);
|
|
1561
1561
|
const containerClasses = [
|
|
1562
|
-
styles$
|
|
1563
|
-
styles$
|
|
1564
|
-
styles$
|
|
1565
|
-
layout === 'vertical' && styles$
|
|
1566
|
-
disabled && styles$
|
|
1562
|
+
styles$p.container,
|
|
1563
|
+
styles$p[size],
|
|
1564
|
+
styles$p[variant],
|
|
1565
|
+
layout === 'vertical' && styles$p.vertical,
|
|
1566
|
+
disabled && styles$p.disabled,
|
|
1567
1567
|
className
|
|
1568
1568
|
].filter(Boolean).join(' ');
|
|
1569
1569
|
// Merge custom styles with hover states
|
|
1570
1570
|
const [isButtonHovered, setIsButtonHovered] = useState(null);
|
|
1571
1571
|
const isDecrementDisabled = disabled || value <= min;
|
|
1572
1572
|
const isIncrementDisabled = disabled || value >= max;
|
|
1573
|
-
const stepperContent = (jsxs("div", { className: styles$
|
|
1573
|
+
const stepperContent = (jsxs("div", { className: styles$p.stepper, style: customStyles.stepper, onKeyDown: handleKeyDown, tabIndex: disabled ? -1 : 0, ...handlers, children: [jsx(motion.button, { className: styles$p.button, style: {
|
|
1574
1574
|
...customStyles.button,
|
|
1575
1575
|
...(isButtonHovered === 'decrement' && customStyles.buttonHover)
|
|
1576
|
-
}, onMouseEnter: () => setIsButtonHovered('decrement'), onMouseLeave: () => setIsButtonHovered(null), onClick: handleDecrement, disabled: isDecrementDisabled, whileTap: !isDecrementDisabled ? { scale: 0.9 } : undefined, animate: isDecrementing ? { scale: [1, 1.2, 1] } : undefined, transition: { duration: 0.2 }, "aria-label": "Decrease value", children: customButtons.decrement || (showPlusMinus ? (jsx("span", { className: styles$
|
|
1576
|
+
}, onMouseEnter: () => setIsButtonHovered('decrement'), onMouseLeave: () => setIsButtonHovered(null), onClick: handleDecrement, disabled: isDecrementDisabled, whileTap: !isDecrementDisabled ? { scale: 0.9 } : undefined, animate: isDecrementing ? { scale: [1, 1.2, 1] } : undefined, transition: { duration: 0.2 }, "aria-label": "Decrease value", children: customButtons.decrement || (showPlusMinus ? (jsx("span", { className: styles$p.buttonIcon, style: customStyles.buttonIcon, children: "\u2212" })) : (jsx("svg", { className: styles$p.buttonIcon, style: customStyles.buttonIcon, viewBox: "0 0 24 24", fill: "none", children: jsx("path", { d: "M15 18L9 12L15 6", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }))) }), jsx("div", { className: styles$p.valueContainer, style: customStyles.valueContainer, children: jsx(AnimatePresence, { mode: "wait", children: jsx(motion.div, { initial: { y: isIncrementing ? 10 : isDecrementing ? -10 : 0, opacity: 0 }, animate: { y: 0, opacity: 1 }, exit: { y: isIncrementing ? -10 : isDecrementing ? 10 : 0, opacity: 0 }, transition: { duration: 0.15 }, className: styles$p.valueWrapper, children: jsx("input", { type: "text", className: styles$p.value, style: customStyles.value, value: displayValue, onChange: handleInputChange, onBlur: handleInputBlur, disabled: disabled, "aria-label": label || "Number input", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value }) }, value) }) }), jsx(motion.button, { className: styles$p.button, style: {
|
|
1577
1577
|
...customStyles.button,
|
|
1578
1578
|
...(isButtonHovered === 'increment' && customStyles.buttonHover)
|
|
1579
|
-
}, onMouseEnter: () => setIsButtonHovered('increment'), onMouseLeave: () => setIsButtonHovered(null), onClick: handleIncrement, disabled: isIncrementDisabled, whileTap: !isIncrementDisabled ? { scale: 0.9 } : undefined, animate: isIncrementing ? { scale: [1, 1.2, 1] } : undefined, transition: { duration: 0.2 }, "aria-label": "Increase value", children: customButtons.increment || (showPlusMinus ? (jsx("span", { className: styles$
|
|
1579
|
+
}, onMouseEnter: () => setIsButtonHovered('increment'), onMouseLeave: () => setIsButtonHovered(null), onClick: handleIncrement, disabled: isIncrementDisabled, whileTap: !isIncrementDisabled ? { scale: 0.9 } : undefined, animate: isIncrementing ? { scale: [1, 1.2, 1] } : undefined, transition: { duration: 0.2 }, "aria-label": "Increase value", children: customButtons.increment || (showPlusMinus ? (jsx("span", { className: styles$p.buttonIcon, style: customStyles.buttonIcon, children: "+" })) : (jsx("svg", { className: styles$p.buttonIcon, style: customStyles.buttonIcon, viewBox: "0 0 24 24", fill: "none", children: jsx("path", { d: "M9 18L15 12L9 6", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }))) })] }));
|
|
1580
1580
|
// For custom variant with horizontal layout, render differently
|
|
1581
1581
|
if (variant === 'custom' && (label || icon)) {
|
|
1582
|
-
return (jsxs("div", { className: containerClasses, style: { ...customStyles.container, display: 'flex', alignItems: 'center' }, children: [jsxs("div", { className: styles$
|
|
1582
|
+
return (jsxs("div", { className: containerClasses, style: { ...customStyles.container, display: 'flex', alignItems: 'center' }, children: [jsxs("div", { className: styles$p.header, style: { ...customStyles.header, flex: 1, marginBottom: 0 }, children: [icon && jsx("span", { className: styles$p.icon, style: customStyles.icon, children: icon }), label && jsx("label", { className: styles$p.label, style: customStyles.label, children: label })] }), stepperContent, !hideLimits && (min !== -Infinity || max !== Infinity) && (jsxs("div", { className: styles$p.limits, style: customStyles.limits, children: [jsx("span", { className: styles$p.limit, children: min !== -Infinity && `Min: ${min}` }), jsx("span", { className: styles$p.limit, children: max !== Infinity && `Max: ${max}` })] }))] }));
|
|
1583
1583
|
}
|
|
1584
|
-
return (jsxs("div", { className: containerClasses, style: customStyles.container, children: [(label || icon) && (jsxs("div", { className: styles$
|
|
1584
|
+
return (jsxs("div", { className: containerClasses, style: customStyles.container, children: [(label || icon) && (jsxs("div", { className: styles$p.header, style: customStyles.header, children: [icon && jsx("span", { className: styles$p.icon, style: customStyles.icon, children: icon }), label && jsx("label", { className: styles$p.label, style: customStyles.label, children: label })] })), stepperContent, !hideLimits && (min !== -Infinity || max !== Infinity) && (jsxs("div", { className: styles$p.limits, style: customStyles.limits, children: [jsx("span", { className: styles$p.limit, children: min !== -Infinity && `Min: ${min}` }), jsx("span", { className: styles$p.limit, children: max !== Infinity && `Max: ${max}` })] }))] }));
|
|
1585
1585
|
};
|
|
1586
1586
|
|
|
1587
|
-
var styles$
|
|
1587
|
+
var styles$o = {"button":"ToggleButton-module_button__DTuyY","background":"ToggleButton-module_background__NwfTp","content":"ToggleButton-module_content__NHqIN","iconWrapper":"ToggleButton-module_iconWrapper__yN4sP","icon":"ToggleButton-module_icon__r8juX","label":"ToggleButton-module_label__4mPJP","hideMobile":"ToggleButton-module_hideMobile__GFAc3","checkmark":"ToggleButton-module_checkmark__ZJwf-","ripple":"ToggleButton-module_ripple__2-faB","small":"ToggleButton-module_small__MhfoN","large":"ToggleButton-module_large__A3naL","default":"ToggleButton-module_default__q8QaZ","active":"ToggleButton-module_active__4DjlR","outlined":"ToggleButton-module_outlined__OtqJB","filled":"ToggleButton-module_filled__LySNn","ghost":"ToggleButton-module_ghost__9KXcb","active-primary":"ToggleButton-module_active-primary__vXMP7","active-secondary":"ToggleButton-module_active-secondary__9Ttdx","active-success":"ToggleButton-module_active-success__oi0rr","active-danger":"ToggleButton-module_active-danger__VUdxr","active-warning":"ToggleButton-module_active-warning__77nSu","animation-scale":"ToggleButton-module_animation-scale__j-3mJ","scaleAnimation":"ToggleButton-module_scaleAnimation__Ms1j2","animation-rotate":"ToggleButton-module_animation-rotate__pBmfc","rotateAnimation":"ToggleButton-module_rotateAnimation__xWZJ5","animation-flip":"ToggleButton-module_animation-flip__ErAbm","flipAnimation":"ToggleButton-module_flipAnimation__qwDTb","disabled":"ToggleButton-module_disabled__Gv5ji"};
|
|
1588
1588
|
|
|
1589
1589
|
/**
|
|
1590
1590
|
* ToggleButton Component
|
|
@@ -1623,18 +1623,18 @@ var styles$n = {"button":"ToggleButton-module_button__DTuyY","background":"Toggl
|
|
|
1623
1623
|
const ToggleButton = ({ active, onClick, icon, label, disabled = false, size = 'medium', variant = 'default', activeColor = 'primary', showCheckmark = false, animation = 'scale', className = '', style = {}, color, tooltip, hideLabelOnMobile = false, soundConfig }) => {
|
|
1624
1624
|
const { handlers, playSound } = useComponentSound(soundConfig);
|
|
1625
1625
|
const buttonClasses = [
|
|
1626
|
-
styles$
|
|
1627
|
-
styles$
|
|
1628
|
-
styles$
|
|
1629
|
-
active && styles$
|
|
1630
|
-
active && styles$
|
|
1631
|
-
disabled && styles$
|
|
1632
|
-
animation !== 'none' && styles$
|
|
1626
|
+
styles$o.button,
|
|
1627
|
+
styles$o[size],
|
|
1628
|
+
styles$o[variant],
|
|
1629
|
+
active && styles$o.active,
|
|
1630
|
+
active && styles$o[`active-${activeColor}`],
|
|
1631
|
+
disabled && styles$o.disabled,
|
|
1632
|
+
animation !== 'none' && styles$o[`animation-${animation}`],
|
|
1633
1633
|
className
|
|
1634
1634
|
].filter(Boolean).join(' ');
|
|
1635
1635
|
const labelClasses = [
|
|
1636
|
-
styles$
|
|
1637
|
-
hideLabelOnMobile && styles$
|
|
1636
|
+
styles$o.label,
|
|
1637
|
+
hideLabelOnMobile && styles$o.hideMobile
|
|
1638
1638
|
].filter(Boolean).join(' ');
|
|
1639
1639
|
const iconVariants = {
|
|
1640
1640
|
scale: {
|
|
@@ -1698,10 +1698,10 @@ const ToggleButton = ({ active, onClick, icon, label, disabled = false, size = '
|
|
|
1698
1698
|
return (jsxs(motion.button, { className: buttonClasses, style: dynamicStyle, onClick: () => {
|
|
1699
1699
|
playSound('toggle');
|
|
1700
1700
|
onClick();
|
|
1701
|
-
}, disabled: disabled, whileHover: !disabled ? { scale: 1.05 } : undefined, whileTap: !disabled ? { scale: 0.95 } : undefined, title: tooltip, "aria-pressed": active, "aria-label": label, ...handlers, children: [jsx(motion.div, { className: styles$
|
|
1701
|
+
}, disabled: disabled, whileHover: !disabled ? { scale: 1.05 } : undefined, whileTap: !disabled ? { scale: 0.95 } : undefined, title: tooltip, "aria-pressed": active, "aria-label": label, ...handlers, children: [jsx(motion.div, { className: styles$o.background, variants: backgroundVariants, initial: "inactive", animate: active ? "active" : "inactive" }), jsxs("div", { className: styles$o.content, children: [icon && (jsx(motion.div, { className: styles$o.iconWrapper, variants: iconVariants[animation], initial: "inactive", animate: active ? "active" : "inactive", transition: { duration: 0.3 }, children: typeof icon === 'string' ? (jsx("span", { className: styles$o.icon, children: icon })) : (jsx("div", { className: styles$o.icon, children: icon })) })), label && jsx("span", { className: labelClasses, children: label }), jsx(AnimatePresence, { children: showCheckmark && active && (jsx(motion.div, { className: styles$o.checkmark, variants: checkmarkVariants, initial: "hidden", animate: "visible", exit: "hidden", children: jsx("svg", { viewBox: "0 0 24 24", fill: "none", children: jsx("path", { d: "M20 6L9 17L4 12", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round" }) }) })) })] }), jsx(AnimatePresence, { children: active && (jsx(motion.div, { className: styles$o.ripple, initial: { scale: 0, opacity: 0.5 }, animate: { scale: 2, opacity: 0 }, exit: { scale: 0, opacity: 0 }, transition: { duration: 0.6 } })) })] }));
|
|
1702
1702
|
};
|
|
1703
1703
|
|
|
1704
|
-
var styles$
|
|
1704
|
+
var styles$n = {"slider":"Slider-module_slider__RD4G7","label":"Slider-module_label__j4H8M","sliderContainer":"Slider-module_sliderContainer__kQICC","track":"Slider-module_track__fQ-oP","fill":"Slider-module_fill__AYR4-","shimmer":"Slider-module_shimmer__271tL","input":"Slider-module_input__fqY-G","thumb":"Slider-module_thumb__yQJho","ripple":"Slider-module_ripple__gVS04","tooltip":"Slider-module_tooltip__ZubHR","tooltipArrow":"Slider-module_tooltipArrow__1aV9s","valueDisplay":"Slider-module_valueDisplay__V6caL","labelsContainer":"Slider-module_labelsContainer__F6ojF","labelItem":"Slider-module_labelItem__FuEaY","size-sm":"Slider-module_size-sm__Y2bmS","size-lg":"Slider-module_size-lg__RSnPf","disabled":"Slider-module_disabled__gxYoH","loading":"Slider-module_loading__6FkKb","loadingTrack":"Slider-module_loadingTrack__8ItT2","loadingIndicator":"Slider-module_loadingIndicator__Elydq"};
|
|
1705
1705
|
|
|
1706
1706
|
/**
|
|
1707
1707
|
* Slider component - A beautiful, animated range input
|
|
@@ -1789,16 +1789,16 @@ function Slider({ value, onChange, min = 0, max = 100, step = 1, label, showValu
|
|
|
1789
1789
|
setShowTooltipState(false);
|
|
1790
1790
|
};
|
|
1791
1791
|
const dynamicColor = getDynamicColor();
|
|
1792
|
-
const sizeClass = styles$
|
|
1793
|
-
const stateClass = disabled ? styles$
|
|
1792
|
+
const sizeClass = styles$n[`size-${size}`];
|
|
1793
|
+
const stateClass = disabled ? styles$n.disabled : loading ? styles$n.loading : '';
|
|
1794
1794
|
if (loading) {
|
|
1795
|
-
return (jsxs("div", { className: `${styles$
|
|
1795
|
+
return (jsxs("div", { className: `${styles$n.slider} ${sizeClass} ${styles$n.loading} ${className}`, style: style, children: [label && jsx("label", { className: styles$n.label, children: label }), jsx("div", { className: styles$n.loadingTrack, children: jsx(motion.div, { className: styles$n.loadingIndicator, animate: { x: ['-100%', '200%'] }, transition: {
|
|
1796
1796
|
repeat: Infinity,
|
|
1797
1797
|
duration: 1.5,
|
|
1798
1798
|
ease: "easeInOut"
|
|
1799
1799
|
} }) })] }));
|
|
1800
1800
|
}
|
|
1801
|
-
return (jsxs("div", { className: `${styles$
|
|
1801
|
+
return (jsxs("div", { className: `${styles$n.slider} ${sizeClass} ${stateClass} ${className}`, style: style, children: [label && (jsx(motion.label, { className: styles$n.label, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.3 }, children: label })), jsxs(motion.div, { className: styles$n.sliderContainer, ref: sliderRef, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, whileHover: { scale: 1.02 }, transition: { duration: 0.1 }, children: [jsx(motion.div, { className: styles$n.track, whileHover: { height: 8, marginTop: -1 }, transition: { duration: 0.1 }, children: jsx(motion.div, { className: styles$n.fill, style: {
|
|
1802
1802
|
width: `${percentage}%`,
|
|
1803
1803
|
backgroundColor: dynamicColor
|
|
1804
1804
|
}, initial: { width: 0 }, animate: { width: `${percentage}%` }, transition: {
|
|
@@ -1808,7 +1808,7 @@ function Slider({ value, onChange, min = 0, max = 100, step = 1, label, showValu
|
|
|
1808
1808
|
damping: 30
|
|
1809
1809
|
}, whileHover: {
|
|
1810
1810
|
boxShadow: `inset 0 0 0 1px rgba(255,255,255,0.2)`
|
|
1811
|
-
} }) }), jsx("input", { type: "range", min: min, max: max, step: step, value: value, onChange: handleChange, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, ...handlers, className: styles$
|
|
1811
|
+
} }) }), jsx("input", { type: "range", min: min, max: max, step: step, value: value, onChange: handleChange, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, ...handlers, className: styles$n.input, disabled: disabled, "aria-label": label }), jsx(motion.div, { className: styles$n.thumb, style: {
|
|
1812
1812
|
left: `${percentage}%`,
|
|
1813
1813
|
backgroundColor: dynamicColor,
|
|
1814
1814
|
borderColor: colors.thumb || dynamicColor
|
|
@@ -1825,14 +1825,14 @@ function Slider({ value, onChange, min = 0, max = 100, step = 1, label, showValu
|
|
|
1825
1825
|
}, whileHover: {
|
|
1826
1826
|
scale: 1.1,
|
|
1827
1827
|
transition: { duration: 0.1 }
|
|
1828
|
-
}, children: isDragging && (jsx(motion.div, { className: styles$
|
|
1828
|
+
}, children: isDragging && (jsx(motion.div, { className: styles$n.ripple, initial: { scale: 0, opacity: 0.6 }, animate: { scale: 2, opacity: 0 }, transition: { duration: 0.5 } })) }), jsx(AnimatePresence, { children: showTooltipState && (jsxs(motion.div, { className: styles$n.tooltip, style: {
|
|
1829
1829
|
left: `${percentage}%`,
|
|
1830
1830
|
backgroundColor: dynamicColor
|
|
1831
|
-
}, initial: { opacity: 0, y: 10, scale: 0.8 }, animate: { opacity: 1, y: 0, scale: 1 }, exit: { opacity: 0, y: 10, scale: 0.8 }, transition: { duration: 0.2 }, children: [tooltipContent ? tooltipContent(value) : formatValue(value), jsx("div", { className: styles$
|
|
1831
|
+
}, initial: { opacity: 0, y: 10, scale: 0.8 }, animate: { opacity: 1, y: 0, scale: 1 }, exit: { opacity: 0, y: 10, scale: 0.8 }, transition: { duration: 0.2 }, children: [tooltipContent ? tooltipContent(value) : formatValue(value), jsx("div", { className: styles$n.tooltipArrow, style: { borderTopColor: dynamicColor } })] })) })] }), showValue && (jsx(motion.div, { className: styles$n.valueDisplay, style: { color: dynamicColor }, initial: { scale: 0.8 }, animate: { scale: 1 }, transition: {
|
|
1832
1832
|
duration: 0.2,
|
|
1833
1833
|
type: "spring",
|
|
1834
1834
|
stiffness: 300
|
|
1835
|
-
}, children: formatValue(value) }, value)), labels.length > 0 && (jsx("div", { className: styles$
|
|
1835
|
+
}, children: formatValue(value) }, value)), labels.length > 0 && (jsx("div", { className: styles$n.labelsContainer, children: labels.map((labelConfig, index) => {
|
|
1836
1836
|
let position = 0;
|
|
1837
1837
|
if (labelConfig.position === 'start')
|
|
1838
1838
|
position = 0;
|
|
@@ -1840,7 +1840,7 @@ function Slider({ value, onChange, min = 0, max = 100, step = 1, label, showValu
|
|
|
1840
1840
|
position = 100;
|
|
1841
1841
|
else if (typeof labelConfig.position === 'number')
|
|
1842
1842
|
position = labelConfig.position;
|
|
1843
|
-
return (jsx(motion.div, { className: styles$
|
|
1843
|
+
return (jsx(motion.div, { className: styles$n.labelItem, style: {
|
|
1844
1844
|
left: `${position}%`,
|
|
1845
1845
|
color: labelConfig.color
|
|
1846
1846
|
}, initial: { opacity: 0, y: 5 }, animate: { opacity: 1, y: 0 }, transition: {
|
|
@@ -1853,7 +1853,7 @@ function Slider({ value, onChange, min = 0, max = 100, step = 1, label, showValu
|
|
|
1853
1853
|
}) }))] }));
|
|
1854
1854
|
}
|
|
1855
1855
|
|
|
1856
|
-
var styles$
|
|
1856
|
+
var styles$m = {"loadingContainer":"LoadingSpinner-module_loadingContainer__m5u51","fullScreen":"LoadingSpinner-module_fullScreen__TuAem","overlay":"LoadingSpinner-module_overlay__X7FTa","shimmer":"LoadingSpinner-module_shimmer__xw4AH","small":"LoadingSpinner-module_small__nq8A3","loadingText":"LoadingSpinner-module_loadingText__wWwna","medium":"LoadingSpinner-module_medium__3JC1S","large":"LoadingSpinner-module_large__4MvAc","dotsSpinner":"LoadingSpinner-module_dotsSpinner__PXtfs","dot1":"LoadingSpinner-module_dot1__5YKSi","dot2":"LoadingSpinner-module_dot2__l6Rbu","dot3":"LoadingSpinner-module_dot3__b9YPW","circleSpinner":"LoadingSpinner-module_circleSpinner__ZmmWs","pulseSpinner":"LoadingSpinner-module_pulseSpinner__wTtDJ","textGradient":"LoadingSpinner-module_textGradient__QDrTY","sparkleContainer":"LoadingSpinner-module_sparkleContainer__9XLJG","sparkle":"LoadingSpinner-module_sparkle__LtFFf"};
|
|
1857
1857
|
|
|
1858
1858
|
const defaultMessages = [
|
|
1859
1859
|
'Loading your content...',
|
|
@@ -1937,22 +1937,22 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
1937
1937
|
}
|
|
1938
1938
|
}, [currentMessageIndex, message, messagesToUse, showMessage]);
|
|
1939
1939
|
const containerClasses = [
|
|
1940
|
-
styles$
|
|
1941
|
-
styles$
|
|
1942
|
-
styles$
|
|
1943
|
-
fullScreen && styles$
|
|
1944
|
-
overlay && styles$
|
|
1940
|
+
styles$m.loadingContainer,
|
|
1941
|
+
styles$m[size],
|
|
1942
|
+
styles$m[variant],
|
|
1943
|
+
fullScreen && styles$m.fullScreen,
|
|
1944
|
+
overlay && styles$m.overlay,
|
|
1945
1945
|
className
|
|
1946
1946
|
].filter(Boolean).join(' ');
|
|
1947
1947
|
const customStyle = {
|
|
1948
1948
|
...(color && { '--spinner-color': color }),
|
|
1949
1949
|
...(backgroundColor && { '--spinner-background': backgroundColor }),
|
|
1950
1950
|
};
|
|
1951
|
-
const renderDots = () => (jsxs(motion.div, { className: styles$
|
|
1951
|
+
const renderDots = () => (jsxs(motion.div, { className: styles$m.dotsSpinner, animate: { rotate: 360 }, transition: {
|
|
1952
1952
|
duration: 2,
|
|
1953
1953
|
repeat: Infinity,
|
|
1954
1954
|
ease: 'linear'
|
|
1955
|
-
}, children: [jsx(motion.div, { className: styles$
|
|
1955
|
+
}, children: [jsx(motion.div, { className: styles$m.dot1, animate: {
|
|
1956
1956
|
scale: [1, 1.3, 1],
|
|
1957
1957
|
y: [0, -6, 0]
|
|
1958
1958
|
}, transition: {
|
|
@@ -1960,7 +1960,7 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
1960
1960
|
repeat: Infinity,
|
|
1961
1961
|
ease: 'easeInOut',
|
|
1962
1962
|
delay: 0
|
|
1963
|
-
} }), jsx(motion.div, { className: styles$
|
|
1963
|
+
} }), jsx(motion.div, { className: styles$m.dot2, animate: {
|
|
1964
1964
|
scale: [1, 1.3, 1],
|
|
1965
1965
|
y: [0, -6, 0]
|
|
1966
1966
|
}, transition: {
|
|
@@ -1968,7 +1968,7 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
1968
1968
|
repeat: Infinity,
|
|
1969
1969
|
ease: 'easeInOut',
|
|
1970
1970
|
delay: 0.5
|
|
1971
|
-
} }), jsx(motion.div, { className: styles$
|
|
1971
|
+
} }), jsx(motion.div, { className: styles$m.dot3, animate: {
|
|
1972
1972
|
scale: [1, 1.3, 1],
|
|
1973
1973
|
y: [0, -6, 0]
|
|
1974
1974
|
}, transition: {
|
|
@@ -1977,12 +1977,12 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
1977
1977
|
ease: 'easeInOut',
|
|
1978
1978
|
delay: 1
|
|
1979
1979
|
} })] }));
|
|
1980
|
-
const renderSpinner = () => (jsx(motion.div, { className: styles$
|
|
1980
|
+
const renderSpinner = () => (jsx(motion.div, { className: styles$m.circleSpinner, animate: { rotate: 360 }, transition: {
|
|
1981
1981
|
duration: 1,
|
|
1982
1982
|
repeat: Infinity,
|
|
1983
1983
|
ease: 'linear'
|
|
1984
1984
|
} }));
|
|
1985
|
-
const renderPulse = () => (jsx(motion.div, { className: styles$
|
|
1985
|
+
const renderPulse = () => (jsx(motion.div, { className: styles$m.pulseSpinner, animate: {
|
|
1986
1986
|
scale: [1, 1.2, 1],
|
|
1987
1987
|
opacity: [1, 0.7, 1]
|
|
1988
1988
|
}, transition: {
|
|
@@ -2001,10 +2001,10 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
2001
2001
|
return renderDots();
|
|
2002
2002
|
}
|
|
2003
2003
|
};
|
|
2004
|
-
return (jsxs("div", { className: containerClasses, style: customStyle, children: [renderSpinnerVariant(), showMessage && (jsx(AnimatePresence, { mode: "wait", children: jsx(motion.p, { className: styles$
|
|
2004
|
+
return (jsxs("div", { className: containerClasses, style: customStyle, children: [renderSpinnerVariant(), showMessage && (jsx(AnimatePresence, { mode: "wait", children: jsx(motion.p, { className: styles$m.loadingText, initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: {
|
|
2005
2005
|
duration: 0.4,
|
|
2006
2006
|
ease: 'easeOut'
|
|
2007
|
-
}, children: currentMessage }, currentMessage) })), showSparkles && (jsx("div", { className: styles$
|
|
2007
|
+
}, children: currentMessage }, currentMessage) })), showSparkles && (jsx("div", { className: styles$m.sparkleContainer, children: [...Array(4)].map((_, i) => (jsx(motion.div, { className: styles$m.sparkle, animate: {
|
|
2008
2008
|
opacity: [0, 1, 0],
|
|
2009
2009
|
scale: [0.5, 1, 0.5],
|
|
2010
2010
|
rotate: [0, 180, 360]
|
|
@@ -2019,7 +2019,7 @@ const LoadingSpinner = ({ message, size = 'medium', variant = 'dots', className
|
|
|
2019
2019
|
} }, i))) }))] }));
|
|
2020
2020
|
};
|
|
2021
2021
|
|
|
2022
|
-
var styles$
|
|
2022
|
+
var styles$l = {"wrapper":"DecryptedText-module_wrapper__tuLvf","srOnly":"DecryptedText-module_srOnly__A-K2T"};
|
|
2023
2023
|
|
|
2024
2024
|
/**
|
|
2025
2025
|
* DecryptedText Component
|
|
@@ -2203,13 +2203,13 @@ const DecryptedText = ({ text, speed = 50, maxIterations = 10, sequential = fals
|
|
|
2203
2203
|
onMouseLeave: () => setIsHovering(false),
|
|
2204
2204
|
}
|
|
2205
2205
|
: {};
|
|
2206
|
-
return (jsxs(motion.span, { className: `${styles$
|
|
2206
|
+
return (jsxs(motion.span, { className: `${styles$l.wrapper} ${parentClassName}`, ref: containerRef, ...hoverProps, ...props, children: [jsx("span", { className: styles$l.srOnly, children: displayText }), jsx("span", { "aria-hidden": "true", children: displayText.split('').map((char, index) => {
|
|
2207
2207
|
const isRevealedOrDone = revealedIndices.has(index) || !isScrambling || !isHovering;
|
|
2208
2208
|
return (jsx("span", { className: isRevealedOrDone ? className : encryptedClassName, children: char }, index));
|
|
2209
2209
|
}) })] }));
|
|
2210
2210
|
};
|
|
2211
2211
|
|
|
2212
|
-
var styles$
|
|
2212
|
+
var styles$k = {"arrayInput":"ArrayInput-module_arrayInput__q1x7A","arrayInputLabel":"ArrayInput-module_arrayInputLabel__HyUC7","arrayInputItem":"ArrayInput-module_arrayInputItem__bFtgl","inputWrapper":"ArrayInput-module_inputWrapper__ajhbW","input":"ArrayInput-module_input__1uywi","complexItem":"ArrayInput-module_complexItem__zr-Q-","fieldsWrapper":"ArrayInput-module_fieldsWrapper__7BVPa","removeButton":"ArrayInput-module_removeButton__gYf8Y","addButton":"ArrayInput-module_addButton__mia29"};
|
|
2213
2213
|
|
|
2214
2214
|
/**
|
|
2215
2215
|
* ArrayInput component - Versatile dynamic list manager
|
|
@@ -2276,11 +2276,11 @@ function SimpleArrayInput({ label, values, onChange, placeholder, itemStyle, inp
|
|
|
2276
2276
|
itemIdsRef.current.splice(index, 1);
|
|
2277
2277
|
onChange(newValues);
|
|
2278
2278
|
};
|
|
2279
|
-
return (jsxs("div", { className: styles$
|
|
2279
|
+
return (jsxs("div", { className: styles$k.arrayInput, children: [jsx("h3", { className: styles$k.arrayInputLabel, children: label }), jsx("div", { children: jsx(AnimatePresence, { children: values.map((value, index) => (jsxs(motion.div, { className: styles$k.arrayInputItem, style: itemStyle, initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0 }, transition: {
|
|
2280
2280
|
duration: 0.3,
|
|
2281
2281
|
ease: "easeInOut",
|
|
2282
2282
|
layout: { duration: 0.2 }
|
|
2283
|
-
}, children: [jsx("div", { className: styles$
|
|
2283
|
+
}, children: [jsx("div", { className: styles$k.inputWrapper, children: multiline ? (jsx("div", { style: inputStyle, children: jsx(TextArea, { label: "", value: value, onChange: (newValue) => handleChange(index, newValue), placeholder: placeholder, rows: rows, compact: true }) })) : (jsx("input", { type: "text", value: value, onChange: (e) => handleChange(index, e.target.value), placeholder: placeholder, className: styles$k.input, style: inputStyle })) }), jsx(Button, { variant: "ghost", size: "small", onClick: () => handleRemove(index), "aria-label": "Remove item", className: styles$k.removeButton, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) })] }, itemIdsRef.current[index]))) }) }), jsx(Button, { variant: buttonVariant, size: "small", onClick: handleAdd, className: styles$k.addButton, children: label })] }));
|
|
2284
2284
|
}
|
|
2285
2285
|
// Complex object array implementation
|
|
2286
2286
|
function ComplexArrayInput({ label, values, onChange, fields, getKey, itemStyle, inputStyle, buttonVariant = 'primary' }) {
|
|
@@ -2305,14 +2305,14 @@ function ComplexArrayInput({ label, values, onChange, fields, getKey, itemStyle,
|
|
|
2305
2305
|
// Generate key from all field values
|
|
2306
2306
|
return fields.map(f => item[f.name] || '').join('-') + `-${index}`;
|
|
2307
2307
|
};
|
|
2308
|
-
return (jsxs("div", { className: styles$
|
|
2308
|
+
return (jsxs("div", { className: styles$k.arrayInput, children: [jsx("h3", { className: styles$k.arrayInputLabel, children: label }), jsx("div", { children: jsx(AnimatePresence, { children: values.map((value, index) => (jsxs(motion.div, { className: `${styles$k.arrayInputItem} ${fields.length > 1 ? styles$k.complexItem : ''}`, style: itemStyle, initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0 }, transition: {
|
|
2309
2309
|
duration: 0.3,
|
|
2310
2310
|
ease: "easeInOut",
|
|
2311
2311
|
layout: { duration: 0.2 }
|
|
2312
|
-
}, children: [jsx("div", { className: styles$
|
|
2312
|
+
}, children: [jsx("div", { className: styles$k.fieldsWrapper, children: fields.map((field) => (jsx("div", { style: inputStyle, children: field.multiline ? (jsx(TextArea, { value: value[field.name] || '', onChange: (newValue) => handleChange(index, field.name, newValue), label: field.label, placeholder: field.placeholder, rows: field.rows, compact: true })) : (jsx(TextInput, { value: value[field.name] || '', onChange: (newValue) => handleChange(index, field.name, newValue), label: field.label, type: field.type, placeholder: field.placeholder })) }, field.name))) }), jsx(Button, { variant: "ghost", size: "small", onClick: () => handleRemove(index), "aria-label": "Remove item", className: styles$k.removeButton, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) })] }, generateKey(value, index)))) }) }), jsxs(Button, { variant: buttonVariant, size: "small", onClick: handleAdd, className: styles$k.addButton, children: ["Add ", label] })] }));
|
|
2313
2313
|
}
|
|
2314
2314
|
|
|
2315
|
-
var styles$
|
|
2315
|
+
var styles$j = {"fab":"EditFAB-module_fab__nSrTJ","primary":"EditFAB-module_primary__zbA9n","secondary":"EditFAB-module_secondary__BnXs0","success":"EditFAB-module_success__kcLg3","loader":"EditFAB-module_loader__TaJOm","draggable":"EditFAB-module_draggable__eE2vE","dragging":"EditFAB-module_dragging__btRJe"};
|
|
2316
2316
|
|
|
2317
2317
|
const EditFAB = ({ canEdit, isEditMode, hasUnsavedChanges = false, isSaving = false, onEnterEditMode, onExitEditMode, position = { bottom: 32, right: 32 } }) => {
|
|
2318
2318
|
const [isMobile, setIsMobile] = useState(false);
|
|
@@ -2397,15 +2397,15 @@ const EditFAB = ({ canEdit, isEditMode, hasUnsavedChanges = false, isSaving = fa
|
|
|
2397
2397
|
};
|
|
2398
2398
|
const getVariantClass = () => {
|
|
2399
2399
|
if (isSaving)
|
|
2400
|
-
return styles$
|
|
2400
|
+
return styles$j.primary;
|
|
2401
2401
|
if (isEditMode) {
|
|
2402
|
-
return hasUnsavedChanges ? styles$
|
|
2402
|
+
return hasUnsavedChanges ? styles$j.success : styles$j.secondary;
|
|
2403
2403
|
}
|
|
2404
|
-
return styles$
|
|
2404
|
+
return styles$j.primary;
|
|
2405
2405
|
};
|
|
2406
2406
|
const getIcon = () => {
|
|
2407
2407
|
if (isSaving) {
|
|
2408
|
-
return jsx("div", { className: styles$
|
|
2408
|
+
return jsx("div", { className: styles$j.loader });
|
|
2409
2409
|
}
|
|
2410
2410
|
if (isEditMode) {
|
|
2411
2411
|
return hasUnsavedChanges ? jsx(Check, { size: 24 }) : jsx(X, { size: 24 });
|
|
@@ -2420,14 +2420,14 @@ const EditFAB = ({ canEdit, isEditMode, hasUnsavedChanges = false, isSaving = fa
|
|
|
2420
2420
|
}
|
|
2421
2421
|
return "Enter edit mode";
|
|
2422
2422
|
};
|
|
2423
|
-
return (jsx(motion.button, { ref: fabRef, className: `${styles$
|
|
2423
|
+
return (jsx(motion.button, { ref: fabRef, className: `${styles$j.fab} ${getVariantClass()} ${isMobile ? styles$j.draggable : ''} ${isDragging ? styles$j.dragging : ''}`, style: getPositionStyles(), onClick: handleClick, onTouchStart: handleTouchStart, onTouchMove: handleTouchMove, onTouchEnd: handleTouchEnd, disabled: isSaving, "aria-label": getAriaLabel(), initial: { scale: 0, opacity: 0 }, animate: { scale: 1, opacity: 1 }, exit: { scale: 0, opacity: 0 }, whileHover: !isSaving && !isDragging ? { scale: 1.1 } : {}, whileTap: !isSaving && !isDragging ? { scale: 0.9 } : {}, transition: {
|
|
2424
2424
|
type: "spring",
|
|
2425
2425
|
stiffness: 260,
|
|
2426
2426
|
damping: 20
|
|
2427
2427
|
}, children: getIcon() }));
|
|
2428
2428
|
};
|
|
2429
2429
|
|
|
2430
|
-
var styles$
|
|
2430
|
+
var styles$i = {"searchContainer":"SearchBar-module_searchContainer__TdM1w","searchInputWrapper":"SearchBar-module_searchInputWrapper__kCZLU","searchIcon":"SearchBar-module_searchIcon__IIxEu","searchInput":"SearchBar-module_searchInput__V4gkE","clearButton":"SearchBar-module_clearButton__7fNIY","filterSelect":"SearchBar-module_filterSelect__xIVE4","resultsDropdown":"SearchBar-module_resultsDropdown__yh6NF","loadingState":"SearchBar-module_loadingState__4gidK","emptyState":"SearchBar-module_emptyState__RbI4s","spinner":"SearchBar-module_spinner__PMc6-","resultsGroups":"SearchBar-module_resultsGroups__U24DC","resultGroup":"SearchBar-module_resultGroup__SoTQH","groupHeader":"SearchBar-module_groupHeader__bFRHA","groupIcon":"SearchBar-module_groupIcon__9ENM-","groupTitle":"SearchBar-module_groupTitle__ZekZs","groupCount":"SearchBar-module_groupCount__PQIqw","groupResults":"SearchBar-module_groupResults__xTF52","resultItem":"SearchBar-module_resultItem__VaKKy","highlighted":"SearchBar-module_highlighted__Q-3sH","resultTitle":"SearchBar-module_resultTitle__i1uqL","resultSubtitle":"SearchBar-module_resultSubtitle__LQOJ1","resultMeta":"SearchBar-module_resultMeta__Kmkrn","resultContent":"SearchBar-module_resultContent__TzVzL","highlight":"SearchBar-module_highlight__Q3PSP"};
|
|
2431
2431
|
|
|
2432
2432
|
// Default filter options for backwards compatibility
|
|
2433
2433
|
const defaultFilterOptions = [
|
|
@@ -2620,18 +2620,18 @@ const SearchBar = ({ className, placeholder = "Search (Ctrl+Space)...", onSearch
|
|
|
2620
2620
|
return text || '';
|
|
2621
2621
|
const regex = new RegExp(`(${highlight.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
|
|
2622
2622
|
const parts = text.split(regex);
|
|
2623
|
-
return parts.map((part, index) => regex.test(part) ? (jsx("mark", { className: styles$
|
|
2623
|
+
return parts.map((part, index) => regex.test(part) ? (jsx("mark", { className: styles$i.highlight, children: part }, index)) : (part));
|
|
2624
2624
|
};
|
|
2625
|
-
return (jsxs("div", { ref: searchRef, className: `${styles$
|
|
2625
|
+
return (jsxs("div", { ref: searchRef, className: `${styles$i.searchContainer} ${className || ''}`, children: [jsxs("div", { className: styles$i.searchInputWrapper, children: [jsx(Search, { className: styles$i.searchIcon }), jsx("input", { ref: inputRef, type: "text", value: query, onChange: (e) => setQuery(e.target.value), onKeyDown: handleKeyDown, onFocus: () => query.trim() && results.length > 0 && setIsDropdownOpen(true), placeholder: placeholder, className: styles$i.searchInput, "aria-label": "Search", "aria-expanded": isDropdownOpen, "aria-controls": "search-results", "aria-autocomplete": "list" }), query && (jsx(motion.button, { className: styles$i.clearButton, onClick: handleClear, whileHover: { scale: 1.1 }, whileTap: { scale: 0.9 }, initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, exit: { opacity: 0, scale: 0.8 }, children: jsx(X, {}) })), showFilter && (jsx("select", { value: filter, onChange: (e) => setFilter(e.target.value), className: styles$i.filterSelect, "aria-label": "Filter search results", children: filterOptions.map(option => (jsx("option", { value: option.value, children: option.label }, option.value))) }))] }), jsx(AnimatePresence, { children: isDropdownOpen && (jsx(motion.div, { ref: resultsRef, id: "search-results", className: styles$i.resultsDropdown, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2 }, children: isLoading ? (jsxs("div", { className: styles$i.loadingState, children: [jsx("div", { className: styles$i.spinner }), jsx("span", { children: "Searching..." })] })) : results.length === 0 ? (jsxs("div", { className: styles$i.emptyState, children: ["No results found for \"", query, "\""] })) : (jsx("div", { className: styles$i.resultsGroups, children: Object.entries(groupedResults).map(([type, groupResults]) => {
|
|
2626
2626
|
const Icon = entityIcons[type];
|
|
2627
|
-
return (jsxs("div", { className: styles$
|
|
2627
|
+
return (jsxs("div", { className: styles$i.resultGroup, children: [jsxs("div", { className: styles$i.groupHeader, children: [Icon && jsx(Icon, { className: styles$i.groupIcon }), jsx("span", { className: styles$i.groupTitle, children: type.charAt(0).toUpperCase() + type.slice(1) }), jsx("span", { className: styles$i.groupCount, children: groupResults.length })] }), jsx("div", { className: styles$i.groupResults, children: groupResults.map((result) => {
|
|
2628
2628
|
const globalIndex = results.indexOf(result);
|
|
2629
|
-
return (jsxs(motion.button, { "data-result-index": globalIndex, className: `${styles$
|
|
2629
|
+
return (jsxs(motion.button, { "data-result-index": globalIndex, className: `${styles$i.resultItem} ${highlightedIndex === globalIndex ? styles$i.highlighted : ''}`, onClick: () => handleResultClick(result), whileHover: { x: 4 }, onMouseEnter: () => setHighlightedIndex(globalIndex), children: [jsxs("div", { className: styles$i.resultContent, children: [jsx("div", { className: styles$i.resultTitle, children: highlightMatch(result.title || 'Untitled', query) }), result.subtitle && (jsx("div", { className: styles$i.resultSubtitle, children: highlightMatch(result.subtitle, query) }))] }), result.meta && (jsx("div", { className: styles$i.resultMeta, children: result.meta }))] }, `${result.type}-${result.id}`));
|
|
2630
2630
|
}) })] }, type));
|
|
2631
2631
|
}) })) })) })] }));
|
|
2632
2632
|
};
|
|
2633
2633
|
|
|
2634
|
-
var styles$
|
|
2634
|
+
var styles$h = {"modalOverlay":"TimePickerModal-module_modalOverlay__Cbq5-","modalContent":"TimePickerModal-module_modalContent__e6py2","modalHeader":"TimePickerModal-module_modalHeader__XhTgK","closeButton":"TimePickerModal-module_closeButton__qsRAG","timeDisplay":"TimePickerModal-module_timeDisplay__voGP4","pickerContainer":"TimePickerModal-module_pickerContainer__4qn3r","pickerColumn":"TimePickerModal-module_pickerColumn__0-kWf","pickerLabel":"TimePickerModal-module_pickerLabel__e7zQ2","pickerScroll":"TimePickerModal-module_pickerScroll__5Dcvw","pickerItem":"TimePickerModal-module_pickerItem__n8sC2","selected":"TimePickerModal-module_selected__oQA8Z","pickerDivider":"TimePickerModal-module_pickerDivider__eg83F","modalActions":"TimePickerModal-module_modalActions__eJRWU","cancelButton":"TimePickerModal-module_cancelButton__zri81","confirmButton":"TimePickerModal-module_confirmButton__q2p3Q"};
|
|
2635
2635
|
|
|
2636
2636
|
function TimePickerModal({ isOpen, onClose, value, onChange }) {
|
|
2637
2637
|
const [hours, minutes] = value ? value.split(':').map(Number) : [12, 0];
|
|
@@ -2652,10 +2652,10 @@ function TimePickerModal({ isOpen, onClose, value, onChange }) {
|
|
|
2652
2652
|
};
|
|
2653
2653
|
if (!isOpen)
|
|
2654
2654
|
return null;
|
|
2655
|
-
return (jsx("div", { className: styles$
|
|
2655
|
+
return (jsx("div", { className: styles$h.modalOverlay, onClick: onClose, children: jsxs("div", { className: styles$h.modalContent, onClick: (e) => e.stopPropagation(), children: [jsxs("div", { className: styles$h.modalHeader, children: [jsx("h3", { children: "Select Time" }), jsx("button", { className: styles$h.closeButton, onClick: onClose, "aria-label": "Close", children: jsx(X, {}) })] }), jsxs("div", { className: styles$h.timeDisplay, children: [selectedHour.toString().padStart(2, '0'), ":", selectedMinute.toString().padStart(2, '0')] }), jsxs("div", { className: styles$h.pickerContainer, children: [jsxs("div", { className: styles$h.pickerColumn, children: [jsx("div", { className: styles$h.pickerLabel, children: "Hours" }), jsx("div", { className: styles$h.pickerScroll, children: Array.from({ length: 24 }, (_, i) => (jsx("button", { className: `${styles$h.pickerItem} ${selectedHour === i ? styles$h.selected : ''}`, onClick: () => setSelectedHour(i), children: i.toString().padStart(2, '0') }, i))) })] }), jsx("div", { className: styles$h.pickerDivider, children: ":" }), jsxs("div", { className: styles$h.pickerColumn, children: [jsx("div", { className: styles$h.pickerLabel, children: "Minutes" }), jsx("div", { className: styles$h.pickerScroll, children: Array.from({ length: 60 }, (_, i) => (jsx("button", { className: `${styles$h.pickerItem} ${selectedMinute === i ? styles$h.selected : ''}`, onClick: () => setSelectedMinute(i), children: i.toString().padStart(2, '0') }, i))) })] })] }), jsxs("div", { className: styles$h.modalActions, children: [jsx("button", { className: styles$h.cancelButton, onClick: onClose, children: "Cancel" }), jsx("button", { className: styles$h.confirmButton, onClick: handleConfirm, children: "Confirm" })] })] }) }));
|
|
2656
2656
|
}
|
|
2657
2657
|
|
|
2658
|
-
var styles$
|
|
2658
|
+
var styles$g = {"timeInput":"TimeInput-module_timeInput__h1DpT","label":"TimeInput-module_label__d4rZw","required":"TimeInput-module_required__rc1vq","inputWrapper":"TimeInput-module_inputWrapper__4RPAn","textInput":"TimeInput-module_textInput__M3eBZ","clockButton":"TimeInput-module_clockButton__3qoub","error":"TimeInput-module_error__gJnpk","success":"TimeInput-module_success__np-lF","loading":"TimeInput-module_loading__Wb1DC","disabled":"TimeInput-module_disabled__wxiZ-"};
|
|
2659
2659
|
|
|
2660
2660
|
function TimeInput({ label, value, onChange, placeholder = "14:30", onFocus, onBlur, error = false, success = false, loading = false, disabled = false, required = false, className = "" }) {
|
|
2661
2661
|
const [showPicker, setShowPicker] = useState(false);
|
|
@@ -2708,20 +2708,20 @@ function TimeInput({ label, value, onChange, placeholder = "14:30", onFocus, onB
|
|
|
2708
2708
|
}
|
|
2709
2709
|
};
|
|
2710
2710
|
const getContainerClassName = () => {
|
|
2711
|
-
const classes = [styles$
|
|
2711
|
+
const classes = [styles$g.timeInput];
|
|
2712
2712
|
if (error)
|
|
2713
|
-
classes.push(styles$
|
|
2713
|
+
classes.push(styles$g.error);
|
|
2714
2714
|
if (success)
|
|
2715
|
-
classes.push(styles$
|
|
2715
|
+
classes.push(styles$g.success);
|
|
2716
2716
|
if (loading)
|
|
2717
|
-
classes.push(styles$
|
|
2717
|
+
classes.push(styles$g.loading);
|
|
2718
2718
|
if (disabled)
|
|
2719
|
-
classes.push(styles$
|
|
2719
|
+
classes.push(styles$g.disabled);
|
|
2720
2720
|
if (className)
|
|
2721
2721
|
classes.push(className);
|
|
2722
2722
|
return classes.join(' ');
|
|
2723
2723
|
};
|
|
2724
|
-
return (jsxs(Fragment, { children: [jsxs("div", { className: getContainerClassName(), children: [jsxs("label", { className: styles$
|
|
2724
|
+
return (jsxs(Fragment, { children: [jsxs("div", { className: getContainerClassName(), children: [jsxs("label", { className: styles$g.label, children: [label, required && jsx("span", { className: styles$g.required, children: "*" })] }), jsxs("div", { className: styles$g.inputWrapper, children: [jsx("input", { type: "text", value: value, onChange: (e) => handleTextChange(e.target.value), onFocus: onFocus, onBlur: onBlur, placeholder: placeholder, className: styles$g.textInput, maxLength: 5, disabled: disabled || loading, "aria-invalid": error, "aria-required": required, inputMode: "numeric", pattern: "[0-9:]*" }), jsx("button", { type: "button", onClick: handleClockClick, className: styles$g.clockButton, title: "Open time picker", disabled: disabled || loading, "aria-label": "Open time picker", children: jsx(Clock, { size: 20 }) })] })] }), jsx(TimePickerModal, { isOpen: showPicker, onClose: () => setShowPicker(false), value: value, onChange: onChange })] }));
|
|
2725
2725
|
}
|
|
2726
2726
|
|
|
2727
2727
|
const ThemeContext = createContext(undefined);
|
|
@@ -2786,7 +2786,7 @@ const ThemeProvider = ({ children, defaultTheme = 'light', storageKey = 'app-the
|
|
|
2786
2786
|
return (jsx(ThemeContext.Provider, { value: { theme, setTheme, toggleTheme }, children: children }));
|
|
2787
2787
|
};
|
|
2788
2788
|
|
|
2789
|
-
var styles$
|
|
2789
|
+
var styles$f = {"button":"ThemeSwitcher-module_button__VfRjU","iconWrapper":"ThemeSwitcher-module_iconWrapper__FpHo8","label":"ThemeSwitcher-module_label__2Hfkp","toggle":"ThemeSwitcher-module_toggle__ATXx4","toggleTrack":"ThemeSwitcher-module_toggleTrack__x28Rv","toggleThumb":"ThemeSwitcher-module_toggleThumb__V8QeN","dropdown":"ThemeSwitcher-module_dropdown__3qLdt","dropdownTrigger":"ThemeSwitcher-module_dropdownTrigger__UzYV5","dropdownMenu":"ThemeSwitcher-module_dropdownMenu__3L5hT","dropdownItem":"ThemeSwitcher-module_dropdownItem__inw-K","active":"ThemeSwitcher-module_active__OHP19","icon":"ThemeSwitcher-module_icon__iRZiJ","text":"ThemeSwitcher-module_text__OCOoA"};
|
|
2790
2790
|
|
|
2791
2791
|
const ThemeSwitcher = ({ variant = 'button', showLabel = false, className = '', currentTheme, onThemeChange, themes: customThemes, }) => {
|
|
2792
2792
|
// Use safe version that returns null when outside a ThemeProvider
|
|
@@ -2807,19 +2807,19 @@ const ThemeSwitcher = ({ variant = 'button', showLabel = false, className = '',
|
|
|
2807
2807
|
if (variant === 'toggle') {
|
|
2808
2808
|
// Simple toggle between light and dark
|
|
2809
2809
|
const isDark = theme.includes('dark');
|
|
2810
|
-
return (jsxs(motion.button, { className: `${styles$
|
|
2810
|
+
return (jsxs(motion.button, { className: `${styles$f.toggle} ${className}`, onClick: () => setTheme(isDark ? 'light' : 'dark'), whileTap: { scale: 0.95 }, "aria-label": "Toggle theme", children: [jsx(motion.div, { className: styles$f.toggleTrack, animate: { backgroundColor: isDark ? 'var(--color-primary)' : 'var(--color-border)' }, children: jsx(motion.div, { className: styles$f.toggleThumb, animate: { x: isDark ? 24 : 0 }, transition: { type: 'spring', stiffness: 500, damping: 30 }, children: isDark ? jsx(Moon, { size: 14 }) : jsx(Sun, { size: 14 }) }) }), showLabel && jsx("span", { className: styles$f.label, children: isDark ? 'Dark' : 'Light' })] }));
|
|
2811
2811
|
}
|
|
2812
2812
|
if (variant === 'dropdown') {
|
|
2813
|
-
return (jsxs("div", { className: `${styles$
|
|
2813
|
+
return (jsxs("div", { className: `${styles$f.dropdown} ${className}`, children: [jsxs(motion.button, { className: styles$f.dropdownTrigger, whileTap: { scale: 0.98 }, children: [currentThemeData.icon, showLabel && jsx("span", { className: styles$f.label, children: currentThemeData.label })] }), jsx(motion.div, { className: styles$f.dropdownMenu, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, children: themes.map((t) => (jsxs(motion.button, { className: `${styles$f.dropdownItem} ${theme === t.value ? styles$f.active : ''}`, onClick: () => setTheme(t.value), whileHover: { x: 4 }, whileTap: { scale: 0.98 }, children: [jsx("span", { className: styles$f.icon, children: t.icon }), jsx("span", { className: styles$f.text, children: t.label })] }, t.value))) })] }));
|
|
2814
2814
|
}
|
|
2815
2815
|
// Default button variant - cycles through themes
|
|
2816
|
-
return (jsxs(motion.button, { className: `${styles$
|
|
2816
|
+
return (jsxs(motion.button, { className: `${styles$f.button} ${className}`, onClick: () => {
|
|
2817
2817
|
const nextIndex = (currentThemeIndex + 1) % themes.length;
|
|
2818
2818
|
setTheme(themes[nextIndex].value);
|
|
2819
|
-
}, whileTap: { scale: 0.95 }, whileHover: { scale: 1.05 }, "aria-label": `Current theme: ${currentThemeData.label}. Click to change.`, children: [jsx(motion.div, { initial: { rotate: -180, opacity: 0 }, animate: { rotate: 0, opacity: 1 }, exit: { rotate: 180, opacity: 0 }, transition: { duration: 0.3 }, className: styles$
|
|
2819
|
+
}, whileTap: { scale: 0.95 }, whileHover: { scale: 1.05 }, "aria-label": `Current theme: ${currentThemeData.label}. Click to change.`, children: [jsx(motion.div, { initial: { rotate: -180, opacity: 0 }, animate: { rotate: 0, opacity: 1 }, exit: { rotate: 180, opacity: 0 }, transition: { duration: 0.3 }, className: styles$f.iconWrapper, children: currentThemeData.icon }, theme), showLabel && jsx("span", { className: styles$f.label, children: currentThemeData.label })] }));
|
|
2820
2820
|
};
|
|
2821
2821
|
|
|
2822
|
-
var styles$
|
|
2822
|
+
var styles$e = {"tabs":"Tabs-module_tabs__Vlvn7","tab":"Tabs-module_tab__uQKim","tabIcon":"Tabs-module_tabIcon__AgN-O"};
|
|
2823
2823
|
|
|
2824
2824
|
// Default tabs for backwards compatibility
|
|
2825
2825
|
const defaultTabs = [
|
|
@@ -2830,39 +2830,39 @@ const defaultTabs = [
|
|
|
2830
2830
|
];
|
|
2831
2831
|
const Tabs = ({ activeTab, onTabChange, tabs: customTabs, className = '' }) => {
|
|
2832
2832
|
const tabs = customTabs ?? defaultTabs;
|
|
2833
|
-
return (jsx("div", { className: `${styles$
|
|
2833
|
+
return (jsx("div", { className: `${styles$e.tabs} ${className}`, children: tabs.map((tab) => {
|
|
2834
2834
|
const isActive = activeTab === tab.id;
|
|
2835
|
-
return (jsxs(motion.button, { className: styles$
|
|
2835
|
+
return (jsxs(motion.button, { className: styles$e.tab, "data-active": isActive, onClick: () => onTabChange(tab.id), style: { position: 'relative' }, children: [jsx(motion.div, { animate: {
|
|
2836
2836
|
rotate: isActive ? [0, -10, 10, -5, 5, 0] : 0,
|
|
2837
2837
|
}, transition: {
|
|
2838
2838
|
rotate: {
|
|
2839
2839
|
duration: 0.5,
|
|
2840
2840
|
ease: 'easeInOut'
|
|
2841
2841
|
}
|
|
2842
|
-
}, children: tab.icon && (React.isValidElement(tab.icon) ? (jsx("span", { className: styles$
|
|
2842
|
+
}, children: tab.icon && (React.isValidElement(tab.icon) ? (jsx("span", { className: styles$e.tabIcon, children: tab.icon })) : (jsx("span", { className: styles$e.tabIcon, children: React.createElement(tab.icon) }))) }), jsx("span", { children: tab.label })] }, tab.id));
|
|
2843
2843
|
}) }));
|
|
2844
2844
|
};
|
|
2845
2845
|
|
|
2846
|
-
var styles$
|
|
2846
|
+
var styles$d = {"toastContainer":"Toast-module_toastContainer__gp5C0","toast":"Toast-module_toast__eenNR","toastSuccess":"Toast-module_toastSuccess__e-cSx","toastError":"Toast-module_toastError__6JO9w","toastWarning":"Toast-module_toastWarning__pJoF1","toastInfo":"Toast-module_toastInfo__y33kR","icon":"Toast-module_icon__Z-D6i","iconSuccess":"Toast-module_iconSuccess__ehY27","iconError":"Toast-module_iconError__nXhZz","iconWarning":"Toast-module_iconWarning__Ie8oD","iconInfo":"Toast-module_iconInfo__8vOf5","content":"Toast-module_content__eBhK8","title":"Toast-module_title__EfUfZ","message":"Toast-module_message__l4pyr","closeButton":"Toast-module_closeButton__UWOVG","progressBar":"Toast-module_progressBar__fGwBU"};
|
|
2847
2847
|
|
|
2848
2848
|
const getIcon = (type) => {
|
|
2849
2849
|
switch (type) {
|
|
2850
2850
|
case 'success':
|
|
2851
|
-
return (jsx("svg", { className: `${styles$
|
|
2851
|
+
return (jsx("svg", { className: `${styles$d.icon} ${styles$d.iconSuccess}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 13l4 4L19 7" }) }));
|
|
2852
2852
|
case 'error':
|
|
2853
|
-
return (jsx("svg", { className: `${styles$
|
|
2853
|
+
return (jsx("svg", { className: `${styles$d.icon} ${styles$d.iconError}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }));
|
|
2854
2854
|
case 'warning':
|
|
2855
|
-
return (jsx("svg", { className: `${styles$
|
|
2855
|
+
return (jsx("svg", { className: `${styles$d.icon} ${styles$d.iconWarning}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" }) }));
|
|
2856
2856
|
case 'info':
|
|
2857
|
-
return (jsx("svg", { className: `${styles$
|
|
2857
|
+
return (jsx("svg", { className: `${styles$d.icon} ${styles$d.iconInfo}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
|
|
2858
2858
|
}
|
|
2859
2859
|
};
|
|
2860
2860
|
const getToastStyle = (type) => {
|
|
2861
2861
|
switch (type) {
|
|
2862
|
-
case 'success': return styles$
|
|
2863
|
-
case 'error': return styles$
|
|
2864
|
-
case 'warning': return styles$
|
|
2865
|
-
case 'info': return styles$
|
|
2862
|
+
case 'success': return styles$d.toastSuccess;
|
|
2863
|
+
case 'error': return styles$d.toastError;
|
|
2864
|
+
case 'warning': return styles$d.toastWarning;
|
|
2865
|
+
case 'info': return styles$d.toastInfo;
|
|
2866
2866
|
default: return '';
|
|
2867
2867
|
}
|
|
2868
2868
|
};
|
|
@@ -2884,7 +2884,7 @@ const ToastItem = ({ toast, removeToast, }) => {
|
|
|
2884
2884
|
clearInterval(interval);
|
|
2885
2885
|
};
|
|
2886
2886
|
}, [toast.id, duration, removeToast]);
|
|
2887
|
-
return (jsxs(motion.div, { className: `${styles$
|
|
2887
|
+
return (jsxs(motion.div, { className: `${styles$d.toast} ${getToastStyle(toast.type)}`, initial: { opacity: 0, x: 100, scale: 0.9 }, animate: { opacity: 1, x: 0, scale: 1 }, exit: { opacity: 0, x: 100, scale: 0.9 }, transition: { type: 'spring', stiffness: 500, damping: 40 }, layout: true, children: [getIcon(toast.type), jsxs("div", { className: styles$d.content, children: [toast.title && jsx("p", { className: styles$d.title, children: toast.title }), jsx("p", { className: styles$d.message, children: toast.message })] }), jsx("button", { className: styles$d.closeButton, onClick: () => removeToast(toast.id), "aria-label": "Close notification", children: jsx("svg", { width: "16", height: "16", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) }), jsx(motion.div, { className: styles$d.progressBar, initial: { width: '100%' }, animate: { width: `${progress}%` }, style: {
|
|
2888
2888
|
color: toast.type === 'success' ? '#10B981'
|
|
2889
2889
|
: toast.type === 'error' ? '#EF4444'
|
|
2890
2890
|
: toast.type === 'warning' ? '#F59E0B'
|
|
@@ -2894,10 +2894,10 @@ const ToastItem = ({ toast, removeToast, }) => {
|
|
|
2894
2894
|
const ToastContainer = ({ toasts, removeToast }) => {
|
|
2895
2895
|
if (typeof document === 'undefined')
|
|
2896
2896
|
return null;
|
|
2897
|
-
return createPortal(jsx("div", { className: styles$
|
|
2897
|
+
return createPortal(jsx("div", { className: styles$d.toastContainer, children: jsx(AnimatePresence, { mode: "sync", children: toasts.map((toast) => (jsx(ToastItem, { toast: toast, removeToast: removeToast }, toast.id))) }) }), document.body);
|
|
2898
2898
|
};
|
|
2899
2899
|
|
|
2900
|
-
var styles$
|
|
2900
|
+
var styles$c = {"breadcrumb":"Breadcrumb-module_breadcrumb__pGabz","separator":"Breadcrumb-module_separator__UCmyy","item":"Breadcrumb-module_item__0cLOg","link":"Breadcrumb-module_link__udp8M","current":"Breadcrumb-module_current__3DpQc"};
|
|
2901
2901
|
|
|
2902
2902
|
/**
|
|
2903
2903
|
* Breadcrumb Component
|
|
@@ -2916,13 +2916,13 @@ var styles$b = {"breadcrumb":"Breadcrumb-module_breadcrumb__pGabz","separator":"
|
|
|
2916
2916
|
* />
|
|
2917
2917
|
*/
|
|
2918
2918
|
const Breadcrumb = ({ items, onNavigate, className = '' }) => {
|
|
2919
|
-
return (jsx("nav", { className: `${styles$
|
|
2919
|
+
return (jsx("nav", { className: `${styles$c.breadcrumb} ${className}`, "aria-label": "Breadcrumb", children: items.map((item, index) => {
|
|
2920
2920
|
const isLast = index === items.length - 1;
|
|
2921
|
-
return (jsxs(React.Fragment, { children: [index > 0 && jsx(ChevronRight, { size: 14, className: styles$
|
|
2921
|
+
return (jsxs(React.Fragment, { children: [index > 0 && jsx(ChevronRight, { size: 14, className: styles$c.separator }), isLast || !item.href ? (jsx("span", { className: `${styles$c.item} ${isLast ? styles$c.current : ''}`, children: item.label })) : (jsx("button", { className: `${styles$c.item} ${styles$c.link}`, onClick: () => onNavigate?.(item.href), children: item.label }))] }, index));
|
|
2922
2922
|
}) }));
|
|
2923
2923
|
};
|
|
2924
2924
|
|
|
2925
|
-
var styles$
|
|
2925
|
+
var styles$b = {"overlay":"LiquidButton-module_overlay__-P-xm","container":"LiquidButton-module_container__f1COS","actions":"LiquidButton-module_actions__XBz7p","actionButton":"LiquidButton-module_actionButton__PlEOk","actionLabel":"LiquidButton-module_actionLabel__tIGHE","button":"LiquidButton-module_button__znjyS"};
|
|
2926
2926
|
|
|
2927
2927
|
/**
|
|
2928
2928
|
* LiquidButton Component
|
|
@@ -2948,13 +2948,81 @@ const LiquidButton = ({ actions, icon: Icon = Plus, className = '', }) => {
|
|
|
2948
2948
|
setExpanded(false);
|
|
2949
2949
|
action.onClick();
|
|
2950
2950
|
}, []);
|
|
2951
|
-
return (jsxs(Fragment, { children: [jsx(AnimatePresence, { children: expanded && (jsx(motion.div, { className: styles$
|
|
2951
|
+
return (jsxs(Fragment, { children: [jsx(AnimatePresence, { children: expanded && (jsx(motion.div, { className: styles$b.overlay, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, onClick: handleToggle })) }), jsxs("div", { className: `${styles$b.container} ${className}`, children: [jsx(AnimatePresence, { children: expanded && (jsx("div", { className: styles$b.actions, children: actions.map((action, index) => (jsxs(motion.button, { type: "button", className: styles$b.actionButton, initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, exit: { opacity: 0, scale: 0.8 }, transition: {
|
|
2952
2952
|
duration: 0.15,
|
|
2953
2953
|
delay: (actions.length - 1 - index) * 0.05,
|
|
2954
|
-
}, onClick: () => handleAction(action), children: [jsx(action.icon, { size: 18, color: action.color }), jsx("span", { className: styles$
|
|
2954
|
+
}, onClick: () => handleAction(action), children: [jsx(action.icon, { size: 18, color: action.color }), jsx("span", { className: styles$b.actionLabel, children: action.label })] }, action.key))) })) }), jsx(motion.button, { type: "button", className: styles$b.button, onClick: handleToggle, animate: { rotate: expanded ? 45 : 0 }, transition: { duration: 0.2 }, "aria-label": expanded ? 'Close actions' : 'Open actions', children: jsx(Icon, { size: 24, strokeWidth: 2.5 }) })] })] }));
|
|
2955
2955
|
};
|
|
2956
2956
|
|
|
2957
|
-
var styles$
|
|
2957
|
+
var styles$a = {"calendar":"Calendar-module_calendar__3mIJS","loading":"Calendar-module_loading__59Z9-","loadingSpinner":"Calendar-module_loadingSpinner__7MXqV","header":"Calendar-module_header__cZHNA","navigation":"Calendar-module_navigation__PGkpY","navButton":"Calendar-module_navButton__kOe-w","title":"Calendar-module_title__oJZ7m","controls":"Calendar-module_controls__i1Z38","todayButton":"Calendar-module_todayButton__Ac9zc","viewToggle":"Calendar-module_viewToggle__Fhg2t","viewButton":"Calendar-module_viewButton__J2WY6","active":"Calendar-module_active__lIqH-","weekDays":"Calendar-module_weekDays__4J-8f","weekNumberHeader":"Calendar-module_weekNumberHeader__xhKbB","weekDay":"Calendar-module_weekDay__cg8Gr","daysGrid":"Calendar-module_daysGrid__ER0GM","weekView":"Calendar-module_weekView__bdtGs","dayCell":"Calendar-module_dayCell__TV-HR","dayNumber":"Calendar-module_dayNumber__ICH-X","today":"Calendar-module_today__eGuUU","events":"Calendar-module_events__qdbs7","event":"Calendar-module_event__Q1Zq3","eventTitle":"Calendar-module_eventTitle__XU7Wd","eventTime":"Calendar-module_eventTime__pMGEB","otherMonth":"Calendar-module_otherMonth__r6VJK","selected":"Calendar-module_selected__5e6h0","compact":"Calendar-module_compact__i0SF3","dots":"Calendar-module_dots__1Q7QR","dot":"Calendar-module_dot__tsCR1","dotMore":"Calendar-module_dotMore__emasD","weekNumber":"Calendar-module_weekNumber__nlo50","completed":"Calendar-module_completed__B-SHI","completedIcon":"Calendar-module_completedIcon__-oDZ9","moreEvents":"Calendar-module_moreEvents__TIKaT","emptyState":"Calendar-module_emptyState__2fcj7","dayView":"Calendar-module_dayView__PCIos","dayViewHeader":"Calendar-module_dayViewHeader__Gvxx2","timeColumnHeader":"Calendar-module_timeColumnHeader__B0btR","dayColumnHeader":"Calendar-module_dayColumnHeader__Rjqwg","allDayStrip":"Calendar-module_allDayStrip__VOqbV","allDayLabel":"Calendar-module_allDayLabel__2AmyT","allDayList":"Calendar-module_allDayList__6hFSb","dayViewScrollContainer":"Calendar-module_dayViewScrollContainer__84Byq","dayTimelineGrid":"Calendar-module_dayTimelineGrid__r1BNI","hourRow":"Calendar-module_hourRow__U-YN-","hourLabel":"Calendar-module_hourLabel__im84k","hourSlots":"Calendar-module_hourSlots__vbtYy","halfHourSlot":"Calendar-module_halfHourSlot__UWIri","halfHourSlotBottom":"Calendar-module_halfHourSlotBottom__aE5Mo","dayEventAnchor":"Calendar-module_dayEventAnchor__oryAi","currentTimeIndicator":"Calendar-module_currentTimeIndicator__GntOZ"};
|
|
2958
|
+
|
|
2959
|
+
var styles$9 = {"wrapper":"DayEventCard-module_wrapper__qvRgl","deleteUnderlay":"DayEventCard-module_deleteUnderlay__fTtuX","card":"DayEventCard-module_card__V9xTi","dragging":"DayEventCard-module_dragging__q19ID","completed":"DayEventCard-module_completed__tq8ol","text":"DayEventCard-module_text__3dWF7","grip":"DayEventCard-module_grip__tmim4","checkIcon":"DayEventCard-module_checkIcon__Ki67j","time":"DayEventCard-module_time__Ojdye","editButton":"DayEventCard-module_editButton__nDi-e"};
|
|
2960
|
+
|
|
2961
|
+
const SWIPE_DELETE_THRESHOLD = -80;
|
|
2962
|
+
const DayEventCard = ({ event, color, textColor, onComplete, onEdit, onDelete, onDragEnd, draggable = true, }) => {
|
|
2963
|
+
const x = useMotionValue(0);
|
|
2964
|
+
const y = useMotionValue(0);
|
|
2965
|
+
const deleteOpacity = useTransform(x, [-80, 0], [1, 0]);
|
|
2966
|
+
const [verticalDragging, setVerticalDragging] = useState(false);
|
|
2967
|
+
const didSwipe = useRef(false);
|
|
2968
|
+
const dragStart = useRef(null);
|
|
2969
|
+
const completed = event.status === 'completed';
|
|
2970
|
+
const handleSwipeEnd = (_, info) => {
|
|
2971
|
+
if (onDelete && info.offset.x < SWIPE_DELETE_THRESHOLD) {
|
|
2972
|
+
animate(x, -1e3, { duration: 0.2, onComplete: () => onDelete(event) });
|
|
2973
|
+
}
|
|
2974
|
+
else {
|
|
2975
|
+
animate(x, 0, { type: 'spring', stiffness: 400, damping: 30 });
|
|
2976
|
+
}
|
|
2977
|
+
};
|
|
2978
|
+
const handleCardClick = () => {
|
|
2979
|
+
if (didSwipe.current) {
|
|
2980
|
+
didSwipe.current = false;
|
|
2981
|
+
return;
|
|
2982
|
+
}
|
|
2983
|
+
if (verticalDragging)
|
|
2984
|
+
return;
|
|
2985
|
+
onComplete?.(event);
|
|
2986
|
+
};
|
|
2987
|
+
const handleGripPointerDown = (e) => {
|
|
2988
|
+
if (!draggable || !onDragEnd)
|
|
2989
|
+
return;
|
|
2990
|
+
e.stopPropagation();
|
|
2991
|
+
e.preventDefault();
|
|
2992
|
+
dragStart.current = { y: e.clientY, pointerId: e.pointerId };
|
|
2993
|
+
e.currentTarget.setPointerCapture(e.pointerId);
|
|
2994
|
+
setVerticalDragging(true);
|
|
2995
|
+
};
|
|
2996
|
+
const handleGripPointerMove = (e) => {
|
|
2997
|
+
if (!dragStart.current)
|
|
2998
|
+
return;
|
|
2999
|
+
const dy = e.clientY - dragStart.current.y;
|
|
3000
|
+
y.set(dy);
|
|
3001
|
+
};
|
|
3002
|
+
const handleGripPointerUp = (e) => {
|
|
3003
|
+
if (!dragStart.current)
|
|
3004
|
+
return;
|
|
3005
|
+
const clientY = e.clientY;
|
|
3006
|
+
try {
|
|
3007
|
+
e.currentTarget.releasePointerCapture(dragStart.current.pointerId);
|
|
3008
|
+
}
|
|
3009
|
+
catch {
|
|
3010
|
+
// ignore
|
|
3011
|
+
}
|
|
3012
|
+
dragStart.current = null;
|
|
3013
|
+
setVerticalDragging(false);
|
|
3014
|
+
animate(y, 0, { type: 'spring', stiffness: 400, damping: 30 });
|
|
3015
|
+
onDragEnd?.(clientY);
|
|
3016
|
+
};
|
|
3017
|
+
const canSwipe = !!onDelete;
|
|
3018
|
+
const showGrip = draggable && !!onDragEnd;
|
|
3019
|
+
return (jsxs("div", { className: styles$9.wrapper, children: [canSwipe && (jsxs(motion.div, { className: styles$9.deleteUnderlay, style: { opacity: deleteOpacity }, children: [jsx(Trash2, { size: 16 }), jsx("span", { children: "Delete" })] })), jsxs(motion.div, { className: `${styles$9.card} ${completed ? styles$9.completed : ''} ${verticalDragging ? styles$9.dragging : ''}`, style: { x, y, background: color, color: textColor, borderLeftColor: color }, drag: canSwipe && !verticalDragging ? 'x' : false, dragConstraints: canSwipe ? { left: -200, right: 0 } : undefined, dragElastic: 0.15, dragDirectionLock: true, onDragStart: () => {
|
|
3020
|
+
didSwipe.current = true;
|
|
3021
|
+
}, onDragEnd: handleSwipeEnd, whileTap: verticalDragging ? undefined : { scale: 0.98 }, animate: verticalDragging ? { scale: 1.03 } : { scale: 1 }, onClick: handleCardClick, children: [showGrip && (jsx("div", { className: styles$9.grip, onPointerDown: handleGripPointerDown, onPointerMove: handleGripPointerMove, onPointerUp: handleGripPointerUp, onPointerCancel: handleGripPointerUp, onClick: (e) => e.stopPropagation(), children: jsx(GripVertical, { size: 14 }) })), completed && jsx(Check, { size: 14, className: styles$9.checkIcon, strokeWidth: 3 }), jsx("span", { className: styles$9.text, children: event.title }), event.time && jsx("span", { className: styles$9.time, children: event.time }), onEdit && (jsx("button", { className: styles$9.editButton, onClick: (e) => {
|
|
3022
|
+
e.stopPropagation();
|
|
3023
|
+
onEdit(event);
|
|
3024
|
+
}, "aria-label": "Edit event", children: jsx(Pencil, { size: 13 }) }))] })] }));
|
|
3025
|
+
};
|
|
2958
3026
|
|
|
2959
3027
|
/**
|
|
2960
3028
|
* Calendar component - A flexible, reusable calendar for displaying events
|
|
@@ -2985,7 +3053,7 @@ var styles$9 = {"calendar":"Calendar-module_calendar__3mIJS","loading":"Calendar
|
|
|
2985
3053
|
* onEventClick={handleEventClick}
|
|
2986
3054
|
* />
|
|
2987
3055
|
*/
|
|
2988
|
-
function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDateClickByView, onTimeSlotClick, onEventDrop, viewMode = 'month', initialDate = new Date(), config = {}, className = '', style = {}, loading = false, emptyState, hideHeader = false, compact = false, selectedDate }) {
|
|
3056
|
+
function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDateClickByView, onTimeSlotClick, onEventDrop, onEventComplete, onEventDelete, onEventEdit, viewMode = 'month', initialDate = new Date(), config = {}, className = '', style = {}, loading = false, emptyState, hideHeader = false, compact = false, selectedDate }) {
|
|
2989
3057
|
const [currentDate, setCurrentDate] = useState(initialDate);
|
|
2990
3058
|
const [currentViewMode, setCurrentViewMode] = useState(viewMode);
|
|
2991
3059
|
const dayViewScrollRef = useRef(null);
|
|
@@ -3187,9 +3255,9 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
|
|
|
3187
3255
|
return Math.floor(diff / oneWeek) + 1;
|
|
3188
3256
|
};
|
|
3189
3257
|
if (loading) {
|
|
3190
|
-
return (jsx("div", { className: `${styles$
|
|
3258
|
+
return (jsx("div", { className: `${styles$a.calendar} ${styles$a.loading} ${className}`, style: style, children: jsx("div", { className: styles$a.loadingSpinner, children: "Loading..." }) }));
|
|
3191
3259
|
}
|
|
3192
|
-
return (jsxs("div", { className: `${styles$
|
|
3260
|
+
return (jsxs("div", { className: `${styles$a.calendar} ${compact ? styles$a.compact : ''} ${className}`, style: style, children: [!hideHeader && (jsxs("div", { className: styles$a.header, children: [jsxs("div", { className: styles$a.navigation, children: [jsx("button", { onClick: handlePrevious, className: styles$a.navButton, "aria-label": "Previous", children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", children: jsx("polyline", { points: "15,18 9,12 15,6" }) }) }), jsx("h3", { className: styles$a.title, children: calendarData.displayTitle }), jsx("button", { onClick: handleNext, className: styles$a.navButton, "aria-label": "Next", children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", children: jsx("polyline", { points: "9,6 15,12 9,18" }) }) })] }), jsxs("div", { className: styles$a.controls, children: [jsx("button", { onClick: handleToday, className: styles$a.todayButton, children: "Today" }), jsxs("div", { className: styles$a.viewToggle, children: [jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'month' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('month'), children: "Month" }), jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'week' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('week'), children: "Week" }), jsx("button", { className: `${styles$a.viewButton} ${currentViewMode === 'day' ? styles$a.active : ''}`, onClick: () => setCurrentViewMode('day'), children: "Day" })] })] })] })), currentViewMode !== 'day' && (jsxs("div", { className: styles$a.weekDays, children: [showWeekNumbers && jsx("div", { className: styles$a.weekNumberHeader, children: "Week" }), finalDayLabels.map((day) => (jsx("div", { className: styles$a.weekDay, children: day }, day)))] })), currentViewMode === 'day' ? (
|
|
3193
3261
|
// Day view layout — positioned events with duration, all-day strip, now-line
|
|
3194
3262
|
(() => {
|
|
3195
3263
|
const dayEvents = getDayEvents(currentDate);
|
|
@@ -3220,14 +3288,14 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
|
|
|
3220
3288
|
onTimeSlotClick(slotDate, hour, timeString);
|
|
3221
3289
|
}
|
|
3222
3290
|
};
|
|
3223
|
-
const handleEventDragEnd = (event,
|
|
3291
|
+
const handleEventDragEnd = (event, clientY) => {
|
|
3224
3292
|
if (!onEventDrop)
|
|
3225
3293
|
return;
|
|
3226
|
-
const gridEl = dayViewScrollRef.current?.querySelector(`.${styles$
|
|
3294
|
+
const gridEl = dayViewScrollRef.current?.querySelector(`.${styles$a.dayTimelineGrid}`);
|
|
3227
3295
|
if (!gridEl)
|
|
3228
3296
|
return;
|
|
3229
3297
|
const rect = gridEl.getBoundingClientRect();
|
|
3230
|
-
const relativeY =
|
|
3298
|
+
const relativeY = clientY - rect.top;
|
|
3231
3299
|
const slotSize = halfHourSlots ? hourHeight / 2 : hourHeight;
|
|
3232
3300
|
const slotIndex = Math.max(0, Math.floor(relativeY / slotSize));
|
|
3233
3301
|
const totalSlots = halfHourSlots ? hours.length * 2 : hours.length;
|
|
@@ -3238,26 +3306,13 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
|
|
|
3238
3306
|
newDate.setHours(newHour, newMinute, 0, 0);
|
|
3239
3307
|
onEventDrop(event, newDate);
|
|
3240
3308
|
};
|
|
3241
|
-
return (jsxs("div", { className: styles$
|
|
3242
|
-
backgroundColor: getEventColor(event),
|
|
3243
|
-
color: getEventTextColor(event),
|
|
3244
|
-
opacity: event.status === 'completed' ? 0.7 : 1
|
|
3245
|
-
}, onClick: () => handleEventClick(event), whileHover: { scale: 1.02 }, whileTap: { scale: 0.98 }, children: [iconRenderer && iconRenderer(event), jsx("span", { children: event.title })] }, event.id))) })] })), jsx("div", { className: styles$9.dayViewScrollContainer, ref: dayViewScrollRef, children: jsxs("div", { className: styles$9.dayTimelineGrid, style: { height: timelineHeight }, children: [hours.map(hour => (jsxs("div", { className: styles$9.hourRow, style: { height: hourHeight }, children: [jsxs("span", { className: styles$9.hourLabel, children: [hour.toString().padStart(2, '0'), ":00"] }), jsx("div", { className: styles$9.hourSlots, children: halfHourSlots ? (jsxs(Fragment, { children: [jsx("div", { className: styles$9.halfHourSlot, onClick: () => handleSlotClick(hour, 0) }), jsx("div", { className: `${styles$9.halfHourSlot} ${styles$9.halfHourSlotBottom}`, onClick: () => handleSlotClick(hour, 30) })] })) : (jsx("div", { className: styles$9.halfHourSlot, onClick: () => handleSlotClick(hour, 0) })) })] }, hour))), scheduled.map((event, eventIndex) => {
|
|
3309
|
+
return (jsxs("div", { className: styles$a.dayView, children: [jsxs("div", { className: styles$a.dayViewHeader, children: [jsx("div", { className: styles$a.timeColumnHeader }), jsx("div", { className: styles$a.dayColumnHeader, children: currentDate.toLocaleDateString(locale, { weekday: 'short', day: 'numeric' }) })] }), allDayEvents.length > 0 && (jsxs("div", { className: styles$a.allDayStrip, children: [jsx("span", { className: styles$a.allDayLabel, children: "All day" }), jsx("div", { className: styles$a.allDayList, children: allDayEvents.map(event => (jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, draggable: false }, event.id))) })] })), jsx("div", { className: styles$a.dayViewScrollContainer, ref: dayViewScrollRef, children: jsxs("div", { className: styles$a.dayTimelineGrid, style: { height: timelineHeight }, children: [hours.map(hour => (jsxs("div", { className: styles$a.hourRow, style: { height: hourHeight }, children: [jsxs("span", { className: styles$a.hourLabel, children: [hour.toString().padStart(2, '0'), ":00"] }), jsx("div", { className: styles$a.hourSlots, children: halfHourSlots ? (jsxs(Fragment, { children: [jsx("div", { className: styles$a.halfHourSlot, onClick: () => handleSlotClick(hour, 0) }), jsx("div", { className: `${styles$a.halfHourSlot} ${styles$a.halfHourSlotBottom}`, onClick: () => handleSlotClick(hour, 30) })] })) : (jsx("div", { className: styles$a.halfHourSlot, onClick: () => handleSlotClick(hour, 0) })) })] }, hour))), scheduled.map((event) => {
|
|
3246
3310
|
const [h, m] = event.time.split(':').map(Number);
|
|
3247
3311
|
const top = (h - startHour) * hourHeight + (m / 60) * hourHeight;
|
|
3248
3312
|
const duration = eventDuration(event);
|
|
3249
3313
|
const height = Math.max(24, (duration / 60) * hourHeight - 2);
|
|
3250
|
-
return (
|
|
3251
|
-
|
|
3252
|
-
height,
|
|
3253
|
-
backgroundColor: getEventColor(event),
|
|
3254
|
-
color: getEventTextColor(event),
|
|
3255
|
-
opacity: event.status === 'completed' ? 0.7 : 1
|
|
3256
|
-
}, onClick: (e) => {
|
|
3257
|
-
e.stopPropagation();
|
|
3258
|
-
handleEventClick(event);
|
|
3259
|
-
}, initial: { opacity: 0, x: -10 }, animate: { opacity: 1, x: 0 }, transition: { duration: 0.2, delay: eventIndex * 0.03, ease: 'easeOut' }, whileHover: { scale: 1.01, transition: { duration: 0.1 } }, whileTap: { scale: 0.98, transition: { duration: 0.1 } }, drag: onEventDrop ? 'y' : false, dragMomentum: false, onDragEnd: (_, info) => handleEventDragEnd(event, info), children: [iconRenderer && iconRenderer(event), jsxs("span", { className: styles$9.dayEventTitle, children: [jsx("span", { className: styles$9.dayEventTime, children: event.time }), event.title] }), event.status === 'completed' && (jsx("svg", { className: styles$9.completedIcon, width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", children: jsx("polyline", { points: "20,6 9,17 4,12" }) }))] }, event.id));
|
|
3260
|
-
}), showNow && (jsx("div", { className: styles$9.currentTimeIndicator, style: { top: `${nowOffset}px` } }))] }) })] }));
|
|
3314
|
+
return (jsx("div", { className: styles$a.dayEventAnchor, style: { top, height }, onClick: (e) => e.stopPropagation(), children: jsx(DayEventCard, { event: event, color: getEventColor(event), textColor: getEventTextColor(event), onComplete: onEventComplete ?? (onEventClick ? handleEventClick : undefined), onEdit: onEventEdit, onDelete: onEventDelete, onDragEnd: onEventDrop ? (clientY) => handleEventDragEnd(event, clientY) : undefined }) }, event.id));
|
|
3315
|
+
}), showNow && (jsx("div", { className: styles$a.currentTimeIndicator, style: { top: `${nowOffset}px` } }))] }) })] }));
|
|
3261
3316
|
})()) : ((() => {
|
|
3262
3317
|
// Fixed month-view cell height derived from maxEventsPerDay.
|
|
3263
3318
|
// Day number + padding ≈ 40px, each event row ≈ 24px.
|
|
@@ -3265,17 +3320,17 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
|
|
|
3265
3320
|
const monthCellHeight = currentViewMode === 'month' && !compact
|
|
3266
3321
|
? 40 + maxEventsPerDay * 24
|
|
3267
3322
|
: undefined;
|
|
3268
|
-
return (jsx("div", { className: `${styles$
|
|
3323
|
+
return (jsx("div", { className: `${styles$a.daysGrid} ${currentViewMode === 'week' ? styles$a.weekView : ''}`, children: calendarData.days.map((day, index) => {
|
|
3269
3324
|
const dayEvents = getDayEvents(day);
|
|
3270
3325
|
const dayIsToday = isToday(day);
|
|
3271
3326
|
const isInCurrentMonth = currentViewMode === 'week' || isCurrentMonth(day);
|
|
3272
3327
|
const isWeekStart = showWeekNumbers && (index % 7 === 0);
|
|
3273
3328
|
const dayIsSelected = selectedDate && day.toDateString() === selectedDate.toDateString();
|
|
3274
|
-
return (jsxs(motion.div, { className: `${styles$
|
|
3329
|
+
return (jsxs(motion.div, { className: `${styles$a.dayCell} ${dayIsToday ? styles$a.today : ''} ${!isInCurrentMonth ? styles$a.otherMonth : ''} ${dayIsSelected ? styles$a.selected : ''}`, style: monthCellHeight !== undefined ? { height: monthCellHeight, minHeight: monthCellHeight } : undefined, initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: {
|
|
3275
3330
|
duration: 0.3,
|
|
3276
3331
|
delay: index * 0.02,
|
|
3277
3332
|
ease: "easeOut"
|
|
3278
|
-
}, onClick: () => handleDateClick(day), children: [isWeekStart && (jsx("div", { className: styles$
|
|
3333
|
+
}, onClick: () => handleDateClick(day), children: [isWeekStart && (jsx("div", { className: styles$a.weekNumber, children: getWeekNumber(day) })), jsx("div", { className: styles$a.dayNumber, children: day.getDate() }), dayEvents.length > 0 && compact && currentViewMode === 'month' ? (jsxs("div", { className: styles$a.dots, children: [dayEvents.slice(0, maxEventsPerDay).map((event) => (jsx("span", { className: styles$a.dot, style: { backgroundColor: getEventColor(event) } }, event.id))), dayEvents.length > maxEventsPerDay && (jsxs("span", { className: styles$a.dotMore, children: ["+", dayEvents.length - maxEventsPerDay] }))] })) : dayEvents.length > 0 ? (jsxs("div", { className: styles$a.events, children: [dayEvents.slice(0, maxEventsPerDay).map((event, eventIndex) => (jsxs(motion.div, { className: `${styles$a.event} ${event.status === 'completed' ? styles$a.completed : ''}`, style: {
|
|
3279
3334
|
backgroundColor: getEventColor(event),
|
|
3280
3335
|
color: getEventTextColor(event),
|
|
3281
3336
|
opacity: event.status === 'completed' ? 0.7 : 1
|
|
@@ -3293,7 +3348,7 @@ function Calendar({ events, onEventClick, onDateClick, onEventClickByView, onDat
|
|
|
3293
3348
|
}, whileTap: {
|
|
3294
3349
|
scale: 0.98,
|
|
3295
3350
|
transition: { duration: 0.1 }
|
|
3296
|
-
}, children: [iconRenderer && iconRenderer(event), jsxs("span", { className: styles$
|
|
3351
|
+
}, children: [iconRenderer && iconRenderer(event), jsxs("span", { className: styles$a.eventTitle, children: [event.time && (jsx("span", { className: styles$a.eventTime, children: event.time })), event.title] }), event.status === 'completed' && (jsx("svg", { className: styles$a.completedIcon, width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", children: jsx("polyline", { points: "20,6 9,17 4,12" }) }))] }, event.id))), dayEvents.length > maxEventsPerDay && (jsxs("div", { className: styles$a.moreEvents, children: ["+", dayEvents.length - maxEventsPerDay, " more"] }))] })) : emptyState ? (jsx("div", { className: styles$a.emptyState, children: emptyState })) : null] }, `${day.getFullYear()}-${day.getMonth()}-${day.getDate()}`));
|
|
3297
3352
|
}) }));
|
|
3298
3353
|
})())] }));
|
|
3299
3354
|
}
|