☀️ useEnvironmentalLight()

The useEnvironmentalLight() hook treats the user's cursor as a physical point light source in 2D space, creating dynamic lighting and shadow effects.

🛠️ Usage

import { useEnvironmentalLight } from 'vibedev-motion';

function Scene() {
  useEnvironmentalLight({
    intensity: 0.8,
    color: '#ffffff'
  });

  return (
    <div className="vibe-cast-shadow py-20 px-10 bg-white/5 rounded-3xl">
      Hover near me to see my shadow move!
    </div>
  );
}

🧠 Internal Logic

Global Variables: Sets global CSS variables (--vibe-light-x, --vibe-light-y) on the document root based on cursor position.
Dynamic Perspective: For elements with the .vibe-cast-shadow class, it calculates the shadow offset relative to the cursor position.
Depth Simulation: Uses these variables to create dynamic perspective-based box shadows that "lean" away from the light source.

🌟 Detailed Use Case

Dark-mode "Flashlight" Interfaces: Perfect for immersive landing pages or portfolios. Use it to make UI cards cast shadows that move away from the cursor, creating a deep 3D sensation that feels tactile and responsive.

usePhysicalDrag()