skilld
All skills
skilld-dev avatar

/motion-v-skilld

@b9c39cb
by skilldskilld-dev/vue-ecosystem-skills180 stars
8

ALWAYS load when writing or debugging code that imports "motion-v" (Motion for Vue, motion-vue). Covers the motion component, AnimatePresence, variants, gestures, layout, scroll, motion values, the v-motion directive, and the Nuxt module for version 2.4.4. Provides API facts, recipes, best practices, and migration notes.

Ask your Agent

Use this Skill: https://skilld.dev/gh/skilld-dev/vue-ecosystem-skills/motion-v-skilld

This session only. Nothing lands on disk.

referencesmigration.md

≈793 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Migration and version notes for motion-v

Upgrading from v1 to v2

Breaking changes in v2.0.0, summarized from the official release notes:

  • Gesture shorthand props focus, hover, press, inView were removed. Use whileFocus, whileHover, whilePress, whileInView for animation. Use event props like onHoverStart and onPressStart for logic.
  • CommonJS support was dropped. The package ships ESM (.mjs) only. Confirmed by the exports map, package.json:20-33.
  • AnimatePresence now discovers children lazily through a data-ap DOM attribute.
  • MotionPlugin, createMotionDirective, and createPresetDirective were added for the v-motion directive.
  • motionGlobalConfig export was added.
  • Later refinement in 2.2.1: the data-ap attribute is only added inside AnimatePresence, keeping other DOM clean.

Release notes: https://github.com/motiondivision/motion-vue/releases/tag/v2.0.0

Older v1 changes worth knowing when touching legacy code:

  • staggerChildren and staggerDirection transition options are deprecated since v1.4.0. Use the stagger() utility inside transition instead, typically with delayChildren.
  • useScroll accepts Vue refs for container and target since v1.6.0.

Changes from 2.2.1 to 2.4.4

Baseline of the previous Skill was 2.2.1. The prepared source is 2.4.4.

2.3.0

2.4.0

2.4.1

2.4.2

2.4.3

2.4.4

Deprecations in current types

  • MotionConfig prop reduceMotion is deprecated. Use reducedMotion (dist/es/components/motion-config/types.d.ts:9-13).
  • animationControls() is deprecated. Use useAnimationControls() (dist/es/animation/hooks/animation-controls.d.ts:3-5).

Full changelogs

Source: SKILL.md on GitHub

Third-party checks

No alerts8d3 checks · Risk SAFE
  • Gen Agent Trust Hub8d

    This skill is a comprehensive documentation and reference guide for the 'motion-v' (Motion for Vue) animation library. It contains best practices, API references, and issue logs to assist in writing and debugging Vue animation code. No malicious patterns or security risks were detected.

  • Socket8d

    No alerts

  • Snyk8d

    Risk: LOW · No issues

Provenance

Signed by skilld at b9c39cb. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub last week.

Activeupdated last week

README badge

README badge for skilld-dev/vue-ecosystem-skills/motion-v-skilld