Routeveil v0.3.0

[milkevich]

Highlights

Routeveil 0.3 introduces a cleaner, unified transition API with independent control over page exit and enter phases.

Unified transition configuration

Transition options now live directly inside transition:

transition={{
  name: 'slide',
  direction: 'left',
}}

Independent exit and enter transitions

Compose page transitions from separate phases:

transition={{
  exit: 'fade',
  enter: {
    name: 'slide',
    direction: 'up',
  },
}}

Either phase can be omitted for an instant exit or enter:

transition={{ enter: 'fade' }}

Included

• unified string and object transition API
• independently configurable exit and enter page phases
• support for one-sided page transitions
• flattened options for page and overlay transitions
• updated TypeScript inference and public types
• preserved shared elements, preloading, playback, and reduced-motion behavior
• updated tests, demo, and documentation

Breaking change

The separate transitionOptions property has been removed.

// Before
transition="slide"
transitionOptions={{ direction: 'left' }}

// Now
transition={{
  name: 'slide',
  direction: 'left',
}}

---

This discussion was created from the release Routeveil v0.3.0.