@animochi/react

The Animochi React SDK combines the verified @animochi/js OTA client with a responsive transparent canvas player.

Install

npm install @animochi/react

Use

import { AnimochiClient, AnimochiPlayer } from "@animochi/react";

const client = new AnimochiClient({
  projectId: "your-project-id",
  sdkKey: "animochi_...",
  apiOrigin: "https://api.animochi.com",
});

export function Mascot() {
  return (
    <div style={{ width: 240, height: 240 }}>
      <AnimochiPlayer client={client} state="wave" />
    </div>
  );
}

The player synchronizes on mount by default, preserves aspect ratio, accounts for device pixel ratio, and stops its animation frame when unmounted. Use autoSync={false} if your app calls client.sync() centrally.