@luna-editor/engine 0.5.0 → 0.5.2

package/dist/hooks/useFontLoader.js

@@ -10,115 +10,137 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { useEffect, useRef, useState } from "react";
 // グローバルなフォントキャッシュ（ページ内で共有）
 const fontCache = new Set();
+/**
+ * Googleフォントの<link>タグを挿入し、CSSの読み込み完了を待つ
+ */
+function loadGoogleFontCSS(fontFamily) {
+    const existingLink = document.querySelector(`link[data-font-family="${fontFamily}"]`);
+    if (existingLink) {
+        return Promise.resolve();
+    }
+    const link = document.createElement("link");
+    link.rel = "stylesheet";
+    // display=blockでフォント読み込みまでテキストを非表示にする（FOUTを防止）
+    link.href = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(fontFamily)}:wght@400;700&display=block`;
+    link.setAttribute("data-font-family", fontFamily);
+    document.head.appendChild(link);
+    return new Promise((resolve) => {
+        link.onload = () => resolve();
+        link.onerror = () => {
+            console.warn(`Failed to load Google font CSS: ${fontFamily}`);
+            resolve();
+        };
+    });
+}
+/**
+ * Googleフォントのフォントデータを事前にダウンロード
+ * 400/700両方のウェイトをプリロードする
+ */
+function preloadGoogleFont(fontFamily, textToPreload) {
+    return __awaiter(this, void 0, void 0, function* () {
+        try {
+            // 400と700両方のウェイトをプリロード
+            yield Promise.all([
+                document.fonts.load(`400 16px "${fontFamily}"`, textToPreload),
+                document.fonts.load(`700 16px "${fontFamily}"`, textToPreload),
+            ]);
+        }
+        catch (error) {
+            console.warn(`Failed to preload Google font: ${fontFamily}`, error);
+        }
+    });
+}
+/**
+ * カスタムフォントをFontFace APIで読み込み
+ */
+function loadCustomFont(fontFamily, url, fontName) {
+    return __awaiter(this, void 0, void 0, function* () {
+        try {
+            // 既にdocument.fontsに登録されているかチェック
+            let fontExists = false;
+            for (const existingFont of document.fonts) {
+                if (existingFont.family === fontFamily) {
+                    fontExists = true;
+                    break;
+                }
+            }
+            if (!fontExists) {
+                const fontFace = new FontFace(fontFamily, `url(${url})`);
+                yield fontFace.load();
+                document.fonts.add(fontFace);
+            }
+        }
+        catch (error) {
+            console.warn(`Failed to load custom font: ${fontName}`, error);
+        }
+    });
+}
 /**
  * フォントを読み込むカスタムフック
  * - Googleフォント: <link>タグで読み込み + document.fonts.load()でプリロード
  * - カスタムフォント: FontFace APIで読み込み
- * - すべてのフォントがプリロード&キャッシュされてからisLoaded=trueになる
+ * - すべてのフォントが完全にダウンロード&キャッシュされてからisLoaded=trueになる
+ * - 再生開始前に全フォントを一括ダウンロードし、再生中のフォントスワップを防止する
+ * - preloadText: シナリオ内の全テキストを渡すと、使用される全ての文字でフォントをプリロード
  */
-export function useFontLoader(fonts) {
+export function useFontLoader(fonts, preloadText) {
     const [isLoaded, setIsLoaded] = useState(false);
     const [loadedFonts, setLoadedFonts] = useState([]);
-    const loadingRef = useRef(false);
+    // 現在のロード処理をキャンセルするための世代カウンター
+    const generationRef = useRef(0);
     useEffect(() => {
         if (!fonts || fonts.length === 0) {
             setIsLoaded(true);
             return;
         }
-        // 既に読み込み中の場合はスキップ
-        if (loadingRef.current)
-            return;
-        loadingRef.current = true;
+        // 新しいロード処理を開始する際、前回の結果を無効化
+        const generation = ++generationRef.current;
+        setIsLoaded(false);
         const loadFonts = () => __awaiter(this, void 0, void 0, function* () {
+            var _a;
             const loadedFontFamilies = [];
-            const fontLoadPromises = [];
-            for (const font of fonts) {
-                // キャッシュにあればスキップ
-                if (fontCache.has(font.fontFamily)) {
+            const textToPreload = preloadText || "あいうえおABCabc123";
+            // すべてのGoogle FontsのCSS読み込みを並列で開始
+            const googleFonts = fonts.filter((f) => f.type === "google" && !fontCache.has(f.fontFamily));
+            const customFonts = fonts.filter((f) => f.type === "custom" && f.url && !fontCache.has(f.fontFamily));
+            const cachedFonts = fonts.filter((f) => fontCache.has(f.fontFamily));
+            // キャッシュ済みフォントは即座に追加
+            for (const font of cachedFonts) {
+                loadedFontFamilies.push(font.fontFamily);
+            }
+            // Google FontsのCSS読み込みを並列実行
+            yield Promise.all(googleFonts.map((font) => loadGoogleFontCSS(font.fontFamily)));
+            // キャンセルチェック
+            if (generation !== generationRef.current)
+                return;
+            // Google Fontsのフォントデータプリロード + カスタムフォント読み込みを並列実行
+            const allFontPromises = [];
+            for (const font of googleFonts) {
+                allFontPromises.push(preloadGoogleFont(font.fontFamily, textToPreload).then(() => {
+                    fontCache.add(font.fontFamily);
                     loadedFontFamilies.push(font.fontFamily);
-                    continue;
-                }
-                try {
-                    if (font.type === "google") {
-                        // Googleフォントを<link>タグで読み込み
-                        const existingLink = document.querySelector(`link[data-font-family="${font.fontFamily}"]`);
-                        if (!existingLink) {
-                            const link = document.createElement("link");
-                            link.rel = "stylesheet";
-                            link.href = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(font.fontFamily)}:wght@400;700&display=swap`;
-                            link.setAttribute("data-font-family", font.fontFamily);
-                            document.head.appendChild(link);
-                            // CSSファイルの読み込み完了を待つ
-                            yield new Promise((resolve) => {
-                                link.onload = () => resolve();
-                                link.onerror = () => {
-                                    console.warn(`Failed to load Google font CSS: ${font.fontFamily}`);
-                                    resolve();
-                                };
-                            });
-                        }
-                        // フォントの実際の読み込み（プリロード）を開始
-                        // document.fonts.load()でフォントデータを事前にダウンロード
-                        const preloadPromise = document.fonts
-                            .load(`16px "${font.fontFamily}"`)
-                            .then(() => {
-                            fontCache.add(font.fontFamily);
-                            loadedFontFamilies.push(font.fontFamily);
-                        })
-                            .catch((error) => {
-                            console.warn(`Failed to preload Google font: ${font.fontFamily}`, error);
-                            // エラーでもキャッシュに追加（再試行防止）
-                            fontCache.add(font.fontFamily);
-                            loadedFontFamilies.push(font.fontFamily);
-                        });
-                        fontLoadPromises.push(preloadPromise);
-                    }
-                    else if (font.type === "custom" && font.url) {
-                        // カスタムフォントをFontFace APIで読み込み
-                        const loadCustomFont = () => __awaiter(this, void 0, void 0, function* () {
-                            try {
-                                // 既にdocument.fontsに登録されているかチェック
-                                let fontExists = false;
-                                for (const existingFont of document.fonts) {
-                                    if (existingFont.family === font.fontFamily) {
-                                        fontExists = true;
-                                        break;
-                                    }
-                                }
-                                if (!fontExists) {
-                                    const fontFace = new FontFace(font.fontFamily, `url(${font.url})`);
-                                    // フォントデータをダウンロード&パース
-                                    yield fontFace.load();
-                                    // document.fontsに追加（キャッシュとして機能）
-                                    document.fonts.add(fontFace);
-                                }
-                                fontCache.add(font.fontFamily);
-                                loadedFontFamilies.push(font.fontFamily);
-                            }
-                            catch (error) {
-                                console.warn(`Failed to load custom font: ${font.name}`, error);
-                                // エラーでもキャッシュに追加（再試行防止）
-                                fontCache.add(font.fontFamily);
-                                loadedFontFamilies.push(font.fontFamily);
-                            }
-                        });
-                        fontLoadPromises.push(loadCustomFont());
-                    }
-                }
-                catch (error) {
-                    console.warn(`Failed to load font: ${font.name}`, error);
-                }
+                }));
+            }
+            for (const font of customFonts) {
+                allFontPromises.push(loadCustomFont(font.fontFamily, (_a = font.url) !== null && _a !== void 0 ? _a : "", font.name).then(() => {
+                    fontCache.add(font.fontFamily);
+                    loadedFontFamilies.push(font.fontFamily);
+                }));
             }
-            // すべてのフォント読み込みを並列で待つ
-            yield Promise.all(fontLoadPromises);
+            yield Promise.all(allFontPromises);
+            // キャンセルチェック
+            if (generation !== generationRef.current)
+                return;
             // document.fonts.readyで全フォントの準備完了を確認
             yield document.fonts.ready;
+            // キャンセルチェック
+            if (generation !== generationRef.current)
+                return;
             setLoadedFonts(loadedFontFamilies);
             setIsLoaded(true);
-            loadingRef.current = false;
         });
         loadFonts();
-    }, [fonts]);
+    }, [fonts, preloadText]);
     return { isLoaded, loadedFonts };
 }
 /**
@@ -139,6 +161,23 @@ export function getFontFamilyStyle(selectedFontFamily, fonts) {
     // 選択されていない、または見つからない場合はデフォルト（最初の）フォントを使用
     return `"${fonts[0].fontFamily}", sans-serif`;
 }
+/**
+ * UIフォントファミリーに基づいてCSSのfont-family値を生成
+ * メニュー、ボタン、ラベルなどのUI要素に使用
+ */
+export function getUIFontFamilyStyle(selectedUIFontFamily, fonts) {
+    if (!fonts || fonts.length === 0) {
+        return "sans-serif";
+    }
+    if (selectedUIFontFamily) {
+        const selectedFont = fonts.find((f) => f.fontFamily === selectedUIFontFamily);
+        if (selectedFont) {
+            return `"${selectedUIFontFamily}", sans-serif`;
+        }
+    }
+    // 選択されていない、または見つからない場合はデフォルト（最初の）フォントを使用
+    return `"${fonts[0].fontFamily}", sans-serif`;
+}
 /**
  * フォントがキャッシュに存在するかチェック
  */

