@vnejs/plugins.views.scenario.interface 0.1.27 → 0.1.29

package/dist/modules/controller.d.ts

@@ -1,6 +1,6 @@
 import { ModuleController } from "@vnejs/module.components";
 import type { InterfacePluginConstants, InterfacePluginEvents, InterfacePluginParams, InterfacePluginSettings } from "../types.js";
-import type { InterfaceForcePayload, InterfacePluginState } from "../utils/interface.js";
+import type { InterfaceForcePayload, InterfacePluginState, InterfaceSpeakerChangedPayload, InterfaceTextChangedPayload, InterfaceWallChangedPayload } from "../utils/interface.js";
 export declare class InterfaceController extends ModuleController<InterfacePluginEvents, InterfacePluginConstants, InterfacePluginSettings, InterfacePluginParams, InterfacePluginState> {
     name: string;
     isStateChangeInProcess: boolean;
@@ -15,8 +15,9 @@ export declare class InterfaceController extends ModuleController<InterfacePlugi
     init: () => Promise<unknown[]> | undefined;
     onShowChanged: ({ isForce }?: InterfaceForcePayload) => Promise<unknown[]> | undefined;
     onViewChanged: ({ isForce }?: InterfaceForcePayload) => Promise<unknown[]> | undefined;
-    onTextChanged: () => Promise<unknown[] | undefined>;
-    onSpeakerChanged: () => Promise<unknown[] | undefined>;
+    onTextChanged: ({ tokens, uid, tokensVisible }?: InterfaceTextChangedPayload) => Promise<unknown[] | undefined>;
+    onWallChanged: ({ wall }?: InterfaceWallChangedPayload) => Promise<unknown[] | undefined>;
+    onSpeakerChanged: ({ speaker, meet }?: InterfaceSpeakerChangedPayload) => Promise<unknown[] | undefined>;
     onVisibleChanged: ({ isForce }?: InterfaceForcePayload) => Promise<void>;
     onStateChanged: () => Promise<void>;
     getDefaultState: () => InterfacePluginState;

package/dist/modules/controller.js

@@ -16,6 +16,7 @@ export class InterfaceController extends ModuleController {
         this.on(this.EVENTS.INTERFACE.SHOW_CHANGED, this.onShowChanged);
         this.on(this.EVENTS.INTERFACE.VIEW_CHANGED, this.onViewChanged);
         this.on(this.EVENTS.INTERFACE.TEXT_CHANGED, this.onTextChanged);
+        this.on(this.EVENTS.INTERFACE.WALL_CHANGED, this.onWallChanged);
         this.on(this.EVENTS.INTERFACE.SPEAKER_CHANGED, this.onSpeakerChanged);
         this.on(this.EVENTS.INTERFACE.STATE_CHANGED, this.onStateChanged);
         this.on(this.EVENTS.INTERFACE.VISIBLE_CHANGED, this.onVisibleChanged);
@@ -32,14 +33,17 @@ export class InterfaceController extends ModuleController {
         if (this.state.view !== view)
             return this.updateStateAndView({ view }, isForce, !isForce);
     };
-    onTextChanged = async () => {
-        const { tokens = [], wall = [], uid = "", tokensVisible = 0 } = this.globalState.interface;
+    onTextChanged = async ({ tokens = [], uid = "", tokensVisible = 0 } = {}) => {
         while (this.isStateChangeInProcess)
             await this.waitRerender();
-        return this.updateStateAndViewFast({ tokens, wall, uid, tokensVisible });
+        return this.updateStateAndViewFast({ tokens, uid, tokensVisible });
     };
-    onSpeakerChanged = async () => {
-        const { speaker = "", meet = 0 } = this.globalState.interface;
+    onWallChanged = async ({ wall = [] } = {}) => {
+        while (this.isStateChangeInProcess)
+            await this.waitRerender();
+        return this.updateStateAndViewFast({ wall });
+    };
+    onSpeakerChanged = async ({ speaker = "", meet = 0 } = {}) => {
         while (this.isStateChangeInProcess)
             await this.waitRerender();
         return this.updateStateAndViewFast({ speaker, meet });
@@ -48,11 +52,7 @@ export class InterfaceController extends ModuleController {
         const { isVisible = false } = this.globalState.interface;
         if (this.state.isVisible === isVisible)
             return;
-        const args = {
-            key: `${this.name}-unvisible`,
-            controls: this.controlsUnvisible,
-            index: this.controlsIndex + 500,
-        };
+        const args = { key: `${this.name}-unvisible`, controls: this.controlsUnvisible, index: this.controlsIndex + 500 };
         await this.emit(isVisible ? this.EVENTS.CONTROLS.POP : this.EVENTS.CONTROLS.PUSH, args);
         await this.updateStateAndView({ isVisible }, isForce, !isForce);
     };

package/dist/modules/interface.d.ts

@@ -1,5 +1,6 @@
 import { ModuleCore, type ModuleGlobalStateRegistry } from "@vnejs/module.core";
 import type { LineExecHandlerArg } from "@vnejs/module.core";
+import type { InterfaceVisibleTokensChangedPayload } from "@vnejs/contracts.views.scenario.interface";
 import type { InterfacePluginConstants, InterfacePluginEvents, InterfacePluginParams, InterfacePluginSettings } from "../types.js";
 import type { InterfaceForcePayload, InterfaceModuleState, InterfaceSpeakerChangedPayload, InterfaceTextChangedPayload, InterfaceViewPayload } from "../utils/interface.js";
 export declare class Interface extends ModuleCore<InterfacePluginEvents, InterfacePluginConstants, InterfacePluginSettings, InterfacePluginParams, InterfaceModuleState> {
@@ -11,7 +12,8 @@ export declare class Interface extends ModuleCore<InterfacePluginEvents, Interfa
     onShow: ({ isForce }?: InterfaceForcePayload) => false | Promise<unknown[] | undefined>;
     onHide: ({ isForce }?: InterfaceForcePayload) => false | Promise<unknown[] | undefined>;
     onVisible: ({ isForce }?: InterfaceForcePayload) => Promise<unknown[]> | undefined;
-    onTextChanged: ({ tokens, wall, uid, tokensVisible }?: InterfaceTextChangedPayload) => Promise<unknown[]> | undefined;
+    onTextChanged: ({ tokens, uid }?: InterfaceTextChangedPayload) => Promise<unknown[]> | undefined;
+    onVisibleTokensChanged: ({ tokensVisible, uid }?: InterfaceVisibleTokensChangedPayload) => Promise<unknown[]> | undefined;
     onTextSpeakerChanged: ({ speaker, meet }?: InterfaceSpeakerChangedPayload) => Promise<unknown[]> | undefined;
     onTextEmitBefore: () => Promise<unknown[]> | undefined;
     onTextHide: () => Promise<unknown[]> | undefined;
@@ -21,8 +23,8 @@ export declare class Interface extends ModuleCore<InterfacePluginEvents, Interfa
     setView: (view?: string, isForce?: boolean) => Promise<unknown[]> | undefined;
     setShow: (isShow: boolean, isForce?: boolean) => Promise<unknown[] | undefined>;
     setVisible: (isVisible: boolean, isForce?: boolean) => Promise<unknown[]> | undefined;
-    setText: (tokens?: InterfaceModuleState["tokens"], wall?: InterfaceModuleState["wall"], uid?: string, tokensVisible?: number) => Promise<unknown[]> | undefined;
-    setSpeaker: (speaker?: string, meet?: number) => Promise<unknown[]> | undefined;
+    emitTextChanged: (tokens?: InterfaceTextChangedPayload["tokens"], uid?: string, tokensVisible?: number) => Promise<unknown[]> | undefined;
+    emitSpeakerChanged: (speaker?: string, meet?: number) => Promise<unknown[]> | undefined;
     setNewState: (view?: string, isVisible?: boolean, isShow?: boolean) => Promise<unknown[]> | undefined;
     getDefaultState: () => InterfaceModuleState;
 }

package/dist/modules/interface.js

@@ -9,13 +9,17 @@ export class Interface extends ModuleCore {
         this.on(this.EVENTS.INTERFACE.VISIBLE, this.onVisible);
         this.on(this.EVENTS.INTERFACE.TEXT_HIDE, this.onTextHide);
         this.on(this.EVENTS.INTERFACE.VIEW, this.onView);
+        this.on(this.EVENTS.INTERFACE.VISIBLE_TOKENS_CHANGED, this.onVisibleTokensChanged);
         this.on(this.EVENTS.TEXT.CHANGED, this.onTextChanged);
         this.on(this.EVENTS.TEXT.SPEAKER_CHANGED, this.onTextSpeakerChanged);
         this.on(this.EVENTS.TEXT.EMIT_BEFORE, this.onTextEmitBefore);
         this.on(this.EVENTS.STATE.SET, this.onStateSet);
         this.on(this.EVENTS.STATE.CLEAR, this.onStateClear);
     };
-    init = () => this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineExec });
+    init = () => {
+        this.shared.interfaceTextShowAllTokensOnChange = true;
+        return this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineExec });
+    };
     onLineExec = async ({ line = "" } = {}) => {
         const isForce = this.shared.viewForceAnimationSources.isNotEmpty();
         const [action = "", execArg = ""] = tokenizeExecLine(line);
@@ -31,10 +35,14 @@ export class Interface extends ModuleCore {
     onShow = ({ isForce = false } = {}) => !this.state.isShow && this.setShow(true, isForce);
     onHide = ({ isForce = false } = {}) => this.state.isShow && this.setShow(false, isForce);
     onVisible = ({ isForce = false } = {}) => this.setVisible(!this.state.isVisible, isForce);
-    onTextChanged = ({ tokens, wall, uid, tokensVisible } = {}) => this.setText(tokens, wall, uid, tokensVisible);
-    onTextSpeakerChanged = ({ speaker, meet } = {}) => this.setSpeaker(speaker, meet);
+    onTextChanged = ({ tokens = [], uid = "" } = {}) => {
+        const tokensVisible = this.shared.interfaceTextShowAllTokensOnChange ? tokens.length : 0;
+        return this.emitTextChanged(tokens, uid, tokensVisible);
+    };
+    onVisibleTokensChanged = ({ tokensVisible = 0, uid = "" } = {}) => this.emitTextChanged(this.globalState.text.tokens, uid, tokensVisible);
+    onTextSpeakerChanged = ({ speaker, meet } = {}) => this.emitSpeakerChanged(speaker, meet);
     onTextEmitBefore = () => this.emit(this.EVENTS.INTERFACE.SHOW);
-    onTextHide = () => this.setText([], [], "", 0);
+    onTextHide = () => this.emitTextChanged([], "", 0);
     onView = ({ view, isForce = false } = {}) => this.setView(view, isForce);
     onStateSet = (payload) => {
         const moduleState = this.getStateSlice(payload);
@@ -55,20 +63,11 @@ export class Interface extends ModuleCore {
         this.state.isVisible = isVisible;
         return this.emit(this.EVENTS.INTERFACE.VISIBLE_CHANGED, { isForce });
     };
-    setText = (tokens = [], wall = [], uid = "", tokensVisible) => {
-        Object.assign(this.state, { tokens, wall, uid, tokensVisible });
-        return this.emit(this.EVENTS.INTERFACE.TEXT_CHANGED);
-    };
-    setSpeaker = (speaker = "", meet = 0) => {
-        Object.assign(this.state, { speaker, meet });
-        return this.emit(this.EVENTS.INTERFACE.SPEAKER_CHANGED);
-    };
+    emitTextChanged = (tokens = [], uid = "", tokensVisible) => this.emit(this.EVENTS.INTERFACE.TEXT_CHANGED, { tokens, uid, tokensVisible });
+    emitSpeakerChanged = (speaker = "", meet = 0) => this.emit(this.EVENTS.INTERFACE.SPEAKER_CHANGED, { speaker, meet });
     setNewState = (view, isVisible, isShow) => {
         Object.assign(this.state, { isShow, view, isVisible });
         return this.emit(this.EVENTS.INTERFACE.STATE_CHANGED);
     };
-    getDefaultState = () => {
-        const result = { tokens: [], view: this.PARAMS.INTERFACE.DEFAULT_VIEW, uid: "", speaker: "" };
-        return { ...result, meet: 0, tokensVisible: 0, isShow: false, isVisible: false, wall: [] };
-    };
+    getDefaultState = () => ({ view: this.PARAMS.INTERFACE.DEFAULT_VIEW, isShow: false, isVisible: false });
 }

package/dist/utils/interface.d.ts

@@ -1,8 +1,17 @@
 import type { ModuleControllerState } from "@vnejs/module.components";
-import type { TokenizedChar, WallElement } from "@vnejs/contracts.text";
+import type { TokenizedChar } from "@vnejs/contracts.text";
+import type { WallElement } from "@vnejs/contracts.text.wall";
 import type { InterfaceModuleState } from "@vnejs/contracts.views.scenario.interface";
 export type { InterfaceModuleState };
-export type InterfacePluginState = ModuleControllerState & InterfaceModuleState & {
+export type InterfaceRuntimeState = {
+    tokens: TokenizedChar[];
+    wall: WallElement[];
+    uid: string;
+    tokensVisible: number;
+    speaker: string;
+    meet: number;
+};
+export type InterfacePluginState = ModuleControllerState & InterfaceModuleState & InterfaceRuntimeState & {
     isFast?: boolean;
     locs?: Record<string, string>;
     prefix?: string;
@@ -22,10 +31,12 @@ export type InterfaceViewPayload = InterfaceForcePayload & {
 };
 export type InterfaceTextChangedPayload = {
     tokens?: TokenizedChar[];
-    wall?: WallElement[];
     uid?: string;
     tokensVisible?: number;
 };
+export type InterfaceWallChangedPayload = {
+    wall?: WallElement[];
+};
 export type InterfaceSpeakerChangedPayload = {
     speaker?: string;
     meet?: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vnejs/plugins.views.scenario.interface",
-  "version": "0.1.27",
+  "version": "0.1.29",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -37,6 +37,7 @@
     "@vnejs/module.core": "~0.1.0",
     "@vnejs/module.components": "~0.1.0",
     "@vnejs/contracts.text": "~0.1.0",
+    "@vnejs/contracts.text.wall": "~0.1.0",
     "@vnejs/shared": "~0.1.0",
     "@vnejs/uis.react": "~0.1.0",
     "@vnejs/uis.utils": "~0.1.0"

package/src/modules/controller.ts

@@ -3,7 +3,13 @@ import type { ControlsPopPayload, ControlsPushPayload } from "@vnejs/module.comp
 import { CONSTANTS as ControlsConstants } from "@vnejs/contracts.controls";
 
 import type { InterfacePluginConstants, InterfacePluginEvents, InterfacePluginParams, InterfacePluginSettings } from "../types.js";
-import type { InterfaceForcePayload, InterfacePluginState } from "../utils/interface.js";
+import type {
+  InterfaceForcePayload,
+  InterfacePluginState,
+  InterfaceSpeakerChangedPayload,
+  InterfaceTextChangedPayload,
+  InterfaceWallChangedPayload,
+} from "../utils/interface.js";
 
 export class InterfaceController extends ModuleController<
   InterfacePluginEvents,
@@ -31,6 +37,7 @@ export class InterfaceController extends ModuleController<
     this.on(this.EVENTS.INTERFACE.SHOW_CHANGED, this.onShowChanged);
     this.on(this.EVENTS.INTERFACE.VIEW_CHANGED, this.onViewChanged);
     this.on(this.EVENTS.INTERFACE.TEXT_CHANGED, this.onTextChanged);
+    this.on(this.EVENTS.INTERFACE.WALL_CHANGED, this.onWallChanged);
     this.on(this.EVENTS.INTERFACE.SPEAKER_CHANGED, this.onSpeakerChanged);
     this.on(this.EVENTS.INTERFACE.STATE_CHANGED, this.onStateChanged);
     this.on(this.EVENTS.INTERFACE.VISIBLE_CHANGED, this.onVisibleChanged);
@@ -49,16 +56,17 @@ export class InterfaceController extends ModuleController<
 
     if (this.state.view !== view) return this.updateStateAndView({ view }, isForce, !isForce);
   };
-  onTextChanged = async () => {
-    const { tokens = [], wall = [], uid = "", tokensVisible = 0 } = this.globalState.interface;
-
+  onTextChanged = async ({ tokens = [], uid = "", tokensVisible = 0 }: InterfaceTextChangedPayload = {}) => {
     while (this.isStateChangeInProcess) await this.waitRerender();
 
-    return this.updateStateAndViewFast({ tokens, wall, uid, tokensVisible });
+    return this.updateStateAndViewFast({ tokens, uid, tokensVisible });
   };
-  onSpeakerChanged = async () => {
-    const { speaker = "", meet = 0 } = this.globalState.interface;
+  onWallChanged = async ({ wall = [] }: InterfaceWallChangedPayload = {}) => {
+    while (this.isStateChangeInProcess) await this.waitRerender();
 
+    return this.updateStateAndViewFast({ wall });
+  };
+  onSpeakerChanged = async ({ speaker = "", meet = 0 }: InterfaceSpeakerChangedPayload = {}) => {
     while (this.isStateChangeInProcess) await this.waitRerender();
 
     return this.updateStateAndViewFast({ speaker, meet });
@@ -68,11 +76,8 @@ export class InterfaceController extends ModuleController<
 
     if (this.state.isVisible === isVisible) return;
 
-    const args = {
-      key: `${this.name}-unvisible`,
-      controls: this.controlsUnvisible,
-      index: this.controlsIndex + 500,
-    } satisfies ControlsPushPayload & ControlsPopPayload;
+    const args = { key: `${this.name}-unvisible`, controls: this.controlsUnvisible, index: this.controlsIndex + 500 } satisfies ControlsPushPayload &
+      ControlsPopPayload;
     await this.emit(isVisible ? this.EVENTS.CONTROLS.POP : this.EVENTS.CONTROLS.PUSH, args);
     await this.updateStateAndView({ isVisible }, isForce, !isForce);
   };

package/src/modules/interface.ts

@@ -3,6 +3,8 @@ import { tokenizeExecLine } from "@vnejs/helpers";
 
 import type { LineExecHandlerArg } from "@vnejs/module.core";
 
+import type { InterfaceVisibleTokensChangedPayload } from "@vnejs/contracts.views.scenario.interface";
+
 import type { InterfacePluginConstants, InterfacePluginEvents, InterfacePluginParams, InterfacePluginSettings } from "../types.js";
 import type {
   InterfaceForcePayload,
@@ -12,7 +14,13 @@ import type {
   InterfaceViewPayload,
 } from "../utils/interface.js";
 
-export class Interface extends ModuleCore<InterfacePluginEvents, InterfacePluginConstants, InterfacePluginSettings, InterfacePluginParams, InterfaceModuleState> {
+export class Interface extends ModuleCore<
+  InterfacePluginEvents,
+  InterfacePluginConstants,
+  InterfacePluginSettings,
+  InterfacePluginParams,
+  InterfaceModuleState
+> {
   name = "interface";
 
   subscribe = () => {
@@ -22,6 +30,7 @@ export class Interface extends ModuleCore<InterfacePluginEvents, InterfacePlugin
     this.on(this.EVENTS.INTERFACE.VISIBLE, this.onVisible);
     this.on(this.EVENTS.INTERFACE.TEXT_HIDE, this.onTextHide);
     this.on(this.EVENTS.INTERFACE.VIEW, this.onView);
+    this.on(this.EVENTS.INTERFACE.VISIBLE_TOKENS_CHANGED, this.onVisibleTokensChanged);
 
     this.on(this.EVENTS.TEXT.CHANGED, this.onTextChanged);
     this.on(this.EVENTS.TEXT.SPEAKER_CHANGED, this.onTextSpeakerChanged);
@@ -31,7 +40,11 @@ export class Interface extends ModuleCore<InterfacePluginEvents, InterfacePlugin
     this.on(this.EVENTS.STATE.CLEAR, this.onStateClear);
   };
 
-  init = () => this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineExec });
+  init = () => {
+    this.shared.interfaceTextShowAllTokensOnChange = true;
+
+    return this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineExec });
+  };
 
   onLineExec = async ({ line = "" }: LineExecHandlerArg = {}) => {
     const isForce = this.shared.viewForceAnimationSources.isNotEmpty();
@@ -49,10 +62,16 @@ export class Interface extends ModuleCore<InterfacePluginEvents, InterfacePlugin
   onShow = ({ isForce = false }: InterfaceForcePayload = {}) => !this.state.isShow && this.setShow(true, isForce);
   onHide = ({ isForce = false }: InterfaceForcePayload = {}) => this.state.isShow && this.setShow(false, isForce);
   onVisible = ({ isForce = false }: InterfaceForcePayload = {}) => this.setVisible(!this.state.isVisible, isForce);
-  onTextChanged = ({ tokens, wall, uid, tokensVisible }: InterfaceTextChangedPayload = {}) => this.setText(tokens, wall, uid, tokensVisible);
-  onTextSpeakerChanged = ({ speaker, meet }: InterfaceSpeakerChangedPayload = {}) => this.setSpeaker(speaker, meet);
+  onTextChanged = ({ tokens = [], uid = "" }: InterfaceTextChangedPayload = {}) => {
+    const tokensVisible = this.shared.interfaceTextShowAllTokensOnChange ? tokens.length : 0;
+
+    return this.emitTextChanged(tokens, uid, tokensVisible);
+  };
+  onVisibleTokensChanged = ({ tokensVisible = 0, uid = "" }: InterfaceVisibleTokensChangedPayload = {}) =>
+    this.emitTextChanged(this.globalState.text.tokens, uid, tokensVisible);
+  onTextSpeakerChanged = ({ speaker, meet }: InterfaceSpeakerChangedPayload = {}) => this.emitSpeakerChanged(speaker, meet);
   onTextEmitBefore = () => this.emit(this.EVENTS.INTERFACE.SHOW);
-  onTextHide = () => this.setText([], [], "", 0);
+  onTextHide = () => this.emitTextChanged([], "", 0);
   onView = ({ view, isForce = false }: InterfaceViewPayload = {}) => this.setView(view, isForce);
   onStateSet = (payload: ModuleGlobalStateRegistry) => {
     const moduleState = this.getStateSlice(payload);
@@ -78,25 +97,14 @@ export class Interface extends ModuleCore<InterfacePluginEvents, InterfacePlugin
 
     return this.emit(this.EVENTS.INTERFACE.VISIBLE_CHANGED, { isForce });
   };
-  setText = (tokens: InterfaceModuleState["tokens"] = [], wall: InterfaceModuleState["wall"] = [], uid = "", tokensVisible?: number) => {
-    Object.assign(this.state, { tokens, wall, uid, tokensVisible });
-
-    return this.emit(this.EVENTS.INTERFACE.TEXT_CHANGED);
-  };
-  setSpeaker = (speaker = "", meet = 0) => {
-    Object.assign(this.state, { speaker, meet });
-
-    return this.emit(this.EVENTS.INTERFACE.SPEAKER_CHANGED);
-  };
+  emitTextChanged = (tokens: InterfaceTextChangedPayload["tokens"] = [], uid = "", tokensVisible?: number) =>
+    this.emit(this.EVENTS.INTERFACE.TEXT_CHANGED, { tokens, uid, tokensVisible });
+  emitSpeakerChanged = (speaker = "", meet = 0) => this.emit(this.EVENTS.INTERFACE.SPEAKER_CHANGED, { speaker, meet });
   setNewState = (view?: string, isVisible?: boolean, isShow?: boolean) => {
     Object.assign(this.state, { isShow, view, isVisible });
 
     return this.emit(this.EVENTS.INTERFACE.STATE_CHANGED);
   };
 
-  getDefaultState = (): InterfaceModuleState => {
-    const result = { tokens: [], view: this.PARAMS.INTERFACE.DEFAULT_VIEW, uid: "", speaker: "" };
-
-    return { ...result, meet: 0, tokensVisible: 0, isShow: false, isVisible: false, wall: [] };
-  };
+  getDefaultState = (): InterfaceModuleState => ({ view: this.PARAMS.INTERFACE.DEFAULT_VIEW, isShow: false, isVisible: false });
 }

package/src/utils/interface.ts

@@ -1,11 +1,22 @@
 import type { ModuleControllerState } from "@vnejs/module.components";
-import type { TokenizedChar, WallElement } from "@vnejs/contracts.text";
+import type { TokenizedChar } from "@vnejs/contracts.text";
+import type { WallElement } from "@vnejs/contracts.text.wall";
 import type { InterfaceModuleState } from "@vnejs/contracts.views.scenario.interface";
 
 export type { InterfaceModuleState };
 
+export type InterfaceRuntimeState = {
+  tokens: TokenizedChar[];
+  wall: WallElement[];
+  uid: string;
+  tokensVisible: number;
+  speaker: string;
+  meet: number;
+};
+
 export type InterfacePluginState = ModuleControllerState &
-  InterfaceModuleState & {
+  InterfaceModuleState &
+  InterfaceRuntimeState & {
     isFast?: boolean;
     locs?: Record<string, string>;
     prefix?: string;
@@ -28,11 +39,14 @@ export type InterfaceViewPayload = InterfaceForcePayload & {
 
 export type InterfaceTextChangedPayload = {
   tokens?: TokenizedChar[];
-  wall?: WallElement[];
   uid?: string;
   tokensVisible?: number;
 };
 
+export type InterfaceWallChangedPayload = {
+  wall?: WallElement[];
+};
+
 export type InterfaceSpeakerChangedPayload = {
   speaker?: string;
   meet?: number;

package/src/view/components/InterfaceViewWall.tsx

@@ -1,4 +1,5 @@
-import type { TextSpeakerInfo, TokenizedChar, WallElement } from "@vnejs/contracts.text";
+import type { TextSpeakerInfo, TokenizedChar } from "@vnejs/contracts.text";
+import type { WallElement } from "@vnejs/contracts.text.wall";
 import { Flex, PositionBox, Scrollbar, SmoothText, Text, useMemo } from "@vnejs/uis.react";
 
 import type { Params as InterfaceContractParams } from "@vnejs/contracts.views.scenario.interface";