@dano796/react-reart 0.1.0
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/LICENSE.md +25 -0
- package/README.md +222 -0
- package/cli/build-registry.mjs +128 -0
- package/cli/index.js +396 -0
- package/cli/registry.json +873 -0
- package/dist/components/BackgroundStudio.d.ts +10 -0
- package/dist/components/BackgroundStudio.d.ts.map +1 -0
- package/dist/components/BackgroundStudio.js +268 -0
- package/dist/components/BackgroundStudio.js.map +1 -0
- package/dist/components/FlowCurrents.d.ts +24 -0
- package/dist/components/FlowCurrents.d.ts.map +1 -0
- package/dist/components/FlowCurrents.js +79 -0
- package/dist/components/FlowCurrents.js.map +1 -0
- package/dist/components/GeoPulse.d.ts +20 -0
- package/dist/components/GeoPulse.d.ts.map +1 -0
- package/dist/components/GeoPulse.js +72 -0
- package/dist/components/GeoPulse.js.map +1 -0
- package/dist/components/GravityStorm.d.ts +20 -0
- package/dist/components/GravityStorm.d.ts.map +1 -0
- package/dist/components/GravityStorm.js +72 -0
- package/dist/components/GravityStorm.js.map +1 -0
- package/dist/components/WaveEther.d.ts +21 -0
- package/dist/components/WaveEther.d.ts.map +1 -0
- package/dist/components/WaveEther.js +73 -0
- package/dist/components/WaveEther.js.map +1 -0
- package/dist/components/backgrounds/AmbientMesh.d.ts +38 -0
- package/dist/components/backgrounds/AmbientMesh.d.ts.map +1 -0
- package/dist/components/backgrounds/AmbientMesh.js +101 -0
- package/dist/components/backgrounds/AmbientMesh.js.map +1 -0
- package/dist/components/backgrounds/ArborealGrowth.d.ts +26 -0
- package/dist/components/backgrounds/ArborealGrowth.d.ts.map +1 -0
- package/dist/components/backgrounds/ArborealGrowth.js +78 -0
- package/dist/components/backgrounds/ArborealGrowth.js.map +1 -0
- package/dist/components/backgrounds/CliffordAttractor.d.ts +24 -0
- package/dist/components/backgrounds/CliffordAttractor.d.ts.map +1 -0
- package/dist/components/backgrounds/CliffordAttractor.js +86 -0
- package/dist/components/backgrounds/CliffordAttractor.js.map +1 -0
- package/dist/components/backgrounds/CrystallineDrift.d.ts +33 -0
- package/dist/components/backgrounds/CrystallineDrift.d.ts.map +1 -0
- package/dist/components/backgrounds/CrystallineDrift.js +101 -0
- package/dist/components/backgrounds/CrystallineDrift.js.map +1 -0
- package/dist/components/backgrounds/DifferentialGrowth.d.ts +9 -0
- package/dist/components/backgrounds/DifferentialGrowth.d.ts.map +1 -0
- package/dist/components/backgrounds/DifferentialGrowth.js +82 -0
- package/dist/components/backgrounds/DifferentialGrowth.js.map +1 -0
- package/dist/components/backgrounds/DoublePendulum.d.ts +9 -0
- package/dist/components/backgrounds/DoublePendulum.d.ts.map +1 -0
- package/dist/components/backgrounds/DoublePendulum.js +81 -0
- package/dist/components/backgrounds/DoublePendulum.js.map +1 -0
- package/dist/components/backgrounds/DragonCurve.d.ts +27 -0
- package/dist/components/backgrounds/DragonCurve.d.ts.map +1 -0
- package/dist/components/backgrounds/DragonCurve.js +79 -0
- package/dist/components/backgrounds/DragonCurve.js.map +1 -0
- package/dist/components/backgrounds/DragonFold.d.ts +31 -0
- package/dist/components/backgrounds/DragonFold.d.ts.map +1 -0
- package/dist/components/backgrounds/DragonFold.js +94 -0
- package/dist/components/backgrounds/DragonFold.js.map +1 -0
- package/dist/components/backgrounds/EmberCascade.d.ts +24 -0
- package/dist/components/backgrounds/EmberCascade.d.ts.map +1 -0
- package/dist/components/backgrounds/EmberCascade.js +88 -0
- package/dist/components/backgrounds/EmberCascade.js.map +1 -0
- package/dist/components/backgrounds/FibonacciVortex.d.ts +42 -0
- package/dist/components/backgrounds/FibonacciVortex.d.ts.map +1 -0
- package/dist/components/backgrounds/FibonacciVortex.js +151 -0
- package/dist/components/backgrounds/FibonacciVortex.js.map +1 -0
- package/dist/components/backgrounds/FlowCurrents.d.ts +35 -0
- package/dist/components/backgrounds/FlowCurrents.d.ts.map +1 -0
- package/dist/components/backgrounds/FlowCurrents.js +97 -0
- package/dist/components/backgrounds/FlowCurrents.js.map +1 -0
- package/dist/components/backgrounds/FractalNoiseTerrain.d.ts +9 -0
- package/dist/components/backgrounds/FractalNoiseTerrain.d.ts.map +1 -0
- package/dist/components/backgrounds/FractalNoiseTerrain.js +85 -0
- package/dist/components/backgrounds/FractalNoiseTerrain.js.map +1 -0
- package/dist/components/backgrounds/FractalTree.d.ts +35 -0
- package/dist/components/backgrounds/FractalTree.d.ts.map +1 -0
- package/dist/components/backgrounds/FractalTree.js +98 -0
- package/dist/components/backgrounds/FractalTree.js.map +1 -0
- package/dist/components/backgrounds/GeoPulse.d.ts +31 -0
- package/dist/components/backgrounds/GeoPulse.d.ts.map +1 -0
- package/dist/components/backgrounds/GeoPulse.js +89 -0
- package/dist/components/backgrounds/GeoPulse.js.map +1 -0
- package/dist/components/backgrounds/GravityStorm.d.ts +30 -0
- package/dist/components/backgrounds/GravityStorm.d.ts.map +1 -0
- package/dist/components/backgrounds/GravityStorm.js +89 -0
- package/dist/components/backgrounds/GravityStorm.js.map +1 -0
- package/dist/components/backgrounds/HarmonicLattice.d.ts +26 -0
- package/dist/components/backgrounds/HarmonicLattice.d.ts.map +1 -0
- package/dist/components/backgrounds/HarmonicLattice.js +89 -0
- package/dist/components/backgrounds/HarmonicLattice.js.map +1 -0
- package/dist/components/backgrounds/HexRipple.d.ts +44 -0
- package/dist/components/backgrounds/HexRipple.d.ts.map +1 -0
- package/dist/components/backgrounds/HexRipple.js +149 -0
- package/dist/components/backgrounds/HexRipple.js.map +1 -0
- package/dist/components/backgrounds/KochCrystal.d.ts +27 -0
- package/dist/components/backgrounds/KochCrystal.d.ts.map +1 -0
- package/dist/components/backgrounds/KochCrystal.js +79 -0
- package/dist/components/backgrounds/KochCrystal.js.map +1 -0
- package/dist/components/backgrounds/LissajousWeave.d.ts +23 -0
- package/dist/components/backgrounds/LissajousWeave.d.ts.map +1 -0
- package/dist/components/backgrounds/LissajousWeave.js +86 -0
- package/dist/components/backgrounds/LissajousWeave.js.map +1 -0
- package/dist/components/backgrounds/MoireLattice.d.ts +9 -0
- package/dist/components/backgrounds/MoireLattice.d.ts.map +1 -0
- package/dist/components/backgrounds/MoireLattice.js +81 -0
- package/dist/components/backgrounds/MoireLattice.js.map +1 -0
- package/dist/components/backgrounds/NebulaVeil.d.ts +28 -0
- package/dist/components/backgrounds/NebulaVeil.d.ts.map +1 -0
- package/dist/components/backgrounds/NebulaVeil.js +121 -0
- package/dist/components/backgrounds/NebulaVeil.js.map +1 -0
- package/dist/components/backgrounds/NeuralWeave.d.ts +9 -0
- package/dist/components/backgrounds/NeuralWeave.d.ts.map +1 -0
- package/dist/components/backgrounds/NeuralWeave.js +81 -0
- package/dist/components/backgrounds/NeuralWeave.js.map +1 -0
- package/dist/components/backgrounds/OrbitalResonance.d.ts +9 -0
- package/dist/components/backgrounds/OrbitalResonance.d.ts.map +1 -0
- package/dist/components/backgrounds/OrbitalResonance.js +86 -0
- package/dist/components/backgrounds/OrbitalResonance.js.map +1 -0
- package/dist/components/backgrounds/PhotonBurst.d.ts +41 -0
- package/dist/components/backgrounds/PhotonBurst.d.ts.map +1 -0
- package/dist/components/backgrounds/PhotonBurst.js +150 -0
- package/dist/components/backgrounds/PhotonBurst.js.map +1 -0
- package/dist/components/backgrounds/PhyllotaxisDream.d.ts +25 -0
- package/dist/components/backgrounds/PhyllotaxisDream.d.ts.map +1 -0
- package/dist/components/backgrounds/PhyllotaxisDream.js +88 -0
- package/dist/components/backgrounds/PhyllotaxisDream.js.map +1 -0
- package/dist/components/backgrounds/PlasmaField.d.ts +28 -0
- package/dist/components/backgrounds/PlasmaField.d.ts.map +1 -0
- package/dist/components/backgrounds/PlasmaField.js +117 -0
- package/dist/components/backgrounds/PlasmaField.js.map +1 -0
- package/dist/components/backgrounds/PrismaticWave.d.ts +46 -0
- package/dist/components/backgrounds/PrismaticWave.d.ts.map +1 -0
- package/dist/components/backgrounds/PrismaticWave.js +152 -0
- package/dist/components/backgrounds/PrismaticWave.js.map +1 -0
- package/dist/components/backgrounds/ReactionDiffusion.d.ts +9 -0
- package/dist/components/backgrounds/ReactionDiffusion.d.ts.map +1 -0
- package/dist/components/backgrounds/ReactionDiffusion.js +79 -0
- package/dist/components/backgrounds/ReactionDiffusion.js.map +1 -0
- package/dist/components/backgrounds/RecursiveSubdivision.d.ts +9 -0
- package/dist/components/backgrounds/RecursiveSubdivision.d.ts.map +1 -0
- package/dist/components/backgrounds/RecursiveSubdivision.js +84 -0
- package/dist/components/backgrounds/RecursiveSubdivision.js.map +1 -0
- package/dist/components/backgrounds/RecursiveTunnel.d.ts +44 -0
- package/dist/components/backgrounds/RecursiveTunnel.d.ts.map +1 -0
- package/dist/components/backgrounds/RecursiveTunnel.js +155 -0
- package/dist/components/backgrounds/RecursiveTunnel.js.map +1 -0
- package/dist/components/backgrounds/SierpinskiChaos.d.ts +32 -0
- package/dist/components/backgrounds/SierpinskiChaos.d.ts.map +1 -0
- package/dist/components/backgrounds/SierpinskiChaos.js +95 -0
- package/dist/components/backgrounds/SierpinskiChaos.js.map +1 -0
- package/dist/components/backgrounds/SierpinskiDust.d.ts +47 -0
- package/dist/components/backgrounds/SierpinskiDust.d.ts.map +1 -0
- package/dist/components/backgrounds/SierpinskiDust.js +148 -0
- package/dist/components/backgrounds/SierpinskiDust.js.map +1 -0
- package/dist/components/backgrounds/Spirograph.d.ts +24 -0
- package/dist/components/backgrounds/Spirograph.d.ts.map +1 -0
- package/dist/components/backgrounds/Spirograph.js +86 -0
- package/dist/components/backgrounds/Spirograph.js.map +1 -0
- package/dist/components/backgrounds/TideHarmonics.d.ts +9 -0
- package/dist/components/backgrounds/TideHarmonics.d.ts.map +1 -0
- package/dist/components/backgrounds/TideHarmonics.js +80 -0
- package/dist/components/backgrounds/TideHarmonics.js.map +1 -0
- package/dist/components/backgrounds/VoronoiMosaic.d.ts +9 -0
- package/dist/components/backgrounds/VoronoiMosaic.d.ts.map +1 -0
- package/dist/components/backgrounds/VoronoiMosaic.js +76 -0
- package/dist/components/backgrounds/VoronoiMosaic.js.map +1 -0
- package/dist/components/backgrounds/VortexBloom.d.ts +36 -0
- package/dist/components/backgrounds/VortexBloom.d.ts.map +1 -0
- package/dist/components/backgrounds/VortexBloom.js +101 -0
- package/dist/components/backgrounds/VortexBloom.js.map +1 -0
- package/dist/components/backgrounds/WaveEther.d.ts +32 -0
- package/dist/components/backgrounds/WaveEther.d.ts.map +1 -0
- package/dist/components/backgrounds/WaveEther.js +91 -0
- package/dist/components/backgrounds/WaveEther.js.map +1 -0
- package/dist/components/backgrounds/archived/CliffordAttractor.d.ts +24 -0
- package/dist/components/backgrounds/archived/CliffordAttractor.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/CliffordAttractor.js +86 -0
- package/dist/components/backgrounds/archived/CliffordAttractor.js.map +1 -0
- package/dist/components/backgrounds/archived/CrystallineDrift.d.ts +33 -0
- package/dist/components/backgrounds/archived/CrystallineDrift.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/CrystallineDrift.js +101 -0
- package/dist/components/backgrounds/archived/CrystallineDrift.js.map +1 -0
- package/dist/components/backgrounds/archived/DifferentialGrowth.d.ts +9 -0
- package/dist/components/backgrounds/archived/DifferentialGrowth.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/DifferentialGrowth.js +82 -0
- package/dist/components/backgrounds/archived/DifferentialGrowth.js.map +1 -0
- package/dist/components/backgrounds/archived/DoublePendulum.d.ts +9 -0
- package/dist/components/backgrounds/archived/DoublePendulum.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/DoublePendulum.js +81 -0
- package/dist/components/backgrounds/archived/DoublePendulum.js.map +1 -0
- package/dist/components/backgrounds/archived/EmberCascade.d.ts +24 -0
- package/dist/components/backgrounds/archived/EmberCascade.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/EmberCascade.js +88 -0
- package/dist/components/backgrounds/archived/EmberCascade.js.map +1 -0
- package/dist/components/backgrounds/archived/GravityStorm.d.ts +30 -0
- package/dist/components/backgrounds/archived/GravityStorm.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/GravityStorm.js +89 -0
- package/dist/components/backgrounds/archived/GravityStorm.js.map +1 -0
- package/dist/components/backgrounds/archived/ReactionDiffusion.d.ts +9 -0
- package/dist/components/backgrounds/archived/ReactionDiffusion.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/ReactionDiffusion.js +79 -0
- package/dist/components/backgrounds/archived/ReactionDiffusion.js.map +1 -0
- package/dist/components/backgrounds/archived/Spirograph.d.ts +24 -0
- package/dist/components/backgrounds/archived/Spirograph.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/Spirograph.js +86 -0
- package/dist/components/backgrounds/archived/Spirograph.js.map +1 -0
- package/dist/components/backgrounds/archived/VortexBloom.d.ts +36 -0
- package/dist/components/backgrounds/archived/VortexBloom.d.ts.map +1 -0
- package/dist/components/backgrounds/archived/VortexBloom.js +101 -0
- package/dist/components/backgrounds/archived/VortexBloom.js.map +1 -0
- package/dist/components/engines/ambientMesh.d.ts +31 -0
- package/dist/components/engines/ambientMesh.d.ts.map +1 -0
- package/dist/components/engines/ambientMesh.js +123 -0
- package/dist/components/engines/ambientMesh.js.map +1 -0
- package/dist/components/engines/arborealGrowth.d.ts +49 -0
- package/dist/components/engines/arborealGrowth.d.ts.map +1 -0
- package/dist/components/engines/arborealGrowth.js +220 -0
- package/dist/components/engines/arborealGrowth.js.map +1 -0
- package/dist/components/engines/archived/cliffordAttractor.d.ts +31 -0
- package/dist/components/engines/archived/cliffordAttractor.d.ts.map +1 -0
- package/dist/components/engines/archived/cliffordAttractor.js +71 -0
- package/dist/components/engines/archived/cliffordAttractor.js.map +1 -0
- package/dist/components/engines/archived/crystallineDrift.d.ts +31 -0
- package/dist/components/engines/archived/crystallineDrift.d.ts.map +1 -0
- package/dist/components/engines/archived/crystallineDrift.js +117 -0
- package/dist/components/engines/archived/crystallineDrift.js.map +1 -0
- package/dist/components/engines/archived/differentialGrowth.d.ts +39 -0
- package/dist/components/engines/archived/differentialGrowth.d.ts.map +1 -0
- package/dist/components/engines/archived/differentialGrowth.js +139 -0
- package/dist/components/engines/archived/differentialGrowth.js.map +1 -0
- package/dist/components/engines/archived/doublePendulum.d.ts +41 -0
- package/dist/components/engines/archived/doublePendulum.d.ts.map +1 -0
- package/dist/components/engines/archived/doublePendulum.js +97 -0
- package/dist/components/engines/archived/doublePendulum.js.map +1 -0
- package/dist/components/engines/archived/emberCascade.d.ts +45 -0
- package/dist/components/engines/archived/emberCascade.d.ts.map +1 -0
- package/dist/components/engines/archived/emberCascade.js +137 -0
- package/dist/components/engines/archived/emberCascade.js.map +1 -0
- package/dist/components/engines/archived/gravityStorm.d.ts +39 -0
- package/dist/components/engines/archived/gravityStorm.d.ts.map +1 -0
- package/dist/components/engines/archived/gravityStorm.js +124 -0
- package/dist/components/engines/archived/gravityStorm.js.map +1 -0
- package/dist/components/engines/archived/reactionDiffusion.d.ts +32 -0
- package/dist/components/engines/archived/reactionDiffusion.d.ts.map +1 -0
- package/dist/components/engines/archived/reactionDiffusion.js +99 -0
- package/dist/components/engines/archived/reactionDiffusion.js.map +1 -0
- package/dist/components/engines/archived/spirograph.d.ts +31 -0
- package/dist/components/engines/archived/spirograph.d.ts.map +1 -0
- package/dist/components/engines/archived/spirograph.js +82 -0
- package/dist/components/engines/archived/spirograph.js.map +1 -0
- package/dist/components/engines/archived/vortexBloom.d.ts +49 -0
- package/dist/components/engines/archived/vortexBloom.d.ts.map +1 -0
- package/dist/components/engines/archived/vortexBloom.js +151 -0
- package/dist/components/engines/archived/vortexBloom.js.map +1 -0
- package/dist/components/engines/cliffordAttractor.d.ts +31 -0
- package/dist/components/engines/cliffordAttractor.d.ts.map +1 -0
- package/dist/components/engines/cliffordAttractor.js +71 -0
- package/dist/components/engines/cliffordAttractor.js.map +1 -0
- package/dist/components/engines/crystallineDrift.d.ts +31 -0
- package/dist/components/engines/crystallineDrift.d.ts.map +1 -0
- package/dist/components/engines/crystallineDrift.js +117 -0
- package/dist/components/engines/crystallineDrift.js.map +1 -0
- package/dist/components/engines/differentialGrowth.d.ts +39 -0
- package/dist/components/engines/differentialGrowth.d.ts.map +1 -0
- package/dist/components/engines/differentialGrowth.js +139 -0
- package/dist/components/engines/differentialGrowth.js.map +1 -0
- package/dist/components/engines/doublePendulum.d.ts +41 -0
- package/dist/components/engines/doublePendulum.d.ts.map +1 -0
- package/dist/components/engines/doublePendulum.js +97 -0
- package/dist/components/engines/doublePendulum.js.map +1 -0
- package/dist/components/engines/dragonCurve.d.ts +46 -0
- package/dist/components/engines/dragonCurve.d.ts.map +1 -0
- package/dist/components/engines/dragonCurve.js +178 -0
- package/dist/components/engines/dragonCurve.js.map +1 -0
- package/dist/components/engines/dragonFold.d.ts +28 -0
- package/dist/components/engines/dragonFold.d.ts.map +1 -0
- package/dist/components/engines/dragonFold.js +166 -0
- package/dist/components/engines/dragonFold.js.map +1 -0
- package/dist/components/engines/emberCascade.d.ts +45 -0
- package/dist/components/engines/emberCascade.d.ts.map +1 -0
- package/dist/components/engines/emberCascade.js +137 -0
- package/dist/components/engines/emberCascade.js.map +1 -0
- package/dist/components/engines/fibonacciVortex.d.ts +70 -0
- package/dist/components/engines/fibonacciVortex.d.ts.map +1 -0
- package/dist/components/engines/fibonacciVortex.js +144 -0
- package/dist/components/engines/fibonacciVortex.js.map +1 -0
- package/dist/components/engines/flowCurrents.d.ts +34 -0
- package/dist/components/engines/flowCurrents.d.ts.map +1 -0
- package/dist/components/engines/flowCurrents.js +89 -0
- package/dist/components/engines/flowCurrents.js.map +1 -0
- package/dist/components/engines/fractalNoiseTerrain.d.ts +32 -0
- package/dist/components/engines/fractalNoiseTerrain.d.ts.map +1 -0
- package/dist/components/engines/fractalNoiseTerrain.js +89 -0
- package/dist/components/engines/fractalNoiseTerrain.js.map +1 -0
- package/dist/components/engines/fractalTree.d.ts +20 -0
- package/dist/components/engines/fractalTree.d.ts.map +1 -0
- package/dist/components/engines/fractalTree.js +92 -0
- package/dist/components/engines/fractalTree.js.map +1 -0
- package/dist/components/engines/geoPulse.d.ts +33 -0
- package/dist/components/engines/geoPulse.d.ts.map +1 -0
- package/dist/components/engines/geoPulse.js +116 -0
- package/dist/components/engines/geoPulse.js.map +1 -0
- package/dist/components/engines/gravityStorm.d.ts +39 -0
- package/dist/components/engines/gravityStorm.d.ts.map +1 -0
- package/dist/components/engines/gravityStorm.js +124 -0
- package/dist/components/engines/gravityStorm.js.map +1 -0
- package/dist/components/engines/harmonicLattice.d.ts +38 -0
- package/dist/components/engines/harmonicLattice.d.ts.map +1 -0
- package/dist/components/engines/harmonicLattice.js +87 -0
- package/dist/components/engines/harmonicLattice.js.map +1 -0
- package/dist/components/engines/hexRipple.d.ts +61 -0
- package/dist/components/engines/hexRipple.d.ts.map +1 -0
- package/dist/components/engines/hexRipple.js +157 -0
- package/dist/components/engines/hexRipple.js.map +1 -0
- package/dist/components/engines/kochCrystal.d.ts +47 -0
- package/dist/components/engines/kochCrystal.d.ts.map +1 -0
- package/dist/components/engines/kochCrystal.js +177 -0
- package/dist/components/engines/kochCrystal.js.map +1 -0
- package/dist/components/engines/lissajousWeave.d.ts +38 -0
- package/dist/components/engines/lissajousWeave.d.ts.map +1 -0
- package/dist/components/engines/lissajousWeave.js +83 -0
- package/dist/components/engines/lissajousWeave.js.map +1 -0
- package/dist/components/engines/moireLattice.d.ts +28 -0
- package/dist/components/engines/moireLattice.d.ts.map +1 -0
- package/dist/components/engines/moireLattice.js +47 -0
- package/dist/components/engines/moireLattice.js.map +1 -0
- package/dist/components/engines/nebulaVeil.d.ts +38 -0
- package/dist/components/engines/nebulaVeil.d.ts.map +1 -0
- package/dist/components/engines/nebulaVeil.js +177 -0
- package/dist/components/engines/nebulaVeil.js.map +1 -0
- package/dist/components/engines/neuralWeave.d.ts +53 -0
- package/dist/components/engines/neuralWeave.d.ts.map +1 -0
- package/dist/components/engines/neuralWeave.js +165 -0
- package/dist/components/engines/neuralWeave.js.map +1 -0
- package/dist/components/engines/orbitalResonance.d.ts +50 -0
- package/dist/components/engines/orbitalResonance.d.ts.map +1 -0
- package/dist/components/engines/orbitalResonance.js +94 -0
- package/dist/components/engines/orbitalResonance.js.map +1 -0
- package/dist/components/engines/photonBurst.d.ts +43 -0
- package/dist/components/engines/photonBurst.d.ts.map +1 -0
- package/dist/components/engines/photonBurst.js +204 -0
- package/dist/components/engines/photonBurst.js.map +1 -0
- package/dist/components/engines/phyllotaxisDream.d.ts +28 -0
- package/dist/components/engines/phyllotaxisDream.d.ts.map +1 -0
- package/dist/components/engines/phyllotaxisDream.js +75 -0
- package/dist/components/engines/phyllotaxisDream.js.map +1 -0
- package/dist/components/engines/plasmaField.d.ts +44 -0
- package/dist/components/engines/plasmaField.d.ts.map +1 -0
- package/dist/components/engines/plasmaField.js +227 -0
- package/dist/components/engines/plasmaField.js.map +1 -0
- package/dist/components/engines/prismaticWave.d.ts +39 -0
- package/dist/components/engines/prismaticWave.d.ts.map +1 -0
- package/dist/components/engines/prismaticWave.js +158 -0
- package/dist/components/engines/prismaticWave.js.map +1 -0
- package/dist/components/engines/reactionDiffusion.d.ts +32 -0
- package/dist/components/engines/reactionDiffusion.d.ts.map +1 -0
- package/dist/components/engines/reactionDiffusion.js +99 -0
- package/dist/components/engines/reactionDiffusion.js.map +1 -0
- package/dist/components/engines/recursiveSubdivision.d.ts +40 -0
- package/dist/components/engines/recursiveSubdivision.d.ts.map +1 -0
- package/dist/components/engines/recursiveSubdivision.js +133 -0
- package/dist/components/engines/recursiveSubdivision.js.map +1 -0
- package/dist/components/engines/recursiveTunnel.d.ts +66 -0
- package/dist/components/engines/recursiveTunnel.d.ts.map +1 -0
- package/dist/components/engines/recursiveTunnel.js +152 -0
- package/dist/components/engines/recursiveTunnel.js.map +1 -0
- package/dist/components/engines/sierpinskiChaos.d.ts +41 -0
- package/dist/components/engines/sierpinskiChaos.d.ts.map +1 -0
- package/dist/components/engines/sierpinskiChaos.js +118 -0
- package/dist/components/engines/sierpinskiChaos.js.map +1 -0
- package/dist/components/engines/sierpinskiDust.d.ts +72 -0
- package/dist/components/engines/sierpinskiDust.d.ts.map +1 -0
- package/dist/components/engines/sierpinskiDust.js +152 -0
- package/dist/components/engines/sierpinskiDust.js.map +1 -0
- package/dist/components/engines/spirograph.d.ts +31 -0
- package/dist/components/engines/spirograph.d.ts.map +1 -0
- package/dist/components/engines/spirograph.js +82 -0
- package/dist/components/engines/spirograph.js.map +1 -0
- package/dist/components/engines/tideHarmonics.d.ts +37 -0
- package/dist/components/engines/tideHarmonics.d.ts.map +1 -0
- package/dist/components/engines/tideHarmonics.js +71 -0
- package/dist/components/engines/tideHarmonics.js.map +1 -0
- package/dist/components/engines/voronoiMosaic.d.ts +37 -0
- package/dist/components/engines/voronoiMosaic.d.ts.map +1 -0
- package/dist/components/engines/voronoiMosaic.js +130 -0
- package/dist/components/engines/voronoiMosaic.js.map +1 -0
- package/dist/components/engines/vortexBloom.d.ts +49 -0
- package/dist/components/engines/vortexBloom.d.ts.map +1 -0
- package/dist/components/engines/vortexBloom.js +151 -0
- package/dist/components/engines/vortexBloom.js.map +1 -0
- package/dist/components/engines/waveEther.d.ts +30 -0
- package/dist/components/engines/waveEther.d.ts.map +1 -0
- package/dist/components/engines/waveEther.js +74 -0
- package/dist/components/engines/waveEther.js.map +1 -0
- package/dist/components/schemas/index.d.ts +131 -0
- package/dist/components/schemas/index.d.ts.map +1 -0
- package/dist/components/schemas/index.js +478 -0
- package/dist/components/schemas/index.js.map +1 -0
- package/dist/components/utils/noise.d.ts +38 -0
- package/dist/components/utils/noise.d.ts.map +1 -0
- package/dist/components/utils/noise.js +132 -0
- package/dist/components/utils/noise.js.map +1 -0
- package/dist/engines/flowCurrents.d.ts +34 -0
- package/dist/engines/flowCurrents.d.ts.map +1 -0
- package/dist/engines/flowCurrents.js +89 -0
- package/dist/engines/flowCurrents.js.map +1 -0
- package/dist/engines/geoPulse.d.ts +33 -0
- package/dist/engines/geoPulse.d.ts.map +1 -0
- package/dist/engines/geoPulse.js +116 -0
- package/dist/engines/geoPulse.js.map +1 -0
- package/dist/engines/gravityStorm.d.ts +39 -0
- package/dist/engines/gravityStorm.d.ts.map +1 -0
- package/dist/engines/gravityStorm.js +124 -0
- package/dist/engines/gravityStorm.js.map +1 -0
- package/dist/engines/waveEther.d.ts +30 -0
- package/dist/engines/waveEther.d.ts.map +1 -0
- package/dist/engines/waveEther.js +74 -0
- package/dist/engines/waveEther.js.map +1 -0
- package/dist/index.d.ts +46 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +138 -0
- package/dist/index.js.map +1 -0
- package/dist/registry/index.d.ts +59 -0
- package/dist/registry/index.d.ts.map +1 -0
- package/dist/registry/index.js +669 -0
- package/dist/registry/index.js.map +1 -0
- package/dist/schemas/index.d.ts +93 -0
- package/dist/schemas/index.d.ts.map +1 -0
- package/dist/schemas/index.js +83 -0
- package/dist/schemas/index.js.map +1 -0
- package/dist/utils/noise.d.ts +37 -0
- package/dist/utils/noise.d.ts.map +1 -0
- package/dist/utils/noise.js +129 -0
- package/dist/utils/noise.js.map +1 -0
- package/package.json +68 -0
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
|
+
import { initSierpinskiChaos, drawSierpinskiChaos, resetSierpinskiChaos, } from "../engines/sierpinskiChaos";
|
|
4
|
+
export const sierpinskiChaosDefaults = {
|
|
5
|
+
seed: 42731,
|
|
6
|
+
stepsPerFrame: 600,
|
|
7
|
+
scale: 0.92,
|
|
8
|
+
rotSpeed: 0.0004,
|
|
9
|
+
pointSize: 1.2,
|
|
10
|
+
pointAlpha: 160,
|
|
11
|
+
showVertices: true,
|
|
12
|
+
colorV1: "#e85a6e",
|
|
13
|
+
colorV2: "#5ab8d8",
|
|
14
|
+
colorV3: "#a8d858",
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* SierpinskiChaos — IFS chaos game producing the Sierpinski gasket.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* <SierpinskiChaos
|
|
21
|
+
* stepsPerFrame={800}
|
|
22
|
+
* colorV1="#e85a6e"
|
|
23
|
+
* colorV2="#5ab8d8"
|
|
24
|
+
* colorV3="#a8d858"
|
|
25
|
+
* style={{ position: "absolute", inset: 0 }}
|
|
26
|
+
* />
|
|
27
|
+
*/
|
|
28
|
+
export function SierpinskiChaos(props) {
|
|
29
|
+
const { className, style, ...params } = props;
|
|
30
|
+
const merged = { ...sierpinskiChaosDefaults, ...params };
|
|
31
|
+
const canvasRef = useRef(null);
|
|
32
|
+
const stateRef = useRef(null);
|
|
33
|
+
const paramsRef = useRef(merged);
|
|
34
|
+
paramsRef.current = merged;
|
|
35
|
+
useEffect(() => {
|
|
36
|
+
const canvas = canvasRef.current;
|
|
37
|
+
if (!canvas)
|
|
38
|
+
return;
|
|
39
|
+
const ctx = canvas.getContext("2d");
|
|
40
|
+
if (!ctx)
|
|
41
|
+
return;
|
|
42
|
+
let animId;
|
|
43
|
+
let running = true;
|
|
44
|
+
let isVisible = false;
|
|
45
|
+
function resizeCanvas() {
|
|
46
|
+
const w = canvas.clientWidth * window.devicePixelRatio;
|
|
47
|
+
const h = canvas.clientHeight * window.devicePixelRatio;
|
|
48
|
+
if (canvas.width !== w || canvas.height !== h) {
|
|
49
|
+
canvas.width = w;
|
|
50
|
+
canvas.height = h;
|
|
51
|
+
ctx.fillStyle = "rgb(10,10,18)";
|
|
52
|
+
ctx.fillRect(0, 0, w, h);
|
|
53
|
+
stateRef.current = initSierpinskiChaos(w, h, paramsRef.current);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
resizeCanvas();
|
|
57
|
+
stateRef.current = initSierpinskiChaos(canvas.width, canvas.height, paramsRef.current);
|
|
58
|
+
const loop = () => {
|
|
59
|
+
if (!running || !isVisible)
|
|
60
|
+
return;
|
|
61
|
+
if (stateRef.current) {
|
|
62
|
+
drawSierpinskiChaos(ctx, stateRef.current, paramsRef.current);
|
|
63
|
+
}
|
|
64
|
+
animId = requestAnimationFrame(loop);
|
|
65
|
+
};
|
|
66
|
+
const io = new IntersectionObserver((entries) => {
|
|
67
|
+
entries.forEach((entry) => {
|
|
68
|
+
isVisible = entry.isIntersecting;
|
|
69
|
+
if (isVisible) {
|
|
70
|
+
if (typeof animId !== "undefined")
|
|
71
|
+
cancelAnimationFrame(animId);
|
|
72
|
+
animId = requestAnimationFrame(loop);
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
});
|
|
76
|
+
io.observe(canvas);
|
|
77
|
+
const ro = new ResizeObserver(resizeCanvas);
|
|
78
|
+
ro.observe(canvas);
|
|
79
|
+
return () => {
|
|
80
|
+
running = false;
|
|
81
|
+
cancelAnimationFrame(animId);
|
|
82
|
+
ro.disconnect();
|
|
83
|
+
io.disconnect();
|
|
84
|
+
};
|
|
85
|
+
}, []);
|
|
86
|
+
useEffect(() => {
|
|
87
|
+
const canvas = canvasRef.current;
|
|
88
|
+
const ctx = canvas?.getContext("2d");
|
|
89
|
+
if (!canvas || !ctx || !stateRef.current)
|
|
90
|
+
return;
|
|
91
|
+
stateRef.current = resetSierpinskiChaos(ctx, stateRef.current, merged);
|
|
92
|
+
}, [merged.seed, merged.scale]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
93
|
+
return (_jsx("canvas", { ref: canvasRef, className: className, style: { display: "block", width: "100%", height: "100%", ...style } }));
|
|
94
|
+
}
|
|
95
|
+
//# sourceMappingURL=SierpinskiChaos.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SierpinskiChaos.js","sourceRoot":"","sources":["../../../src/components/backgrounds/SierpinskiChaos.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { type CSSProperties } from "react";
|
|
2
|
+
export interface SierpinskiDustParams {
|
|
3
|
+
seed?: number;
|
|
4
|
+
/** IFS chaos-game iterations plotted per frame. */
|
|
5
|
+
itersPerFrame?: number;
|
|
6
|
+
/** Max simultaneous triangle origins. */
|
|
7
|
+
maxTriangles?: number;
|
|
8
|
+
/** Triangle circumradius as fraction of min(W,H). */
|
|
9
|
+
size?: number;
|
|
10
|
+
/** Triangle rotation speed (radians/frame). */
|
|
11
|
+
rotSpeed?: number;
|
|
12
|
+
/** Trail fade opacity per frame (lower = longer persistence). */
|
|
13
|
+
trailOpacity?: number;
|
|
14
|
+
/** How strongly the mouse biases vertex selection [0–1]. */
|
|
15
|
+
mouseInfluence?: number;
|
|
16
|
+
/** Color of dust near vertex 0. */
|
|
17
|
+
colorA?: string;
|
|
18
|
+
/** Color of dust near vertex 1. */
|
|
19
|
+
colorB?: string;
|
|
20
|
+
/** Color of dust near vertex 2. */
|
|
21
|
+
colorC?: string;
|
|
22
|
+
}
|
|
23
|
+
export declare const sierpinskiDustDefaults: Required<SierpinskiDustParams>;
|
|
24
|
+
export interface SierpinskiDustProps extends SierpinskiDustParams {
|
|
25
|
+
className?: string;
|
|
26
|
+
style?: CSSProperties;
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* SierpinskiDust — chaos game IFS accumulating Sierpinski triangle attractors.
|
|
30
|
+
*
|
|
31
|
+
* The iterated function system (chaos game) plots thousands of points per frame,
|
|
32
|
+
* each placed halfway between the current position and a randomly selected triangle
|
|
33
|
+
* vertex. Over many iterations the Sierpinski fractal emerges as self-similar dust.
|
|
34
|
+
* Move the cursor to bias vertex selection — pulling the fractal toward the mouse
|
|
35
|
+
* side of each triangle. Click anywhere to plant a new triangle origin (oldest
|
|
36
|
+
* evicted when the cap is reached).
|
|
37
|
+
*
|
|
38
|
+
* @example
|
|
39
|
+
* <SierpinskiDust
|
|
40
|
+
* maxTriangles={3}
|
|
41
|
+
* rotSpeed={0.002}
|
|
42
|
+
* mouseInfluence={0.7}
|
|
43
|
+
* style={{ position: "absolute", inset: 0 }}
|
|
44
|
+
* />
|
|
45
|
+
*/
|
|
46
|
+
export declare function SierpinskiDust(props: SierpinskiDustProps): import("react/jsx-runtime").JSX.Element;
|
|
47
|
+
//# sourceMappingURL=SierpinskiDust.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SierpinskiDust.d.ts","sourceRoot":"","sources":["../../../src/components/backgrounds/SierpinskiDust.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAW9D,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qDAAqD;IACrD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4DAA4D;IAC5D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mCAAmC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mCAAmC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mCAAmC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,sBAAsB,EAAE,QAAQ,CAAC,oBAAoB,CAWjE,CAAC;AAIF,MAAM,WAAW,mBAAoB,SAAQ,oBAAoB;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAID;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAyIxD"}
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
|
+
import { initSierpinskiDust, drawSierpinskiDust, resetSierpinskiDust, addTriangle, } from "../engines/sierpinskiDust";
|
|
4
|
+
export const sierpinskiDustDefaults = {
|
|
5
|
+
seed: 88432,
|
|
6
|
+
itersPerFrame: 6000,
|
|
7
|
+
maxTriangles: 4,
|
|
8
|
+
size: 0.78,
|
|
9
|
+
rotSpeed: 0.003,
|
|
10
|
+
trailOpacity: 5,
|
|
11
|
+
mouseInfluence: 0.55,
|
|
12
|
+
colorA: "#ff3d6e",
|
|
13
|
+
colorB: "#3dffa0",
|
|
14
|
+
colorC: "#3d8fff",
|
|
15
|
+
};
|
|
16
|
+
// ── Component ─────────────────────────────────────────────────────────────────
|
|
17
|
+
/**
|
|
18
|
+
* SierpinskiDust — chaos game IFS accumulating Sierpinski triangle attractors.
|
|
19
|
+
*
|
|
20
|
+
* The iterated function system (chaos game) plots thousands of points per frame,
|
|
21
|
+
* each placed halfway between the current position and a randomly selected triangle
|
|
22
|
+
* vertex. Over many iterations the Sierpinski fractal emerges as self-similar dust.
|
|
23
|
+
* Move the cursor to bias vertex selection — pulling the fractal toward the mouse
|
|
24
|
+
* side of each triangle. Click anywhere to plant a new triangle origin (oldest
|
|
25
|
+
* evicted when the cap is reached).
|
|
26
|
+
*
|
|
27
|
+
* @example
|
|
28
|
+
* <SierpinskiDust
|
|
29
|
+
* maxTriangles={3}
|
|
30
|
+
* rotSpeed={0.002}
|
|
31
|
+
* mouseInfluence={0.7}
|
|
32
|
+
* style={{ position: "absolute", inset: 0 }}
|
|
33
|
+
* />
|
|
34
|
+
*/
|
|
35
|
+
export function SierpinskiDust(props) {
|
|
36
|
+
const { className, style, ...params } = props;
|
|
37
|
+
const merged = { ...sierpinskiDustDefaults, ...params };
|
|
38
|
+
const canvasRef = useRef(null);
|
|
39
|
+
const stateRef = useRef(null);
|
|
40
|
+
const paramsRef = useRef(merged);
|
|
41
|
+
paramsRef.current = merged;
|
|
42
|
+
// EFFECT 1 — setup loop, observers, pointer listeners
|
|
43
|
+
useEffect(() => {
|
|
44
|
+
const canvas = canvasRef.current;
|
|
45
|
+
if (!canvas)
|
|
46
|
+
return;
|
|
47
|
+
const ctx = canvas.getContext("2d");
|
|
48
|
+
if (!ctx)
|
|
49
|
+
return;
|
|
50
|
+
let animId;
|
|
51
|
+
let running = true;
|
|
52
|
+
let isVisible = false;
|
|
53
|
+
const mouse = { pos: undefined };
|
|
54
|
+
function resizeCanvas() {
|
|
55
|
+
const w = canvas.clientWidth * window.devicePixelRatio;
|
|
56
|
+
const h = canvas.clientHeight * window.devicePixelRatio;
|
|
57
|
+
if (canvas.width !== w || canvas.height !== h) {
|
|
58
|
+
canvas.width = w;
|
|
59
|
+
canvas.height = h;
|
|
60
|
+
ctx.fillStyle = "rgb(6,6,14)";
|
|
61
|
+
ctx.fillRect(0, 0, w, h);
|
|
62
|
+
stateRef.current = initSierpinskiDust(w, h, paramsRef.current);
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
resizeCanvas();
|
|
66
|
+
stateRef.current = initSierpinskiDust(canvas.width, canvas.height, paramsRef.current);
|
|
67
|
+
// Pointer handlers
|
|
68
|
+
const onMouseMove = (e) => {
|
|
69
|
+
const rect = canvas.getBoundingClientRect();
|
|
70
|
+
mouse.pos = {
|
|
71
|
+
x: (e.clientX - rect.left) * window.devicePixelRatio,
|
|
72
|
+
y: (e.clientY - rect.top) * window.devicePixelRatio,
|
|
73
|
+
};
|
|
74
|
+
};
|
|
75
|
+
const onMouseLeave = () => { mouse.pos = undefined; };
|
|
76
|
+
const onClick = (e) => {
|
|
77
|
+
if (!stateRef.current)
|
|
78
|
+
return;
|
|
79
|
+
const rect = canvas.getBoundingClientRect();
|
|
80
|
+
addTriangle(stateRef.current, (e.clientX - rect.left) * window.devicePixelRatio, (e.clientY - rect.top) * window.devicePixelRatio, paramsRef.current);
|
|
81
|
+
};
|
|
82
|
+
const onTouchMove = (e) => {
|
|
83
|
+
e.preventDefault();
|
|
84
|
+
const t = e.touches[0];
|
|
85
|
+
const rect = canvas.getBoundingClientRect();
|
|
86
|
+
mouse.pos = {
|
|
87
|
+
x: (t.clientX - rect.left) * window.devicePixelRatio,
|
|
88
|
+
y: (t.clientY - rect.top) * window.devicePixelRatio,
|
|
89
|
+
};
|
|
90
|
+
};
|
|
91
|
+
const onTouchStart = (e) => {
|
|
92
|
+
e.preventDefault();
|
|
93
|
+
if (!stateRef.current)
|
|
94
|
+
return;
|
|
95
|
+
const t = e.touches[0];
|
|
96
|
+
const rect = canvas.getBoundingClientRect();
|
|
97
|
+
addTriangle(stateRef.current, (t.clientX - rect.left) * window.devicePixelRatio, (t.clientY - rect.top) * window.devicePixelRatio, paramsRef.current);
|
|
98
|
+
};
|
|
99
|
+
canvas.addEventListener("mousemove", onMouseMove);
|
|
100
|
+
canvas.addEventListener("mouseleave", onMouseLeave);
|
|
101
|
+
canvas.addEventListener("click", onClick);
|
|
102
|
+
canvas.addEventListener("touchmove", onTouchMove, { passive: false });
|
|
103
|
+
canvas.addEventListener("touchstart", onTouchStart, { passive: false });
|
|
104
|
+
// Animation loop
|
|
105
|
+
const loop = () => {
|
|
106
|
+
if (!running || !isVisible)
|
|
107
|
+
return;
|
|
108
|
+
if (stateRef.current) {
|
|
109
|
+
drawSierpinskiDust(ctx, stateRef.current, paramsRef.current, mouse.pos);
|
|
110
|
+
}
|
|
111
|
+
animId = requestAnimationFrame(loop);
|
|
112
|
+
};
|
|
113
|
+
const io = new IntersectionObserver((entries) => {
|
|
114
|
+
entries.forEach((entry) => {
|
|
115
|
+
isVisible = entry.isIntersecting;
|
|
116
|
+
if (isVisible) {
|
|
117
|
+
if (typeof animId !== "undefined")
|
|
118
|
+
cancelAnimationFrame(animId);
|
|
119
|
+
animId = requestAnimationFrame(loop);
|
|
120
|
+
}
|
|
121
|
+
});
|
|
122
|
+
});
|
|
123
|
+
io.observe(canvas);
|
|
124
|
+
const ro = new ResizeObserver(resizeCanvas);
|
|
125
|
+
ro.observe(canvas);
|
|
126
|
+
return () => {
|
|
127
|
+
running = false;
|
|
128
|
+
cancelAnimationFrame(animId);
|
|
129
|
+
ro.disconnect();
|
|
130
|
+
io.disconnect();
|
|
131
|
+
canvas.removeEventListener("mousemove", onMouseMove);
|
|
132
|
+
canvas.removeEventListener("mouseleave", onMouseLeave);
|
|
133
|
+
canvas.removeEventListener("click", onClick);
|
|
134
|
+
canvas.removeEventListener("touchmove", onTouchMove);
|
|
135
|
+
canvas.removeEventListener("touchstart", onTouchStart);
|
|
136
|
+
};
|
|
137
|
+
}, []); // eslint-disable-line react-hooks/exhaustive-deps
|
|
138
|
+
// EFFECT 2 — structural reset when seed or size changes
|
|
139
|
+
useEffect(() => {
|
|
140
|
+
const canvas = canvasRef.current;
|
|
141
|
+
const ctx = canvas?.getContext("2d");
|
|
142
|
+
if (!canvas || !ctx || !stateRef.current)
|
|
143
|
+
return;
|
|
144
|
+
stateRef.current = resetSierpinskiDust(ctx, stateRef.current, merged);
|
|
145
|
+
}, [merged.seed, merged.size, merged.maxTriangles]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
146
|
+
return (_jsx("canvas", { ref: canvasRef, className: className, style: { display: "block", width: "100%", height: "100%", ...style } }));
|
|
147
|
+
}
|
|
148
|
+
//# sourceMappingURL=SierpinskiDust.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SierpinskiDust.js","sourceRoot":"","sources":["../../../src/components/backgrounds/SierpinskiDust.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAsB,MAAM,OAAO,CAAC;AAC9D,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,EACnB,WAAW,GAEZ,MAAM,2BAA2B,CAAC;AA0BnC,MAAM,CAAC,MAAM,sBAAsB,GAAmC;IACpE,IAAI,EAAE,KAAK;IACX,aAAa,EAAE,IAAI;IACnB,YAAY,EAAE,CAAC;IACf,IAAI,EAAE,IAAI;IACV,QAAQ,EAAE,KAAK;IACf,YAAY,EAAE,CAAC;IACf,cAAc,EAAE,IAAI;IACpB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;CAClB,CAAC;AASF,iFAAiF;AAEjF;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,cAAc,CAAC,KAA0B;IACvD,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,MAAM,GAAG,EAAE,GAAG,sBAAsB,EAAE,GAAG,MAAM,EAAE,CAAC;IAExD,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAClD,MAAM,QAAQ,GAAI,MAAM,CAA6B,IAAI,CAAC,CAAC;IAC3D,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACjC,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;IAE3B,sDAAsD;IACtD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,MAAM;YAAE,OAAO;QACpB,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACpC,IAAI,CAAC,GAAG;YAAE,OAAO;QAEjB,IAAI,MAAc,CAAC;QACnB,IAAI,OAAO,GAAK,IAAI,CAAC;QACrB,IAAI,SAAS,GAAG,KAAK,CAAC;QAEtB,MAAM,KAAK,GAAkD,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC;QAEhF,SAAS,YAAY;YACnB,MAAM,CAAC,GAAG,MAAO,CAAC,WAAW,GAAI,MAAM,CAAC,gBAAgB,CAAC;YACzD,MAAM,CAAC,GAAG,MAAO,CAAC,YAAY,GAAG,MAAM,CAAC,gBAAgB,CAAC;YACzD,IAAI,MAAO,CAAC,KAAK,KAAK,CAAC,IAAI,MAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAChD,MAAO,CAAC,KAAK,GAAI,CAAC,CAAC;gBACnB,MAAO,CAAC,MAAM,GAAG,CAAC,CAAC;gBACnB,GAAI,CAAC,SAAS,GAAG,aAAa,CAAC;gBAC/B,GAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;gBAC1B,QAAQ,CAAC,OAAO,GAAG,kBAAkB,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;YACjE,CAAC;QACH,CAAC;QAED,YAAY,EAAE,CAAC;QACf,QAAQ,CAAC,OAAO,GAAG,kBAAkB,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;QAEtF,mBAAmB;QACnB,MAAM,WAAW,GAAG,CAAC,CAAa,EAAE,EAAE;YACpC,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,KAAK,CAAC,GAAG,GAAG;gBACV,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,gBAAgB;gBACpD,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,GAAI,MAAM,CAAC,gBAAgB;aACrD,CAAC;QACJ,CAAC,CAAC;QACF,MAAM,YAAY,GAAG,GAAG,EAAE,GAAG,KAAK,CAAC,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;QAEtD,MAAM,OAAO,GAAG,CAAC,CAAa,EAAE,EAAE;YAChC,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE,OAAO;YAC9B,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,WAAW,CACT,QAAQ,CAAC,OAAO,EAChB,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,gBAAgB,EACjD,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,GAAI,MAAM,CAAC,gBAAgB,EACjD,SAAS,CAAC,OAAO,CAClB,CAAC;QACJ,CAAC,CAAC;QAEF,MAAM,WAAW,GAAG,CAAC,CAAa,EAAE,EAAE;YACpC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,MAAM,CAAC,GAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAC1B,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,KAAK,CAAC,GAAG,GAAG;gBACV,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,gBAAgB;gBACpD,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,GAAI,MAAM,CAAC,gBAAgB;aACrD,CAAC;QACJ,CAAC,CAAC;QACF,MAAM,YAAY,GAAG,CAAC,CAAa,EAAE,EAAE;YACrC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,CAAC,QAAQ,CAAC,OAAO;gBAAE,OAAO;YAC9B,MAAM,CAAC,GAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;YAC1B,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,WAAW,CACT,QAAQ,CAAC,OAAO,EAChB,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,gBAAgB,EACjD,CAAC,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,GAAI,MAAM,CAAC,gBAAgB,EACjD,SAAS,CAAC,OAAO,CAClB,CAAC;QACJ,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAG,WAAW,CAAC,CAAC;QACnD,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;QACpD,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAO,OAAO,CAAC,CAAC;QAC/C,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAG,WAAW,EAAG,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;QACxE,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;QAExE,iBAAiB;QACjB,MAAM,IAAI,GAAG,GAAG,EAAE;YAChB,IAAI,CAAC,OAAO,IAAI,CAAC,SAAS;gBAAE,OAAO;YACnC,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;gBACrB,kBAAkB,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;YAC1E,CAAC;YACD,MAAM,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;QACvC,CAAC,CAAC;QAEF,MAAM,EAAE,GAAG,IAAI,oBAAoB,CAAC,CAAC,OAAO,EAAE,EAAE;YAC9C,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;gBACxB,SAAS,GAAG,KAAK,CAAC,cAAc,CAAC;gBACjC,IAAI,SAAS,EAAE,CAAC;oBACd,IAAI,OAAO,MAAM,KAAK,WAAW;wBAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC;oBAChE,MAAM,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;gBACvC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAEnB,MAAM,EAAE,GAAG,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC;QAC5C,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAEnB,OAAO,GAAG,EAAE;YACV,OAAO,GAAG,KAAK,CAAC;YAChB,oBAAoB,CAAC,MAAM,CAAC,CAAC;YAC7B,EAAE,CAAC,UAAU,EAAE,CAAC;YAChB,EAAE,CAAC,UAAU,EAAE,CAAC;YAChB,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAG,WAAW,CAAC,CAAC;YACtD,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;YACvD,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAO,OAAO,CAAC,CAAC;YAClD,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAG,WAAW,CAAC,CAAC;YACtD,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;QACzD,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,kDAAkD;IAE1D,wDAAwD;IACxD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,MAAM,GAAG,GAAM,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE,OAAO;QACjD,QAAQ,CAAC,OAAO,GAAG,mBAAmB,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;IACxE,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,kDAAkD;IAEvG,OAAO,CACL,iBACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,GACpE,CACH,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Spirograph
|
|
3
|
+
* Hypotrochoid curves from rolling circles
|
|
4
|
+
*/
|
|
5
|
+
import { type CSSProperties } from "react";
|
|
6
|
+
export interface SpirographParams {
|
|
7
|
+
seed?: number;
|
|
8
|
+
R?: number;
|
|
9
|
+
r?: number;
|
|
10
|
+
d?: number;
|
|
11
|
+
speed?: number;
|
|
12
|
+
lineWeight?: number;
|
|
13
|
+
bgColor?: string;
|
|
14
|
+
colorA?: string;
|
|
15
|
+
colorB?: string;
|
|
16
|
+
colorC?: string;
|
|
17
|
+
}
|
|
18
|
+
export declare const spirographDefaults: Required<SpirographParams>;
|
|
19
|
+
export interface SpirographProps extends SpirographParams {
|
|
20
|
+
className?: string;
|
|
21
|
+
style?: CSSProperties;
|
|
22
|
+
}
|
|
23
|
+
export declare function Spirograph(props: SpirographProps): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
//# sourceMappingURL=Spirograph.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spirograph.d.ts","sourceRoot":"","sources":["../../../src/components/backgrounds/Spirograph.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAQ9D,MAAM,WAAW,gBAAgB;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,kBAAkB,EAAE,QAAQ,CAAC,gBAAgB,CAWzD,CAAC;AAEF,MAAM,WAAW,eAAgB,SAAQ,gBAAgB;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CA8EhD"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
* Spirograph
|
|
4
|
+
* Hypotrochoid curves from rolling circles
|
|
5
|
+
*/
|
|
6
|
+
import { useEffect, useRef } from "react";
|
|
7
|
+
import { initSpirograph, drawSpirograph, resetSpirograph, } from "../engines/spirograph";
|
|
8
|
+
export const spirographDefaults = {
|
|
9
|
+
seed: 42731,
|
|
10
|
+
R: 120,
|
|
11
|
+
r: 45,
|
|
12
|
+
d: 70,
|
|
13
|
+
speed: 1.0,
|
|
14
|
+
lineWeight: 1.2,
|
|
15
|
+
bgColor: "#0a0a0a",
|
|
16
|
+
colorA: "#ff6b35",
|
|
17
|
+
colorB: "#f7931e",
|
|
18
|
+
colorC: "#fdc830",
|
|
19
|
+
};
|
|
20
|
+
export function Spirograph(props) {
|
|
21
|
+
const { className, style, ...params } = props;
|
|
22
|
+
const merged = { ...spirographDefaults, ...params };
|
|
23
|
+
const canvasRef = useRef(null);
|
|
24
|
+
const stateRef = useRef(null);
|
|
25
|
+
const paramsRef = useRef(merged);
|
|
26
|
+
paramsRef.current = merged;
|
|
27
|
+
useEffect(() => {
|
|
28
|
+
const canvas = canvasRef.current;
|
|
29
|
+
if (!canvas)
|
|
30
|
+
return;
|
|
31
|
+
const ctx = canvas.getContext("2d", { alpha: false });
|
|
32
|
+
if (!ctx)
|
|
33
|
+
return;
|
|
34
|
+
let animId;
|
|
35
|
+
let running = true;
|
|
36
|
+
let isVisible = false;
|
|
37
|
+
function resizeCanvas() {
|
|
38
|
+
const w = canvas.clientWidth * window.devicePixelRatio;
|
|
39
|
+
const h = canvas.clientHeight * window.devicePixelRatio;
|
|
40
|
+
if (canvas.width !== w || canvas.height !== h) {
|
|
41
|
+
canvas.width = w;
|
|
42
|
+
canvas.height = h;
|
|
43
|
+
stateRef.current = initSpirograph(w, h, paramsRef.current);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
resizeCanvas();
|
|
47
|
+
stateRef.current = initSpirograph(canvas.width, canvas.height, paramsRef.current);
|
|
48
|
+
const loop = () => {
|
|
49
|
+
if (!running || !isVisible)
|
|
50
|
+
return;
|
|
51
|
+
if (stateRef.current) {
|
|
52
|
+
drawSpirograph(ctx, stateRef.current, paramsRef.current);
|
|
53
|
+
}
|
|
54
|
+
animId = requestAnimationFrame(loop);
|
|
55
|
+
};
|
|
56
|
+
const io = new IntersectionObserver((entries) => {
|
|
57
|
+
entries.forEach((entry) => {
|
|
58
|
+
isVisible = entry.isIntersecting;
|
|
59
|
+
if (isVisible) {
|
|
60
|
+
if (typeof animId !== "undefined") {
|
|
61
|
+
cancelAnimationFrame(animId);
|
|
62
|
+
}
|
|
63
|
+
animId = requestAnimationFrame(loop);
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
io.observe(canvas);
|
|
68
|
+
const ro = new ResizeObserver(resizeCanvas);
|
|
69
|
+
ro.observe(canvas);
|
|
70
|
+
return () => {
|
|
71
|
+
running = false;
|
|
72
|
+
cancelAnimationFrame(animId);
|
|
73
|
+
ro.disconnect();
|
|
74
|
+
io.disconnect();
|
|
75
|
+
};
|
|
76
|
+
}, []);
|
|
77
|
+
useEffect(() => {
|
|
78
|
+
const canvas = canvasRef.current;
|
|
79
|
+
const ctx = canvas?.getContext("2d");
|
|
80
|
+
if (!canvas || !ctx || !stateRef.current)
|
|
81
|
+
return;
|
|
82
|
+
resetSpirograph(stateRef.current, paramsRef.current);
|
|
83
|
+
}, [merged.seed, merged.R, merged.r, merged.d]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
84
|
+
return (_jsx("canvas", { ref: canvasRef, className: className, style: { display: "block", width: "100%", height: "100%", ...style } }));
|
|
85
|
+
}
|
|
86
|
+
//# sourceMappingURL=Spirograph.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Spirograph.js","sourceRoot":"","sources":["../../../src/components/backgrounds/Spirograph.tsx"],"names":[],"mappings":";AAAA;;;GAGG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,EAAsB,MAAM,OAAO,CAAC;AAC9D,OAAO,EACL,cAAc,EACd,cAAc,EACd,eAAe,GAEhB,MAAM,uBAAuB,CAAC;AAe/B,MAAM,CAAC,MAAM,kBAAkB,GAA+B;IAC5D,IAAI,EAAE,KAAK;IACX,CAAC,EAAE,GAAG;IACN,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,KAAK,EAAE,GAAG;IACV,UAAU,EAAE,GAAG;IACf,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;IACjB,MAAM,EAAE,SAAS;CAClB,CAAC;AAOF,MAAM,UAAU,UAAU,CAAC,KAAsB;IAC/C,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,MAAM,GAAG,EAAE,GAAG,kBAAkB,EAAE,GAAG,MAAM,EAAE,CAAC;IAEpD,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAClD,MAAM,QAAQ,GAAG,MAAM,CAAyB,IAAI,CAAC,CAAC;IACtD,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACjC,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;IAE3B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC;QACtD,IAAI,CAAC,GAAG;YAAE,OAAO;QAEjB,IAAI,MAAc,CAAC;QACnB,IAAI,OAAO,GAAG,IAAI,CAAC;QACnB,IAAI,SAAS,GAAG,KAAK,CAAC;QAEtB,SAAS,YAAY;YACnB,MAAM,CAAC,GAAG,MAAO,CAAC,WAAW,GAAG,MAAM,CAAC,gBAAgB,CAAC;YACxD,MAAM,CAAC,GAAG,MAAO,CAAC,YAAY,GAAG,MAAM,CAAC,gBAAgB,CAAC;YACzD,IAAI,MAAO,CAAC,KAAK,KAAK,CAAC,IAAI,MAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAChD,MAAO,CAAC,KAAK,GAAG,CAAC,CAAC;gBAClB,MAAO,CAAC,MAAM,GAAG,CAAC,CAAC;gBACnB,QAAQ,CAAC,OAAO,GAAG,cAAc,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;YAC7D,CAAC;QACH,CAAC;QAED,YAAY,EAAE,CAAC;QACf,QAAQ,CAAC,OAAO,GAAG,cAAc,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;QAElF,MAAM,IAAI,GAAG,GAAG,EAAE;YAChB,IAAI,CAAC,OAAO,IAAI,CAAC,SAAS;gBAAE,OAAO;YACnC,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;gBACrB,cAAc,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;YAC3D,CAAC;YACD,MAAM,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;QACvC,CAAC,CAAC;QACF,MAAM,EAAE,GAAG,IAAI,oBAAoB,CAAC,CAAC,OAAO,EAAE,EAAE;YAC9C,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;gBACxB,SAAS,GAAG,KAAK,CAAC,cAAc,CAAC;gBACjC,IAAI,SAAS,EAAE,CAAC;oBACd,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;wBAClC,oBAAoB,CAAC,MAAM,CAAC,CAAC;oBAC/B,CAAC;oBACD,MAAM,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAC;gBACvC,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QACH,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAEnB,MAAM,EAAE,GAAG,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC;QAC5C,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAEnB,OAAO,GAAG,EAAE;YACV,OAAO,GAAG,KAAK,CAAC;YAChB,oBAAoB,CAAC,MAAM,CAAC,CAAC;YAC7B,EAAE,CAAC,UAAU,EAAE,CAAC;YAChB,EAAE,CAAC,UAAU,EAAE,CAAC;QAClB,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,MAAM,GAAG,GAAG,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QACrC,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE,OAAO;QACjD,eAAe,CAAC,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IACvD,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kDAAkD;IAEnG,OAAO,CACL,iBACE,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,GACpE,CACH,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type CSSProperties } from "react";
|
|
2
|
+
import { type TideHarmonicsParams } from "../engines/tideHarmonics";
|
|
3
|
+
export declare const tideHarmonicsDefaults: TideHarmonicsParams;
|
|
4
|
+
export interface TideHarmonicsProps extends Partial<TideHarmonicsParams> {
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: CSSProperties;
|
|
7
|
+
}
|
|
8
|
+
export declare function TideHarmonics(props: TideHarmonicsProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
//# sourceMappingURL=TideHarmonics.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TideHarmonics.d.ts","sourceRoot":"","sources":["../../../src/components/backgrounds/TideHarmonics.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAKL,KAAK,mBAAmB,EACzB,MAAM,0BAA0B,CAAC;AAElC,eAAO,MAAM,qBAAqB,EAAE,mBAUnC,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,OAAO,CAAC,mBAAmB,CAAC;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CA4EtD"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
|
+
import { initTideHarmonics, drawTideHarmonics, resetTideHarmonics, } from "../engines/tideHarmonics";
|
|
4
|
+
export const tideHarmonicsDefaults = {
|
|
5
|
+
seed: 8888,
|
|
6
|
+
waveCount: 5,
|
|
7
|
+
gridRows: 35,
|
|
8
|
+
frequency: 1.0,
|
|
9
|
+
amplitude: 45,
|
|
10
|
+
speed: 1.0,
|
|
11
|
+
bgColor: "#0a0e14",
|
|
12
|
+
colorA: "#50b8e8",
|
|
13
|
+
colorB: "#e850b8",
|
|
14
|
+
};
|
|
15
|
+
export function TideHarmonics(props) {
|
|
16
|
+
const { className, style, ...params } = props;
|
|
17
|
+
const merged = { ...tideHarmonicsDefaults, ...params };
|
|
18
|
+
const canvasRef = useRef(null);
|
|
19
|
+
const stateRef = useRef(null);
|
|
20
|
+
const paramsRef = useRef(merged);
|
|
21
|
+
paramsRef.current = merged;
|
|
22
|
+
useEffect(() => {
|
|
23
|
+
const canvas = canvasRef.current;
|
|
24
|
+
if (!canvas)
|
|
25
|
+
return;
|
|
26
|
+
const ctx = canvas.getContext("2d");
|
|
27
|
+
if (!ctx)
|
|
28
|
+
return;
|
|
29
|
+
let animId;
|
|
30
|
+
let running = true;
|
|
31
|
+
let isVisible = false;
|
|
32
|
+
function resizeCanvas() {
|
|
33
|
+
const dpr = Math.min(window.devicePixelRatio || 1, 2);
|
|
34
|
+
const w = Math.floor(canvas.clientWidth * dpr);
|
|
35
|
+
const h = Math.floor(canvas.clientHeight * dpr);
|
|
36
|
+
if (canvas.width !== w || canvas.height !== h) {
|
|
37
|
+
canvas.width = w;
|
|
38
|
+
canvas.height = h;
|
|
39
|
+
stateRef.current = initTideHarmonics(w, h, paramsRef.current);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
resizeCanvas();
|
|
43
|
+
stateRef.current = initTideHarmonics(canvas.width, canvas.height, paramsRef.current);
|
|
44
|
+
const loop = () => {
|
|
45
|
+
if (!running || !isVisible)
|
|
46
|
+
return;
|
|
47
|
+
if (stateRef.current) {
|
|
48
|
+
drawTideHarmonics(ctx, stateRef.current, paramsRef.current);
|
|
49
|
+
}
|
|
50
|
+
animId = requestAnimationFrame(loop);
|
|
51
|
+
};
|
|
52
|
+
const io = new IntersectionObserver((entries) => {
|
|
53
|
+
entries.forEach((entry) => {
|
|
54
|
+
isVisible = entry.isIntersecting;
|
|
55
|
+
if (isVisible) {
|
|
56
|
+
if (typeof animId !== "undefined") {
|
|
57
|
+
cancelAnimationFrame(animId);
|
|
58
|
+
}
|
|
59
|
+
animId = requestAnimationFrame(loop);
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
io.observe(canvas);
|
|
64
|
+
const ro = new ResizeObserver(resizeCanvas);
|
|
65
|
+
ro.observe(canvas);
|
|
66
|
+
return () => {
|
|
67
|
+
running = false;
|
|
68
|
+
cancelAnimationFrame(animId);
|
|
69
|
+
ro.disconnect();
|
|
70
|
+
io.disconnect();
|
|
71
|
+
};
|
|
72
|
+
}, []);
|
|
73
|
+
useEffect(() => {
|
|
74
|
+
if (!stateRef.current)
|
|
75
|
+
return;
|
|
76
|
+
resetTideHarmonics(stateRef.current, merged);
|
|
77
|
+
}, [merged.seed]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
78
|
+
return (_jsx("canvas", { ref: canvasRef, className: className, style: { display: "block", width: "100%", height: "100%", ...style } }));
|
|
79
|
+
}
|
|
80
|
+
//# sourceMappingURL=TideHarmonics.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TideHarmonics.js","sourceRoot":"","sources":["../../../src/components/backgrounds/TideHarmonics.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { type CSSProperties } from "react";
|
|
2
|
+
import { type VoronoiMosaicParams } from "../engines/voronoiMosaic";
|
|
3
|
+
export declare const voronoiMosaicDefaults: VoronoiMosaicParams;
|
|
4
|
+
export interface VoronoiMosaicProps extends Partial<VoronoiMosaicParams> {
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: CSSProperties;
|
|
7
|
+
}
|
|
8
|
+
export declare function VoronoiMosaic(props: VoronoiMosaicProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
//# sourceMappingURL=VoronoiMosaic.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VoronoiMosaic.d.ts","sourceRoot":"","sources":["../../../src/components/backgrounds/VoronoiMosaic.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAKL,KAAK,mBAAmB,EACzB,MAAM,0BAA0B,CAAC;AAElC,eAAO,MAAM,qBAAqB,EAAE,mBAMnC,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,OAAO,CAAC,mBAAmB,CAAC;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CA4EtD"}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
|
+
import { initVoronoiMosaic, drawVoronoiMosaic, resetVoronoiMosaic, } from "../engines/voronoiMosaic";
|
|
4
|
+
export const voronoiMosaicDefaults = {
|
|
5
|
+
seed: 4444,
|
|
6
|
+
seedCount: 25,
|
|
7
|
+
moveSpeed: 0.5,
|
|
8
|
+
edgeContrast: 1.2,
|
|
9
|
+
bgColor: "#0a0e14",
|
|
10
|
+
};
|
|
11
|
+
export function VoronoiMosaic(props) {
|
|
12
|
+
const { className, style, ...params } = props;
|
|
13
|
+
const merged = { ...voronoiMosaicDefaults, ...params };
|
|
14
|
+
const canvasRef = useRef(null);
|
|
15
|
+
const stateRef = useRef(null);
|
|
16
|
+
const paramsRef = useRef(merged);
|
|
17
|
+
paramsRef.current = merged;
|
|
18
|
+
useEffect(() => {
|
|
19
|
+
const canvas = canvasRef.current;
|
|
20
|
+
if (!canvas)
|
|
21
|
+
return;
|
|
22
|
+
const ctx = canvas.getContext("2d");
|
|
23
|
+
if (!ctx)
|
|
24
|
+
return;
|
|
25
|
+
let animId;
|
|
26
|
+
let running = true;
|
|
27
|
+
let isVisible = false;
|
|
28
|
+
function resizeCanvas() {
|
|
29
|
+
const dpr = Math.min(window.devicePixelRatio || 1, 2);
|
|
30
|
+
const w = Math.floor(canvas.clientWidth * dpr);
|
|
31
|
+
const h = Math.floor(canvas.clientHeight * dpr);
|
|
32
|
+
if (canvas.width !== w || canvas.height !== h) {
|
|
33
|
+
canvas.width = w;
|
|
34
|
+
canvas.height = h;
|
|
35
|
+
stateRef.current = initVoronoiMosaic(w, h, paramsRef.current);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
resizeCanvas();
|
|
39
|
+
stateRef.current = initVoronoiMosaic(canvas.width, canvas.height, paramsRef.current);
|
|
40
|
+
const loop = () => {
|
|
41
|
+
if (!running || !isVisible)
|
|
42
|
+
return;
|
|
43
|
+
if (stateRef.current) {
|
|
44
|
+
drawVoronoiMosaic(ctx, stateRef.current, paramsRef.current);
|
|
45
|
+
}
|
|
46
|
+
animId = requestAnimationFrame(loop);
|
|
47
|
+
};
|
|
48
|
+
const io = new IntersectionObserver((entries) => {
|
|
49
|
+
entries.forEach((entry) => {
|
|
50
|
+
isVisible = entry.isIntersecting;
|
|
51
|
+
if (isVisible) {
|
|
52
|
+
if (typeof animId !== "undefined") {
|
|
53
|
+
cancelAnimationFrame(animId);
|
|
54
|
+
}
|
|
55
|
+
animId = requestAnimationFrame(loop);
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
});
|
|
59
|
+
io.observe(canvas);
|
|
60
|
+
const ro = new ResizeObserver(resizeCanvas);
|
|
61
|
+
ro.observe(canvas);
|
|
62
|
+
return () => {
|
|
63
|
+
running = false;
|
|
64
|
+
cancelAnimationFrame(animId);
|
|
65
|
+
ro.disconnect();
|
|
66
|
+
io.disconnect();
|
|
67
|
+
};
|
|
68
|
+
}, []);
|
|
69
|
+
useEffect(() => {
|
|
70
|
+
if (!stateRef.current)
|
|
71
|
+
return;
|
|
72
|
+
resetVoronoiMosaic(stateRef.current, merged);
|
|
73
|
+
}, [merged.seed]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
74
|
+
return (_jsx("canvas", { ref: canvasRef, className: className, style: { display: "block", width: "100%", height: "100%", ...style } }));
|
|
75
|
+
}
|
|
76
|
+
//# sourceMappingURL=VoronoiMosaic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"VoronoiMosaic.js","sourceRoot":"","sources":["../../../src/components/backgrounds/VoronoiMosaic.tsx"],"names":[],"mappings":"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"}
|