package/dist/hooks/usePlayerLogic.js

@@ -20,6 +20,9 @@ const calculateDisplayedCharacters = (blocks, currentIndex) => {
                                 positionY: char.positionY,
                                 zIndex: char.zIndex,
                                 scale: char.scale,
+                                cropLeft: char.cropLeft,
+                                cropRight: char.cropRight,
+                                cropFade: char.cropFade,
                                 object: char.object,
                                 entityState: char.entityState,
                                 // レイヤー機能用

package/dist/hooks/usePluginAPI.js

@@ -37,6 +37,6 @@ export function useUIVisibility(type) {
         // UI 状態の変更を監視
         const unsubscribe = pluginManager.subscribeUIVisibility(type, setIsVisible);
         return unsubscribe;
-    }, [pluginManager, type]);
+    }, [type]);
     return isVisible;
 }

package/dist/hooks/useSoundPlayer.js

@@ -40,13 +40,36 @@ export const useSoundPlayer = ({ soundBlocks, isFirstRenderComplete, muteAudio =
         isBGM,
         isVoice,
     ]);
-    // BGMを停止
+    const bgmFadeIntervalRef = useRef(null);
+    // BGMをフェードアウトして停止
     const stopBGM = useCallback(() => {
-        if (bgmRef.current) {
-            bgmRef.current.audio.pause();
-            bgmRef.current.audio.currentTime = 0;
-            bgmRef.current = null;
+        if (!bgmRef.current)
+            return;
+        // 既にフェード中なら前回のをクリア
+        if (bgmFadeIntervalRef.current) {
+            clearInterval(bgmFadeIntervalRef.current);
         }
+        const audio = bgmRef.current.audio;
+        const fadeDuration = 1000; // 1秒フェードアウト
+        const fadeSteps = 20;
+        const stepTime = fadeDuration / fadeSteps;
+        const volumeStep = audio.volume / fadeSteps;
+        let stepsRemaining = fadeSteps;
+        bgmFadeIntervalRef.current = setInterval(() => {
+            stepsRemaining--;
+            if (stepsRemaining <= 0) {
+                if (bgmFadeIntervalRef.current) {
+                    clearInterval(bgmFadeIntervalRef.current);
+                    bgmFadeIntervalRef.current = null;
+                }
+                audio.pause();
+                audio.currentTime = 0;
+                bgmRef.current = null;
+            }
+            else {
+                audio.volume = Math.max(0, volumeStep * stepsRemaining);
+            }
+        }, stepTime);
     }, []);
     // 特定のSEを停止
     const stopSE = useCallback((soundId) => {
@@ -185,6 +208,11 @@ export const useSoundPlayer = ({ soundBlocks, isFirstRenderComplete, muteAudio =
     // クリーンアップ（直接refにアクセスして依存配列の問題を回避）
     useEffect(() => {
         return () => {
+            // フェードintervalをクリア
+            if (bgmFadeIntervalRef.current) {
+                clearInterval(bgmFadeIntervalRef.current);
+                bgmFadeIntervalRef.current = null;
+            }
             // BGMを停止
             if (bgmRef.current) {
                 bgmRef.current.audio.pause();

package/dist/index.d.ts

@@ -5,9 +5,10 @@ export { aspectRatio, BasisHeight, BasisWidth } from "./constants/screen-size";
 export type { AudioSettings } from "./contexts/AudioContext";
 export { useAudioSettings } from "./contexts/AudioContext";
 export { useDataAPI } from "./contexts/DataContext";
+export { getFontFamilyStyle, getUIFontFamilyStyle, } from "./hooks/useFontLoader";
 export { setGlobalUIAPI, usePluginAPI, useUIVisibility, } from "./hooks/usePluginAPI";
 export { useScreenScale, useScreenSize, useToPixel, } from "./hooks/useScreenSize";
 export { Player } from "./Player";
-export type { BacklogData, BlockChangeContext, DataAPI, DataContext, FontsData, PlayerSettingsData, ScenarioPlaybackData, TransitionSource, } from "./sdk";
-export { ComponentType, renderTextWithLineBreaks } from "./sdk";
+export type { BacklogData, BlockChangeContext, DataAPI, DataContext, FontsData, LunaPlugin, PlayerSettingsData, PluginAPI, ScenarioPlaybackData, TransitionSource, } from "./sdk";
+export { ComponentType, definePlugin, renderTextWithLineBreaks } from "./sdk";
 export type { ActionNode, BacklogEntry, Character, DisplayedCharacter, EntityState, FontType, PlayerProps, PlayerSettings, PlayerState, PluginConfig, PublishedScenario, ScenarioBlock, ScenarioBlockAttributeValue, ScenarioBlockCharacter, ScenarioBlockEntityAttributeValue, ScenarioBlockType, WorkFont, WorkSound, } from "./types";

package/dist/index.js

@@ -5,7 +5,8 @@ export { OverlayUI } from "./components/OverlayUI";
 export { aspectRatio, BasisHeight, BasisWidth } from "./constants/screen-size";
 export { useAudioSettings } from "./contexts/AudioContext";
 export { useDataAPI } from "./contexts/DataContext";
+export { getFontFamilyStyle, getUIFontFamilyStyle, } from "./hooks/useFontLoader";
 export { setGlobalUIAPI, usePluginAPI, useUIVisibility, } from "./hooks/usePluginAPI";
 export { useScreenScale, useScreenSize, useToPixel, } from "./hooks/useScreenSize";
 export { Player } from "./Player";
-export { ComponentType, renderTextWithLineBreaks } from "./sdk";
+export { ComponentType, definePlugin, renderTextWithLineBreaks } from "./sdk";

package/dist/plugin/PluginManager.d.ts

@@ -62,7 +62,10 @@ export declare class PluginManager {
      * 既に初期化済みの場合はスキップ
      */
     private initializeReactRuntime;
-    loadPlugin(packageName: string, bundleUrl: string, config?: unknown): Promise<void>;
+    loadPlugin(packageName: string, bundleUrl: string | undefined, config?: unknown, assets?: {
+        filename: string;
+        url: string;
+    }[], plugin?: LunaPlugin): Promise<void>;
     private doLoadPlugin;
     private loadPluginScript;
     private createPluginAPI;
@@ -74,6 +77,11 @@ export declare class PluginManager {
     executeActionNode(nodeType: string, context: unknown): Promise<void>;
     setPluginEnabled(packageName: string, enabled: boolean): void;
     cleanup(): void;
+    /**
+     * React Strict Mode の再マウント時に呼び出す。
+     * componentRegistry と plugins をクリアし、プラグインが再ロード・再登録できるようにする。
+     */
+    resetForRemount(): void;
     private findPluginByComponentType;
     getComponent(type: ComponentType): React.ComponentType<{
         dataAPI?: DataAPI;

package/dist/plugin/PluginManager.js

@@ -21,6 +21,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from "react";
 import { useScreenSizeAtom } from "../atoms/screen-size";
 import { useDataAPI } from "../contexts/DataContext";
+import { getFontFamilyStyle, getUIFontFamilyStyle, } from "../hooks/useFontLoader";
 import { usePluginAPI, useUIVisibility } from "../hooks/usePluginAPI";
 import { useScreenScale, useScreenSize, useToPixel, } from "../hooks/useScreenSize";
 import { ComponentType, definePlugin, } from "../sdk";
@@ -107,18 +108,32 @@ export class PluginManager {
             useScreenScale,
             useScreenSizeAtom,
             ComponentType,
-            definePlugin });
+            definePlugin,
+            getFontFamilyStyle,
+            getUIFontFamilyStyle });
     }
-    loadPlugin(packageName, bundleUrl, config) {
+    loadPlugin(packageName, bundleUrl, config, assets, plugin) {
         return __awaiter(this, void 0, void 0, function* () {
             // 開発環境ではキャッシュをバイパスして常に最新コードをロード
             const isDevelopment = this.isDevelopment();
             if (isDevelopment) {
-                // 開発環境では強制リロード（キャッシュをクリア）
+                // ロード中の場合はそのPromiseを待って完了させる（二重ロード防止）
+                const existingLoadPromise = globalLoadingPlugins.get(packageName);
+                if (existingLoadPromise) {
+                    yield existingLoadPromise;
+                    // ロード完了後、結果をローカルにコピー
+                    const loaded = globalLoadedPlugins.get(packageName);
+                    if (loaded) {
+                        this.plugins.set(packageName, Object.assign(Object.assign({}, loaded), { config: config !== null && config !== void 0 ? config : loaded.config }));
+                        for (const [type, component] of loaded.instance.components) {
+                            this.componentRegistry.set(type, component);
+                        }
+                    }
+                    return;
+                }
+                // ロード中でなければキャッシュをクリアして再ロード
                 globalLoadedPlugins.delete(packageName);
                 this.plugins.delete(packageName);
-                // ロード中のPromiseもクリア（再ロードを確実にするため）
-                globalLoadingPlugins.delete(packageName);
             }
             else {
                 // 本番環境のみキャッシュを使用
@@ -160,7 +175,7 @@ export class PluginManager {
                 }
             }
             // ロード処理をPromiseとして保存
-            const loadPromise = this.doLoadPlugin(packageName, bundleUrl, config);
+            const loadPromise = this.doLoadPlugin(packageName, bundleUrl, config, assets, plugin);
             globalLoadingPlugins.set(packageName, loadPromise);
             try {
                 yield loadPromise;
@@ -171,11 +186,13 @@ export class PluginManager {
             }
         });
     }
-    doLoadPlugin(packageName, bundleUrl, config) {
+    doLoadPlugin(packageName, bundleUrl, config, assets, localPlugin) {
         return __awaiter(this, void 0, void 0, function* () {
             try {
-                // スクリプトタグで動的にプラグインを読み込む
-                const plugin = yield this.loadPluginScript(bundleUrl, packageName);
+                // ローカルプラグインが渡された場合はスクリプトロードをスキップ
+                const plugin = localPlugin
+                    ? localPlugin
+                    : yield this.loadPluginScript(bundleUrl, packageName);
                 const instance = {
                     actionNodes: new Map(),
                     hooks: {},
@@ -185,6 +202,12 @@ export class PluginManager {
                     components: new Map(),
                     assetUrls: new Map(),
                 };
+                // 外部アプリから渡されたアセットURLを事前にキャッシュ
+                if (assets) {
+                    for (const asset of assets) {
+                        instance.assetUrls.set(asset.filename, asset.url);
+                    }
+                }
                 // プラグインAPIを作成
                 const api = this.createPluginAPI(packageName, instance);
                 // プラグインをセットアップ
@@ -610,16 +633,26 @@ export class PluginManager {
             preload: (filenames) => {
                 const preloadPromise = (() => __awaiter(this, void 0, void 0, function* () {
                     const promises = filenames.map((filename) => __awaiter(this, void 0, void 0, function* () {
-                        // APIエンドポイントURL
-                        const encodedPackageName = encodeURIComponent(packageName);
-                        const encodedFilename = encodeURIComponent(filename);
-                        const apiUrl = `/api/plugin/${encodedPackageName}/assets/${encodedFilename}`;
-                        // fetchでリダイレクト後の最終URLを取得
+                        // 既にキャッシュされたURLがあればAPIフェッチをスキップ
+                        let finalUrl = instance.assetUrls.get(filename);
+                        if (!finalUrl) {
+                            // APIエンドポイントURL
+                            const encodedPackageName = encodeURIComponent(packageName);
+                            const encodedFilename = encodeURIComponent(filename);
+                            const apiUrl = `/api/plugin/${encodedPackageName}/assets/${encodedFilename}`;
+                            // fetchでリダイレクト後の最終URLを取得
+                            try {
+                                const response = yield fetch(apiUrl, { method: "HEAD" });
+                                finalUrl = response.url; // リダイレクト後の最終URL
+                                // 最終URLをキャッシュに保存
+                                instance.assetUrls.set(filename, finalUrl);
+                            }
+                            catch (error) {
+                                console.error(`Failed to preload asset: ${filename}`, error);
+                                return Promise.resolve();
+                            }
+                        }
                         try {
-                            const response = yield fetch(apiUrl, { method: "HEAD" });
-                            const finalUrl = response.url; // リダイレクト後の最終URL
-                            // 最終URLをキャッシュに保存
-                            instance.assetUrls.set(filename, finalUrl);
                             // 画像をプリロード
                             if (filename.match(/\.(png|jpg|jpeg|gif|webp)$/i)) {
                                 return new Promise((resolve, reject) => {
@@ -642,7 +675,6 @@ export class PluginManager {
                         catch (error) {
                             console.error(`Failed to preload asset: ${filename}`, error);
                         }
-                        return Promise.resolve();
                     }));
                     yield Promise.all(promises);
                 }))();
@@ -943,6 +975,14 @@ export class PluginManager {
         this.storage.clear();
         this.componentRegistry.clear();
     }
+    /**
+     * React Strict Mode の再マウント時に呼び出す。
+     * componentRegistry と plugins をクリアし、プラグインが再ロード・再登録できるようにする。
+     */
+    resetForRemount() {
+        this.componentRegistry.clear();
+        this.plugins.clear();
+    }
     // Component registry helper methods
     findPluginByComponentType(type) {
         for (const [packageName, plugin] of this.plugins) {

package/dist/sdk.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
+import { useDataAPI } from "./contexts/DataContext";
 import type { DataAPI, DataContext, DataSubscriber } from "./data-api-types";
 import type { FacePosition } from "./emotion-effect-types";
 import type { Character, ConversationBranchState, EntityState, ScenarioBlock, ScenarioBlockType } from "./types";
-import { useDataAPI } from "./contexts/DataContext";
 /**
  * ブロックオプションの定義
  * プラグインがシナリオブロックに追加できるカスタムオプションを定義

package/dist/types.d.ts

@@ -16,6 +16,7 @@ export interface ScenarioBlock {
     updatedAt: Date;
     /** Plugin-defined block options (key-value pairs) */
     options?: BlockOptions | null;
+    characterLayoutMode?: "detailed" | "simple";
     speaker?: {
         id: string;
         name: string;
@@ -100,6 +101,9 @@ export interface ScenarioBlockCharacter {
     positionY?: number | null;
     zIndex?: number | null;
     scale?: number | null;
+    cropLeft?: number | null;
+    cropRight?: number | null;
+    cropFade?: number | null;
     object: {
         id: string;
         name: string;
@@ -113,6 +117,9 @@ export interface ScenarioBlockCharacter {
         scale?: number;
         translateY?: number;
         translateX?: number;
+        cropLeft?: number | null;
+        cropRight?: number | null;
+        cropFade?: number | null;
         isDefault?: boolean;
         layers?: EntityStateLayer[];
     };
@@ -200,6 +207,9 @@ export interface DisplayedCharacter {
     positionY?: number | null;
     zIndex?: number | null;
     scale?: number | null;
+    cropLeft?: number | null;
+    cropRight?: number | null;
+    cropFade?: number | null;
     object: {
         id: string;
         name: string;
@@ -213,6 +223,9 @@ export interface DisplayedCharacter {
         scale?: number;
         translateY?: number;
         translateX?: number;
+        cropLeft?: number | null;
+        cropRight?: number | null;
+        cropFade?: number | null;
         isDefault?: boolean;
         layers?: EntityStateLayer[];
     };
@@ -311,13 +324,27 @@ export interface PlayerSettings {
     defaultBackgroundFadeDuration?: number;
     /** 全ての音声をミュートする (デフォルト: false) */
     muteAudio?: boolean;
-    /** 選択されたフォントファミリー */
+    /** 選択されたフォントファミリー（テキスト用） */
     selectedFontFamily?: string;
+    /** 選択されたUIフォントファミリー（メニュー・ラベル等） */
+    selectedUIFontFamily?: string;
+    /** 非アクティブキャラクターの明るさ (0-1, デフォルト: 0.8) */
+    inactiveCharacterBrightness?: number;
+    /** キャラクター間隔（簡易モード用、デフォルト: 0.1） */
+    characterSpacing?: number;
 }
 export interface PluginConfig {
     packageName: string;
-    bundleUrl: string;
+    /** リモートプラグインのバンドルURL（plugin未指定時に必須） */
+    bundleUrl?: string;
+    /** ローカルプラグイン: LunaPluginオブジェクトを直接渡す（bundleUrl不要） */
+    plugin?: import("./sdk").LunaPlugin;
     config?: unknown;
+    /** アセットのファイル名→絶対URLマッピング（外部アプリから利用時に必要） */
+    assets?: {
+        filename: string;
+        url: string;
+    }[];
 }
 /** 作品のサウンドデータ（プラグインからアクセス可能） */
 export interface WorkSound {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luna-editor/engine",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "Luna Editor scenario playback engine",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",