like2d 2.9.0 → 2.10.0

package/dist/input/gamepad.js

@@ -0,0 +1,288 @@
+import { defaultMapping, fullButtonName, getSdlMapping, mapStick } from './gamepad-mapping';
+/** LIKE Gamepad Wrapper
+ *
+ *  - Allows events/callbacks to be sent from joy buttons.
+ *  - Can track if any gamepad has a button pressed / just pressed.
+ *  - Remaps raw input numbers to readable strings -- by default using SDL database.
+ *
+ * If you're planning on supporting gamepads, please include a
+ * way to generate {@link GamepadMapping} and set it with {@link Gamepad.setMapping}.
+ *
+ * If you don't want to make your own, take a look at `prefab-scenes/mapGamepad`.
+ */
+export class Gamepad {
+    constructor(props) {
+        Object.defineProperty(this, "dispatch", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "gamepads", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "autoLoadMapping", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: true
+        });
+        this.dispatch = props.dispatch;
+        const { abort } = props;
+        // Register event listeners
+        window.addEventListener("gamepadconnected", this.onGamepadConnected.bind(this), {
+            signal: abort,
+        });
+        window.addEventListener("gamepaddisconnected", (ev) => {
+            console.log(`[Gamepad] Disconnected ${ev.gamepad.id}`);
+            delete this.gamepads[ev.gamepad.index];
+            this.dispatch("gamepaddisconnected", [ev.gamepad.index]);
+        }, { signal: abort });
+        window.addEventListener("blur", () => {
+            for (const gps of Object.values(this.gamepads)) {
+                gps.clear();
+            }
+        }, { signal: abort });
+    }
+    onGamepadConnected(ev) {
+        const gps = new GamepadState(ev.gamepad.index);
+        this.gamepads[ev.gamepad.index] = gps;
+        console.log(`[Gamepad] Connected ${ev.gamepad.id}. buttons: ${ev.gamepad.buttons.length}, axes: ${ev.gamepad.axes.length}`);
+        const mapping = this.loadMapping(ev.gamepad.index);
+        if (this.autoLoadMapping && mapping) {
+            gps.mapping = mapping;
+            console.log(`[Gamepad] Applied presaved mapping.`);
+        }
+        else if (ev.gamepad.mapping == 'standard') {
+            gps.mapping = defaultMapping(ev.gamepad.axes.length / 2);
+            console.log(`Loaded standard mapping.`);
+        }
+        else {
+            const sdlMapping = getSdlMapping(ev.gamepad);
+            if (sdlMapping) {
+                gps.mapping.buttons = sdlMapping.mapping;
+                console.log(`[Gamepad] Connected, applied SDL database mapping.`);
+            }
+            else {
+                console.log(`[Gamepad] Could not find mapping for gamepad. Consider remapping it.`);
+            }
+        }
+        this.dispatch("gamepadconnected", [ev.gamepad.index]);
+    }
+    /**
+     * @private
+     * Called by the engine every frame.
+     */
+    update() {
+        Object.values(this.gamepads).forEach((gp) => gp.update(this.dispatch));
+    }
+    /**
+     *
+     * @param target Which controller?
+     * @returns all of the sticks. Convention is 0 = left, 1 = right.
+     */
+    getSticks(target) {
+        const gp = this.gamepads[target];
+        if (gp) {
+            return gp.getSticks();
+        }
+        return [];
+    }
+    fullButtonName(name) {
+        return fullButtonName.get(name) ?? name;
+    }
+    checkButton(target, button, mode) {
+        if (target == "any") {
+            return Object.values(this.gamepads).some((gp) => gp[mode](button));
+        }
+        else {
+            return this.gamepads[target]?.[mode](button);
+        }
+    }
+    /** Check if a gamepad button is down. */
+    isDown(target, button) {
+        return this.checkButton(target, button, "isDown");
+    }
+    /**
+     * Returns true for only one frame/update if a button is pressed.
+     * Considered an alternative to `like.gamepadpressed`.
+     */
+    justPressed(target, button) {
+        return this.checkButton(target, button, "justPressed");
+    }
+    /**
+     * Get a controller mapping.
+     * Note that modifying this mapping in place will modify the target controller.
+     * However, use `setMapping` to finalize the mapping.
+     */
+    getMapping(index) {
+        return this.gamepads[index]?.mapping;
+    }
+    /**
+     * Set the mapping for a particular controller.
+     *
+     * Set `save = false` if you don't want this written into localstorage.
+     */
+    setMapping(index, mapping, save = true) {
+        const gp = this.gamepads[index];
+        if (gp) {
+            gp.mapping = mapping;
+            if (save) {
+                this.saveMapping(index, mapping);
+            }
+        }
+    }
+    /**
+     * Get saved mapping from db, if it exists.
+     */
+    loadMapping(index) {
+        const gp = navigator.getGamepads()?.[index];
+        if (gp) {
+            const path = getLocalstoragePath(gp);
+            console.log(`[Gamepad] Found saved mapping for ${gp.id}.`);
+            const item = localStorage.getItem(path);
+            if (item) {
+                return JSON.parse(item);
+            }
+        }
+    }
+    /**
+     * Save a mapping to persistant storage
+     */
+    saveMapping(index, mapping) {
+        const gp = navigator.getGamepads()?.[index];
+        if (gp) {
+            const path = getLocalstoragePath(gp);
+            console.log(`[Gamepad] Saved mapping ${path} to localStorage.`);
+            localStorage.setItem(path, JSON.stringify(mapping));
+        }
+    }
+    /**
+     * Enable automatically loading mappings.
+     *
+     * When a gamepad with a known (to this system) ID is plugged in,
+     * this will load the previously saved mapping.
+     *
+     * @param enable
+     */
+    enableAutoLoadMapping(enable) {
+        this.autoLoadMapping = enable;
+    }
+}
+function getLocalstoragePath(gamepad) {
+    return `${gamepad.axes.length}A${gamepad.buttons.length}B${gamepad.id}`;
+}
+const maxButtons = 64;
+/** Internal class: Using it externally could result
+ * in a gamepad being disconnected and still trying to maintain
+ * its state.
+ */
+class GamepadState {
+    constructor(index) {
+        Object.defineProperty(this, "index", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: index
+        });
+        Object.defineProperty(this, "mapping", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "downNums", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "lastDownNums", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "down", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "lastDown", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        const gp = navigator.getGamepads()[this.index];
+        this.mapping = defaultMapping(gp.axes.length);
+    }
+    isDown(button) {
+        return typeof (button) == "number" ? !!this.downNums[button] : !!this.down[button];
+    }
+    justPressed(button) {
+        return typeof (button) == "number" ?
+            (!!this.downNums[button] && !this.lastDownNums[button]) :
+            (!!this.down[button] && !this.lastDown[button]);
+    }
+    map(button) {
+        return (this.mapping.buttons[button] ??
+            (button < maxButtons
+                ? `Button${button}`
+                : `Axis${Math.floor((button - maxButtons) / 2)}${button % 2 ? "-" : "+"}`));
+    }
+    update(dispatch) {
+        const gp = navigator.getGamepads()[this.index];
+        if (!gp)
+            return;
+        [this.downNums, this.lastDownNums] = [this.lastDownNums, this.downNums];
+        for (const k in this.downNums) {
+            delete this.downNums[Number(k)];
+        }
+        gp.buttons.forEach((btn, i) => {
+            if (btn.pressed) {
+                this.downNums[i] = true;
+            }
+        });
+        gp.axes.forEach((axis, i) => {
+            const pos = Math.round(axis);
+            if (pos == 0)
+                return;
+            const index = 64 + i * 2 + (pos == -1 ? 1 : 0);
+            this.downNums[index] = true;
+        });
+        [this.down, this.lastDown] = [this.lastDown, this.down];
+        for (const k in this.down) {
+            delete this.down[k];
+        }
+        for (const i in this.downNums) {
+            const name = this.map(Number(i));
+            this.down[name] = true;
+            if (!this.lastDownNums[Number(i)]) {
+                dispatch("gamepadpressed", [this.index, name, Number(i)]);
+            }
+        }
+        for (const i in this.lastDownNums) {
+            if (!this.downNums[Number(i)]) {
+                const name = this.map(Number(i));
+                dispatch("gamepadreleased", [this.index, name, Number(i)]);
+            }
+        }
+    }
+    getSticks() {
+        const gp = navigator.getGamepads()[this.index];
+        return this.mapping.sticks.map((stick) => mapStick(gp, stick));
+    }
+    clear() {
+        for (const k in this.lastDown) {
+            delete this.lastDown[k];
+        }
+        for (const k in this.down) {
+            delete this.down[k];
+        }
+    }
+}

