agentsclimarketplace

Anima upgrade migration

Skill ComeOnOliver/skillshub/skills/jeremylongshore/claude-code-plugins-plus-skills/anima-upgrade-migration

Upgrade @animaapp/anima-sdk versions and handle API changes. Use when upgrading SDK versions, migrating from the Figma plugin workflow to SDK-based automation, or adapting to new Anima API features. Trigger: "anima upgrade", "anima migration", "anima SDK update".From its SKILL.md

Install
npx -y skills add ComeOnOliver/skillshub --skill anima-upgrade-migration

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its file declares

Copied from the file, not written here

The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.

SKILL.md

3.0 KB, 673 tokens by cl100k_base, as published. Nobody here has run it

Anima Upgrade & Migration

Migration Paths

FromToComplexity
Figma plugin (manual)SDK automationMedium
SDK v1 → v2SDK latestLow
Anima PlaygroundSDK APILow

Instructions

Step 1: Upgrade SDK

# Check current version
npm list @animaapp/anima-sdk

# Upgrade to latest
npm install @animaapp/anima-sdk@latest

# Check for breaking changes
npm info @animaapp/anima-sdk changelog

Step 2: Migrate from Manual Plugin to SDK

// BEFORE: Manual Figma plugin workflow
// 1. Open Figma → Plugins → Anima
// 2. Select component → Export → React
// 3. Copy-paste generated code into project
// 4. Manually repeat for each component change

// AFTER: Automated SDK workflow
import { Anima } from '@animaapp/anima-sdk';

const anima = new Anima({ auth: { token: process.env.ANIMA_TOKEN! } });

// Automated: runs in CI on Figma file version change
async function syncDesignToCode() {
  const { files } = await anima.generateCode({
    fileKey: process.env.FIGMA_FILE_KEY!,
    figmaToken: process.env.FIGMA_TOKEN!,
    nodesId: ['1:2', '3:4', '5:6'],  // All design system components
    settings: { language: 'typescript', framework: 'react', styling: 'tailwind' },
  });

  // Write to project, run through linter, create PR
  for (const file of files) {
    require('fs').writeFileSync(`src/components/generated/${file.fileName}`, file.content);
  }
}

Step 3: API Changes Checklist

// Common API changes between versions:
// - New settings options (e.g., uiLibrary: 'shadcn' added later)
// - New frameworks (e.g., Next.js-specific output)
// - Response format changes in files array
// - New authentication methods

// Test after upgrade:
async function testUpgrade() {
  const anima = new Anima({ auth: { token: process.env.ANIMA_TOKEN! } });
  const { files } = await anima.generateCode({
    fileKey: process.env.FIGMA_FILE_KEY!,
    figmaToken: process.env.FIGMA_TOKEN!,
    nodesId: ['1:2'],
    settings: { language: 'typescript', framework: 'react', styling: 'tailwind' },
  });
  console.log(`Upgrade test: ${files.length} files generated`);
}

Output

  • SDK upgraded to latest version
  • Migrated from manual plugin to automated SDK
  • All generation tests passing after upgrade

Resources

Next Steps

For CI/CD setup, see anima-ci-integration.

What ships with it

Read from the repository

Just SKILL.md. No reference files, no scripts.

Keep looking

Skills are one crate of 326,851. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.