@vnejs/plugins.views.scenario.qte 0.2.1 → 0.2.3

package/dist/index.js

@@ -2,6 +2,6 @@ import "@vnejs/contracts.scenario.qte";
 import "@vnejs/contracts.views.scenario.qte";
 import { regPlugin } from "@vnejs/shared";
 import { PARAMS, PLUGIN_NAME, SUBSCRIBE_EVENTS } from "@vnejs/contracts.views.scenario.qte";
-import { QteController } from "./modules/controller.js";
-import { QteView } from "./modules/view.js";
-regPlugin(PLUGIN_NAME, { events: SUBSCRIBE_EVENTS, params: PARAMS }, [QteController, QteView]);
+import { QteViewController } from "./modules/controller.js";
+import { QteViewView } from "./modules/view.js";
+regPlugin(PLUGIN_NAME, { events: SUBSCRIBE_EVENTS, params: PARAMS }, [QteViewController, QteViewView]);

package/dist/modules/controller.d.ts

@@ -2,14 +2,14 @@ import { ModuleController } from "@vnejs/module.components";
 import type { ViewActionPayload } from "@vnejs/module.components";
 import type { QtePluginConstants, QtePluginEvents, QtePluginParams, QtePluginSettings } from "../types.js";
 import type { QtePluginControllerState, QteVisibilityPayload } from "../utils/qte.js";
-export declare class QteController extends ModuleController<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
+export declare class QteViewController extends ModuleController<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
     name: string;