package/dist/input/index.d.ts

@@ -0,0 +1,6 @@
+export type { Input, InputType, InputBinding, } from "./input";
+export type { GamepadTarget, Gamepad, } from "./gamepad";
+export type { LikeButton, GamepadMapping, StickMapping, StickAxisMapping, } from "./gamepad-mapping";
+export { defaultMapping, allButtons } from "./gamepad-mapping";
+export type { MouseSetMode, Mouse, } from "./mouse";
+//# sourceMappingURL=index.d.ts.map

package/dist/input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/input/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,KAAK,EACL,SAAS,EACT,YAAY,GACb,MAAM,SAAS,CAAC;AAEjB,YAAY,EACV,aAAa,EACb,OAAO,GACR,MAAM,WAAW,CAAA;AAElB,YAAY,EACV,UAAU,EACV,cAAc,EACd,YAAY,EACZ,gBAAgB,GACjB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAE/D,YAAY,EACV,YAAY,EACZ,KAAK,GACN,MAAM,SAAS,CAAC"}

package/dist/input/index.js

@@ -0,0 +1 @@
+export { defaultMapping, allButtons } from "./gamepad-mapping";

package/dist/input/input.d.ts

@@ -0,0 +1,76 @@
+import type { Keyboard } from './keyboard';
+import type { Mouse } from './mouse';
+import { Gamepad, GamepadTarget } from './gamepad';
+import { LikeButton } from './gamepad-mapping';
+import { MouseButton, Dispatcher } from '../events';
+export type InputType = InputBinding['type'];
+export type InputBinding = {
+    type: 'keyboard';
+    scancode: string;
+} | {
+    type: 'mouse';
+    button: MouseButton;
+} | {
+    type: 'gamepad';
+    gamepad: GamepadTarget;
+    button: LikeButton;
+};
+export declare class Input {
+    private dispatch;
+    private currState;
+    private prevState;
+    private actionTable;
+    private keyboard;
+    private mouse;
+    private gamepad;
+    constructor(dispatch: Dispatcher<'actionpressed' | 'actionreleased'>, deps: {
+        keyboard: Keyboard;
+        mouse: Mouse;
+        gamepad: Gamepad;
+    });
+    /**
+     * This is the easiest way to set-and-forget input => action mapping.
+     *
+     * Or, it's a helper to remove actions -- `setAction(action)`
+     * will simply clear the action away.
+     *
+     * For input strings:
+     *  - Mouse is `MouseLeft`, `MouseRight`, or `MouseMiddle`.
+     *  - Joypad is 'Left', 'L1', or any joypad button. {@link LikeButton}
+     *  - Keyboard is the name of scancodes, which are based on key positions. Choose from a subset of portable, web-safe scancodes:
+     *    - Alphabetical: `KeyA`, `KeyB`, ...
+     *    - Numeric: `Digit0`, `Digit1`, ...
+     *    - `ArrowLeft`, `ArrowRight`, `ArrowUp`, `ArrowDown`
+     *    - `ShiftLeft`, `ShiftRight`
+     *    - `Minus`
+     *    - `Equal` (also has a plus sign)
+     *    - `BracketLeft` and `BracketRight`
+     *    - `Semicolon`
+     *    - `Quote`
+     *    - `Backquote` (also has tilde)
+     *    - `Backslash`
+     *    - `Comma`
+     *    - `Period`
+     *    - `Slash`
+     *    - `Backspace`
+     *    - `Enter`
+     *
+     * @param action
+     * @param inputs
+     */
+    setAction(action: string, inputs?: (string | InputBinding)[]): void;
+    /**
+     * Map a single input onto an action.
+     */
+    appendToAction(action: string, input: InputBinding | string): void;
+    /**
+     * Get the mapping entry for a specific action.
+     */
+    getActionMapping(action: string): InputBinding[];
+    isDown(action: string): boolean;
+    justPressed(action: string): boolean;
+    justReleased(action: string): boolean;
+    update(): void;
+    private isBindingActive;
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/input/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/input/input.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AACnD,OAAO,EAAc,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAEpD,MAAM,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;AAC7C,MAAM,MAAM,YAAY,GACpB;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,GACtC;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,GACtC;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,OAAO,EAAE,aAAa,CAAC;IAAC,MAAM,EAAE,UAAU,CAAA;CAAE,CAAC;AAEpE,qBAAa,KAAK;IASd,OAAO,CAAC,QAAQ;IARlB,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,WAAW,CAAsC;IACzD,OAAO,CAAC,QAAQ,CAAW;IAC3B,OAAO,CAAC,KAAK,CAAQ;IACrB,OAAO,CAAC,OAAO,CAAU;gBAGf,QAAQ,EAAE,UAAU,CAAC,eAAe,GAAG,gBAAgB,CAAC,EAChE,IAAI,EAAE;QACJ,QAAQ,EAAE,QAAQ,CAAC;QACnB,KAAK,EAAE,KAAK,CAAC;QACb,OAAO,EAAE,OAAO,CAAC;KAClB;IAOH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA6BG;IACH,SAAS,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,GAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAO,GAAG,IAAI;IAUvE;;OAEG;IACH,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,GAAG,MAAM;IAM3D;;OAEG;IACH,gBAAgB,CAAC,MAAM,EAAE,MAAM,GAAG,YAAY,EAAE;IAIhD,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAM/B,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAIpC,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAIrC,MAAM;IAiBN,OAAO,CAAC,eAAe;CAaxB"}

package/dist/input/input.js

@@ -0,0 +1,164 @@
+import { allButtons } from './gamepad-mapping';
+export class Input {
+    constructor(dispatch, deps) {
+        Object.defineProperty(this, "dispatch", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: dispatch
+        });
+        Object.defineProperty(this, "currState", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Set()
+        });
+        Object.defineProperty(this, "prevState", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Set()
+        });
+        Object.defineProperty(this, "actionTable", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "keyboard", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "mouse", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "gamepad", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.keyboard = deps.keyboard;
+        this.mouse = deps.mouse;
+        this.gamepad = deps.gamepad;
+    }
+    /**
+     * This is the easiest way to set-and-forget input => action mapping.
+     *
+     * Or, it's a helper to remove actions -- `setAction(action)`
+     * will simply clear the action away.
+     *
+     * For input strings:
+     *  - Mouse is `MouseLeft`, `MouseRight`, or `MouseMiddle`.
+     *  - Joypad is 'Left', 'L1', or any joypad button. {@link LikeButton}
+     *  - Keyboard is the name of scancodes, which are based on key positions. Choose from a subset of portable, web-safe scancodes:
+     *    - Alphabetical: `KeyA`, `KeyB`, ...
+     *    - Numeric: `Digit0`, `Digit1`, ...
+     *    - `ArrowLeft`, `ArrowRight`, `ArrowUp`, `ArrowDown`
+     *    - `ShiftLeft`, `ShiftRight`
+     *    - `Minus`
+     *    - `Equal` (also has a plus sign)
+     *    - `BracketLeft` and `BracketRight`
+     *    - `Semicolon`
+     *    - `Quote`
+     *    - `Backquote` (also has tilde)
+     *    - `Backslash`
+     *    - `Comma`
+     *    - `Period`
+     *    - `Slash`
+     *    - `Backspace`
+     *    - `Enter`
+     *
+     * @param action
+     * @param inputs
+     */
+    setAction(action, inputs = []) {
+        if (inputs.length) {
+            this.actionTable[action] = inputs.map(parseInput);
+        }
+        else {
+            delete this.actionTable[action];
+            this.currState.delete(action);
+            this.prevState.delete(action);
+        }
+    }
+    /**
+     * Map a single input onto an action.
+     */
+    appendToAction(action, input) {
+        const am = this.actionTable[action] ?? [];
+        am.push(parseInput(input));
+        this.actionTable[action] = am;
+    }
+    /**
+     * Get the mapping entry for a specific action.
+     */
+    getActionMapping(action) {
+        return this.actionTable[action] ?? [];
+    }
+    isDown(action) {
+        const bindings = this.actionTable[action];
+        if (!bindings)
+            return false;
+        return bindings.some((binding) => this.isBindingActive(binding));
+    }
+    justPressed(action) {
+        return this.currState.has(action) && !this.prevState.has(action);
+    }
+    justReleased(action) {
+        return !this.currState.has(action) && this.prevState.has(action);
+    }
+    update() {
+        this.gamepad.update();
+        [this.prevState, this.currState] = [this.currState, this.prevState];
+        this.currState.clear();
+        for (const action of Object.keys(this.actionTable)) {
+            if (this.isDown(action)) {
+                if (!this.prevState.has(action)) {
+                    this.dispatch('actionpressed', [action]);
+                }
+                this.currState.add(action);
+            }
+            else if (this.prevState.has(action)) {
+                this.dispatch('actionreleased', [action]);
+            }
+        }
+    }
+    isBindingActive(binding) {
+        switch (binding.type) {
+            case "keyboard":
+                return this.keyboard.isDown(binding.scancode);
+            case "mouse":
+                return this.mouse.isDown(binding.button);
+            case "gamepad": {
+                return !!this.gamepad.isDown(binding.gamepad, binding.button);
+            }
+            default:
+                return false;
+        }
+    }
+}
+function parseInput(input) {
+    if (typeof input !== "string")
+        return input;
+    const normalized = input.trim();
+    if (normalized.startsWith("Mouse")) {
+        const buttonCode = normalized.replace("Mouse", "").toLowerCase();
+        return { type: "mouse", button: buttonCode };
+    }
+    if (allButtons.has(input) ||
+        normalized.startsWith("Button") ||
+        normalized.startsWith("Axis")) {
+        return {
+            type: "gamepad",
+            gamepad: "any",
+            button: normalized,
+        };
+    }
+    return { type: "keyboard", scancode: normalized };
+}

