@lemondouble/featheranime2d 0.0.0-stage → 0.1.0-preview.2

package/README.md

@@ -1,3 +1,80 @@
-# Temporary Holding Version
+# @lemondouble/featheranime2d
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+그림 한 장으로 만드는, 가벼운 움직이는 애니메이션 캐릭터 렌더러입니다. 캐릭터 패키지(`.fa2d`)를 불러와 표정, 모션, 숨쉬기, 깜빡임, 머리카락 흔들림을 계산하고 PixiJS로 그립니다. 계산은 Rust로 만든 Core를 WASM으로 돌립니다.
+
+## 설치
+
+```bash
+pnpm add @lemondouble/featheranime2d pixi.js
+```
+
+- `pixi.js`(8.x)는 `/pixi`, `/react`를 쓸 때 필요합니다. `react`(19.x)는 `/react`를 쓸 때 필요합니다.
+- WASM 파일은 번들러(Vite, Next.js 등)가 `new URL(..., import.meta.url)`을 보고 빌드 결과에 함께 넣습니다. 따로 설정할 것은 없습니다.
+
+## React
+
+```tsx
+"use client";
+
+import { useFeatherAnime2D } from "@lemondouble/featheranime2d/react";
+import { useEffect } from "react";
+
+export default function CharacterStage({ expression }: { expression?: string }) {
+  const { containerRef, view, error } = useFeatherAnime2D("/characters/witch.fa2d");
+
+  useEffect(() => {
+    view?.character.setExpression(expression ?? null);
+  }, [view, expression]);
+
+  return <div ref={containerRef} style={{ width: "100%", height: "100%" }} />;
+}
+```
+
+- `containerRef`를 붙인 요소의 크기에 맞춰, 비율을 유지하며 가운데에 그립니다. 배경은 투명합니다.
+- PixiJS와 WASM은 effect 안에서 불러오므로, Next.js에서 서버 렌더링을 빼는 처리(`dynamic(..., { ssr: false })`) 없이 서버 컴포넌트에서 바로 쓸 수 있습니다.
+- 표정처럼 상태인 것은 위처럼 `useEffect`로 넣고, 모션처럼 한 번 실행하는 것은 `view.character.playMotion("wave", "normal")`을 직접 부릅니다.
+
+## PixiJS
+
+```ts
+import { CharacterView } from "@lemondouble/featheranime2d/pixi";
+
+const view = await CharacterView.load("/characters/witch.fa2d");
+app.stage.addChild(view);
+app.ticker.add((ticker) => view.update(ticker.deltaMS / 1000));
+view.character.setExpression("happy");
+```
+
+- 캔버스 픽셀 좌표로 그리므로 화면 크기에 맞추는 일(`scale`, `position`)은 앱이 합니다. 캔버스 크기는 `view.info.canvas`에 있습니다.
+- `info.backdrop`이 색이면 앱이 화면을 그 색으로 칠합니다. 그림 배경은 `CharacterView`가 함께 그립니다.
+- 다 쓰면 `view.destroy()`로 텍스처와 WASM 메모리를 해제합니다.
+
+## Core만 쓰기
+
+```ts
+import { Character } from "@lemondouble/featheranime2d";
+
+const character = await Character.load(bytes);   // .fa2d 파일의 바이트
+character.update(1 / 60);
+character.vertices;       // 모든 slot의 정점 (캔버스 픽셀)
+character.slotVisible;    // slot마다 보이는지
+character.slotTextures;   // slot마다 그릴 텍스처 번호 (info.textures 순서)
+```
+
+- 다른 그래픽 라이브러리로 그릴 때 씁니다. slot의 정점 수, uv, 삼각형은 `character.info.slots`에 있습니다.
+- `vertices` 같은 버퍼는 WASM 메모리를 복사 없이 보는 뷰라서, 다음 `update` 전까지만 유효합니다.
+- 시드(`{ seed }`)를 빼면 무작위 시드를 씁니다. 같은 시드의 캐릭터들은 같은 순간에 깜빡입니다.
+
+## API
+
+| 이름 | 설명 |
+|---|---|
+| `setExpression(name \| null)` | 표정을 바꿉니다. 즉시 바뀝니다 |
+| `playMotion(name, "idle" \| "normal" \| "force")` | 모션을 재생합니다. 재생 중인 모션보다 우선순위가 높지 않으면 버리고 `false`를 돌려줍니다 |
+| `currentExpression`, `currentMotion` | 지금 표정과 재생 중인 모션입니다. 모션이 끝나면 `null`입니다 |
+| `setInput(parameter, value)` | 얼굴 추적, 마우스 시선 같은 외부 입력입니다. 기본값에서 옮긴 만큼 더합니다 |
+| `setLipSync(mouthOpen, speaking)` | 실제 음성으로 계산한 입 벌림 값입니다 |
+| `setTalkSimulation(enabled, syllablesPerSecond, loudness)` | 음성 없이 말하는 흉내를 냅니다. 켜져 있으면 `setLipSync` 대신 씁니다 |
+| `setDriverEnabled(driver, enabled)` | 모션, 깜빡임, 표정, 외부 입력, 숨쉬기, 물리, 립싱크를 하나씩 켜고 끕니다 |
+
+캐릭터 패키지를 만드는 방법과 형식은 [FeatherAnime2D 레포](https://github.com/FeatherAnime2D/featheranime2d)에 있습니다.

package/dist/index.d.ts

@@ -0,0 +1,83 @@
+export type MotionPriority = "idle" | "normal" | "force";
+export type DriverName = "motion" | "blink" | "expression" | "input" | "breath" | "physics" | "lipSync";
+/** 처음에 한 번 읽는 정보입니다. Rust의 info.rs와 같은 모양입니다. */
+export interface CharacterInfo {
+    canvas: {
+        width: number;
+        height: number;
+    };
+    backdrop: null | {
+        type: "color";
+        color: string;
+    } | {
+        type: "image";
+        texture: number;
+        offset: [number, number];
+    };
+    textures: {
+        path: string;
+        width: number;
+        height: number;
+    }[];
+    slots: {
+        id: string;
+        vertexCount: number;
+        firstVertex: number;
+        uvs: number[];
+        indices: number[];
+    }[];
+    parameters: {
+        name: string;
+        min: number;
+        max: number;
+        default: number;
+    }[];
+    inputs: string[];
+    expressions: string[];
+    motions: string[];
+    groups: {
+        id: string;
+        parts: string[];
+    }[];
+    drivers: {
+        name: DriverName;
+        parameters: string[];
+    }[];
+}
+/** 캐릭터 패키지(.fa2d) 하나를 계산합니다. 그리지는 않으며, 그리기는 `/pixi`의 CharacterView가 맡습니다. */
+export declare class Character {
+    private readonly wasm;
+    readonly info: CharacterInfo;
+    private constructor();
+    /** seed를 빼면 무작위 시드를 씁니다. 같은 시드의 캐릭터들은 같은 순간에 깜빡이기 때문입니다. */
+    static load(bytes: Uint8Array, options?: {
+        seed?: bigint;
+    }): Promise<Character>;
+    /** `info.textures` 순서대로 패키지 안의 WebP 바이트를 돌려줍니다. */
+    textureBytes(index: number): Uint8Array;
+    update(deltaSeconds: number): void;
+    /** 모든 slot의 정점을 이어 붙인 (x, y) 목록입니다. 캔버스 픽셀이며 y는 아래쪽이 양수입니다. */
+    get vertices(): Float32Array<ArrayBuffer>;
+    /** slot마다 1이면 보이고 0이면 숨깁니다. */
+    get slotVisible(): Uint8Array<ArrayBuffer>;
+    /** slot마다 지금 그릴 텍스처 번호입니다. 보이지 않는 slot의 값은 쓰지 않습니다. */
+    get slotTextures(): Uint32Array<ArrayBuffer>;
+    /** 이번 프레임의 최종 파라미터 값입니다. 순서는 `info.parameters`와 같습니다. */
+    get parameterValues(): Float64Array<ArrayBuffer>;
+    setExpression(name: string | null): void;
+    get currentExpression(): string | null;
+    /** 시작했으면 true, 재생 중인 모션보다 우선순위가 높지 않아 버려졌으면 false입니다. */
+    playMotion(name: string, priority: MotionPriority): boolean;
+    /** 재생 중인 모션 이름입니다. 모션이 끝나면 null이 됩니다. */
+    get currentMotion(): string | null;
+    /** 얼굴 추적, 마우스 시선, 슬라이더 같은 외부 입력입니다. 기본값에서 옮긴 만큼 더합니다. */
+    setInput(parameter: string, value: number): void;
+    /** 실제 음성으로 계산한 입 벌림 값입니다. 말하기 시뮬레이션이 꺼져 있을 때 씁니다. */
+    setLipSync(mouthOpen: number, speaking: boolean): void;
+    /** 음성 없이 말하는 흉내를 냅니다. 켜져 있으면 setLipSync 값 대신 이것을 씁니다. */
+    setTalkSimulation(enabled: boolean, syllablesPerSecond: number, loudness: number): void;
+    setDriverEnabled(driver: DriverName, enabled: boolean): void;
+    /** WASM 메모리를 해제합니다. 이후에는 쓸 수 없습니다. */
+    free(): void;
+    private buffer;
+}

package/dist/index.js

@@ -0,0 +1,92 @@
+import initializeWasm, { Character as WasmCharacter } from "../wasm/featheranime2d_wasm.js";
+let memory;
+let initialization;
+// WASM은 처음 불러올 때 한 번만 초기화합니다.
+function initializeOnce() {
+    initialization ??= initializeWasm().then((exports) => {
+        memory = exports.memory;
+    });
+    return initialization;
+}
+/** 캐릭터 패키지(.fa2d) 하나를 계산합니다. 그리지는 않으며, 그리기는 `/pixi`의 CharacterView가 맡습니다. */
+export class Character {
+    wasm;
+    info;
+    constructor(wasm) {
+        this.wasm = wasm;
+        this.info = JSON.parse(wasm.infoJson());
+    }
+    /** seed를 빼면 무작위 시드를 씁니다. 같은 시드의 캐릭터들은 같은 순간에 깜빡이기 때문입니다. */
+    static async load(bytes, options = {}) {
+        await initializeOnce();
+        return new Character(WasmCharacter.load(bytes, options.seed ?? randomSeed()));
+    }
+    /** `info.textures` 순서대로 패키지 안의 WebP 바이트를 돌려줍니다. */
+    textureBytes(index) {
+        const bytes = this.wasm.textureBytes(index);
+        if (!bytes)
+            throw new Error(`Unknown texture: ${index}`);
+        return bytes;
+    }
+    update(deltaSeconds) {
+        this.wasm.update(deltaSeconds);
+    }
+    // 아래 버퍼는 WASM 메모리를 복사 없이 봅니다. WASM 메모리가 커지면 이전 뷰가 끊어지므로 읽을 때마다 새로 만들고,
+    // 다음 update 전까지만 유효합니다.
+    /** 모든 slot의 정점을 이어 붙인 (x, y) 목록입니다. 캔버스 픽셀이며 y는 아래쪽이 양수입니다. */
+    get vertices() {
+        return new Float32Array(this.buffer(), this.wasm.verticesPointer(), this.wasm.verticesLength());
+    }
+    /** slot마다 1이면 보이고 0이면 숨깁니다. */
+    get slotVisible() {
+        return new Uint8Array(this.buffer(), this.wasm.slotVisiblePointer(), this.wasm.slotCount());
+    }
+    /** slot마다 지금 그릴 텍스처 번호입니다. 보이지 않는 slot의 값은 쓰지 않습니다. */
+    get slotTextures() {
+        return new Uint32Array(this.buffer(), this.wasm.slotTexturesPointer(), this.wasm.slotCount());
+    }
+    /** 이번 프레임의 최종 파라미터 값입니다. 순서는 `info.parameters`와 같습니다. */
+    get parameterValues() {
+        return new Float64Array(this.buffer(), this.wasm.parameterValuesPointer(), this.wasm.parameterCount());
+    }
+    setExpression(name) {
+        this.wasm.setExpression(name ?? undefined);
+    }
+    get currentExpression() {
+        return this.wasm.currentExpression() ?? null;
+    }
+    /** 시작했으면 true, 재생 중인 모션보다 우선순위가 높지 않아 버려졌으면 false입니다. */
+    playMotion(name, priority) {
+        return this.wasm.playMotion(name, priority);
+    }
+    /** 재생 중인 모션 이름입니다. 모션이 끝나면 null이 됩니다. */
+    get currentMotion() {
+        return this.wasm.currentMotion() ?? null;
+    }
+    /** 얼굴 추적, 마우스 시선, 슬라이더 같은 외부 입력입니다. 기본값에서 옮긴 만큼 더합니다. */
+    setInput(parameter, value) {
+        this.wasm.setInput(parameter, value);
+    }
+    /** 실제 음성으로 계산한 입 벌림 값입니다. 말하기 시뮬레이션이 꺼져 있을 때 씁니다. */
+    setLipSync(mouthOpen, speaking) {
+        this.wasm.setLipSync(mouthOpen, speaking);
+    }
+    /** 음성 없이 말하는 흉내를 냅니다. 켜져 있으면 setLipSync 값 대신 이것을 씁니다. */
+    setTalkSimulation(enabled, syllablesPerSecond, loudness) {
+        this.wasm.setTalkSimulation(enabled, syllablesPerSecond, loudness);
+    }
+    setDriverEnabled(driver, enabled) {
+        this.wasm.setDriverEnabled(driver, enabled);
+    }
+    /** WASM 메모리를 해제합니다. 이후에는 쓸 수 없습니다. */
+    free() {
+        this.wasm.free();
+    }
+    buffer() {
+        return memory.buffer;
+    }
+}
+function randomSeed() {
+    const [high, low] = crypto.getRandomValues(new Uint32Array(2));
+    return (BigInt(high) << 32n) | BigInt(low);
+}

package/dist/pixi.d.ts

@@ -0,0 +1,23 @@
+import { Container, type DestroyOptions } from "pixi.js";
+import { Character, type CharacterInfo } from "./index.js";
+/**
+ * 캐릭터를 PixiJS로 그리는 Container입니다. 캔버스 픽셀 좌표로 그리므로, 화면 크기에 맞추는 일은 앱이 합니다.
+ * 앱은 자기 루프에서 매 프레임 `update`를 부릅니다.
+ */
+export declare class CharacterView extends Container {
+    readonly character: Character;
+    private readonly textures;
+    readonly info: CharacterInfo;
+    private readonly meshes;
+    private readonly hiddenSlots;
+    private constructor();
+    /** URL이나 패키지 바이트에서 캐릭터를 불러옵니다. */
+    static load(source: string | URL | Uint8Array, options?: {
+        seed?: bigint;
+    }): Promise<CharacterView>;
+    update(deltaSeconds: number): void;
+    /** 디버그용으로 slot 하나를 숨깁니다. Core의 계산과 상관없이 그리기만 건너뜁니다. */
+    setSlotHidden(id: string, hidden: boolean): void;
+    /** 텍스처와 WASM 메모리까지 해제합니다. */
+    destroy(options?: DestroyOptions): void;
+}

package/dist/pixi.js

@@ -0,0 +1,92 @@
+import { Container, Graphics, ImageSource, Mesh, MeshGeometry, Sprite, Texture } from "pixi.js";
+import { Character } from "./index.js";
+/**
+ * 캐릭터를 PixiJS로 그리는 Container입니다. 캔버스 픽셀 좌표로 그리므로, 화면 크기에 맞추는 일은 앱이 합니다.
+ * 앱은 자기 루프에서 매 프레임 `update`를 부릅니다.
+ */
+export class CharacterView extends Container {
+    character;
+    textures;
+    info;
+    meshes;
+    hiddenSlots = new Set();
+    constructor(character, textures) {
+        super();
+        this.character = character;
+        this.textures = textures;
+        this.info = character.info;
+        const { canvas, backdrop, slots } = this.info;
+        // 배경 그림은 캔버스보다 넓게 그려 넓은 화면의 여백을 채우므로 잘라 내지 않습니다.
+        if (backdrop?.type === "image") {
+            const sprite = new Sprite(textures[backdrop.texture]);
+            sprite.position.set(...backdrop.offset);
+            this.addChild(sprite);
+        }
+        const content = new Container();
+        this.meshes = slots.map((slot) => {
+            const geometry = new MeshGeometry({
+                positions: new Float32Array(slot.vertexCount * 2),
+                uvs: new Float32Array(slot.uvs),
+                indices: new Uint32Array(slot.indices),
+            });
+            const mesh = new Mesh({ geometry, texture: Texture.EMPTY });
+            mesh.visible = false;
+            content.addChild(mesh);
+            return mesh;
+        });
+        // 캔버스 밖까지 그린 부위가 있어도 화면에는 캔버스 영역만 보여 줍니다.
+        const canvasArea = new Graphics().rect(0, 0, canvas.width, canvas.height).fill(0xffffff);
+        content.addChild(canvasArea);
+        content.mask = canvasArea;
+        this.addChild(content);
+    }
+    /** URL이나 패키지 바이트에서 캐릭터를 불러옵니다. */
+    static async load(source, options = {}) {
+        const bytes = source instanceof Uint8Array ? source : await fetchBytes(source);
+        const character = await Character.load(bytes, options);
+        const textures = await Promise.all(character.info.textures.map((_, index) => decode(character.textureBytes(index))));
+        return new CharacterView(character, textures);
+    }
+    update(deltaSeconds) {
+        this.character.update(deltaSeconds);
+        const { vertices, slotVisible, slotTextures } = this.character;
+        this.meshes.forEach((mesh, index) => {
+            mesh.visible = slotVisible[index] === 1 && !this.hiddenSlots.has(index);
+            if (!mesh.visible)
+                return;
+            mesh.texture = this.textures[slotTextures[index]];
+            const { firstVertex, vertexCount } = this.info.slots[index];
+            const positions = mesh.geometry.getBuffer("aPosition");
+            positions.data.set(vertices.subarray(firstVertex * 2, (firstVertex + vertexCount) * 2));
+            positions.update();
+        });
+    }
+    /** 디버그용으로 slot 하나를 숨깁니다. Core의 계산과 상관없이 그리기만 건너뜁니다. */
+    setSlotHidden(id, hidden) {
+        const index = this.info.slots.findIndex((slot) => slot.id === id);
+        if (index === -1)
+            throw new Error(`Unknown slot: ${id}`);
+        if (hidden)
+            this.hiddenSlots.add(index);
+        else
+            this.hiddenSlots.delete(index);
+    }
+    /** 텍스처와 WASM 메모리까지 해제합니다. */
+    destroy(options) {
+        super.destroy(options);
+        for (const texture of this.textures)
+            texture.destroy(true);
+        this.character.free();
+    }
+}
+async function fetchBytes(url) {
+    const response = await fetch(url);
+    if (!response.ok)
+        throw new Error((await response.text()) || `Failed to load ${url} (${response.status})`);
+    return new Uint8Array(await response.arrayBuffer());
+}
+// PixiJS의 Assets가 그림을 불러올 때와 같은 방식으로 텍스처를 만들어, 반투명한 가장자리도 같게 그립니다.
+async function decode(webp) {
+    const bitmap = await createImageBitmap(new Blob([webp], { type: "image/webp" }));
+    return new Texture({ source: new ImageSource({ resource: bitmap, alphaMode: "premultiply-alpha-on-upload" }) });
+}

package/dist/react.d.ts

@@ -0,0 +1,12 @@
+import type { CharacterView } from "./pixi.js";
+/**
+ * `containerRef`를 붙인 요소에 캐릭터를 띄웁니다. 요소 크기에 맞춰 비율을 유지하며 가운데에 놓고, 매 프레임 움직입니다.
+ * `src`가 바뀌거나 컴포넌트가 사라지면 화면, 텍스처, WASM 메모리를 모두 해제합니다.
+ */
+export declare function useFeatherAnime2D(src: string, options?: {
+    seed?: bigint;
+}): {
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
+    view: CharacterView | undefined;
+    error: Error | undefined;
+};

package/dist/react.js

@@ -0,0 +1,57 @@
+import { useEffect, useRef, useState } from "react";
+/**
+ * `containerRef`를 붙인 요소에 캐릭터를 띄웁니다. 요소 크기에 맞춰 비율을 유지하며 가운데에 놓고, 매 프레임 움직입니다.
+ * `src`가 바뀌거나 컴포넌트가 사라지면 화면, 텍스처, WASM 메모리를 모두 해제합니다.
+ */
+export function useFeatherAnime2D(src, options = {}) {
+    const containerRef = useRef(null);
+    const [view, setView] = useState();
+    const [error, setError] = useState();
+    const { seed } = options;
+    useEffect(() => {
+        const container = containerRef.current;
+        if (!container)
+            return;
+        let cancelled = false;
+        let application;
+        let resizeObserver;
+        setView(undefined);
+        setError(undefined);
+        // PixiJS와 WASM은 브라우저에서만 동작하므로 effect 안에서 불러옵니다. 그래서 서버 렌더링에서 빼는 처리가 필요 없습니다.
+        const started = (async () => {
+            const [{ Application }, { CharacterView }] = await Promise.all([import("pixi.js"), import("./pixi.js")]);
+            application = new Application();
+            await application.init({ resizeTo: container, backgroundAlpha: 0, antialias: true, autoDensity: true });
+            const loaded = await CharacterView.load(src, { seed });
+            if (cancelled)
+                return loaded.destroy();
+            container.appendChild(application.canvas);
+            application.stage.addChild(loaded);
+            const app = application;
+            app.ticker.add((ticker) => {
+                loaded.update(ticker.deltaMS / 1000);
+                fitToScreen(loaded, app);
+            });
+            // resizeTo는 창 크기 변화만 감지하므로, 옆의 패널처럼 레이아웃 때문에 요소 크기가 바뀌는 경우도 반영합니다.
+            resizeObserver = new ResizeObserver(() => app.resize());
+            resizeObserver.observe(container);
+            setView(loaded);
+        })().catch((reason) => {
+            if (!cancelled)
+                setError(reason instanceof Error ? reason : new Error(String(reason)));
+        });
+        return () => {
+            cancelled = true;
+            resizeObserver?.disconnect();
+            // init이 끝나기 전에 destroy하면 PixiJS가 예외를 던지므로 시작 작업을 기다립니다.
+            started.then(() => application?.destroy(true, { children: true }));
+        };
+    }, [src, seed]);
+    return { containerRef, view, error };
+}
+function fitToScreen(view, application) {
+    const { width, height } = view.info.canvas;
+    const scale = Math.min(application.screen.width / width, application.screen.height / height);
+    view.scale.set(scale);
+    view.position.set((application.screen.width - width * scale) / 2, (application.screen.height - height * scale) / 2);
+}

package/package.json

@@ -1,6 +1,54 @@
 {
   "name": "@lemondouble/featheranime2d",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.1.0-preview.2",
+  "description": "그림 한 장으로 만드는, 가벼운 움직이는 애니메이션 캐릭터 렌더러",
+  "license": "UNLICENSED",
+  "keywords": [
+    "2d",
+    "animation",
+    "character",
+    "pixi",
+    "godot"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./pixi": {
+      "types": "./dist/pixi.d.ts",
+      "default": "./dist/pixi.js"
+    },
+    "./react": {
+      "types": "./dist/react.d.ts",
+      "default": "./dist/react.js"
+    }
+  },
+  "files": [
+    "dist",
+    "wasm"
+  ],
+  "scripts": {
+    "build:wasm": "cd ../../rust && cargo build --release --target wasm32-unknown-unknown -p featheranime2d-wasm && wasm-bindgen --target web --out-dir ../typescript/featheranime2d/wasm target/wasm32-unknown-unknown/release/featheranime2d_wasm.wasm",
+    "build": "pnpm build:wasm && tsc -p ."
+  },
+  "peerDependencies": {
+    "pixi.js": "^8.22.0",
+    "react": "^19.3.1"
+  },
+  "peerDependenciesMeta": {
+    "pixi.js": {
+      "optional": true
+    },
+    "react": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "^19.3.0",
+    "pixi.js": "^8.22.0",
+    "react": "^19.3.1",
+    "typescript": "^7.0.2"
+  }
+}