-    updateEvent: "vne:qte_view:update";
-    controls: {
+    EVENT_UPDATE_VIEW: "vne:qte_view:update";
+    CONTROLS: {
         abstract_accept: () => undefined;
         abstract_interact: () => undefined;
     };
-    controlsIndex: number;
+    CONTROLS_INDEX: number;
     activeStartedAt: number | null;
     isResolved: boolean;
     resultTimeout: ReturnType<typeof setTimeout> | null;

package/dist/modules/controller.js

@@ -1,13 +1,13 @@
 import { ModuleController } from "@vnejs/module.components";
 import { getFailAtProgress, getProgressFromElapsed, isProgressInsideZone } from "../utils/qte.js";
-export class QteController extends ModuleController {
+export class QteViewController extends ModuleController {
     name = "qte_view.controller";
-    updateEvent = this.EVENTS.QTE_VIEW.UPDATE;
-    controls = {
+    EVENT_UPDATE_VIEW = this.EVENTS.QTE_VIEW.UPDATE;
+    CONTROLS = {
         [this.CONST.CONTROLS.BUTTONS.ACCEPT]: () => void this.onAction(),
         [this.CONST.CONTROLS.BUTTONS.INTERACT]: () => void this.onAction(),
     };
-    controlsIndex = this.PARAMS.QTE_VIEW.ZINDEX;
+    CONTROLS_INDEX = this.PARAMS.QTE_VIEW.ZINDEX;
     activeStartedAt = null;
     isResolved = false;
     resultTimeout = null;

package/dist/modules/view.d.ts

@@ -1,11 +1,10 @@
 import { ModuleView } from "@vnejs/module.components";
 import type { QtePluginConstants, QtePluginEvents, QtePluginParams, QtePluginSettings } from "../types.js";
 import type { QtePluginControllerState } from "../utils/qte.js";
-export declare class QteView extends ModuleView<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
+export declare class QteViewView extends ModuleView<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
     name: string;
-    locLabel: string;
-    animationTime: number;
-    updateEvent: "vne:qte_view:update";
+    EVENT_UPDATE_VIEW: "vne:qte_view:update";
+    LOC_LABEL: string;
+    TRANSITION: number;
     renderFunc: import("@vnejs/module.components").ViewRenderFunc<QtePluginControllerState>;
-    updateHandler: (state?: QtePluginControllerState | undefined) => Promise<void>;
 }

package/dist/modules/view.js

@@ -1,10 +1,9 @@
 import { ModuleView } from "@vnejs/module.components";
 import { render } from "../view/index.js";
-export class QteView extends ModuleView {
+export class QteViewView extends ModuleView {
     name = "qte_view.view";
-    locLabel = this.PARAMS.QTE_VIEW.LOC_LABEL;
-    animationTime = this.PARAMS.QTE_VIEW.TRANSITION;
-    updateEvent = this.EVENTS.QTE_VIEW.UPDATE;
+    EVENT_UPDATE_VIEW = this.EVENTS.QTE_VIEW.UPDATE;
+    LOC_LABEL = this.PARAMS.QTE_VIEW.LOC_LABEL;
+    TRANSITION = this.PARAMS.QTE_VIEW.TRANSITION;
     renderFunc = render;
-    updateHandler = this.onUpdateStoreComponent;
 }

package/dist/view/index.js

@@ -16,7 +16,7 @@ const describeArc = (sectorStart, sectorWidth) => {
     return ["M", start.x, start.y, "A", RADIUS, RADIUS, 0, largeArcFlag, 0, end.x, end.y].join(" ");
 };
 const Qte = ({ store, onMount, emit, EVENTS, PARAMS }) => {
-    const { isShow = false, isForce = false, phase = "", result = "", item = null, locs = {}, } = useStoreState(store, onMount);
+    const { isShow = false, isForce = false, phase = "", result = "", item = null, locs = {} } = useStoreState(store, onMount);
     const isRealForce = useIsForceHook(isForce);
     const propsView = PARAMS.QTE_VIEW.VIEW_PROPS;
     const transition = isRealForce ? 0 : PARAMS.QTE_VIEW.TRANSITION;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vnejs/plugins.views.scenario.qte",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/index.ts

@@ -4,7 +4,7 @@ import "@vnejs/contracts.views.scenario.qte";
 import { regPlugin } from "@vnejs/shared";
 import { PARAMS, PLUGIN_NAME, SUBSCRIBE_EVENTS } from "@vnejs/contracts.views.scenario.qte";
 
-import { QteController } from "./modules/controller.js";
-import { QteView } from "./modules/view.js";
+import { QteViewController } from "./modules/controller.js";
+import { QteViewView } from "./modules/view.js";
 
-regPlugin(PLUGIN_NAME, { events: SUBSCRIBE_EVENTS, params: PARAMS }, [QteController, QteView]);
+regPlugin(PLUGIN_NAME, { events: SUBSCRIBE_EVENTS, params: PARAMS }, [QteViewController, QteViewView]);

package/src/modules/controller.ts

@@ -6,16 +6,16 @@ import type { QtePluginConstants, QtePluginEvents, QtePluginParams, QtePluginSet
 import type { QtePluginControllerState, QteVisibilityPayload } from "../utils/qte.js";
 import { getFailAtProgress, getProgressFromElapsed, isProgressInsideZone } from "../utils/qte.js";
 
-export class QteController extends ModuleController<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
+export class QteViewController extends ModuleController<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
   name = "qte_view.controller";
 
-  updateEvent = this.EVENTS.QTE_VIEW.UPDATE;
+  EVENT_UPDATE_VIEW = this.EVENTS.QTE_VIEW.UPDATE;
 
-  controls = {
+  CONTROLS = {
     [this.CONST.CONTROLS.BUTTONS.ACCEPT]: () => void this.onAction(),
     [this.CONST.CONTROLS.BUTTONS.INTERACT]: () => void this.onAction(),
   };
-  controlsIndex = this.PARAMS.QTE_VIEW.ZINDEX;
+  CONTROLS_INDEX = this.PARAMS.QTE_VIEW.ZINDEX;
 
   activeStartedAt: number | null = null;
   isResolved = false;

package/src/modules/view.ts

@@ -4,13 +4,14 @@ import { render } from "../view/index.js";
 import type { QtePluginConstants, QtePluginEvents, QtePluginParams, QtePluginSettings } from "../types.js";
 import type { QtePluginControllerState } from "../utils/qte.js";
 
-export class QteView extends ModuleView<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
+export class QteViewView extends ModuleView<QtePluginEvents, QtePluginConstants, QtePluginSettings, QtePluginParams, QtePluginControllerState> {
   name = "qte_view.view";
 
-  locLabel = this.PARAMS.QTE_VIEW.LOC_LABEL;
-  animationTime = this.PARAMS.QTE_VIEW.TRANSITION;
-  updateEvent = this.EVENTS.QTE_VIEW.UPDATE;
+  EVENT_UPDATE_VIEW = this.EVENTS.QTE_VIEW.UPDATE;
+
+  LOC_LABEL = this.PARAMS.QTE_VIEW.LOC_LABEL;
+
+  TRANSITION = this.PARAMS.QTE_VIEW.TRANSITION;
 
   renderFunc = render;
-  updateHandler = this.onUpdateStoreComponent;
 }

package/src/tests/controller.test.ts

@@ -2,17 +2,17 @@ import { beforeEach, describe, expect, it, vi } from "vitest";
 
 import { spyEvent } from "@vnejs/test-utils";
 
-import { QteController } from "../modules/controller.js";
+import { QteViewController } from "../modules/controller.js";
 import { createQteViewTestModule, registerQteViewPluginVne, QTE_EVENTS, SUBSCRIBE_EVENTS } from "./setup.js";
 
-describe("QteController", () => {
+describe("QteViewController", () => {
   beforeEach(() => {
     registerQteViewPluginVne();
     vi.useFakeTimers({ toFake: ["setTimeout", "clearTimeout", "performance"] });
   });
 
   it("OPENED bridge emits SHOW with payload", async () => {
-    const { observer } = createQteViewTestModule(QteController);
+    const { observer } = createQteViewTestModule(QteViewController);
     const show = spyEvent(observer, SUBSCRIBE_EVENTS.SHOW);
     const payload = { id: "door_lock", item: { start: 70, size: 20, duration: 1500 } };
 
@@ -22,66 +22,66 @@ describe("QteController", () => {
   });
 
   it("SHOW starts in initial, then intro, then active", async () => {
-    const { module, observer } = createQteViewTestModule(QteController);
+    const { module, observer } = createQteViewTestModule(QteViewController);
     const item = { start: 70, size: 20, duration: 1500 };
-    const { INITIAL, TRANSITION } = (module as QteController).PARAMS.QTE_VIEW;
+    const { INITIAL, TRANSITION } = (module as QteViewController).PARAMS.QTE_VIEW;
 
     await observer.emit(SUBSCRIBE_EVENTS.SHOW, { id: "door_lock", item });
 
-    expect((module as QteController).state.id).toBe("door_lock");
-    expect((module as QteController).state.item).toEqual(item);
-    expect((module as QteController).state.phase).toBe("initial");
+    expect((module as QteViewController).state.id).toBe("door_lock");
+    expect((module as QteViewController).state.item).toEqual(item);
+    expect((module as QteViewController).state.phase).toBe("initial");
 
     await vi.advanceTimersByTimeAsync(INITIAL);
-    expect((module as QteController).state.phase).toBe("intro");
+    expect((module as QteViewController).state.phase).toBe("intro");
 
     await vi.advanceTimersByTimeAsync(TRANSITION - INITIAL);
-    expect((module as QteController).state.phase).toBe("active");
-    expect((module as QteController).activeStartedAt).not.toBeNull();
+    expect((module as QteViewController).state.phase).toBe("active");
+    expect((module as QteViewController).activeStartedAt).not.toBeNull();
   });
 
   it("ACTION resolves success inside zone by elapsed time", async () => {
-    const { module, observer } = createQteViewTestModule(QteController);
+    const { module, observer } = createQteViewTestModule(QteViewController);
     const result = spyEvent(observer, QTE_EVENTS.RESULT);
     const item = { start: 40, size: 20, duration: 1000 };
 
     await observer.emit(SUBSCRIBE_EVENTS.SHOW, { id: "door_lock", item });
-    await vi.advanceTimersByTimeAsync((module as QteController).PARAMS.QTE_VIEW.TRANSITION);
+    await vi.advanceTimersByTimeAsync((module as QteViewController).PARAMS.QTE_VIEW.TRANSITION);
     await vi.advanceTimersByTimeAsync(500);
 
     await observer.emit(SUBSCRIBE_EVENTS.ACTION);
 
-    expect((module as QteController).state.result).toBe("success");
+    expect((module as QteViewController).state.result).toBe("success");
 
-    await vi.advanceTimersByTimeAsync((module as QteController).PARAMS.QTE_VIEW.RESULT_DELAY);
+    await vi.advanceTimersByTimeAsync((module as QteViewController).PARAMS.QTE_VIEW.RESULT_DELAY);
 
     expect(result).toHaveBeenCalledExactlyOnceWith({ success: true });
   });
 
   it("ACTION resolves fail outside zone", async () => {
-    const { module, observer } = createQteViewTestModule(QteController);
+    const { module, observer } = createQteViewTestModule(QteViewController);
     const item = { start: 70, size: 20, duration: 1000 };
 
     await observer.emit(SUBSCRIBE_EVENTS.SHOW, { id: "door_lock", item });
-    await vi.advanceTimersByTimeAsync((module as QteController).PARAMS.QTE_VIEW.TRANSITION);
+    await vi.advanceTimersByTimeAsync((module as QteViewController).PARAMS.QTE_VIEW.TRANSITION);
     await vi.advanceTimersByTimeAsync(100);
 
-    (module as QteController).controls[(module as QteController).CONST.CONTROLS.BUTTONS.ACCEPT]();
+    (module as QteViewController).CONTROLS[(module as QteViewController).CONST.CONTROLS.BUTTONS.ACCEPT]();
 
-    expect((module as QteController).state.result).toBe("fail");
+    expect((module as QteViewController).state.result).toBe("fail");
   });
 
   it("auto-fails when pointer leaves the zone", async () => {
-    const { module, observer } = createQteViewTestModule(QteController);
+    const { module, observer } = createQteViewTestModule(QteViewController);
     const result = spyEvent(observer, QTE_EVENTS.RESULT);
     const item = { start: 50, size: 10, duration: 1000 };
 
     await observer.emit(SUBSCRIBE_EVENTS.SHOW, { id: "door_lock", item });
-    await vi.advanceTimersByTimeAsync((module as QteController).PARAMS.QTE_VIEW.TRANSITION);
+    await vi.advanceTimersByTimeAsync((module as QteViewController).PARAMS.QTE_VIEW.TRANSITION);
     await vi.advanceTimersByTimeAsync(600);
-    await vi.advanceTimersByTimeAsync((module as QteController).PARAMS.QTE_VIEW.RESULT_DELAY);
+    await vi.advanceTimersByTimeAsync((module as QteViewController).PARAMS.QTE_VIEW.RESULT_DELAY);
 
-    expect((module as QteController).state.result).toBe("fail");
+    expect((module as QteViewController).state.result).toBe("fail");
     expect(result).toHaveBeenCalledExactlyOnceWith({ success: false });
   });
 });

package/src/view/index.tsx

@@ -28,14 +28,7 @@ const describeArc = (sectorStart: number, sectorWidth: number) => {
 };
 
 const Qte = ({ store, onMount, emit, EVENTS, PARAMS }: QteComponentProps) => {
-  const {
-    isShow = false,
-    isForce = false,
-    phase = "",
-    result = "",
-    item = null,
-    locs = {},
-  } = useStoreState<QtePluginControllerState>(store, onMount);
+  const { isShow = false, isForce = false, phase = "", result = "", item = null, locs = {} } = useStoreState<QtePluginControllerState>(store, onMount);
 
   const isRealForce = useIsForceHook(isForce);
   const propsView = PARAMS.QTE_VIEW.VIEW_PROPS;