MCPcopy Index your code
hub / github.com/JonathonRP/motion-start

github.com/JonathonRP/motion-start @v0.1.21

Chat with this repo
repository ↗ · DeepWiki ↗ · release v0.1.21 ↗ · + Follow
544 symbols 1,174 edges 205 files 113 documented · 21%
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

Motion Start

An animation library inspired by framer-motion

Discord Build Status License Latest Release Downloads


Work in progress.

[!WARNING] Note: 🚧 This library is currently in alpha. Features and APIs may change. expect bugs and please report or make PRs to fix bugs.

Note: This is svelte-motion ported to typescript currently. We have plans to evolve it to include modern features in framer-motion and to use svelte/motion to implement animations in the future.

Installation

npm install --save-dev motion-start
pnpm install --save-dev motion-start
yarn install --save-dev motion-start
bun install --save-dev motion-start

Usage

Corresponding to a MotionDiv in framer-motion is this:



import { Motion } from 'motion-start'

<Motion.div></Motion.div>

For svg elements like 'g', 'path' or 'circle', use:

<Motion.g></Motion.g>

Community

Join the Discord server to ask questions, find collaborators, or say hi!

Motion Start Discord Community

Extension points exported contracts — how you extend this code

Orchestration (Interface)
(no doc)
src/lib/motion-start/types.ts
Repeat (Interface)
(no doc)
src/lib/motion-start/types.ts
Tween (Interface)
(no doc)
src/lib/motion-start/types.ts
Spring (Interface)
(no doc)
src/lib/motion-start/types.ts
Inertia (Interface)
(no doc)
src/lib/motion-start/types.ts

Core symbols most depended-on inside this repo

set
called by 37
src/lib/motion-start/animation/types.ts
motionValue
called by 15
src/lib/motion-start/value/index.ts
add
called by 14
src/lib/motion-start/components/AnimateSharedLayout/utils/stack.ts
eachAxis
called by 12
src/lib/motion-start/utils/each-axis.ts
isMotionValue
called by 12
src/lib/motion-start/value/utils/is-motion-value.ts
isVariantLabel
called by 11
src/lib/motion-start/render/utils/variants.ts
stop
called by 10
src/lib/motion-start/animation/types.ts
createDefinition
called by 9
src/lib/motion-start/motion/features/definitions.ts

Shape

Function 318
Method 113
Interface 93
Class 16
Enum 4

Languages

TypeScript100%

Modules by API surface

src/lib/motion-start/render/types.ts61 symbols
src/lib/motion-start/components/AnimateSharedLayout/utils/crossfader.ts18 symbols
src/lib/motion-start/render/utils/animation-state.ts15 symbols
src/lib/motion-start/gestures/types.ts14 symbols
src/lib/motion-start/utils/geometry/delta-apply.ts13 symbols
src/lib/motion-start/gestures/PanSession.ts13 symbols
src/lib/motion-start/gestures/drag/VisualElementDragControls.ts12 symbols
src/lib/motion-start/animation/utils/transitions.ts12 symbols
src/lib/motion-start/render/utils/lifecycles.ts11 symbols
src/lib/motion-start/render/dom/utils/unit-conversion.ts11 symbols
src/lib/motion-start/gestures/drag/utils/constraints.ts11 symbols
src/lib/motion-start/components/AnimateSharedLayout/utils/stack.ts11 symbols

For agents

$ claude mcp add motion-start \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact