●Change8

@remix-run/component@0.4.0

📦 remixView on GitHub →
✨ 3 features🐛 2 fixes🔧 5 symbols

Summary

This release introduces new animation utilities like 'animate', 'spring', and 'tween', and updates CSS processing to use data attributes instead of class names.

Migration Steps

  1. If you were relying on CSS classes being set by the framework, update your code to use the new data attribute mechanism for CSS processing.
  2. If you were using numeric values for 'aspect-ratio', ensure you are not expecting 'px' to be appended.

✨ New Features

  • Added 'animate' prop on host elements to enable enter, exit, and layout (FLIP) animations.
  • Added 'spring()' function to create spring-based animation iterators with configurable stiffness, damping, and mass.
  • Added 'tween()' function to create time-based animation iterators with customizable duration and easing (including 'easings' presets).

🐛 Bug Fixes

  • CSS processing now uses a data attribute instead of className.
  • 'aspect-ratio' added to numeric CSS properties, preventing 'px' from being appended to numeric values.

Affected Symbols

animatespringtweenVirtualRootaspect-ratio