package/wasm/featheranime2d_wasm.d.ts

@@ -0,0 +1,84 @@
+/* tslint:disable */
+/* eslint-disable */
+
+export class Character {
+    private constructor();
+    free(): void;
+    [Symbol.dispose](): void;
+    currentExpression(): string | undefined;
+    currentMotion(): string | undefined;
+    infoJson(): string;
+    static load(_package: Uint8Array, seed: bigint): Character;
+    parameterCount(): number;
+    parameterValuesPointer(): number;
+    playMotion(name: string, priority: string): boolean;
+    setDriverEnabled(driver: string, enabled: boolean): void;
+    setExpression(name?: string | null): void;
+    setInput(parameter: string, value: number): void;
+    setLipSync(mouth_open: number, speaking: boolean): void;
+    setTalkSimulation(enabled: boolean, syllables_per_second: number, loudness: number): void;
+    slotCount(): number;
+    slotTexturesPointer(): number;
+    /**
+     * bool은 1바이트(0 또는 1)라서 JS에서는 Uint8Array로 봅니다.
+     */
+    slotVisiblePointer(): number;
+    textureBytes(index: number): Uint8Array | undefined;
+    update(delta_seconds: number): void;
+    verticesLength(): number;
+    verticesPointer(): number;
+}
+
+export type InitInput = RequestInfo | URL | Response | BufferSource | WebAssembly.Module;
+
+export interface InitOutput {
+    readonly memory: WebAssembly.Memory;
+    readonly __wbg_character_free: (a: number, b: number) => void;
+    readonly character_currentExpression: (a: number) => [number, number];
+    readonly character_currentMotion: (a: number) => [number, number];
+    readonly character_infoJson: (a: number) => [number, number];
+    readonly character_load: (a: number, b: number, c: bigint) => [number, number, number];
+    readonly character_parameterCount: (a: number) => number;
+    readonly character_parameterValuesPointer: (a: number) => number;
+    readonly character_playMotion: (a: number, b: number, c: number, d: number, e: number) => [number, number, number];
+    readonly character_setDriverEnabled: (a: number, b: number, c: number, d: number) => [number, number];
+    readonly character_setExpression: (a: number, b: number, c: number) => [number, number];
+    readonly character_setInput: (a: number, b: number, c: number, d: number) => [number, number];
+    readonly character_setLipSync: (a: number, b: number, c: number) => void;
+    readonly character_setTalkSimulation: (a: number, b: number, c: number, d: number) => void;
+    readonly character_slotCount: (a: number) => number;
+    readonly character_slotTexturesPointer: (a: number) => number;
+    readonly character_slotVisiblePointer: (a: number) => number;
+    readonly character_textureBytes: (a: number, b: number) => [number, number];
+    readonly character_update: (a: number, b: number) => void;
+    readonly character_verticesLength: (a: number) => number;
+    readonly character_verticesPointer: (a: number) => number;
+    readonly __wbindgen_externrefs: WebAssembly.Table;
+    readonly __wbindgen_free: (a: number, b: number, c: number) => void;
+    readonly __wbindgen_malloc: (a: number, b: number) => number;
+    readonly __externref_table_dealloc: (a: number) => void;
+    readonly __wbindgen_realloc: (a: number, b: number, c: number, d: number) => number;
+    readonly __wbindgen_start: () => void;
+}
+
+export type SyncInitInput = BufferSource | WebAssembly.Module;
+
+/**
+ * Instantiates the given `module`, which can either be bytes or
+ * a precompiled `WebAssembly.Module`.
+ *
+ * @param {{ module: SyncInitInput }} module - Passing `SyncInitInput` directly is deprecated.
+ *
+ * @returns {InitOutput}
+ */
+export function initSync(module: { module: SyncInitInput } | SyncInitInput): InitOutput;
+
+/**
+ * If `module_or_path` is {RequestInfo} or {URL}, makes a request and
+ * for everything else, calls `WebAssembly.instantiate` directly.
+ *
+ * @param {{ module_or_path: InitInput | Promise<InitInput> }} module_or_path - Passing `InitInput` directly is deprecated.
+ *
+ * @returns {Promise<InitOutput>}
+ */
+export default function __wbg_init (module_or_path?: { module_or_path: InitInput | Promise<InitInput> } | InitInput | Promise<InitInput>): Promise<InitOutput>;

