👁️ <VibeReveal />

A viewport-aware reveal component that respects current presets and global physical themes.

🛠️ Usage

import { VibeReveal } from 'vibedev-motion';

function HeroSection() {
  return (
    <VibeReveal
      initial={{ opacity: 0, y: 100 }}
      whileInView={{ opacity: 1, y: 0 }}
      viewport={{ once: true }}
    >
      <h1>Welcome to VibeDev</h1>
    </VibeReveal>
  );
}

🧠 Features

Viewport Integrated: Triggered by standard whileInView props.
Theme Awareness: Initial entry animations (stiffness, damping) are automatically pulled from the global VibeContext.
"Kinetic" Reveal: Instead of a linear fade, elements "pop" into the view with theme-specific physical oscillation.

🌟 Detailed Use Case

Dynamic Landing Pages: Loading a high-end marketing page where sections don't just fade onto the screen, but physically "emerge" according to the site's design language (e.g., silkiness for B2B or glitchy high-frequencies for gaming).

ScrollPhysics