package/dist/input/keyboard.d.ts

@@ -0,0 +1,15 @@
+import { EngineProps } from "../engine";
+type KEvent = 'keypressed' | 'keyreleased';
+export declare class Keyboard {
+    private pressedScancodes;
+    private canvas;
+    private dispatch;
+    constructor(props: EngineProps<KEvent>);
+    private handleKeyDown;
+    private handleKeyUp;
+    private handleBlur;
+    isDown(scancode: string): boolean;
+    isAnyDown(...scancodes: string[]): boolean;
+}
+export {};
+//# sourceMappingURL=keyboard.d.ts.map

package/dist/input/keyboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard.d.ts","sourceRoot":"","sources":["../../src/input/keyboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGxC,KAAK,MAAM,GAAG,YAAY,GAAG,aAAa,CAAC;AAE3C,qBAAa,QAAQ;IACnB,OAAO,CAAC,gBAAgB,CAAqB;IAC7C,OAAO,CAAC,MAAM,CAAoB;IAClC,OAAO,CAAC,QAAQ,CAAqB;gBAEzB,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC;IAUtC,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,UAAU;IAIlB,MAAM,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO;IAIjC,SAAS,CAAC,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,OAAO;CAG3C"}

package/dist/{core → input}/keyboard.js

@@ -1,11 +1,5 @@
-export class KeyboardInternal {
-    constructor(canvas, dispatch) {
-        Object.defineProperty(this, "dispatch", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: dispatch
-        });
+export class Keyboard {
+    constructor(props) {
         Object.defineProperty(this, "pressedScancodes", {
             enumerable: true,
             configurable: true,
@@ -16,20 +10,20 @@ export class KeyboardInternal {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: null
+            value: void 0
         });
-        Object.defineProperty(this, "abort", {
+        Object.defineProperty(this, "dispatch", {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: new AbortController()
+            value: void 0
         });
-        this.canvas = canvas;
-        if (this.canvas) {
-            this.canvas.addEventListener('keydown', this.handleKeyDown.bind(this), { signal: this.abort.signal });
-            this.canvas.addEventListener('keyup', this.handleKeyUp.bind(this), { signal: this.abort.signal });
-            this.canvas.addEventListener('blur', this.handleBlur.bind(this), { signal: this.abort.signal });
-        }
+        this.canvas = props.canvas;
+        this.dispatch = props.dispatch;
+        const { abort } = props;
+        this.canvas.addEventListener('keydown', this.handleKeyDown.bind(this), { signal: abort });
+        this.canvas.addEventListener('keyup', this.handleKeyUp.bind(this), { signal: abort });
+        this.canvas.addEventListener('blur', this.handleBlur.bind(this), { signal: abort });
     }
     handleKeyDown(e) {
         const scrollKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Space', 'PageUp', 'PageDown', 'Home', 'End'];
@@ -50,10 +44,6 @@ export class KeyboardInternal {
     handleBlur() {
         this.pressedScancodes.clear();
     }
-    _dispose() {
-        this.abort.abort();
-        this.pressedScancodes.clear();
-    }
     isDown(scancode) {
         return this.pressedScancodes.has(scancode);
     }