package/wasm/featheranime2d_wasm.js

@@ -0,0 +1,435 @@
+/* @ts-self-types="./featheranime2d_wasm.d.ts" */
+
+export class Character {
+    static __wrap(ptr) {
+        const obj = Object.create(Character.prototype);
+        obj.__wbg_ptr = ptr;
+        CharacterFinalization.register(obj, obj.__wbg_ptr, obj);
+        return obj;
+    }
+    __destroy_into_raw() {
+        const ptr = this.__wbg_ptr;
+        this.__wbg_ptr = 0;
+        CharacterFinalization.unregister(this);
+        return ptr;
+    }
+    free() {
+        const ptr = this.__destroy_into_raw();
+        wasm.__wbg_character_free(ptr, 0);
+    }
+    /**
+     * @returns {string | undefined}
+     */
+    currentExpression() {
+        const ret = wasm.character_currentExpression(this.__wbg_ptr);
+        let v1;
+        if (ret[0] !== 0) {
+            v1 = getStringFromWasm0(ret[0], ret[1]);
+            wasm.__wbindgen_free(ret[0], ret[1] * 1, 1);
+        }
+        return v1;
+    }
+    /**
+     * @returns {string | undefined}
+     */
+    currentMotion() {
+        const ret = wasm.character_currentMotion(this.__wbg_ptr);
+        let v1;
+        if (ret[0] !== 0) {
+            v1 = getStringFromWasm0(ret[0], ret[1]);
+            wasm.__wbindgen_free(ret[0], ret[1] * 1, 1);
+        }
+        return v1;
+    }
+    /**
+     * @returns {string}
+     */
+    infoJson() {
+        let deferred1_0;
+        let deferred1_1;
+        try {
+            const ret = wasm.character_infoJson(this.__wbg_ptr);
+            deferred1_0 = ret[0];
+            deferred1_1 = ret[1];
+            return getStringFromWasm0(ret[0], ret[1]);
+        } finally {
+            wasm.__wbindgen_free(deferred1_0, deferred1_1, 1);
+        }
+    }
+    /**
+     * @param {Uint8Array} _package
+     * @param {bigint} seed
+     * @returns {Character}
+     */
+    static load(_package, seed) {
+        const ptr0 = passArray8ToWasm0(_package, wasm.__wbindgen_malloc);
+        const len0 = WASM_VECTOR_LEN;
+        const ret = wasm.character_load(ptr0, len0, seed);
+        if (ret[2]) {
+            throw takeFromExternrefTable0(ret[1]);
+        }
+        return Character.__wrap(ret[0]);
+    }
+    /**
+     * @returns {number}
+     */
+    parameterCount() {
+        const ret = wasm.character_parameterCount(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * @returns {number}
+     */
+    parameterValuesPointer() {
+        const ret = wasm.character_parameterValuesPointer(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * @param {string} name
+     * @param {string} priority
+     * @returns {boolean}
+     */
+    playMotion(name, priority) {
+        const ptr0 = passStringToWasm0(name, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
+        const len0 = WASM_VECTOR_LEN;
+        const ptr1 = passStringToWasm0(priority, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
+        const len1 = WASM_VECTOR_LEN;
+        const ret = wasm.character_playMotion(this.__wbg_ptr, ptr0, len0, ptr1, len1);
+        if (ret[2]) {
+            throw takeFromExternrefTable0(ret[1]);
+        }
+        return ret[0] !== 0;
+    }
+    /**
+     * @param {string} driver
+     * @param {boolean} enabled
+     */
+    setDriverEnabled(driver, enabled) {
+        const ptr0 = passStringToWasm0(driver, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
+        const len0 = WASM_VECTOR_LEN;
+        const ret = wasm.character_setDriverEnabled(this.__wbg_ptr, ptr0, len0, enabled);
+        if (ret[1]) {
+            throw takeFromExternrefTable0(ret[0]);
+        }
+    }
+    /**
+     * @param {string | null} [name]
+     */
+    setExpression(name) {
+        var ptr0 = isLikeNone(name) ? 0 : passStringToWasm0(name, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
+        var len0 = WASM_VECTOR_LEN;
+        const ret = wasm.character_setExpression(this.__wbg_ptr, ptr0, len0);
+        if (ret[1]) {
+            throw takeFromExternrefTable0(ret[0]);
+        }
+    }
+    /**
+     * @param {string} parameter
+     * @param {number} value
+     */
+    setInput(parameter, value) {
+        const ptr0 = passStringToWasm0(parameter, wasm.__wbindgen_malloc, wasm.__wbindgen_realloc);
+        const len0 = WASM_VECTOR_LEN;
+        const ret = wasm.character_setInput(this.__wbg_ptr, ptr0, len0, value);
+        if (ret[1]) {
+            throw takeFromExternrefTable0(ret[0]);
+        }
+    }
+    /**
+     * @param {number} mouth_open
+     * @param {boolean} speaking
+     */
+    setLipSync(mouth_open, speaking) {
+        wasm.character_setLipSync(this.__wbg_ptr, mouth_open, speaking);
+    }
+    /**
+     * @param {boolean} enabled
+     * @param {number} syllables_per_second
+     * @param {number} loudness
+     */
+    setTalkSimulation(enabled, syllables_per_second, loudness) {
+        wasm.character_setTalkSimulation(this.__wbg_ptr, enabled, syllables_per_second, loudness);
+    }
+    /**
+     * @returns {number}
+     */
+    slotCount() {
+        const ret = wasm.character_slotCount(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * @returns {number}
+     */
+    slotTexturesPointer() {
+        const ret = wasm.character_slotTexturesPointer(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * bool은 1바이트(0 또는 1)라서 JS에서는 Uint8Array로 봅니다.
+     * @returns {number}
+     */
+    slotVisiblePointer() {
+        const ret = wasm.character_slotVisiblePointer(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * @param {number} index
+     * @returns {Uint8Array | undefined}
+     */
+    textureBytes(index) {
+        const ret = wasm.character_textureBytes(this.__wbg_ptr, index);
+        let v1;
+        if (ret[0] !== 0) {
+            v1 = getArrayU8FromWasm0(ret[0], ret[1]).slice();
+            wasm.__wbindgen_free(ret[0], ret[1] * 1, 1);
+        }
+        return v1;
+    }
+    /**
+     * @param {number} delta_seconds
+     */
+    update(delta_seconds) {
+        wasm.character_update(this.__wbg_ptr, delta_seconds);
+    }
+    /**
+     * @returns {number}
+     */
+    verticesLength() {
+        const ret = wasm.character_verticesLength(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+    /**
+     * @returns {number}
+     */
+    verticesPointer() {
+        const ret = wasm.character_verticesPointer(this.__wbg_ptr);
+        return ret >>> 0;
+    }
+}
+if (Symbol.dispose) Character.prototype[Symbol.dispose] = Character.prototype.free;
+function __wbg_get_imports() {
+    const import0 = {
+        __proto__: null,
+        __wbg_Error_30c8987f7c2ed4e2: function(arg0, arg1) {
+            const ret = Error(getStringFromWasm0(arg0, arg1));
+            return ret;
+        },
+        __wbg___wbindgen_throw_41e9ee4f547fc59a: function(arg0, arg1) {
+            throw new Error(getStringFromWasm0(arg0, arg1));
+        },
+        __wbindgen_init_externref_table: function() {
+            const table = wasm.__wbindgen_externrefs;
+            const offset = table.grow(4);
+            table.set(0, undefined);
+            table.set(offset + 0, undefined);
+            table.set(offset + 1, null);
+            table.set(offset + 2, true);
+            table.set(offset + 3, false);
+        },
+    };
+    return {
+        __proto__: null,
+        "./featheranime2d_wasm_bg.js": import0,
+    };
+}
+
+const CharacterFinalization = (typeof FinalizationRegistry === 'undefined')
+    ? { register: () => {}, unregister: () => {} }
+    : new FinalizationRegistry(ptr => wasm.__wbg_character_free(ptr, 1));
+
+function getArrayU8FromWasm0(ptr, len) {
+    ptr = ptr >>> 0;
+    return getUint8ArrayMemory0().subarray(ptr / 1, ptr / 1 + len);
+}
+
+function getStringFromWasm0(ptr, len) {
+    return decodeText(ptr >>> 0, len);
+}
+
+let cachedUint8ArrayMemory0 = null;
+function getUint8ArrayMemory0() {
+    if (cachedUint8ArrayMemory0 === null || cachedUint8ArrayMemory0.byteLength === 0) {
+        cachedUint8ArrayMemory0 = new Uint8Array(wasm.memory.buffer);
+    }
+    return cachedUint8ArrayMemory0;
+}
+
+function isLikeNone(x) {
+    return x === undefined || x === null;
+}
+
+function passArray8ToWasm0(arg, malloc) {
+    const ptr = malloc(arg.length * 1, 1) >>> 0;
+    getUint8ArrayMemory0().set(arg, ptr / 1);
+    WASM_VECTOR_LEN = arg.length;
+    return ptr;
+}
+
+function passStringToWasm0(arg, malloc, realloc) {
+    if (realloc === undefined) {
+        const buf = cachedTextEncoder.encode(arg);
+        const ptr = malloc(buf.length, 1) >>> 0;
+        getUint8ArrayMemory0().subarray(ptr, ptr + buf.length).set(buf);
+        WASM_VECTOR_LEN = buf.length;
+        return ptr;
+    }
+
+    let len = arg.length;
+    let ptr = malloc(len, 1) >>> 0;
+
+    const mem = getUint8ArrayMemory0();
+
+    let offset = 0;
+
+    for (; offset < len; offset++) {
+        const code = arg.charCodeAt(offset);
+        if (code > 0x7F) break;
+        mem[ptr + offset] = code;
+    }
+    if (offset !== len) {
+        if (offset !== 0) {
+            arg = arg.slice(offset);
+        }
+        ptr = realloc(ptr, len, len = offset + arg.length * 3, 1) >>> 0;
+        const view = getUint8ArrayMemory0().subarray(ptr + offset, ptr + len);
+        const ret = cachedTextEncoder.encodeInto(arg, view);
+
+        offset += ret.written;
+        ptr = realloc(ptr, len, offset, 1) >>> 0;
+    }
+
+    WASM_VECTOR_LEN = offset;
+    return ptr;
+}
+
+function takeFromExternrefTable0(idx) {
+    const value = wasm.__wbindgen_externrefs.get(idx);
+    wasm.__externref_table_dealloc(idx);
+    return value;
+}
+
+let cachedTextDecoder = new TextDecoder('utf-8', { ignoreBOM: true, fatal: true });
+cachedTextDecoder.decode();
+const MAX_SAFARI_DECODE_BYTES = 2146435072;
+let numBytesDecoded = 0;
+function decodeText(ptr, len) {
+    numBytesDecoded += len;
+    if (numBytesDecoded >= MAX_SAFARI_DECODE_BYTES) {
+        cachedTextDecoder = new TextDecoder('utf-8', { ignoreBOM: true, fatal: true });
+        cachedTextDecoder.decode();
+        numBytesDecoded = len;
+    }
+    return cachedTextDecoder.decode(getUint8ArrayMemory0().subarray(ptr, ptr + len));
+}
+
+const cachedTextEncoder = new TextEncoder();
+
+if (!('encodeInto' in cachedTextEncoder)) {
+    cachedTextEncoder.encodeInto = function (arg, view) {
+        const buf = cachedTextEncoder.encode(arg);
+        view.set(buf);
+        return {
+            read: arg.length,
+            written: buf.length
+        };
+    };
+}
+
+let WASM_VECTOR_LEN = 0;
+
+let wasmModule, wasmInstance, wasm;
+function __wbg_finalize_init(instance, module) {
+    wasmInstance = instance;
+    wasm = instance.exports;
+    wasmModule = module;
+    cachedUint8ArrayMemory0 = null;
+    wasm.__wbindgen_start();
+    return wasm;
+}
+
+async function __wbg_load(module, imports) {
+    if (typeof Response === 'function' && module instanceof Response) {
+        if (!module.ok) {
+            throw new Error(`failed to fetch Wasm: ${module.status} ${module.statusText} fetching '${module.url}'`);
+        }
+
+        if (typeof WebAssembly.instantiateStreaming === 'function') {
+            try {
+                return await WebAssembly.instantiateStreaming(module, imports);
+            } catch (e) {
+                const validResponse = expectedResponseType(module.type);
+
+                if (validResponse && module.headers.get('Content-Type') !== 'application/wasm') {
+                    console.warn("`WebAssembly.instantiateStreaming` failed because your server does not serve Wasm with `application/wasm` MIME type. Falling back to `WebAssembly.instantiate` which is slower. Original error:\n", e);
+
+                } else { throw e; }
+            }
+        }
+
+        const bytes = await module.arrayBuffer();
+        return await WebAssembly.instantiate(bytes, imports);
+    } else {
+        const instance = await WebAssembly.instantiate(module, imports);
+
+        if (instance instanceof WebAssembly.Instance) {
+            return { instance, module };
+        } else {
+            return instance;
+        }
+    }
+
+    function expectedResponseType(type) {
+        switch (type) {
+            case 'basic': case 'cors': case 'default': return true;
+        }
+        return false;
+    }
+}
+
+function initSync(module) {
+    if (wasm !== undefined) return wasm;
+
+
+    if (module !== undefined) {
+        if (Object.getPrototypeOf(module) === Object.prototype) {
+            ({module} = module)
+        } else {
+            console.warn('using deprecated parameters for `initSync()`; pass a single object instead')
+        }
+    }
+
+    const imports = __wbg_get_imports();
+    if (!(module instanceof WebAssembly.Module)) {
+        module = new WebAssembly.Module(module);
+    }
+    const instance = new WebAssembly.Instance(module, imports);
+    return __wbg_finalize_init(instance, module);
+}
+
+async function __wbg_init(module_or_path) {
+    if (wasm !== undefined) return wasm;
+
+
+    if (module_or_path !== undefined) {
+        if (Object.getPrototypeOf(module_or_path) === Object.prototype) {
+            ({module_or_path} = module_or_path)
+        } else {
+            console.warn('using deprecated parameters for the initialization function; pass a single object instead')
+        }
+    }
+
+    if (module_or_path === undefined) {
+        module_or_path = new URL('featheranime2d_wasm_bg.wasm', import.meta.url);
+    }
+    const imports = __wbg_get_imports();
+
+    if (typeof module_or_path === 'string' || (typeof Request === 'function' && module_or_path instanceof Request) || (typeof URL === 'function' && module_or_path instanceof URL)) {
+        module_or_path = fetch(module_or_path);
+    }
+
+    const { instance, module } = await __wbg_load(await module_or_path, imports);
+
+    return __wbg_finalize_init(instance, module);
+}
+
+export { initSync, __wbg_init as default };

package/wasm/featheranime2d_wasm_bg.wasm.d.ts

@@ -0,0 +1,29 @@
+/* tslint:disable */
+/* eslint-disable */
+export const memory: WebAssembly.Memory;
+export const __wbg_character_free: (a: number, b: number) => void;
+export const character_currentExpression: (a: number) => [number, number];
+export const character_currentMotion: (a: number) => [number, number];
+export const character_infoJson: (a: number) => [number, number];
+export const character_load: (a: number, b: number, c: bigint) => [number, number, number];
+export const character_parameterCount: (a: number) => number;
+export const character_parameterValuesPointer: (a: number) => number;
+export const character_playMotion: (a: number, b: number, c: number, d: number, e: number) => [number, number, number];
+export const character_setDriverEnabled: (a: number, b: number, c: number, d: number) => [number, number];
+export const character_setExpression: (a: number, b: number, c: number) => [number, number];
+export const character_setInput: (a: number, b: number, c: number, d: number) => [number, number];
+export const character_setLipSync: (a: number, b: number, c: number) => void;
+export const character_setTalkSimulation: (a: number, b: number, c: number, d: number) => void;
+export const character_slotCount: (a: number) => number;
+export const character_slotTexturesPointer: (a: number) => number;
+export const character_slotVisiblePointer: (a: number) => number;
+export const character_textureBytes: (a: number, b: number) => [number, number];
+export const character_update: (a: number, b: number) => void;
+export const character_verticesLength: (a: number) => number;
+export const character_verticesPointer: (a: number) => number;
+export const __wbindgen_externrefs: WebAssembly.Table;
+export const __wbindgen_free: (a: number, b: number, c: number) => void;
+export const __wbindgen_malloc: (a: number, b: number) => number;
+export const __externref_table_dealloc: (a: number) => void;
+export const __wbindgen_realloc: (a: number, b: number, c: number, d: number) => number;
+export const __wbindgen_start: () => void;