Chapter 92: Upgrade Motion guide

Core Idea

Upgrade to the latest version of Motion by following our incremental, version-by-version guide. Major version changes are typically small, making for a quick process.

Key Concepts

• Upgrade with AI: Install the Motion AI Kit and run:
• Manual upgrade instructions: For manual upgrade
• 13.0: There are no breaking changes in Motion in version 13 for JavaScript users.
• 12.0: Motion 12 introduces a small change to the inView
• 11.0: Motion 11.11.12 is the version that merged Framer Motion and Motion One.
• animate: The biggest change to the API is the animate and timeline functions.
• # On removing independent transforms: Animating independent transforms is a popular feature in Motion One.
• # Callback function: The callback function syntax of animate() has been replaced by the hybrid animate()'s abil
• # Options: animate(

Code Examples

press("a", (startEvent) => {
  return (endEvent) => {}
})

hover("li", (startEvent) => {
  return (endEvent) => {}
})

inView("section", (startEntry) => {
  return (endEntry) => {}
})

• What it demonstrates: Core usage pattern for Upgrade Motion guide.

Key Takeaways

1. Upgrade Motion guide supports Upgrade with AI.
2. Upgrade Motion guide supports Manual upgrade instructions.
3. Upgrade Motion guide supports 13.0.

Connects To

• Motion AI Kit. MotionScore for Agents, current docs and CSS springs: related Motion doc page.
• Motion & Framer Motion upgrade guide: related Motion doc page.
• animate(): related Motion doc page.
• Migrate from GSAP to Motion: related Motion doc page.
• Animation performance guide: related Motion doc page.