Motion Editor

A visual editor for Motion animations. The Vite plugin detects animate() calls and <motion.*> components in your source, renders them as an editable timeline over your page in dev mode, and writes every edit back to your code.

This package is a placeholder

Motion Editor is a commercial product distributed through Motion's registry. This public package exists so the name resolves and to point you at the real install.

Install

Add Motion's registry to .npmrc in your project root:

@motionplus:registry=https://api.motion.dev/npm/
//api.motion.dev/npm/:_authToken=${MOTION_TOKEN}

Then depend on the editor under this name via npm's alias syntax:

{
  "devDependencies": {
    "motion-editor": "npm:@motionplus/editor@^1"
  }
}

And add it to your Vite config:

import { defineConfig } from "vite"
import { motionEditor } from "motion-editor"

export default defineConfig({
  plugins: [motionEditor()],
})

Get access at motion.dev/plus.

Licence

The placeholder is published for name resolution only. Motion Editor itself is commercial software; your licence comes with your Motion purchase.