Skip to content

Agent skills

The packages include agent skills: instructions that teach a coding agent, such as Claude Code, to use the package. The skills are in the skills folder of the package, and they match the installed version.

  • adding-reveal-animations: add reveal animations with Reveal and useReveal.
  • migrating-from-v4: migrate code from react-awesome-reveal v4.
  • adding-reveal-animations: add reveal animations with v-reveal and Reveal.
  • adding-reveal-animations: add reveal animations with the Reveal component.
  • adding-reveal-animations: add reveal animations to plain DOM code with reveal().
  • migrating-from-v4: the same skill as in @awesome-reveal/react, for projects that upgrade react-awesome-reveal to version 5.

pnpm 12.11 and later link the skills of your dependencies into your project. pnpm links nothing until you approve the package:

  1. Install the package. pnpm lists the direct dependencies with skills that wait for approval.
  2. Run pnpm approve, and choose the package. pnpm writes the approval to pnpm-workspace.yaml.

The approval covers all the skills of the package, also in later versions. pnpm links each skill as pnpm-<package>-<skill>, for example pnpm-@awesome-reveal+react-adding-reveal-animations:

  • pnpm links into the agent skill folders that exist in the workspace root, such as .claude/skills or .cursor/skills.
  • When pnpm detects an agent, such as Claude Code or Cursor, it creates the skill folder of that agent.
  • To choose the folders yourself, set skills.dirs. An empty list turns off the links.

If you approved a skill, but no skill folder exists and pnpm detects no agent, for example in CI, the install fails. Create .claude/skills, or set skills.dirs.

pnpm adds a .gitignore to each skill folder, so the links stay out of Git. Global installs, pnpm dlx and pnpm deploy do not link skills.

Copy or link the skill folders from node_modules/<package>/skills/ into the skills folder of your agent. For Claude Code, this folder is .claude/skills/.

@awesome-reveal/core and each adapter have an adding-reveal-animations skill, so their folders have the same name. Copy only the skill of the package that your code imports. A project gets @awesome-reveal/core as a dependency of the adapter, but it needs only the skill of the adapter.