@wix/motion 1.659.0 → 2.0.0-rc.2
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/README.md +26 -13
- package/dist/cjs/motion.js +2 -146
- package/dist/cjs/motion.js.map +1 -1
- package/dist/es/AnimationGroup.js +91 -0
- package/dist/es/CustomAnimation.js +169 -0
- package/dist/es/api/common.js +125 -0
- package/dist/es/api/cssAnimations.js +44 -0
- package/dist/es/api/prepare.js +12 -0
- package/dist/es/api/webAnimations.js +128 -0
- package/dist/es/easings.js +218 -0
- package/dist/{esm → es}/index.js +0 -1
- package/dist/es/library/backgroundScroll/BgCloseUp.js +62 -0
- package/dist/es/library/backgroundScroll/BgFade.js +43 -0
- package/dist/es/library/backgroundScroll/BgFadeBack.js +61 -0
- package/dist/es/library/backgroundScroll/BgFake3D.js +88 -0
- package/dist/es/library/backgroundScroll/BgPan.js +39 -0
- package/dist/es/library/backgroundScroll/BgParallax.js +33 -0
- package/dist/es/library/backgroundScroll/BgPullBack.js +35 -0
- package/dist/es/library/backgroundScroll/BgReveal.js +7 -0
- package/dist/es/library/backgroundScroll/BgRotate.js +28 -0
- package/dist/es/library/backgroundScroll/BgSkew.js +33 -0
- package/dist/es/library/backgroundScroll/BgZoom.js +108 -0
- package/dist/es/library/backgroundScroll/ImageParallax.js +46 -0
- package/dist/{esm → es}/library/backgroundScroll/index.js +12 -13
- package/dist/es/library/backgroundScroll/test/BgCloseUp.spec.js +36 -0
- package/dist/es/library/backgroundScroll/test/BgFade.spec.js +34 -0
- package/dist/es/library/backgroundScroll/test/BgFadeBack.spec.js +36 -0
- package/dist/es/library/backgroundScroll/test/BgFake3D.spec.js +63 -0
- package/dist/es/library/backgroundScroll/test/BgPan.spec.js +47 -0
- package/dist/es/library/backgroundScroll/test/BgParallax.spec.js +44 -0
- package/dist/es/library/backgroundScroll/test/BgPullBack.spec.js +42 -0
- package/dist/es/library/backgroundScroll/test/BgRotate.spec.js +46 -0
- package/dist/es/library/backgroundScroll/test/BgSkew.spec.js +46 -0
- package/dist/es/library/backgroundScroll/test/BgZoom.spec.js +105 -0
- package/dist/es/library/backgroundScroll/test/ImageParallax.spec.js +46 -0
- package/dist/es/library/backgroundScroll/test/testUtils.js +3 -0
- package/dist/es/library/backgroundScroll/utils.js +30 -0
- package/dist/es/library/entrance/ArcIn.js +78 -0
- package/dist/es/library/entrance/BlurIn.js +46 -0
- package/dist/es/library/entrance/BounceIn.js +83 -0
- package/dist/es/library/entrance/CircleIn.js +77 -0
- package/dist/es/library/entrance/CurveIn.js +61 -0
- package/dist/es/library/entrance/DropIn.js +46 -0
- package/dist/es/library/entrance/ExpandIn.js +80 -0
- package/dist/es/library/entrance/FadeIn.js +17 -0
- package/dist/es/library/entrance/FlipIn.js +80 -0
- package/dist/es/library/entrance/FloatIn.js +48 -0
- package/dist/es/library/entrance/FoldIn.js +86 -0
- package/dist/es/library/entrance/GlideIn.js +75 -0
- package/dist/es/library/entrance/GlitchIn.js +20 -0
- package/dist/es/library/entrance/GrowIn.js +52 -0
- package/dist/es/library/entrance/PunchIn.js +103 -0
- package/dist/es/library/entrance/RevealIn.js +64 -0
- package/dist/es/library/entrance/ShapeIn.js +55 -0
- package/dist/es/library/entrance/ShuttersIn.js +40 -0
- package/dist/es/library/entrance/SlideIn.js +106 -0
- package/dist/es/library/entrance/SpinIn.js +54 -0
- package/dist/es/library/entrance/TiltIn.js +96 -0
- package/dist/es/library/entrance/TurnIn.js +73 -0
- package/dist/es/library/entrance/WinkIn.js +94 -0
- package/dist/{esm → es}/library/entrance/index.js +23 -24
- package/dist/es/library/entrance/test/ArcIn.spec.js +253 -0
- package/dist/es/library/entrance/test/BlurIn.spec.js +103 -0
- package/dist/es/library/entrance/test/BounceIn.spec.js +943 -0
- package/dist/es/library/entrance/test/CircleIn.spec.js +174 -0
- package/dist/es/library/entrance/test/CurveIn.spec.js +143 -0
- package/dist/es/library/entrance/test/DropIn.spec.js +172 -0
- package/dist/es/library/entrance/test/ExpandIn.spec.js +194 -0
- package/dist/es/library/entrance/test/FadeIn.spec.js +33 -0
- package/dist/es/library/entrance/test/FlipIn.spec.js +125 -0
- package/dist/es/library/entrance/test/FloatIn.spec.js +127 -0
- package/dist/es/library/entrance/test/FoldIn.spec.js +125 -0
- package/dist/es/library/entrance/test/GlideIn.spec.js +133 -0
- package/dist/es/library/entrance/test/GlitchIn.spec.js +216 -0
- package/dist/es/library/entrance/test/GrowIn.spec.js +121 -0
- package/dist/es/library/entrance/test/PunchIn.spec.js +888 -0
- package/dist/es/library/entrance/test/RevealIn.spec.js +121 -0
- package/dist/es/library/entrance/test/ShapeIn.spec.js +221 -0
- package/dist/es/library/entrance/test/ShuttersIn.spec.js +338 -0
- package/dist/es/library/entrance/test/SlideIn.spec.js +149 -0
- package/dist/es/library/entrance/test/SpinIn.spec.js +141 -0
- package/dist/es/library/entrance/test/TiltIn.spec.js +186 -0
- package/dist/es/library/entrance/test/TurnIn.spec.js +224 -0
- package/dist/es/library/entrance/test/WinkIn.spec.js +281 -0
- package/dist/es/library/entrance/test/testUtils.js +3 -0
- package/dist/es/library/mouse/AiryMouse.js +43 -0
- package/dist/es/library/mouse/BlobMouse.js +42 -0
- package/dist/es/library/mouse/BlurMouse.js +56 -0
- package/dist/es/library/mouse/BounceMouse.js +10 -0
- package/dist/es/library/mouse/CustomMouse.js +31 -0
- package/dist/es/library/mouse/ScaleMouse.js +61 -0
- package/dist/es/library/mouse/SkewMouse.js +58 -0
- package/dist/es/library/mouse/SpinMouse.js +26 -0
- package/dist/es/library/mouse/SwivelMouse.js +52 -0
- package/dist/es/library/mouse/Tilt3DMouse.js +34 -0
- package/dist/es/library/mouse/Track3DMouse.js +50 -0
- package/dist/es/library/mouse/TrackMouse.js +43 -0
- package/dist/{esm → es}/library/mouse/index.js +12 -13
- package/dist/es/library/ongoing/Bounce.js +58 -0
- package/dist/es/library/ongoing/Breathe.js +92 -0
- package/dist/es/library/ongoing/Cross.js +218 -0
- package/dist/es/library/ongoing/DVD.js +85 -0
- package/dist/es/library/ongoing/Flash.js +45 -0
- package/dist/es/library/ongoing/Flip.js +57 -0
- package/dist/es/library/ongoing/Fold.js +121 -0
- package/dist/es/library/ongoing/Jello.js +51 -0
- package/dist/es/library/ongoing/Poke.js +61 -0
- package/dist/es/library/ongoing/Pulse.js +58 -0
- package/dist/es/library/ongoing/Rubber.js +60 -0
- package/dist/es/library/ongoing/Spin.js +50 -0
- package/dist/es/library/ongoing/Swing.js +98 -0
- package/dist/es/library/ongoing/Wiggle.js +60 -0
- package/dist/{esm → es}/library/ongoing/index.js +14 -17
- package/dist/es/library/ongoing/test/Bounce.spec.js +771 -0
- package/dist/es/library/ongoing/test/Breathe.spec.js +542 -0
- package/dist/es/library/ongoing/test/Cross.spec.js +579 -0
- package/dist/es/library/ongoing/test/DVD.spec.js +63 -0
- package/dist/es/library/ongoing/test/Flash.spec.js +205 -0
- package/dist/es/library/ongoing/test/Flip.spec.js +324 -0
- package/dist/es/library/ongoing/test/Fold.spec.js +649 -0
- package/dist/es/library/ongoing/test/Jello.spec.js +373 -0
- package/dist/es/library/ongoing/test/Poke.spec.js +590 -0
- package/dist/es/library/ongoing/test/Pulse.spec.js +391 -0
- package/dist/es/library/ongoing/test/Rubber.spec.js +591 -0
- package/dist/es/library/ongoing/test/Spin.spec.js +414 -0
- package/dist/es/library/ongoing/test/Swing.spec.js +240 -0
- package/dist/es/library/ongoing/test/Wiggle.spec.js +464 -0
- package/dist/es/library/ongoing/test/testUtils.js +3 -0
- package/dist/es/library/scroll/ArcScroll.js +43 -0
- package/dist/es/library/scroll/BlurScroll.js +39 -0
- package/dist/es/library/scroll/FadeScroll.js +33 -0
- package/dist/es/library/scroll/FlipScroll.js +44 -0
- package/dist/es/library/scroll/GrowScroll.js +112 -0
- package/dist/es/library/scroll/MoveScroll.js +72 -0
- package/dist/es/library/scroll/PanScroll.js +67 -0
- package/dist/es/library/scroll/ParallaxScroll.js +48 -0
- package/dist/es/library/scroll/RevealScroll.js +87 -0
- package/dist/es/library/scroll/ShapeScroll.js +124 -0
- package/dist/es/library/scroll/ShrinkScroll.js +109 -0
- package/dist/es/library/scroll/ShuttersScroll.js +63 -0
- package/dist/es/library/scroll/SkewPanScroll.js +78 -0
- package/dist/es/library/scroll/SlideScroll.js +105 -0
- package/dist/es/library/scroll/Spin3dScroll.js +92 -0
- package/dist/es/library/scroll/SpinScroll.js +45 -0
- package/dist/es/library/scroll/StretchScroll.js +81 -0
- package/dist/es/library/scroll/TiltScroll.js +118 -0
- package/dist/es/library/scroll/TurnScroll.js +96 -0
- package/dist/{esm → es}/library/scroll/index.js +19 -20
- package/dist/es/library/scroll/test/ArcScroll.spec.js +89 -0
- package/dist/es/library/scroll/test/BlurScroll.spec.js +149 -0
- package/dist/es/library/scroll/test/FadeScroll.spec.js +90 -0
- package/dist/es/library/scroll/test/FlipScroll.spec.js +167 -0
- package/dist/es/library/scroll/test/GrowScroll.spec.js +299 -0
- package/dist/es/library/scroll/test/MoveScroll.spec.js +183 -0
- package/dist/es/library/scroll/test/PanScroll.spec.js +133 -0
- package/dist/es/library/scroll/test/ParallaxScroll.spec.js +51 -0
- package/dist/es/library/scroll/test/RevealScroll.spec.js +131 -0
- package/dist/es/library/scroll/test/ShapeScroll.spec.js +234 -0
- package/dist/es/library/scroll/test/ShrinkScroll.spec.js +180 -0
- package/dist/es/library/scroll/test/ShuttersScroll.spec.js +189 -0
- package/dist/es/library/scroll/test/SkewPanScroll.spec.js +168 -0
- package/dist/es/library/scroll/test/SlideScroll.spec.js +99 -0
- package/dist/es/library/scroll/test/Spin3dScroll.spec.js +184 -0
- package/dist/es/library/scroll/test/SpinScroll.spec.js +188 -0
- package/dist/es/library/scroll/test/StretchScroll.spec.js +235 -0
- package/dist/es/library/scroll/test/TiltScroll.spec.js +206 -0
- package/dist/es/library/scroll/test/TurnScroll.spec.js +148 -0
- package/dist/es/library/scroll/test/testUtils.js +3 -0
- package/dist/es/motion.js +5440 -0
- package/dist/es/motion.js.map +1 -0
- package/dist/es/types.js +1 -0
- package/dist/es/utils.js +251 -0
- package/dist/tsconfig.tsbuildinfo +1 -0
- package/dist/types/AnimationGroup.d.ts.map +1 -1
- package/dist/types/CustomAnimation.d.ts +2 -2
- package/dist/types/CustomAnimation.d.ts.map +1 -1
- package/dist/types/api/common.d.ts +109 -109
- package/dist/types/api/common.d.ts.map +1 -1
- package/dist/types/api/cssAnimations.d.ts.map +1 -1
- package/dist/types/api/prepare.d.ts.map +1 -1
- package/dist/types/api/webAnimations.d.ts.map +1 -1
- package/dist/types/easings.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgCloseUp.d.ts +28 -28
- package/dist/types/library/backgroundScroll/BgCloseUp.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgFade.d.ts +14 -14
- package/dist/types/library/backgroundScroll/BgFade.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgFadeBack.d.ts +28 -28
- package/dist/types/library/backgroundScroll/BgFadeBack.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgFake3D.d.ts +28 -28
- package/dist/types/library/backgroundScroll/BgFake3D.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgPan.d.ts +15 -15
- package/dist/types/library/backgroundScroll/BgPan.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgParallax.d.ts +15 -15
- package/dist/types/library/backgroundScroll/BgParallax.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgPullBack.d.ts +14 -14
- package/dist/types/library/backgroundScroll/BgPullBack.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgRotate.d.ts +14 -14
- package/dist/types/library/backgroundScroll/BgRotate.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgSkew.d.ts +15 -15
- package/dist/types/library/backgroundScroll/BgSkew.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/BgZoom.d.ts +42 -42
- package/dist/types/library/backgroundScroll/BgZoom.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/ImageParallax.d.ts +15 -15
- package/dist/types/library/backgroundScroll/ImageParallax.d.ts.map +1 -1
- package/dist/types/library/backgroundScroll/test/BgCloseUp.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgCloseUp.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgFade.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgFade.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgFadeBack.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgFadeBack.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgFake3D.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgFake3D.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgPan.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgPan.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgParallax.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgParallax.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgPullBack.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgPullBack.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgRotate.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgRotate.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgSkew.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgSkew.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/BgZoom.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/BgZoom.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/test/ImageParallax.spec.d.ts +2 -0
- package/dist/types/library/backgroundScroll/test/ImageParallax.spec.d.ts.map +1 -0
- package/dist/types/library/backgroundScroll/utils.d.ts.map +1 -1
- package/dist/types/library/entrance/ArcIn.d.ts +42 -42
- package/dist/types/library/entrance/ArcIn.d.ts.map +1 -1
- package/dist/types/library/entrance/BlurIn.d.ts +42 -42
- package/dist/types/library/entrance/BlurIn.d.ts.map +1 -1
- package/dist/types/library/entrance/BounceIn.d.ts +42 -42
- package/dist/types/library/entrance/BounceIn.d.ts.map +1 -1
- package/dist/types/library/entrance/CircleIn.d.ts +44 -44
- package/dist/types/library/entrance/CurveIn.d.ts +22 -22
- package/dist/types/library/entrance/DropIn.d.ts +42 -42
- package/dist/types/library/entrance/DropIn.d.ts.map +1 -1
- package/dist/types/library/entrance/ExpandIn.d.ts +44 -44
- package/dist/types/library/entrance/ExpandIn.d.ts.map +1 -1
- package/dist/types/library/entrance/FadeIn.d.ts +22 -22
- package/dist/types/library/entrance/FadeIn.d.ts.map +1 -1
- package/dist/types/library/entrance/FlipIn.d.ts +44 -44
- package/dist/types/library/entrance/FlipIn.d.ts.map +1 -1
- package/dist/types/library/entrance/FloatIn.d.ts +22 -22
- package/dist/types/library/entrance/FoldIn.d.ts +44 -44
- package/dist/types/library/entrance/FoldIn.d.ts.map +1 -1
- package/dist/types/library/entrance/GlideIn.d.ts +22 -22
- package/dist/types/library/entrance/GlideIn.d.ts.map +1 -1
- package/dist/types/library/entrance/GlitchIn.d.ts +22 -22
- package/dist/types/library/entrance/GlitchIn.d.ts.map +1 -1
- package/dist/types/library/entrance/GrowIn.d.ts +42 -42
- package/dist/types/library/entrance/GrowIn.d.ts.map +1 -1
- package/dist/types/library/entrance/PunchIn.d.ts +42 -42
- package/dist/types/library/entrance/PunchIn.d.ts.map +1 -1
- package/dist/types/library/entrance/RevealIn.d.ts +22 -22
- package/dist/types/library/entrance/RevealIn.d.ts.map +1 -1
- package/dist/types/library/entrance/ShapeIn.d.ts +42 -42
- package/dist/types/library/entrance/ShapeIn.d.ts.map +1 -1
- package/dist/types/library/entrance/ShuttersIn.d.ts +22 -22
- package/dist/types/library/entrance/ShuttersIn.d.ts.map +1 -1
- package/dist/types/library/entrance/SlideIn.d.ts +22 -22
- package/dist/types/library/entrance/SlideIn.d.ts.map +1 -1
- package/dist/types/library/entrance/SpinIn.d.ts +42 -42
- package/dist/types/library/entrance/SpinIn.d.ts.map +1 -1
- package/dist/types/library/entrance/TiltIn.d.ts +62 -62
- package/dist/types/library/entrance/TiltIn.d.ts.map +1 -1
- package/dist/types/library/entrance/TurnIn.d.ts +42 -42
- package/dist/types/library/entrance/TurnIn.d.ts.map +1 -1
- package/dist/types/library/entrance/WinkIn.d.ts +64 -64
- package/dist/types/library/entrance/WinkIn.d.ts.map +1 -1
- package/dist/types/library/entrance/test/ArcIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/ArcIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/BlurIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/BlurIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/BounceIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/BounceIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/CircleIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/CircleIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/CurveIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/CurveIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/DropIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/DropIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/ExpandIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/ExpandIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/FadeIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/FadeIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/FlipIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/FlipIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/FloatIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/FloatIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/FoldIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/FoldIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/GlideIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/GlideIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/GlitchIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/GlitchIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/GrowIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/GrowIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/PunchIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/PunchIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/RevealIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/RevealIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/ShapeIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/ShapeIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/ShuttersIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/ShuttersIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/SlideIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/SlideIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/SpinIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/SpinIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/TiltIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/TiltIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/TurnIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/TurnIn.spec.d.ts.map +1 -0
- package/dist/types/library/entrance/test/WinkIn.spec.d.ts +2 -0
- package/dist/types/library/entrance/test/WinkIn.spec.d.ts.map +1 -0
- package/dist/types/library/mouse/AiryMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/BlobMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/BlurMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/BounceMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/CustomMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/ScaleMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/SkewMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/SpinMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/SwivelMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/Tilt3DMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/Track3DMouse.d.ts.map +1 -1
- package/dist/types/library/mouse/TrackMouse.d.ts.map +1 -1
- package/dist/types/library/ongoing/Bounce.d.ts +24 -24
- package/dist/types/library/ongoing/Bounce.d.ts.map +1 -1
- package/dist/types/library/ongoing/Breathe.d.ts +24 -25
- package/dist/types/library/ongoing/Breathe.d.ts.map +1 -1
- package/dist/types/library/ongoing/Cross.d.ts +12 -12
- package/dist/types/library/ongoing/Cross.d.ts.map +1 -1
- package/dist/types/library/ongoing/DVD.d.ts +16 -16
- package/dist/types/library/ongoing/Flash.d.ts +24 -24
- package/dist/types/library/ongoing/Flash.d.ts.map +1 -1
- package/dist/types/library/ongoing/Flip.d.ts +24 -24
- package/dist/types/library/ongoing/Flip.d.ts.map +1 -1
- package/dist/types/library/ongoing/Fold.d.ts +24 -25
- package/dist/types/library/ongoing/Fold.d.ts.map +1 -1
- package/dist/types/library/ongoing/Jello.d.ts +24 -24
- package/dist/types/library/ongoing/Jello.d.ts.map +1 -1
- package/dist/types/library/ongoing/Poke.d.ts +24 -24
- package/dist/types/library/ongoing/Poke.d.ts.map +1 -1
- package/dist/types/library/ongoing/Pulse.d.ts +24 -24
- package/dist/types/library/ongoing/Pulse.d.ts.map +1 -1
- package/dist/types/library/ongoing/Rubber.d.ts +24 -24
- package/dist/types/library/ongoing/Rubber.d.ts.map +1 -1
- package/dist/types/library/ongoing/Spin.d.ts +24 -24
- package/dist/types/library/ongoing/Spin.d.ts.map +1 -1
- package/dist/types/library/ongoing/Swing.d.ts +24 -25
- package/dist/types/library/ongoing/Swing.d.ts.map +1 -1
- package/dist/types/library/ongoing/Wiggle.d.ts +24 -24
- package/dist/types/library/ongoing/Wiggle.d.ts.map +1 -1
- package/dist/types/library/ongoing/index.d.ts.map +1 -1
- package/dist/types/library/ongoing/test/Bounce.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Bounce.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Breathe.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Breathe.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Cross.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Cross.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/DVD.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/DVD.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Flash.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Flash.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Flip.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Flip.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Fold.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Fold.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Jello.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Jello.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Poke.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Poke.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Pulse.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Pulse.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Rubber.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Rubber.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Spin.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Spin.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Swing.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Swing.spec.d.ts.map +1 -0
- package/dist/types/library/ongoing/test/Wiggle.spec.d.ts +2 -0
- package/dist/types/library/ongoing/test/Wiggle.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/ArcScroll.d.ts +15 -15
- package/dist/types/library/scroll/ArcScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/BlurScroll.d.ts +15 -15
- package/dist/types/library/scroll/BlurScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/FadeScroll.d.ts +15 -15
- package/dist/types/library/scroll/FadeScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/FlipScroll.d.ts +15 -15
- package/dist/types/library/scroll/FlipScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/GrowScroll.d.ts +15 -15
- package/dist/types/library/scroll/GrowScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/MoveScroll.d.ts +15 -15
- package/dist/types/library/scroll/MoveScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/PanScroll.d.ts +15 -15
- package/dist/types/library/scroll/PanScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/ParallaxScroll.d.ts +15 -15
- package/dist/types/library/scroll/ParallaxScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/RevealScroll.d.ts +15 -15
- package/dist/types/library/scroll/RevealScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/ShapeScroll.d.ts +15 -15
- package/dist/types/library/scroll/ShapeScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/ShrinkScroll.d.ts +15 -15
- package/dist/types/library/scroll/ShrinkScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/ShuttersScroll.d.ts +15 -15
- package/dist/types/library/scroll/ShuttersScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/SkewPanScroll.d.ts +15 -15
- package/dist/types/library/scroll/SkewPanScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/SlideScroll.d.ts +15 -15
- package/dist/types/library/scroll/SlideScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/Spin3dScroll.d.ts +15 -15
- package/dist/types/library/scroll/Spin3dScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/SpinScroll.d.ts +15 -15
- package/dist/types/library/scroll/SpinScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/StretchScroll.d.ts +30 -30
- package/dist/types/library/scroll/StretchScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/TiltScroll.d.ts +30 -30
- package/dist/types/library/scroll/TiltScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/TurnScroll.d.ts +18 -18
- package/dist/types/library/scroll/TurnScroll.d.ts.map +1 -1
- package/dist/types/library/scroll/test/ArcScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/ArcScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/BlurScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/BlurScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/FadeScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/FadeScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/FlipScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/FlipScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/GrowScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/GrowScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/MoveScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/MoveScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/PanScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/PanScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/ParallaxScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/ParallaxScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/RevealScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/RevealScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/ShapeScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/ShapeScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/ShrinkScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/ShrinkScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/ShuttersScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/ShuttersScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/SkewPanScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/SkewPanScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/SlideScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/SlideScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/Spin3dScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/Spin3dScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/SpinScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/SpinScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/StretchScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/StretchScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/TiltScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/TiltScroll.spec.d.ts.map +1 -0
- package/dist/types/library/scroll/test/TurnScroll.spec.d.ts +2 -0
- package/dist/types/library/scroll/test/TurnScroll.spec.d.ts.map +1 -0
- package/dist/types/motion.d.ts.map +1 -1
- package/dist/types/types.d.ts +3 -3
- package/dist/types/types.d.ts.map +1 -1
- package/dist/types/utils.d.ts +11 -0
- package/dist/types/utils.d.ts.map +1 -1
- package/package.json +54 -74
- package/dist/cjs/AnimationGroup.js +0 -106
- package/dist/cjs/AnimationGroup.js.map +0 -1
- package/dist/cjs/CustomAnimation.js +0 -190
- package/dist/cjs/CustomAnimation.js.map +0 -1
- package/dist/cjs/api/common.js +0 -145
- package/dist/cjs/api/common.js.map +0 -1
- package/dist/cjs/api/cssAnimations.js +0 -58
- package/dist/cjs/api/cssAnimations.js.map +0 -1
- package/dist/cjs/api/prepare.js +0 -20
- package/dist/cjs/api/prepare.js.map +0 -1
- package/dist/cjs/api/webAnimations.js +0 -155
- package/dist/cjs/api/webAnimations.js.map +0 -1
- package/dist/cjs/easings.js +0 -272
- package/dist/cjs/easings.js.map +0 -1
- package/dist/cjs/external-types.d.js +0 -2
- package/dist/cjs/external-types.d.js.map +0 -1
- package/dist/cjs/index.js +0 -16
- package/dist/cjs/index.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgCloseUp.js +0 -74
- package/dist/cjs/library/backgroundScroll/BgCloseUp.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgFade.js +0 -51
- package/dist/cjs/library/backgroundScroll/BgFade.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgFadeBack.js +0 -73
- package/dist/cjs/library/backgroundScroll/BgFadeBack.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgFake3D.js +0 -103
- package/dist/cjs/library/backgroundScroll/BgFake3D.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgPan.js +0 -50
- package/dist/cjs/library/backgroundScroll/BgPan.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgParallax.js +0 -43
- package/dist/cjs/library/backgroundScroll/BgParallax.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgPullBack.js +0 -45
- package/dist/cjs/library/backgroundScroll/BgPullBack.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgReveal.js +0 -14
- package/dist/cjs/library/backgroundScroll/BgReveal.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgRotate.js +0 -37
- package/dist/cjs/library/backgroundScroll/BgRotate.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgSkew.js +0 -44
- package/dist/cjs/library/backgroundScroll/BgSkew.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/BgZoom.js +0 -125
- package/dist/cjs/library/backgroundScroll/BgZoom.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/ImageParallax.js +0 -58
- package/dist/cjs/library/backgroundScroll/ImageParallax.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/index.js +0 -32
- package/dist/cjs/library/backgroundScroll/index.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/test/testUtils.js +0 -8
- package/dist/cjs/library/backgroundScroll/test/testUtils.js.map +0 -1
- package/dist/cjs/library/backgroundScroll/utils.js +0 -37
- package/dist/cjs/library/backgroundScroll/utils.js.map +0 -1
- package/dist/cjs/library/entrance/ArcIn.js +0 -110
- package/dist/cjs/library/entrance/ArcIn.js.map +0 -1
- package/dist/cjs/library/entrance/BlurIn.js +0 -56
- package/dist/cjs/library/entrance/BlurIn.js.map +0 -1
- package/dist/cjs/library/entrance/BounceIn.js +0 -143
- package/dist/cjs/library/entrance/BounceIn.js.map +0 -1
- package/dist/cjs/library/entrance/CircleIn.js +0 -75
- package/dist/cjs/library/entrance/CircleIn.js.map +0 -1
- package/dist/cjs/library/entrance/CurveIn.js +0 -80
- package/dist/cjs/library/entrance/CurveIn.js.map +0 -1
- package/dist/cjs/library/entrance/DropIn.js +0 -64
- package/dist/cjs/library/entrance/DropIn.js.map +0 -1
- package/dist/cjs/library/entrance/ExpandIn.js +0 -121
- package/dist/cjs/library/entrance/ExpandIn.js.map +0 -1
- package/dist/cjs/library/entrance/FadeIn.js +0 -27
- package/dist/cjs/library/entrance/FadeIn.js.map +0 -1
- package/dist/cjs/library/entrance/FlipIn.js +0 -107
- package/dist/cjs/library/entrance/FlipIn.js.map +0 -1
- package/dist/cjs/library/entrance/FloatIn.js +0 -67
- package/dist/cjs/library/entrance/FloatIn.js.map +0 -1
- package/dist/cjs/library/entrance/FoldIn.js +0 -134
- package/dist/cjs/library/entrance/FoldIn.js.map +0 -1
- package/dist/cjs/library/entrance/GlideIn.js +0 -89
- package/dist/cjs/library/entrance/GlideIn.js.map +0 -1
- package/dist/cjs/library/entrance/GlitchIn.js +0 -29
- package/dist/cjs/library/entrance/GlitchIn.js.map +0 -1
- package/dist/cjs/library/entrance/GrowIn.js +0 -66
- package/dist/cjs/library/entrance/GrowIn.js.map +0 -1
- package/dist/cjs/library/entrance/PunchIn.js +0 -178
- package/dist/cjs/library/entrance/PunchIn.js.map +0 -1
- package/dist/cjs/library/entrance/RevealIn.js +0 -72
- package/dist/cjs/library/entrance/RevealIn.js.map +0 -1
- package/dist/cjs/library/entrance/ShapeIn.js +0 -75
- package/dist/cjs/library/entrance/ShapeIn.js.map +0 -1
- package/dist/cjs/library/entrance/ShuttersIn.js +0 -48
- package/dist/cjs/library/entrance/ShuttersIn.js.map +0 -1
- package/dist/cjs/library/entrance/SlideIn.js +0 -140
- package/dist/cjs/library/entrance/SlideIn.js.map +0 -1
- package/dist/cjs/library/entrance/SpinIn.js +0 -65
- package/dist/cjs/library/entrance/SpinIn.js.map +0 -1
- package/dist/cjs/library/entrance/TiltIn.js +0 -102
- package/dist/cjs/library/entrance/TiltIn.js.map +0 -1
- package/dist/cjs/library/entrance/TurnIn.js +0 -85
- package/dist/cjs/library/entrance/TurnIn.js.map +0 -1
- package/dist/cjs/library/entrance/WinkIn.js +0 -115
- package/dist/cjs/library/entrance/WinkIn.js.map +0 -1
- package/dist/cjs/library/entrance/index.js +0 -55
- package/dist/cjs/library/entrance/index.js.map +0 -1
- package/dist/cjs/library/entrance/test/testUtils.js +0 -8
- package/dist/cjs/library/entrance/test/testUtils.js.map +0 -1
- package/dist/cjs/library/mouse/AiryMouse.js +0 -76
- package/dist/cjs/library/mouse/AiryMouse.js.map +0 -1
- package/dist/cjs/library/mouse/BlobMouse.js +0 -70
- package/dist/cjs/library/mouse/BlobMouse.js.map +0 -1
- package/dist/cjs/library/mouse/BlurMouse.js +0 -94
- package/dist/cjs/library/mouse/BlurMouse.js.map +0 -1
- package/dist/cjs/library/mouse/BounceMouse.js +0 -26
- package/dist/cjs/library/mouse/BounceMouse.js.map +0 -1
- package/dist/cjs/library/mouse/CustomMouse.js +0 -65
- package/dist/cjs/library/mouse/CustomMouse.js.map +0 -1
- package/dist/cjs/library/mouse/ScaleMouse.js +0 -98
- package/dist/cjs/library/mouse/ScaleMouse.js.map +0 -1
- package/dist/cjs/library/mouse/SkewMouse.js +0 -92
- package/dist/cjs/library/mouse/SkewMouse.js.map +0 -1
- package/dist/cjs/library/mouse/SpinMouse.js +0 -41
- package/dist/cjs/library/mouse/SpinMouse.js.map +0 -1
- package/dist/cjs/library/mouse/SwivelMouse.js +0 -85
- package/dist/cjs/library/mouse/SwivelMouse.js.map +0 -1
- package/dist/cjs/library/mouse/Tilt3DMouse.js +0 -65
- package/dist/cjs/library/mouse/Tilt3DMouse.js.map +0 -1
- package/dist/cjs/library/mouse/Track3DMouse.js +0 -87
- package/dist/cjs/library/mouse/Track3DMouse.js.map +0 -1
- package/dist/cjs/library/mouse/TrackMouse.js +0 -65
- package/dist/cjs/library/mouse/TrackMouse.js.map +0 -1
- package/dist/cjs/library/mouse/index.js +0 -32
- package/dist/cjs/library/mouse/index.js.map +0 -1
- package/dist/cjs/library/ongoing/Blink.js +0 -120
- package/dist/cjs/library/ongoing/Blink.js.map +0 -1
- package/dist/cjs/library/ongoing/Bounce.js +0 -92
- package/dist/cjs/library/ongoing/Bounce.js.map +0 -1
- package/dist/cjs/library/ongoing/Breathe.js +0 -124
- package/dist/cjs/library/ongoing/Breathe.js.map +0 -1
- package/dist/cjs/library/ongoing/Cross.js +0 -262
- package/dist/cjs/library/ongoing/Cross.js.map +0 -1
- package/dist/cjs/library/ongoing/DVD.js +0 -84
- package/dist/cjs/library/ongoing/DVD.js.map +0 -1
- package/dist/cjs/library/ongoing/Flash.js +0 -45
- package/dist/cjs/library/ongoing/Flash.js.map +0 -1
- package/dist/cjs/library/ongoing/Flip.js +0 -67
- package/dist/cjs/library/ongoing/Flip.js.map +0 -1
- package/dist/cjs/library/ongoing/Fold.js +0 -167
- package/dist/cjs/library/ongoing/Fold.js.map +0 -1
- package/dist/cjs/library/ongoing/Jello.js +0 -72
- package/dist/cjs/library/ongoing/Jello.js.map +0 -1
- package/dist/cjs/library/ongoing/Poke.js +0 -102
- package/dist/cjs/library/ongoing/Poke.js.map +0 -1
- package/dist/cjs/library/ongoing/Pulse.js +0 -75
- package/dist/cjs/library/ongoing/Pulse.js.map +0 -1
- package/dist/cjs/library/ongoing/Rubber.js +0 -92
- package/dist/cjs/library/ongoing/Rubber.js.map +0 -1
- package/dist/cjs/library/ongoing/Spin.js +0 -55
- package/dist/cjs/library/ongoing/Spin.js.map +0 -1
- package/dist/cjs/library/ongoing/Swing.js +0 -130
- package/dist/cjs/library/ongoing/Swing.js.map +0 -1
- package/dist/cjs/library/ongoing/Wiggle.js +0 -88
- package/dist/cjs/library/ongoing/Wiggle.js.map +0 -1
- package/dist/cjs/library/ongoing/index.js +0 -41
- package/dist/cjs/library/ongoing/index.js.map +0 -1
- package/dist/cjs/library/ongoing/test/testUtils.js +0 -8
- package/dist/cjs/library/ongoing/test/testUtils.js.map +0 -1
- package/dist/cjs/library/scroll/ArcScroll.js +0 -58
- package/dist/cjs/library/scroll/ArcScroll.js.map +0 -1
- package/dist/cjs/library/scroll/BlurScroll.js +0 -43
- package/dist/cjs/library/scroll/BlurScroll.js.map +0 -1
- package/dist/cjs/library/scroll/FadeScroll.js +0 -36
- package/dist/cjs/library/scroll/FadeScroll.js.map +0 -1
- package/dist/cjs/library/scroll/FlipScroll.js +0 -50
- package/dist/cjs/library/scroll/FlipScroll.js.map +0 -1
- package/dist/cjs/library/scroll/GrowScroll.js +0 -160
- package/dist/cjs/library/scroll/GrowScroll.js.map +0 -1
- package/dist/cjs/library/scroll/MoveScroll.js +0 -123
- package/dist/cjs/library/scroll/MoveScroll.js.map +0 -1
- package/dist/cjs/library/scroll/PanScroll.js +0 -77
- package/dist/cjs/library/scroll/PanScroll.js.map +0 -1
- package/dist/cjs/library/scroll/ParallaxScroll.js +0 -56
- package/dist/cjs/library/scroll/ParallaxScroll.js.map +0 -1
- package/dist/cjs/library/scroll/RevealScroll.js +0 -92
- package/dist/cjs/library/scroll/RevealScroll.js.map +0 -1
- package/dist/cjs/library/scroll/ShapeScroll.js +0 -114
- package/dist/cjs/library/scroll/ShapeScroll.js.map +0 -1
- package/dist/cjs/library/scroll/ShrinkScroll.js +0 -157
- package/dist/cjs/library/scroll/ShrinkScroll.js.map +0 -1
- package/dist/cjs/library/scroll/ShuttersScroll.js +0 -67
- package/dist/cjs/library/scroll/ShuttersScroll.js.map +0 -1
- package/dist/cjs/library/scroll/SkewPanScroll.js +0 -113
- package/dist/cjs/library/scroll/SkewPanScroll.js.map +0 -1
- package/dist/cjs/library/scroll/SlideScroll.js +0 -115
- package/dist/cjs/library/scroll/SlideScroll.js.map +0 -1
- package/dist/cjs/library/scroll/Spin3dScroll.js +0 -119
- package/dist/cjs/library/scroll/Spin3dScroll.js.map +0 -1
- package/dist/cjs/library/scroll/SpinScroll.js +0 -51
- package/dist/cjs/library/scroll/SpinScroll.js.map +0 -1
- package/dist/cjs/library/scroll/StretchScroll.js +0 -105
- package/dist/cjs/library/scroll/StretchScroll.js.map +0 -1
- package/dist/cjs/library/scroll/TiltScroll.js +0 -129
- package/dist/cjs/library/scroll/TiltScroll.js.map +0 -1
- package/dist/cjs/library/scroll/TurnScroll.js +0 -125
- package/dist/cjs/library/scroll/TurnScroll.js.map +0 -1
- package/dist/cjs/library/scroll/index.js +0 -46
- package/dist/cjs/library/scroll/index.js.map +0 -1
- package/dist/cjs/library/scroll/test/testUtils.js +0 -8
- package/dist/cjs/library/scroll/test/testUtils.js.map +0 -1
- package/dist/cjs/playground/animationMotionBgScroll.stories.js +0 -369
- package/dist/cjs/playground/animationMotionBgScroll.stories.js.map +0 -1
- package/dist/cjs/playground/animationsMotion.stories.js +0 -199
- package/dist/cjs/playground/animationsMotion.stories.js.map +0 -1
- package/dist/cjs/playground/animationsMotionMouse.stories.js +0 -266
- package/dist/cjs/playground/animationsMotionMouse.stories.js.map +0 -1
- package/dist/cjs/playground/animationsMotionOngoing.stories.js +0 -195
- package/dist/cjs/playground/animationsMotionOngoing.stories.js.map +0 -1
- package/dist/cjs/playground/animationsMotionScroll.stories.js +0 -270
- package/dist/cjs/playground/animationsMotionScroll.stories.js.map +0 -1
- package/dist/cjs/playground/controls.js +0 -334
- package/dist/cjs/playground/controls.js.map +0 -1
- package/dist/cjs/playground/mouse-parallax-components/plastic.jpeg +0 -0
- package/dist/cjs/playground/mouse-parallax-components/vector.svg +0 -19
- package/dist/cjs/playground/mouseComponent.js +0 -114
- package/dist/cjs/playground/mouseComponent.js.map +0 -1
- package/dist/cjs/playground/playground-common.js +0 -84
- package/dist/cjs/playground/playground-common.js.map +0 -1
- package/dist/cjs/playground/playground.module.scss +0 -381
- package/dist/cjs/test-types.d.js +0 -2
- package/dist/cjs/test-types.d.js.map +0 -1
- package/dist/cjs/types.js +0 -2
- package/dist/cjs/types.js.map +0 -1
- package/dist/cjs/utils.js +0 -305
- package/dist/cjs/utils.js.map +0 -1
- package/dist/esm/AnimationGroup.js +0 -100
- package/dist/esm/AnimationGroup.js.map +0 -1
- package/dist/esm/CustomAnimation.js +0 -184
- package/dist/esm/CustomAnimation.js.map +0 -1
- package/dist/esm/api/common.js +0 -132
- package/dist/esm/api/common.js.map +0 -1
- package/dist/esm/api/cssAnimations.js +0 -53
- package/dist/esm/api/cssAnimations.js.map +0 -1
- package/dist/esm/api/prepare.js +0 -16
- package/dist/esm/api/prepare.js.map +0 -1
- package/dist/esm/api/webAnimations.js +0 -152
- package/dist/esm/api/webAnimations.js.map +0 -1
- package/dist/esm/easings.js +0 -248
- package/dist/esm/easings.js.map +0 -1
- package/dist/esm/external-types.d.js +0 -2
- package/dist/esm/external-types.d.js.map +0 -1
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgCloseUp.js +0 -70
- package/dist/esm/library/backgroundScroll/BgCloseUp.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgFade.js +0 -47
- package/dist/esm/library/backgroundScroll/BgFade.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgFadeBack.js +0 -69
- package/dist/esm/library/backgroundScroll/BgFadeBack.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgFake3D.js +0 -99
- package/dist/esm/library/backgroundScroll/BgFake3D.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgPan.js +0 -46
- package/dist/esm/library/backgroundScroll/BgPan.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgParallax.js +0 -39
- package/dist/esm/library/backgroundScroll/BgParallax.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgPullBack.js +0 -41
- package/dist/esm/library/backgroundScroll/BgPullBack.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgReveal.js +0 -10
- package/dist/esm/library/backgroundScroll/BgReveal.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgRotate.js +0 -33
- package/dist/esm/library/backgroundScroll/BgRotate.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgSkew.js +0 -40
- package/dist/esm/library/backgroundScroll/BgSkew.js.map +0 -1
- package/dist/esm/library/backgroundScroll/BgZoom.js +0 -121
- package/dist/esm/library/backgroundScroll/BgZoom.js.map +0 -1
- package/dist/esm/library/backgroundScroll/ImageParallax.js +0 -54
- package/dist/esm/library/backgroundScroll/ImageParallax.js.map +0 -1
- package/dist/esm/library/backgroundScroll/index.js.map +0 -1
- package/dist/esm/library/backgroundScroll/test/testUtils.js +0 -4
- package/dist/esm/library/backgroundScroll/test/testUtils.js.map +0 -1
- package/dist/esm/library/backgroundScroll/utils.js +0 -31
- package/dist/esm/library/backgroundScroll/utils.js.map +0 -1
- package/dist/esm/library/entrance/ArcIn.js +0 -106
- package/dist/esm/library/entrance/ArcIn.js.map +0 -1
- package/dist/esm/library/entrance/BlurIn.js +0 -53
- package/dist/esm/library/entrance/BlurIn.js.map +0 -1
- package/dist/esm/library/entrance/BounceIn.js +0 -143
- package/dist/esm/library/entrance/BounceIn.js.map +0 -1
- package/dist/esm/library/entrance/CircleIn.js +0 -71
- package/dist/esm/library/entrance/CircleIn.js.map +0 -1
- package/dist/esm/library/entrance/CurveIn.js +0 -76
- package/dist/esm/library/entrance/CurveIn.js.map +0 -1
- package/dist/esm/library/entrance/DropIn.js +0 -61
- package/dist/esm/library/entrance/DropIn.js.map +0 -1
- package/dist/esm/library/entrance/ExpandIn.js +0 -117
- package/dist/esm/library/entrance/ExpandIn.js.map +0 -1
- package/dist/esm/library/entrance/FadeIn.js +0 -21
- package/dist/esm/library/entrance/FadeIn.js.map +0 -1
- package/dist/esm/library/entrance/FlipIn.js +0 -100
- package/dist/esm/library/entrance/FlipIn.js.map +0 -1
- package/dist/esm/library/entrance/FloatIn.js +0 -64
- package/dist/esm/library/entrance/FloatIn.js.map +0 -1
- package/dist/esm/library/entrance/FoldIn.js +0 -127
- package/dist/esm/library/entrance/FoldIn.js.map +0 -1
- package/dist/esm/library/entrance/GlideIn.js +0 -85
- package/dist/esm/library/entrance/GlideIn.js.map +0 -1
- package/dist/esm/library/entrance/GlitchIn.js +0 -22
- package/dist/esm/library/entrance/GlitchIn.js.map +0 -1
- package/dist/esm/library/entrance/GrowIn.js +0 -63
- package/dist/esm/library/entrance/GrowIn.js.map +0 -1
- package/dist/esm/library/entrance/PunchIn.js +0 -175
- package/dist/esm/library/entrance/PunchIn.js.map +0 -1
- package/dist/esm/library/entrance/RevealIn.js +0 -65
- package/dist/esm/library/entrance/RevealIn.js.map +0 -1
- package/dist/esm/library/entrance/ShapeIn.js +0 -72
- package/dist/esm/library/entrance/ShapeIn.js.map +0 -1
- package/dist/esm/library/entrance/ShuttersIn.js +0 -45
- package/dist/esm/library/entrance/ShuttersIn.js.map +0 -1
- package/dist/esm/library/entrance/SlideIn.js +0 -133
- package/dist/esm/library/entrance/SlideIn.js.map +0 -1
- package/dist/esm/library/entrance/SpinIn.js +0 -62
- package/dist/esm/library/entrance/SpinIn.js.map +0 -1
- package/dist/esm/library/entrance/TiltIn.js +0 -98
- package/dist/esm/library/entrance/TiltIn.js.map +0 -1
- package/dist/esm/library/entrance/TurnIn.js +0 -82
- package/dist/esm/library/entrance/TurnIn.js.map +0 -1
- package/dist/esm/library/entrance/WinkIn.js +0 -108
- package/dist/esm/library/entrance/WinkIn.js.map +0 -1
- package/dist/esm/library/entrance/index.js.map +0 -1
- package/dist/esm/library/entrance/test/testUtils.js +0 -4
- package/dist/esm/library/entrance/test/testUtils.js.map +0 -1
- package/dist/esm/library/mouse/AiryMouse.js +0 -73
- package/dist/esm/library/mouse/AiryMouse.js.map +0 -1
- package/dist/esm/library/mouse/BlobMouse.js +0 -67
- package/dist/esm/library/mouse/BlobMouse.js.map +0 -1
- package/dist/esm/library/mouse/BlurMouse.js +0 -91
- package/dist/esm/library/mouse/BlurMouse.js.map +0 -1
- package/dist/esm/library/mouse/BounceMouse.js +0 -21
- package/dist/esm/library/mouse/BounceMouse.js.map +0 -1
- package/dist/esm/library/mouse/CustomMouse.js +0 -59
- package/dist/esm/library/mouse/CustomMouse.js.map +0 -1
- package/dist/esm/library/mouse/ScaleMouse.js +0 -95
- package/dist/esm/library/mouse/ScaleMouse.js.map +0 -1
- package/dist/esm/library/mouse/SkewMouse.js +0 -89
- package/dist/esm/library/mouse/SkewMouse.js.map +0 -1
- package/dist/esm/library/mouse/SpinMouse.js +0 -38
- package/dist/esm/library/mouse/SpinMouse.js.map +0 -1
- package/dist/esm/library/mouse/SwivelMouse.js +0 -82
- package/dist/esm/library/mouse/SwivelMouse.js.map +0 -1
- package/dist/esm/library/mouse/Tilt3DMouse.js +0 -62
- package/dist/esm/library/mouse/Tilt3DMouse.js.map +0 -1
- package/dist/esm/library/mouse/Track3DMouse.js +0 -84
- package/dist/esm/library/mouse/Track3DMouse.js.map +0 -1
- package/dist/esm/library/mouse/TrackMouse.js +0 -62
- package/dist/esm/library/mouse/TrackMouse.js.map +0 -1
- package/dist/esm/library/mouse/index.js.map +0 -1
- package/dist/esm/library/ongoing/Blink.js +0 -115
- package/dist/esm/library/ongoing/Blink.js.map +0 -1
- package/dist/esm/library/ongoing/Bounce.js +0 -92
- package/dist/esm/library/ongoing/Bounce.js.map +0 -1
- package/dist/esm/library/ongoing/Breathe.js +0 -122
- package/dist/esm/library/ongoing/Breathe.js.map +0 -1
- package/dist/esm/library/ongoing/Cross.js +0 -273
- package/dist/esm/library/ongoing/Cross.js.map +0 -1
- package/dist/esm/library/ongoing/DVD.js +0 -79
- package/dist/esm/library/ongoing/DVD.js.map +0 -1
- package/dist/esm/library/ongoing/Flash.js +0 -42
- package/dist/esm/library/ongoing/Flash.js.map +0 -1
- package/dist/esm/library/ongoing/Flip.js +0 -64
- package/dist/esm/library/ongoing/Flip.js.map +0 -1
- package/dist/esm/library/ongoing/Fold.js +0 -165
- package/dist/esm/library/ongoing/Fold.js.map +0 -1
- package/dist/esm/library/ongoing/Jello.js +0 -70
- package/dist/esm/library/ongoing/Jello.js.map +0 -1
- package/dist/esm/library/ongoing/Poke.js +0 -100
- package/dist/esm/library/ongoing/Poke.js.map +0 -1
- package/dist/esm/library/ongoing/Pulse.js +0 -73
- package/dist/esm/library/ongoing/Pulse.js.map +0 -1
- package/dist/esm/library/ongoing/Rubber.js +0 -90
- package/dist/esm/library/ongoing/Rubber.js.map +0 -1
- package/dist/esm/library/ongoing/Spin.js +0 -52
- package/dist/esm/library/ongoing/Spin.js.map +0 -1
- package/dist/esm/library/ongoing/Swing.js +0 -128
- package/dist/esm/library/ongoing/Swing.js.map +0 -1
- package/dist/esm/library/ongoing/Wiggle.js +0 -86
- package/dist/esm/library/ongoing/Wiggle.js.map +0 -1
- package/dist/esm/library/ongoing/index.js.map +0 -1
- package/dist/esm/library/ongoing/test/testUtils.js +0 -4
- package/dist/esm/library/ongoing/test/testUtils.js.map +0 -1
- package/dist/esm/library/scroll/ArcScroll.js +0 -54
- package/dist/esm/library/scroll/ArcScroll.js.map +0 -1
- package/dist/esm/library/scroll/BlurScroll.js +0 -39
- package/dist/esm/library/scroll/BlurScroll.js.map +0 -1
- package/dist/esm/library/scroll/FadeScroll.js +0 -32
- package/dist/esm/library/scroll/FadeScroll.js.map +0 -1
- package/dist/esm/library/scroll/FlipScroll.js +0 -46
- package/dist/esm/library/scroll/FlipScroll.js.map +0 -1
- package/dist/esm/library/scroll/GrowScroll.js +0 -157
- package/dist/esm/library/scroll/GrowScroll.js.map +0 -1
- package/dist/esm/library/scroll/MoveScroll.js +0 -120
- package/dist/esm/library/scroll/MoveScroll.js.map +0 -1
- package/dist/esm/library/scroll/PanScroll.js +0 -73
- package/dist/esm/library/scroll/PanScroll.js.map +0 -1
- package/dist/esm/library/scroll/ParallaxScroll.js +0 -53
- package/dist/esm/library/scroll/ParallaxScroll.js.map +0 -1
- package/dist/esm/library/scroll/RevealScroll.js +0 -88
- package/dist/esm/library/scroll/RevealScroll.js.map +0 -1
- package/dist/esm/library/scroll/ShapeScroll.js +0 -110
- package/dist/esm/library/scroll/ShapeScroll.js.map +0 -1
- package/dist/esm/library/scroll/ShrinkScroll.js +0 -154
- package/dist/esm/library/scroll/ShrinkScroll.js.map +0 -1
- package/dist/esm/library/scroll/ShuttersScroll.js +0 -63
- package/dist/esm/library/scroll/ShuttersScroll.js.map +0 -1
- package/dist/esm/library/scroll/SkewPanScroll.js +0 -109
- package/dist/esm/library/scroll/SkewPanScroll.js.map +0 -1
- package/dist/esm/library/scroll/SlideScroll.js +0 -111
- package/dist/esm/library/scroll/SlideScroll.js.map +0 -1
- package/dist/esm/library/scroll/Spin3dScroll.js +0 -116
- package/dist/esm/library/scroll/Spin3dScroll.js.map +0 -1
- package/dist/esm/library/scroll/SpinScroll.js +0 -47
- package/dist/esm/library/scroll/SpinScroll.js.map +0 -1
- package/dist/esm/library/scroll/StretchScroll.js +0 -101
- package/dist/esm/library/scroll/StretchScroll.js.map +0 -1
- package/dist/esm/library/scroll/TiltScroll.js +0 -126
- package/dist/esm/library/scroll/TiltScroll.js.map +0 -1
- package/dist/esm/library/scroll/TurnScroll.js +0 -121
- package/dist/esm/library/scroll/TurnScroll.js.map +0 -1
- package/dist/esm/library/scroll/index.js.map +0 -1
- package/dist/esm/library/scroll/test/testUtils.js +0 -4
- package/dist/esm/library/scroll/test/testUtils.js.map +0 -1
- package/dist/esm/motion.js +0 -142
- package/dist/esm/motion.js.map +0 -1
- package/dist/esm/playground/animationMotionBgScroll.stories.js +0 -284
- package/dist/esm/playground/animationMotionBgScroll.stories.js.map +0 -1
- package/dist/esm/playground/animationsMotion.stories.js +0 -132
- package/dist/esm/playground/animationsMotion.stories.js.map +0 -1
- package/dist/esm/playground/animationsMotionMouse.stories.js +0 -187
- package/dist/esm/playground/animationsMotionMouse.stories.js.map +0 -1
- package/dist/esm/playground/animationsMotionOngoing.stories.js +0 -128
- package/dist/esm/playground/animationsMotionOngoing.stories.js.map +0 -1
- package/dist/esm/playground/animationsMotionScroll.stories.js +0 -198
- package/dist/esm/playground/animationsMotionScroll.stories.js.map +0 -1
- package/dist/esm/playground/controls.js +0 -168
- package/dist/esm/playground/controls.js.map +0 -1
- package/dist/esm/playground/mouse-parallax-components/plastic.jpeg +0 -0
- package/dist/esm/playground/mouse-parallax-components/vector.svg +0 -19
- package/dist/esm/playground/mouseComponent.js +0 -61
- package/dist/esm/playground/mouseComponent.js.map +0 -1
- package/dist/esm/playground/playground-common.js +0 -91
- package/dist/esm/playground/playground-common.js.map +0 -1
- package/dist/esm/playground/playground.module.scss +0 -381
- package/dist/esm/test-types.d.js +0 -2
- package/dist/esm/test-types.d.js.map +0 -1
- package/dist/esm/types.js +0 -2
- package/dist/esm/types.js.map +0 -1
- package/dist/esm/utils.js +0 -332
- package/dist/esm/utils.js.map +0 -1
- package/dist/types/library/ongoing/Blink.d.ts +0 -19
- package/dist/types/library/ongoing/Blink.d.ts.map +0 -1
- package/dist/types/playground/animationMotionBgScroll.stories.d.ts +0 -6
- package/dist/types/playground/animationMotionBgScroll.stories.d.ts.map +0 -1
- package/dist/types/playground/animationsMotion.stories.d.ts +0 -6
- package/dist/types/playground/animationsMotion.stories.d.ts.map +0 -1
- package/dist/types/playground/animationsMotionMouse.stories.d.ts +0 -6
- package/dist/types/playground/animationsMotionMouse.stories.d.ts.map +0 -1
- package/dist/types/playground/animationsMotionOngoing.stories.d.ts +0 -6
- package/dist/types/playground/animationsMotionOngoing.stories.d.ts.map +0 -1
- package/dist/types/playground/animationsMotionScroll.stories.d.ts +0 -6
- package/dist/types/playground/animationsMotionScroll.stories.d.ts.map +0 -1
- package/dist/types/playground/controls.d.ts +0 -53
- package/dist/types/playground/controls.d.ts.map +0 -1
- package/dist/types/playground/mouseComponent.d.ts +0 -10
- package/dist/types/playground/mouseComponent.d.ts.map +0 -1
- package/dist/types/playground/playground-common.d.ts +0 -34
- package/dist/types/playground/playground-common.d.ts.map +0 -1
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["baseMockOptions","exports","id"],"sources":["../../../../../src/library/scroll/test/testUtils.ts"],"sourcesContent":["import { ScrubAnimationOptions } from '../../../types';\n\nexport const baseMockOptions: ScrubAnimationOptions = {\n id: 'test-id',\n};\n"],"mappings":";;;;AAEO,MAAMA,eAAsC,GAAAC,OAAA,CAAAD,eAAA,GAAG;EACpDE,EAAE,EAAE;AACN,CAAC","ignoreList":[]}
|
|
@@ -1,369 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
exports.__esModule = true;
|
|
5
|
-
exports.default = exports.BackgroundScroll = void 0;
|
|
6
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _fizban = require("fizban");
|
|
9
|
-
var _index = require("../index");
|
|
10
|
-
var _controls = require("./controls");
|
|
11
|
-
var _playgroundModule = _interopRequireDefault(require("./playground.module.scss"));
|
|
12
|
-
var _backgroundScroll = require("../library/backgroundScroll");
|
|
13
|
-
var _playgroundCommon = require("./playground-common");
|
|
14
|
-
var _effectsKit = require("@wix/effects-kit");
|
|
15
|
-
var _jsxFileName = "/home/builduser/work/5a10c7a05f300a84/packages/motion/dist/cjs/playground/animationMotionBgScroll.stories.tsx";
|
|
16
|
-
var _default = exports.default = {
|
|
17
|
-
title: 'Animation Playground/Background Scroll'
|
|
18
|
-
};
|
|
19
|
-
const effectToClassMap = {
|
|
20
|
-
BgParallax: _playgroundModule.default.bgParallax,
|
|
21
|
-
BgReveal: _playgroundModule.default.bgReveal,
|
|
22
|
-
BgFake3D: _playgroundModule.default.bgFakeThreeD,
|
|
23
|
-
BgSkew: _playgroundModule.default.bgSkew,
|
|
24
|
-
BgRotate: _playgroundModule.default.bgRotate,
|
|
25
|
-
BgPan: _playgroundModule.default.bgPan,
|
|
26
|
-
ImageParallax: _playgroundModule.default.imageParallax,
|
|
27
|
-
BgZoomIn: _playgroundModule.default.bgZoomIn,
|
|
28
|
-
BgZoomOut: _playgroundModule.default.bgZoomOut
|
|
29
|
-
};
|
|
30
|
-
const effectToCssVars = {
|
|
31
|
-
BgSkew: params => ({
|
|
32
|
-
'--tan-angle': `${Math.tan(Number(params.angle || 20) * Math.PI / 180)}`
|
|
33
|
-
}),
|
|
34
|
-
BgRotate: params => ({
|
|
35
|
-
'--cos-angle': `${Math.cos(Number(params.angle || 22) * Math.PI / 180)}`,
|
|
36
|
-
'--sin-angle': `${Math.sin(Number(params.angle || 22) * Math.PI / 180)}`
|
|
37
|
-
}),
|
|
38
|
-
BgPan: params => ({
|
|
39
|
-
'--speed': `${Number(params.speed || 0.2)}`
|
|
40
|
-
}),
|
|
41
|
-
ImageParallax: params => ({
|
|
42
|
-
'--speed': `${Number(params.speed || 1.5)}`
|
|
43
|
-
})
|
|
44
|
-
};
|
|
45
|
-
function getCssVars(name, params) {
|
|
46
|
-
const styleMapper = effectToCssVars[name] || (_ => {});
|
|
47
|
-
return styleMapper(params);
|
|
48
|
-
}
|
|
49
|
-
function getEffectFullName(name, params) {
|
|
50
|
-
return name !== 'BgZoom' ? name : params.direction === 'in' ? 'BgZoomIn' : 'BgZoomOut';
|
|
51
|
-
}
|
|
52
|
-
const BackgroundScroll = () => {
|
|
53
|
-
var _bgAnimations;
|
|
54
|
-
const siteRef = _react.default.useRef(null);
|
|
55
|
-
const compRefs = _react.default.useRef([]);
|
|
56
|
-
const stageRef = _react.default.useRef(null);
|
|
57
|
-
const animationGroupRefs = _react.default.useRef([]);
|
|
58
|
-
const animationSceneRefs = _react.default.useRef([]);
|
|
59
|
-
const scrollRefs = _react.default.useRef([]);
|
|
60
|
-
const [attachment] = _react.default.useState('scroll');
|
|
61
|
-
const [schemaEditor, setSchemaEditor] = _react.default.useState('responsive');
|
|
62
|
-
const [selectedRange, setSelectedRange] = _react.default.useState('continuous');
|
|
63
|
-
const bgAnimations = Object.fromEntries((0, _effectsKit.getPresets)(_effectsKit.CONFIG[_playgroundCommon.schemaMapper[schemaEditor]].bgScrub, ['background', 'image'], true).map(preset => [preset.name, {
|
|
64
|
-
schema: preset.schema,
|
|
65
|
-
range: preset.range
|
|
66
|
-
}]));
|
|
67
|
-
_react.default.useEffect(() => {
|
|
68
|
-
setData((0, _playgroundCommon.mapSchemaToDefaultData)(bgAnimations[animName].schema[selectedRange], schemaEditor));
|
|
69
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
70
|
-
}, [schemaEditor, selectedRange]);
|
|
71
|
-
const implementedAnimations = Object.keys(_backgroundScroll.backgroundScrollAnimations).filter(animationName => bgAnimations[animationName]);
|
|
72
|
-
const [animName, setAnimName] = _react.default.useState(implementedAnimations[0]);
|
|
73
|
-
const schema = bgAnimations[animName].schema || {};
|
|
74
|
-
const [data, setData] = _react.default.useState((0, _playgroundCommon.mapSchemaToDefaultData)(schema[selectedRange], schemaEditor));
|
|
75
|
-
function handleControlChange(name, value) {
|
|
76
|
-
setData(currentData => ({
|
|
77
|
-
...currentData,
|
|
78
|
-
[name]: value
|
|
79
|
-
}));
|
|
80
|
-
}
|
|
81
|
-
function cleanContainerRules() {
|
|
82
|
-
const styleSheet = document.styleSheets[0];
|
|
83
|
-
const {
|
|
84
|
-
cssRules
|
|
85
|
-
} = styleSheet;
|
|
86
|
-
for (let i = 0; i < cssRules.length; i++) {
|
|
87
|
-
if (cssRules[i].cssText.startsWith('@container')) {
|
|
88
|
-
styleSheet.deleteRule(i);
|
|
89
|
-
i--;
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
function insertBgRotateContainerRules(angle) {
|
|
94
|
-
const styleSheet = document.styleSheets[0];
|
|
95
|
-
|
|
96
|
-
/*
|
|
97
|
-
@container (max-aspect-ratio: tan(angle)) {
|
|
98
|
-
#bgMedia-0, #bgMedia-1 {
|
|
99
|
-
height: calc(100% + min(100% * (sqrt(1 + tan(angle)^2) - 1), 100cqw * sin(angle)));
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
*/
|
|
103
|
-
styleSheet.insertRule(`@container (max-aspect-ratio: ${Math.tan(angle * Math.PI / 180)}) { #bgMedia-0, #bgMedia-1 { height: calc(100% + min(${100 * (Math.sqrt(1 + Math.pow(Math.tan(angle * Math.PI / 180), 2)) - 1)}%, ${100 * Math.sin(angle * Math.PI / 180)}cqw)) } }`, 0);
|
|
104
|
-
|
|
105
|
-
/*
|
|
106
|
-
@container (max-aspect-ratio: tan(90 - angle)) {
|
|
107
|
-
#bgMedia-0, #bgMedia-1 {
|
|
108
|
-
width: calc(100% + min(100% * (sqrt(1 + tan(angle)^2) - 1), 100cqh * sin(angle)));
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
*/
|
|
112
|
-
styleSheet.insertRule(`@container (min-aspect-ratio: ${Math.tan((90 - angle) * Math.PI / 180)}) { #bgMedia-0, #bgMedia-1 { width: calc(100% + min(${100 * (Math.sqrt(1 + Math.pow(Math.tan(angle * Math.PI / 180), 2)) - 1)}%, ${100 * Math.sin(angle * Math.PI / 180)}cqh)) } }`, 0);
|
|
113
|
-
}
|
|
114
|
-
function animateBg(el, name, animationScene, animationGroup, scroll, {
|
|
115
|
-
easing = '',
|
|
116
|
-
range = selectedRange,
|
|
117
|
-
...params
|
|
118
|
-
}) {
|
|
119
|
-
cleanContainerRules();
|
|
120
|
-
if (name === 'BgRotate') {
|
|
121
|
-
insertBgRotateContainerRules(params.angle || 22);
|
|
122
|
-
}
|
|
123
|
-
if (window.ViewTimeline) {
|
|
124
|
-
var _animationGroup;
|
|
125
|
-
(_animationGroup = animationGroup) == null || _animationGroup.cancel();
|
|
126
|
-
animationGroup = (0, _index.getWebAnimation)(el.id, {
|
|
127
|
-
id: '',
|
|
128
|
-
namedEffect: {
|
|
129
|
-
id: '',
|
|
130
|
-
type: name,
|
|
131
|
-
range,
|
|
132
|
-
...params
|
|
133
|
-
},
|
|
134
|
-
fill: 'both',
|
|
135
|
-
iterations: 1,
|
|
136
|
-
easing
|
|
137
|
-
}, {
|
|
138
|
-
componentId: el.id,
|
|
139
|
-
element: el,
|
|
140
|
-
trigger: 'view-progress',
|
|
141
|
-
id: ''
|
|
142
|
-
});
|
|
143
|
-
animationGroup.play();
|
|
144
|
-
} else {
|
|
145
|
-
var _scroll;
|
|
146
|
-
animationScene = (0, _index.getScrubScene)(el.id, {
|
|
147
|
-
id: '',
|
|
148
|
-
namedEffect: {
|
|
149
|
-
id: '',
|
|
150
|
-
type: name,
|
|
151
|
-
range,
|
|
152
|
-
...params
|
|
153
|
-
},
|
|
154
|
-
fill: 'both',
|
|
155
|
-
iterations: 1,
|
|
156
|
-
startOffset: {
|
|
157
|
-
name: 'cover',
|
|
158
|
-
offset: {
|
|
159
|
-
value: 0,
|
|
160
|
-
type: 'percentage'
|
|
161
|
-
}
|
|
162
|
-
},
|
|
163
|
-
endOffset: {
|
|
164
|
-
name: 'cover',
|
|
165
|
-
offset: {
|
|
166
|
-
value: 100,
|
|
167
|
-
type: 'percentage'
|
|
168
|
-
}
|
|
169
|
-
},
|
|
170
|
-
easing
|
|
171
|
-
}, {
|
|
172
|
-
componentId: el.id,
|
|
173
|
-
element: el,
|
|
174
|
-
trigger: 'view-progress',
|
|
175
|
-
id: ''
|
|
176
|
-
});
|
|
177
|
-
(_scroll = scroll) == null || _scroll.destroy();
|
|
178
|
-
scroll = new _fizban.Scroll({
|
|
179
|
-
root: stageRef.current,
|
|
180
|
-
observeViewportEntry: false,
|
|
181
|
-
scenes: [animationScene]
|
|
182
|
-
});
|
|
183
|
-
scroll.start();
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
_react.default.useEffect(() => {
|
|
187
|
-
for (let i = 0; i < 2; ++i) {
|
|
188
|
-
animateBg(compRefs.current[i], animName, animationSceneRefs.current[i], animationGroupRefs.current[i], scrollRefs.current[i], {
|
|
189
|
-
...data
|
|
190
|
-
});
|
|
191
|
-
}
|
|
192
|
-
return () => {
|
|
193
|
-
if (window.ViewTimeline) {
|
|
194
|
-
['bgLayer-0', 'bgLayer-1', 'bgMedia-0', 'bgMedia-1', 'bgImage-0', 'bgImage-1'].forEach(elId => {
|
|
195
|
-
var _document$getElementB;
|
|
196
|
-
(_document$getElementB = document.getElementById(elId)) == null || _document$getElementB.getAnimations().forEach(a => {
|
|
197
|
-
a.cancel();
|
|
198
|
-
});
|
|
199
|
-
});
|
|
200
|
-
}
|
|
201
|
-
};
|
|
202
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
203
|
-
}, [animName, data]);
|
|
204
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
205
|
-
className: `${_playgroundModule.default.stage} ${_playgroundModule.default.scrollStage} ${_playgroundModule.default.bgScrub}`,
|
|
206
|
-
ref: stageRef,
|
|
207
|
-
__self: void 0,
|
|
208
|
-
__source: {
|
|
209
|
-
fileName: _jsxFileName,
|
|
210
|
-
lineNumber: 312,
|
|
211
|
-
columnNumber: 5
|
|
212
|
-
}
|
|
213
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
214
|
-
className: _playgroundModule.default.components,
|
|
215
|
-
ref: siteRef,
|
|
216
|
-
style: {
|
|
217
|
-
'--attachment': attachment
|
|
218
|
-
},
|
|
219
|
-
__self: void 0,
|
|
220
|
-
__source: {
|
|
221
|
-
fileName: _jsxFileName,
|
|
222
|
-
lineNumber: 316,
|
|
223
|
-
columnNumber: 7
|
|
224
|
-
}
|
|
225
|
-
}, [0, 1].map((_, i) => /*#__PURE__*/_react.default.createElement("div", {
|
|
226
|
-
id: `comp-${i}`,
|
|
227
|
-
className: `${_playgroundModule.default.bgComponent} ${i ? _playgroundModule.default.bgComponentTwo : ''} ${animName === 'ImageParallax' ? _playgroundModule.default.imageComponent : ''}`,
|
|
228
|
-
ref: ref => compRefs.current[i] = ref,
|
|
229
|
-
key: `comp-${i}`,
|
|
230
|
-
__self: void 0,
|
|
231
|
-
__source: {
|
|
232
|
-
fileName: _jsxFileName,
|
|
233
|
-
lineNumber: 326,
|
|
234
|
-
columnNumber: 11
|
|
235
|
-
}
|
|
236
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
237
|
-
id: `bgLayer-${i}`,
|
|
238
|
-
className: _playgroundModule.default.bgLayer,
|
|
239
|
-
"data-motion-part": `BG_LAYER comp-${i}`,
|
|
240
|
-
__self: void 0,
|
|
241
|
-
__source: {
|
|
242
|
-
fileName: _jsxFileName,
|
|
243
|
-
lineNumber: 334,
|
|
244
|
-
columnNumber: 13
|
|
245
|
-
}
|
|
246
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
247
|
-
id: `bgMedia-${i}`,
|
|
248
|
-
className: `${_playgroundModule.default.bgMedia} ${effectToClassMap[getEffectFullName(animName, data)] || ''}`,
|
|
249
|
-
"data-motion-part": `BG_MEDIA comp-${i}`,
|
|
250
|
-
style: getCssVars(animName || 'BgCloseUp', data),
|
|
251
|
-
__self: void 0,
|
|
252
|
-
__source: {
|
|
253
|
-
fileName: _jsxFileName,
|
|
254
|
-
lineNumber: 339,
|
|
255
|
-
columnNumber: 15
|
|
256
|
-
}
|
|
257
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
258
|
-
id: `bgImage-${i}`,
|
|
259
|
-
className: `${_playgroundModule.default.bgImage} ${effectToClassMap[getEffectFullName(animName, data)] || ''}`,
|
|
260
|
-
"data-motion-part": `BG_IMG comp-${i}`,
|
|
261
|
-
__self: void 0,
|
|
262
|
-
__source: {
|
|
263
|
-
fileName: _jsxFileName,
|
|
264
|
-
lineNumber: 352,
|
|
265
|
-
columnNumber: 17
|
|
266
|
-
}
|
|
267
|
-
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
268
|
-
id: "content",
|
|
269
|
-
className: _playgroundModule.default.content,
|
|
270
|
-
__self: void 0,
|
|
271
|
-
__source: {
|
|
272
|
-
fileName: _jsxFileName,
|
|
273
|
-
lineNumber: 366,
|
|
274
|
-
columnNumber: 13
|
|
275
|
-
}
|
|
276
|
-
}, "Background Scrub")))), /*#__PURE__*/_react.default.createElement("div", {
|
|
277
|
-
className: _playgroundModule.default.panels,
|
|
278
|
-
__self: void 0,
|
|
279
|
-
__source: {
|
|
280
|
-
fileName: _jsxFileName,
|
|
281
|
-
lineNumber: 372,
|
|
282
|
-
columnNumber: 7
|
|
283
|
-
}
|
|
284
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
285
|
-
className: _playgroundModule.default.globalControls,
|
|
286
|
-
__self: void 0,
|
|
287
|
-
__source: {
|
|
288
|
-
fileName: _jsxFileName,
|
|
289
|
-
lineNumber: 373,
|
|
290
|
-
columnNumber: 9
|
|
291
|
-
}
|
|
292
|
-
}, /*#__PURE__*/_react.default.createElement(_controls.SelectInput, {
|
|
293
|
-
onChange: event => {
|
|
294
|
-
const value = event.target.value;
|
|
295
|
-
setSchemaEditor(value);
|
|
296
|
-
},
|
|
297
|
-
value: schemaEditor,
|
|
298
|
-
options: ['desktop', 'mobile', 'responsive'],
|
|
299
|
-
className: _playgroundModule.default.mainSelect,
|
|
300
|
-
__self: void 0,
|
|
301
|
-
__source: {
|
|
302
|
-
fileName: _jsxFileName,
|
|
303
|
-
lineNumber: 374,
|
|
304
|
-
columnNumber: 11
|
|
305
|
-
}
|
|
306
|
-
}), /*#__PURE__*/_react.default.createElement(_controls.SelectInput, {
|
|
307
|
-
onChange: event => {
|
|
308
|
-
const value = event.target.value;
|
|
309
|
-
setSelectedRange(value);
|
|
310
|
-
},
|
|
311
|
-
value: selectedRange,
|
|
312
|
-
options: (_bgAnimations = bgAnimations[animName]) == null || (_bgAnimations = _bgAnimations.range) == null ? void 0 : _bgAnimations.enum,
|
|
313
|
-
className: _playgroundModule.default.mainSelect,
|
|
314
|
-
__self: void 0,
|
|
315
|
-
__source: {
|
|
316
|
-
fileName: _jsxFileName,
|
|
317
|
-
lineNumber: 383,
|
|
318
|
-
columnNumber: 11
|
|
319
|
-
}
|
|
320
|
-
}), /*#__PURE__*/_react.default.createElement(_controls.SelectInput, {
|
|
321
|
-
onChange: event => {
|
|
322
|
-
const value = event.target.value;
|
|
323
|
-
setAnimName(value);
|
|
324
|
-
if (!bgAnimations[value].schema[selectedRange]) {
|
|
325
|
-
setSelectedRange(bgAnimations[value].range.enum[0]);
|
|
326
|
-
}
|
|
327
|
-
setData((0, _playgroundCommon.mapSchemaToDefaultData)(bgAnimations[value].schema[selectedRange] || {}, schemaEditor));
|
|
328
|
-
},
|
|
329
|
-
value: animName,
|
|
330
|
-
options: Object.keys(bgAnimations).map(name => [name, implementedAnimations.includes(name)]),
|
|
331
|
-
className: _playgroundModule.default.mainSelect,
|
|
332
|
-
__self: void 0,
|
|
333
|
-
__source: {
|
|
334
|
-
fileName: _jsxFileName,
|
|
335
|
-
lineNumber: 395,
|
|
336
|
-
columnNumber: 11
|
|
337
|
-
}
|
|
338
|
-
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
339
|
-
className: _playgroundModule.default.controls,
|
|
340
|
-
__self: void 0,
|
|
341
|
-
__source: {
|
|
342
|
-
fileName: _jsxFileName,
|
|
343
|
-
lineNumber: 426,
|
|
344
|
-
columnNumber: 9
|
|
345
|
-
}
|
|
346
|
-
}, Object.entries(schema[selectedRange]).sort(([a], [b]) => {
|
|
347
|
-
if (a === 'duration' || b !== 'duration' && a === 'delay') {
|
|
348
|
-
return -1;
|
|
349
|
-
}
|
|
350
|
-
if (b === 'allowReplay') {
|
|
351
|
-
return -1;
|
|
352
|
-
}
|
|
353
|
-
return 0;
|
|
354
|
-
}).map(([name, controlProps], i) => /*#__PURE__*/_react.default.createElement(_controls.Control, (0, _extends2.default)({
|
|
355
|
-
key: `key-control-${i}`
|
|
356
|
-
}, controlProps, {
|
|
357
|
-
value: data[name],
|
|
358
|
-
label: name,
|
|
359
|
-
onChange: (_e, value) => handleControlChange(name, value),
|
|
360
|
-
__self: void 0,
|
|
361
|
-
__source: {
|
|
362
|
-
fileName: _jsxFileName,
|
|
363
|
-
lineNumber: 438,
|
|
364
|
-
columnNumber: 15
|
|
365
|
-
}
|
|
366
|
-
}))))));
|
|
367
|
-
};
|
|
368
|
-
exports.BackgroundScroll = BackgroundScroll;
|
|
369
|
-
//# sourceMappingURL=animationMotionBgScroll.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_fizban","_index","_controls","_playgroundModule","_backgroundScroll","_playgroundCommon","_effectsKit","_jsxFileName","_default","exports","default","title","effectToClassMap","BgParallax","styles","bgParallax","BgReveal","bgReveal","BgFake3D","bgFakeThreeD","BgSkew","bgSkew","BgRotate","bgRotate","BgPan","bgPan","ImageParallax","imageParallax","BgZoomIn","bgZoomIn","BgZoomOut","bgZoomOut","effectToCssVars","params","Math","tan","Number","angle","PI","cos","sin","speed","getCssVars","name","styleMapper","_","getEffectFullName","direction","BackgroundScroll","_bgAnimations","siteRef","React","useRef","compRefs","stageRef","animationGroupRefs","animationSceneRefs","scrollRefs","attachment","useState","schemaEditor","setSchemaEditor","selectedRange","setSelectedRange","bgAnimations","Object","fromEntries","getPresets","CONFIG","schemaMapper","bgScrub","map","preset","schema","range","useEffect","setData","mapSchemaToDefaultData","animName","implementedAnimations","keys","defs","filter","animationName","setAnimName","data","handleControlChange","value","currentData","cleanContainerRules","styleSheet","document","styleSheets","cssRules","i","length","cssText","startsWith","deleteRule","insertBgRotateContainerRules","insertRule","sqrt","pow","animateBg","el","animationScene","animationGroup","scroll","easing","window","ViewTimeline","_animationGroup","cancel","getWebAnimation","id","namedEffect","type","fill","iterations","componentId","element","trigger","play","_scroll","getScrubScene","startOffset","offset","endOffset","destroy","ScrollLib","root","current","observeViewportEntry","scenes","start","forEach","elId","_document$getElementB","getElementById","getAnimations","a","createElement","className","stage","scrollStage","ref","__self","__source","fileName","lineNumber","columnNumber","components","style","bgComponent","bgComponentTwo","imageComponent","key","bgLayer","bgMedia","bgImage","content","panels","globalControls","SelectInput","onChange","event","target","options","mainSelect","enum","includes","controls","entries","sort","b","controlProps","Control","_extends2","label","_e"],"sources":["../../../src/playground/animationMotionBgScroll.stories.tsx"],"sourcesContent":["import React, { CSSProperties } from 'react';\nimport { Scroll as ScrollLib } from 'fizban';\n\nimport {\n AnimationGroup,\n BackgroundScrollAnimation,\n getWebAnimation,\n getScrubScene,\n} from '../index';\nimport { Control, SelectInput } from './controls';\nimport styles from './playground.module.scss';\nimport { backgroundScrollAnimations as defs } from '../library/backgroundScroll';\n\nimport {\n mapSchemaToDefaultData,\n SchemaEditor,\n schemaMapper,\n} from './playground-common';\n\nimport {\n getPresets,\n CONFIG,\n AllEffectsNames,\n OneOfBgScrubEffects,\n SchemaValues,\n ScrollEffectConfig,\n} from '@wix/effects-kit';\n\nimport type { Meta } from '@wix/yoshi-storybook-dependencies';\nimport type { EffectScrollRange } from '../index';\n\nexport default {\n title: 'Animation Playground/Background Scroll',\n} as Meta;\n\nconst effectToClassMap = {\n BgParallax: styles.bgParallax,\n BgReveal: styles.bgReveal,\n BgFake3D: styles.bgFakeThreeD,\n BgSkew: styles.bgSkew,\n BgRotate: styles.bgRotate,\n BgPan: styles.bgPan,\n ImageParallax: styles.imageParallax,\n BgZoomIn: styles.bgZoomIn,\n BgZoomOut: styles.bgZoomOut,\n};\n\nconst effectToCssVars = {\n BgSkew: (params: any) => ({\n '--tan-angle': `${Math.tan((Number(params.angle || 20) * Math.PI) / 180)}`,\n }),\n BgRotate: (params: any) => ({\n '--cos-angle': `${Math.cos((Number(params.angle || 22) * Math.PI) / 180)}`,\n '--sin-angle': `${Math.sin((Number(params.angle || 22) * Math.PI) / 180)}`,\n }),\n BgPan: (params: any) => ({\n '--speed': `${Number(params.speed || 0.2)}`,\n }),\n ImageParallax: (params: any) => ({\n '--speed': `${Number(params.speed || 1.5)}`,\n }),\n};\n\nfunction getCssVars(\n name: BackgroundScrollAnimation['type'],\n params: any,\n): CSSProperties {\n const styleMapper =\n effectToCssVars[name as keyof typeof effectToCssVars] || ((_) => {});\n return styleMapper(params) as CSSProperties;\n}\n\nfunction getEffectFullName(\n name: BackgroundScrollAnimation['type'],\n params: any,\n): string {\n return name !== 'BgZoom'\n ? name\n : params.direction === 'in'\n ? 'BgZoomIn'\n : 'BgZoomOut';\n}\nexport const BackgroundScroll: React.FC<any> = () => {\n const siteRef = React.useRef<HTMLDivElement>(null);\n\n const compRefs = React.useRef<HTMLDivElement[]>([]);\n\n const stageRef = React.useRef<HTMLDivElement>(null);\n\n const animationGroupRefs = React.useRef<AnimationGroup[]>([]);\n const animationSceneRefs = React.useRef<ReturnType<typeof getScrubScene>[]>(\n [],\n );\n const scrollRefs = React.useRef<(typeof ScrollLib)[]>([]);\n\n const [attachment] = React.useState<string>('scroll');\n\n const [schemaEditor, setSchemaEditor] =\n React.useState<SchemaEditor>('responsive');\n\n const [selectedRange, setSelectedRange] =\n React.useState<EffectScrollRange>('continuous');\n\n const bgAnimations = Object.fromEntries(\n getPresets(\n CONFIG[schemaMapper[schemaEditor]].bgScrub,\n ['background', 'image'],\n true,\n ).map((preset) => [\n preset.name,\n {\n schema: preset.schema,\n range: (preset as ScrollEffectConfig<OneOfBgScrubEffects>).range,\n },\n ]),\n ) as Record<AllEffectsNames, ScrollEffectConfig<OneOfBgScrubEffects>>;\n\n React.useEffect(() => {\n setData(\n mapSchemaToDefaultData(\n bgAnimations[animName].schema[\n selectedRange\n ] as ScrollEffectConfig<OneOfBgScrubEffects>['schema'][EffectScrollRange],\n schemaEditor,\n ),\n );\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [schemaEditor, selectedRange]);\n\n const implementedAnimations = Object.keys(defs).filter(\n (animationName) => bgAnimations[animationName as keyof typeof defs],\n ) as AllEffectsNames[];\n\n const [animName, setAnimName] = React.useState<keyof typeof defs>(\n implementedAnimations[0] as keyof typeof defs,\n );\n\n const schema = (bgAnimations[animName].schema ||\n {}) as ScrollEffectConfig<OneOfBgScrubEffects>['schema'];\n\n const [data, setData] = React.useState<Record<string, any>>(\n mapSchemaToDefaultData(schema[selectedRange], schemaEditor),\n );\n\n function handleControlChange(name: string, value: any) {\n setData((currentData) => ({\n ...currentData,\n [name]: value,\n }));\n }\n\n function cleanContainerRules() {\n const styleSheet = document.styleSheets[0];\n const { cssRules } = styleSheet;\n for (let i = 0; i < cssRules.length; i++) {\n if (cssRules[i].cssText.startsWith('@container')) {\n styleSheet.deleteRule(i);\n i--;\n }\n }\n }\n\n function insertBgRotateContainerRules(angle: number) {\n const styleSheet = document.styleSheets[0];\n\n /*\n @container (max-aspect-ratio: tan(angle)) {\n #bgMedia-0, #bgMedia-1 {\n height: calc(100% + min(100% * (sqrt(1 + tan(angle)^2) - 1), 100cqw * sin(angle)));\n }\n }\n */\n styleSheet.insertRule(\n `@container (max-aspect-ratio: ${Math.tan(\n (angle * Math.PI) / 180,\n )}) { #bgMedia-0, #bgMedia-1 { height: calc(100% + min(${\n 100 *\n (Math.sqrt(1 + Math.pow(Math.tan((angle * Math.PI) / 180), 2)) - 1)\n }%, ${100 * Math.sin((angle * Math.PI) / 180)}cqw)) } }`,\n 0,\n );\n\n /*\n @container (max-aspect-ratio: tan(90 - angle)) {\n #bgMedia-0, #bgMedia-1 {\n width: calc(100% + min(100% * (sqrt(1 + tan(angle)^2) - 1), 100cqh * sin(angle)));\n }\n }\n */\n styleSheet.insertRule(\n `@container (min-aspect-ratio: ${Math.tan(\n ((90 - angle) * Math.PI) / 180,\n )}) { #bgMedia-0, #bgMedia-1 { width: calc(100% + min(${\n 100 *\n (Math.sqrt(1 + Math.pow(Math.tan((angle * Math.PI) / 180), 2)) - 1)\n }%, ${100 * Math.sin((angle * Math.PI) / 180)}cqh)) } }`,\n 0,\n );\n }\n\n function animateBg(\n el: HTMLElement,\n name: string,\n animationScene: ReturnType<typeof getScrubScene>,\n animationGroup: AnimationGroup,\n scroll: typeof ScrollLib,\n { easing = '', range = selectedRange, ...params },\n ) {\n cleanContainerRules();\n if (name === 'BgRotate') {\n insertBgRotateContainerRules(params.angle || 22);\n }\n if (window.ViewTimeline) {\n animationGroup?.cancel();\n\n animationGroup = getWebAnimation(\n el.id,\n {\n id: '',\n namedEffect: {\n id: '',\n type: name,\n range,\n ...params,\n } as BackgroundScrollAnimation,\n fill: 'both',\n iterations: 1,\n easing,\n },\n { componentId: el.id, element: el, trigger: 'view-progress', id: '' },\n ) as AnimationGroup;\n animationGroup!.play();\n } else {\n animationScene = getScrubScene(\n el.id,\n {\n id: '',\n namedEffect: {\n id: '',\n type: name,\n range,\n ...params,\n } as BackgroundScrollAnimation,\n fill: 'both',\n iterations: 1,\n startOffset: {\n name: 'cover',\n offset: {\n value: 0,\n type: 'percentage',\n },\n },\n endOffset: {\n name: 'cover',\n offset: {\n value: 100,\n type: 'percentage',\n },\n },\n easing,\n },\n { componentId: el.id, element: el, trigger: 'view-progress', id: '' },\n );\n\n scroll?.destroy();\n\n scroll = new ScrollLib({\n root: stageRef.current,\n observeViewportEntry: false,\n scenes: [animationScene],\n });\n scroll.start();\n }\n }\n\n React.useEffect(() => {\n for (let i = 0; i < 2; ++i) {\n animateBg(\n compRefs.current[i]!,\n animName,\n animationSceneRefs.current[i],\n animationGroupRefs.current[i],\n scrollRefs.current[i],\n {\n ...data,\n },\n );\n }\n return () => {\n if (window.ViewTimeline) {\n [\n 'bgLayer-0',\n 'bgLayer-1',\n 'bgMedia-0',\n 'bgMedia-1',\n 'bgImage-0',\n 'bgImage-1',\n ].forEach((elId) => {\n document\n .getElementById(elId)\n ?.getAnimations()\n .forEach((a) => {\n a.cancel();\n });\n });\n }\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [animName, data]);\n\n return (\n <div\n className={`${styles.stage} ${styles.scrollStage} ${styles.bgScrub}`}\n ref={stageRef}\n >\n <div\n className={styles.components}\n ref={siteRef}\n style={\n {\n '--attachment': attachment,\n } as CSSProperties\n }\n >\n {[0, 1].map((_, i) => (\n <div\n id={`comp-${i}`}\n className={`${styles.bgComponent} ${\n i ? styles.bgComponentTwo : ''\n } ${animName === 'ImageParallax' ? styles.imageComponent : ''}`}\n ref={(ref: HTMLDivElement | null) => (compRefs.current[i] = ref!)}\n key={`comp-${i}`}\n >\n <div\n id={`bgLayer-${i}`}\n className={styles.bgLayer}\n data-motion-part={`BG_LAYER comp-${i}`}\n >\n <div\n id={`bgMedia-${i}`}\n className={`${styles.bgMedia} ${\n effectToClassMap[\n getEffectFullName(\n animName,\n data,\n ) as keyof typeof effectToClassMap\n ] || ''\n }`}\n data-motion-part={`BG_MEDIA comp-${i}`}\n style={getCssVars(animName || 'BgCloseUp', data)}\n >\n <div\n id={`bgImage-${i}`}\n className={`${styles.bgImage} ${\n effectToClassMap[\n getEffectFullName(\n animName,\n data,\n ) as keyof typeof effectToClassMap\n ] || ''\n }`}\n data-motion-part={`BG_IMG comp-${i}`}\n ></div>\n </div>\n </div>\n <div id=\"content\" className={styles.content}>\n Background Scrub\n </div>\n </div>\n ))}\n </div>\n <div className={styles.panels}>\n <div className={styles.globalControls}>\n <SelectInput\n onChange={(event) => {\n const value: SchemaEditor = event.target.value;\n setSchemaEditor(value);\n }}\n value={schemaEditor}\n options={['desktop', 'mobile', 'responsive']}\n className={styles.mainSelect}\n />\n <SelectInput\n onChange={(event) => {\n const value: EffectScrollRange = event.target.value;\n setSelectedRange(value);\n }}\n value={selectedRange}\n options={\n bgAnimations[animName as AllEffectsNames]?.range\n ?.enum as EffectScrollRange[]\n }\n className={styles.mainSelect}\n />\n <SelectInput\n onChange={(event) => {\n const value = event.target.value;\n setAnimName(value);\n if (\n !bgAnimations[value as typeof animName].schema[selectedRange]\n ) {\n setSelectedRange(\n bgAnimations[value as typeof animName].range.enum![0],\n );\n }\n setData(\n mapSchemaToDefaultData(\n (bgAnimations[value as typeof animName].schema[\n selectedRange\n ] ||\n {}) as ScrollEffectConfig<OneOfBgScrubEffects>['schema'][EffectScrollRange],\n schemaEditor,\n ),\n );\n }}\n value={animName}\n options={\n Object.keys(bgAnimations).map((name) => [\n name,\n implementedAnimations.includes(name as AllEffectsNames),\n ]) as [string, boolean][]\n }\n className={styles.mainSelect}\n />\n </div>\n <div className={styles.controls}>\n {Object.entries(schema[selectedRange]!)\n .sort(([a], [b]) => {\n if (a === 'duration' || (b !== 'duration' && a === 'delay')) {\n return -1;\n }\n if (b === 'allowReplay') {\n return -1;\n }\n return 0;\n })\n .map(([name, controlProps], i) => (\n <Control\n key={`key-control-${i}`}\n {...(controlProps as SchemaValues)}\n value={data[name]}\n label={name}\n onChange={(_e, value) => handleControlChange(name, value)}\n />\n ))}\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
exports.__esModule = true;
|
|
5
|
-
exports.default = exports.Entrance = void 0;
|
|
6
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _effectsKit = require("@wix/effects-kit");
|
|
9
|
-
var _controls = require("./controls");
|
|
10
|
-
var _playgroundModule = _interopRequireDefault(require("./playground.module.scss"));
|
|
11
|
-
var _playgroundCommon = require("./playground-common");
|
|
12
|
-
var _motion = require("../motion");
|
|
13
|
-
var _entrance = require("../library/entrance");
|
|
14
|
-
var _jsxFileName = "/home/builduser/work/5a10c7a05f300a84/packages/motion/dist/cjs/playground/animationsMotion.stories.tsx";
|
|
15
|
-
var _default = exports.default = {
|
|
16
|
-
title: 'Animation Playground/Entrance'
|
|
17
|
-
};
|
|
18
|
-
const Entrance = () => {
|
|
19
|
-
const compRef = _react.default.useRef(null);
|
|
20
|
-
const animationGroup = _react.default.useRef();
|
|
21
|
-
const [schemaEditor, setSchemaEditor] = _react.default.useState('responsive');
|
|
22
|
-
_react.default.useEffect(() => {
|
|
23
|
-
setData((0, _playgroundCommon.mapSchemaToDefaultData)(animations[animName], schemaEditor));
|
|
24
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
25
|
-
}, [schemaEditor]);
|
|
26
|
-
const animations = Object.fromEntries((0, _effectsKit.getPresets)(_effectsKit.CONFIG[_playgroundCommon.schemaMapper[schemaEditor]].entrance).concat((0, _effectsKit.getPresets)(_effectsKit.CONFIG[_playgroundCommon.schemaMapper[schemaEditor]].entranceLegacy)).map(preset => [preset.name, preset.schema]));
|
|
27
|
-
const implementedAnimations = Object.keys(_entrance.entranceAnimations).filter(animationName => animations[animationName]);
|
|
28
|
-
function animateText(el, name, {
|
|
29
|
-
duration = 1000,
|
|
30
|
-
delay = 0,
|
|
31
|
-
easing = '',
|
|
32
|
-
...params
|
|
33
|
-
}) {
|
|
34
|
-
var _animationGroup$curre;
|
|
35
|
-
// Clear
|
|
36
|
-
(_animationGroup$curre = animationGroup.current) == null || _animationGroup$curre.cancel();
|
|
37
|
-
|
|
38
|
-
// Animate
|
|
39
|
-
animationGroup.current = (0, _motion.getWebAnimation)(el.id, {
|
|
40
|
-
id: '',
|
|
41
|
-
namedEffect: {
|
|
42
|
-
id: '',
|
|
43
|
-
type: name,
|
|
44
|
-
...params
|
|
45
|
-
},
|
|
46
|
-
duration,
|
|
47
|
-
delay,
|
|
48
|
-
fill: 'backwards',
|
|
49
|
-
iterations: 1,
|
|
50
|
-
easing
|
|
51
|
-
});
|
|
52
|
-
animationGroup.current.play();
|
|
53
|
-
// animate(name, el, +duration / 1000, +delay / 1000, {
|
|
54
|
-
// ...params,
|
|
55
|
-
// callbacks: { onComplete: () => resetAnimation(el, animationGroup.current) },
|
|
56
|
-
// });
|
|
57
|
-
}
|
|
58
|
-
const [animName, setAnimName] = _react.default.useState(implementedAnimations[0]);
|
|
59
|
-
const [rotation, setRotation] = _react.default.useState(0);
|
|
60
|
-
const schema = animations[animName] || {};
|
|
61
|
-
const [data, setData] = _react.default.useState((0, _playgroundCommon.mapSchemaToDefaultData)(schema));
|
|
62
|
-
function handleControlChange(name, value) {
|
|
63
|
-
setData(currentData => ({
|
|
64
|
-
...currentData,
|
|
65
|
-
[name]: value
|
|
66
|
-
}));
|
|
67
|
-
}
|
|
68
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
69
|
-
className: _playgroundModule.default.stage,
|
|
70
|
-
__self: void 0,
|
|
71
|
-
__source: {
|
|
72
|
-
fileName: _jsxFileName,
|
|
73
|
-
lineNumber: 90,
|
|
74
|
-
columnNumber: 5
|
|
75
|
-
}
|
|
76
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
77
|
-
className: _playgroundModule.default.components,
|
|
78
|
-
__self: void 0,
|
|
79
|
-
__source: {
|
|
80
|
-
fileName: _jsxFileName,
|
|
81
|
-
lineNumber: 91,
|
|
82
|
-
columnNumber: 7
|
|
83
|
-
}
|
|
84
|
-
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
85
|
-
id: "comp1",
|
|
86
|
-
className: _playgroundModule.default.component,
|
|
87
|
-
ref: compRef,
|
|
88
|
-
style: {
|
|
89
|
-
'--comp-rotate-z': `${rotation}deg`,
|
|
90
|
-
transform: `rotateZ(var(--comp-rotate-z, 0deg))`,
|
|
91
|
-
background: 'teal'
|
|
92
|
-
},
|
|
93
|
-
__self: void 0,
|
|
94
|
-
__source: {
|
|
95
|
-
fileName: _jsxFileName,
|
|
96
|
-
lineNumber: 92,
|
|
97
|
-
columnNumber: 9
|
|
98
|
-
}
|
|
99
|
-
}, "Entrance")), /*#__PURE__*/_react.default.createElement("div", {
|
|
100
|
-
className: _playgroundModule.default.globalControls,
|
|
101
|
-
__self: void 0,
|
|
102
|
-
__source: {
|
|
103
|
-
fileName: _jsxFileName,
|
|
104
|
-
lineNumber: 107,
|
|
105
|
-
columnNumber: 7
|
|
106
|
-
}
|
|
107
|
-
}, /*#__PURE__*/_react.default.createElement(_controls.NumberInput, {
|
|
108
|
-
label: "Rotation",
|
|
109
|
-
value: rotation,
|
|
110
|
-
min: 0,
|
|
111
|
-
max: 360,
|
|
112
|
-
step: 1,
|
|
113
|
-
onChange: event => setRotation(event.target.valueAsNumber),
|
|
114
|
-
__self: void 0,
|
|
115
|
-
__source: {
|
|
116
|
-
fileName: _jsxFileName,
|
|
117
|
-
lineNumber: 108,
|
|
118
|
-
columnNumber: 9
|
|
119
|
-
}
|
|
120
|
-
}), /*#__PURE__*/_react.default.createElement(_controls.SelectInput, {
|
|
121
|
-
onChange: event => {
|
|
122
|
-
const value = event.target.value;
|
|
123
|
-
setSchemaEditor(value);
|
|
124
|
-
// Reset "power" when changing editor
|
|
125
|
-
// handleControlChange('power', undefined);
|
|
126
|
-
},
|
|
127
|
-
value: schemaEditor,
|
|
128
|
-
options: ['desktop', 'mobile', 'responsive'],
|
|
129
|
-
className: _playgroundModule.default.mainSelect,
|
|
130
|
-
__self: void 0,
|
|
131
|
-
__source: {
|
|
132
|
-
fileName: _jsxFileName,
|
|
133
|
-
lineNumber: 116,
|
|
134
|
-
columnNumber: 9
|
|
135
|
-
}
|
|
136
|
-
}), /*#__PURE__*/_react.default.createElement(_controls.SelectInput, {
|
|
137
|
-
onChange: event => {
|
|
138
|
-
const value = event.target.value;
|
|
139
|
-
setAnimName(value);
|
|
140
|
-
setData((0, _playgroundCommon.mapSchemaToDefaultData)(animations[value] || {}, schemaEditor));
|
|
141
|
-
},
|
|
142
|
-
value: animName,
|
|
143
|
-
options: Object.keys(animations).map(name => [name, implementedAnimations.includes(name)]),
|
|
144
|
-
className: _playgroundModule.default.mainSelect,
|
|
145
|
-
__self: void 0,
|
|
146
|
-
__source: {
|
|
147
|
-
fileName: _jsxFileName,
|
|
148
|
-
lineNumber: 127,
|
|
149
|
-
columnNumber: 9
|
|
150
|
-
}
|
|
151
|
-
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
152
|
-
className: _playgroundModule.default.controls,
|
|
153
|
-
__self: void 0,
|
|
154
|
-
__source: {
|
|
155
|
-
fileName: _jsxFileName,
|
|
156
|
-
lineNumber: 145,
|
|
157
|
-
columnNumber: 7
|
|
158
|
-
}
|
|
159
|
-
}, Object.entries(schema).sort(([a], [b]) => {
|
|
160
|
-
if (a === 'duration' || b !== 'duration' && a === 'delay') {
|
|
161
|
-
return -1;
|
|
162
|
-
}
|
|
163
|
-
if (b === 'allowReplay') {
|
|
164
|
-
return -1;
|
|
165
|
-
}
|
|
166
|
-
return 0;
|
|
167
|
-
}).map(([name, controlProps], i) => /*#__PURE__*/_react.default.createElement(_controls.Control, (0, _extends2.default)({
|
|
168
|
-
key: `key-control-${i}`
|
|
169
|
-
}, controlProps, {
|
|
170
|
-
value: data[name],
|
|
171
|
-
label: name,
|
|
172
|
-
onChange: (_e, value) => handleControlChange(name, value),
|
|
173
|
-
__self: void 0,
|
|
174
|
-
__source: {
|
|
175
|
-
fileName: _jsxFileName,
|
|
176
|
-
lineNumber: 157,
|
|
177
|
-
columnNumber: 13
|
|
178
|
-
}
|
|
179
|
-
}))), /*#__PURE__*/_react.default.createElement("div", {
|
|
180
|
-
className: _playgroundModule.default.buttons,
|
|
181
|
-
__self: void 0,
|
|
182
|
-
__source: {
|
|
183
|
-
fileName: _jsxFileName,
|
|
184
|
-
lineNumber: 165,
|
|
185
|
-
columnNumber: 9
|
|
186
|
-
}
|
|
187
|
-
}, /*#__PURE__*/_react.default.createElement("button", {
|
|
188
|
-
className: _playgroundModule.default.animateButton,
|
|
189
|
-
onClick: () => animateText(compRef.current, animName, data),
|
|
190
|
-
__self: void 0,
|
|
191
|
-
__source: {
|
|
192
|
-
fileName: _jsxFileName,
|
|
193
|
-
lineNumber: 166,
|
|
194
|
-
columnNumber: 11
|
|
195
|
-
}
|
|
196
|
-
}, "Animate"))));
|
|
197
|
-
};
|
|
198
|
-
exports.Entrance = Entrance;
|
|
199
|
-
//# sourceMappingURL=animationsMotion.stories.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_effectsKit","_controls","_playgroundModule","_playgroundCommon","_motion","_entrance","_jsxFileName","_default","exports","default","title","Entrance","compRef","React","useRef","animationGroup","schemaEditor","setSchemaEditor","useState","useEffect","setData","mapSchemaToDefaultData","animations","animName","Object","fromEntries","getPresets","CONFIG","schemaMapper","entrance","concat","entranceLegacy","map","preset","name","schema","implementedAnimations","keys","defs","filter","animationName","animateText","el","duration","delay","easing","params","_animationGroup$curre","current","cancel","getWebAnimation","id","namedEffect","type","fill","iterations","play","setAnimName","rotation","setRotation","data","handleControlChange","value","currentData","createElement","className","styles","stage","__self","__source","fileName","lineNumber","columnNumber","components","component","ref","style","transform","background","globalControls","NumberInput","label","min","max","step","onChange","event","target","valueAsNumber","SelectInput","options","mainSelect","includes","controls","entries","sort","a","b","controlProps","i","Control","_extends2","key","_e","buttons","animateButton","onClick"],"sources":["../../../src/playground/animationsMotion.stories.tsx"],"sourcesContent":["import React from 'react';\nimport { getPresets, CONFIG } from '@wix/effects-kit';\n\nimport { Control, NumberInput, SelectInput } from './controls';\nimport styles from './playground.module.scss';\nimport { mapSchemaToDefaultData, schemaMapper } from './playground-common';\nimport { getWebAnimation } from '../motion';\nimport { entranceAnimations as defs } from '../library/entrance';\n\nimport type { CSSProperties } from 'react';\nimport type { Meta } from '@wix/yoshi-storybook-dependencies';\nimport type {\n EffectConfig,\n OneOfEffects,\n AllEffectsNames,\n} from '@wix/effects-kit';\nimport type { SchemaEditor } from './playground-common';\nimport type { AnimationGroup } from '../motion';\nimport type { EntranceAnimation } from '../types';\n\nexport default {\n title: 'Animation Playground/Entrance',\n} as Meta;\n\nexport const Entrance: React.FC<any> = () => {\n const compRef = React.useRef<HTMLDivElement>(null);\n const animationGroup = React.useRef<AnimationGroup>();\n const [schemaEditor, setSchemaEditor] =\n React.useState<SchemaEditor>('responsive');\n\n React.useEffect(() => {\n setData(mapSchemaToDefaultData(animations[animName], schemaEditor));\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [schemaEditor]);\n\n const animations = Object.fromEntries(\n getPresets(CONFIG[schemaMapper[schemaEditor]].entrance)\n .concat(getPresets(CONFIG[schemaMapper[schemaEditor]].entranceLegacy))\n .map((preset) => [preset.name, preset.schema]),\n ) as Record<AllEffectsNames, EffectConfig<OneOfEffects>['schema']>;\n\n const implementedAnimations = Object.keys(defs).filter(\n (animationName) => animations[animationName as AllEffectsNames],\n ) as AllEffectsNames[];\n\n function animateText(\n el: HTMLElement,\n name: string,\n { duration = 1000, delay = 0, easing = '', ...params },\n ) {\n // Clear\n animationGroup.current?.cancel();\n\n // Animate\n animationGroup.current = getWebAnimation(el.id, {\n id: '',\n namedEffect: { id: '', type: name, ...params } as EntranceAnimation,\n duration,\n delay,\n fill: 'backwards',\n iterations: 1,\n easing,\n }) as AnimationGroup;\n animationGroup.current!.play();\n // animate(name, el, +duration / 1000, +delay / 1000, {\n // ...params,\n // callbacks: { onComplete: () => resetAnimation(el, animationGroup.current) },\n // });\n }\n\n const [animName, setAnimName] = React.useState<AllEffectsNames>(\n implementedAnimations[0],\n );\n\n const [rotation, setRotation] = React.useState<number>(0);\n\n const schema = animations[animName] || {};\n const [data, setData] = React.useState<Record<string, any>>(\n mapSchemaToDefaultData(schema),\n );\n\n function handleControlChange(name: string, value: any) {\n setData((currentData) => ({\n ...currentData,\n [name]: value,\n }));\n }\n\n return (\n <div className={styles.stage}>\n <div className={styles.components}>\n <div\n id=\"comp1\"\n className={styles.component}\n ref={compRef}\n style={\n {\n '--comp-rotate-z': `${rotation}deg`,\n transform: `rotateZ(var(--comp-rotate-z, 0deg))`,\n background: 'teal',\n } as CSSProperties\n }\n >\n Entrance\n </div>\n </div>\n <div className={styles.globalControls}>\n <NumberInput\n label=\"Rotation\"\n value={rotation}\n min={0}\n max={360}\n step={1}\n onChange={(event) => setRotation(event.target.valueAsNumber)}\n />\n <SelectInput\n onChange={(event) => {\n const value = event.target.value;\n setSchemaEditor(value);\n // Reset \"power\" when changing editor\n // handleControlChange('power', undefined);\n }}\n value={schemaEditor}\n options={['desktop', 'mobile', 'responsive']}\n className={styles.mainSelect}\n />\n <SelectInput\n onChange={(event) => {\n const value = event.target.value as AllEffectsNames;\n setAnimName(value);\n setData(\n mapSchemaToDefaultData(animations[value] || {}, schemaEditor),\n );\n }}\n value={animName}\n options={\n Object.keys(animations).map((name) => [\n name,\n implementedAnimations.includes(name as AllEffectsNames),\n ]) as [string, boolean][]\n }\n className={styles.mainSelect}\n />\n </div>\n <div className={styles.controls}>\n {Object.entries(schema)\n .sort(([a], [b]) => {\n if (a === 'duration' || (b !== 'duration' && a === 'delay')) {\n return -1;\n }\n if (b === 'allowReplay') {\n return -1;\n }\n return 0;\n })\n .map(([name, controlProps], i) => (\n <Control\n key={`key-control-${i}`}\n {...controlProps}\n value={data[name]}\n label={name}\n onChange={(_e, value) => handleControlChange(name, value)}\n />\n ))}\n <div className={styles.buttons}>\n <button\n className={styles.animateButton}\n onClick={() => animateText(compRef.current!, animName, data)}\n >\n Animate\n </button>\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|