add TypeScript definition to the generated plugin build

Author: obiot

dist/@melonjs/debug-plugin.js

@@ -1,5 +1,5 @@
 /*!
- * melonJS debug plugin - v14.5.2
+ * melonJS debug plugin - v14.6.0
  * http://www.melonjs.org
  * @melonjs/debug-plugin is licensed under the MIT License.
  * http://www.opensource.org/licenses/mit-license
@@ -71,7 +71,7 @@ class DebugPanel extends Renderable {
         this.name = "debugPanel";
 
         // the debug panel version
-        this.version = "14.5.2";
+        this.version = "14.6.0";
 
         // persistent
         this.isPersistent = true;

dist/counters.d.ts

@@ -0,0 +1,7 @@
+export default Counters;
+declare class Counters {
+    stats: any[];
+    reset(): void;
+    inc(stat: any, value: any): void;
+    get(stat: any): any;
+}

dist/debugPanel.d.ts

@@ -0,0 +1,44 @@
+export default DebugPanel;
+declare class DebugPanel extends Renderable {
+    constructor(debugToggle?: number);
+    checkbox: {};
+    counters: Counters;
+    visible: boolean;
+    frameUpdateTime: number;
+    frameDrawTime: number;
+    version: string;
+    canvas: HTMLCanvasElement | OffscreenCanvas;
+    font_size: number;
+    mod: number;
+    font: BitmapText;
+    debugToggle: number;
+    keyHandler: import("eventemitter3").EventEmitter<string | symbol, any>;
+    help_str: string;
+    help_str_len: number;
+    fps_str_len: number;
+    memoryPositionX: number;
+    frameUpdateStartTime: number;
+    frameDrawStartTime: number;
+    /**
+     * patch system fn to draw debug information
+     */
+    patchSystemFn(): void;
+    /**
+     * show the debug panel
+     */
+    show(): void;
+    /**
+     * hide the debug panel
+     */
+    hide(): void;
+    update(): boolean;
+    onClick(e: any): void;
+    drawQuadTreeNode(renderer: any, node: any): void;
+    drawQuadTree(renderer: any): void;
+    /** @private */
+    private drawMemoryGraph;
+    draw(renderer: any): void;
+}
+import { Renderable } from "melonjs";
+import Counters from "./counters";
+import { BitmapText } from "melonjs";

dist/index.d.ts

@@ -0,0 +1,46 @@
+declare const DebugPanelPlugin_base: any;
+/**
+ * @classdesc
+ * a simple debug panel plugin <br>
+ * <img src="images/debugPanel.png"/> <br>
+ * <b>usage : </b><br>
+ * &bull; upon loading the debug panel, it will be automatically registered under me.plugins.debugPanel <br>
+ * &bull; you can then press the default "s" key to show or hide the panel, or use me.plugins.debugPanel.show() and me.plugins.debugPanel.show(), or add #debug as a parameter to your URL e.g. http://myURL/index.html#debug <br>
+ * &bull; default key can be configured using the following parameters in the url : e.g. http://myURL/index.html#debugToggleKey=d <br>
+ * <b>the debug panel provides the following information : </b><br>
+ * &bull; amount of total objects currently active in the current stage <br>
+ * &bull; amount of draws operation <br>
+ * &bull; amount of body shape (for collision) <br>
+ * &bull; amount of bounding box <br>
+ * &bull; amount of sprites objects <br>
+ * &bull; amount of objects currently inactive in the the object pool <br>
+ * &bull; memory usage (Heap Memory information is only available under Chrome) <br>
+ * &bull; frame update time (in ms) <br>
+ * &bull; frame draw time (in ms) <br>
+ * &bull; current fps rate vs target fps <br>
+ * additionally, using the checkbox in the panel it is also possible to display : <br>
+ * &bull; the hitbox or bounding box for all objects <br>
+ * &bull; current velocity vector <br>
+ * &bull; quadtree spatial visualization <br>
+ * @augments plugin.Base
+ */
+export class DebugPanelPlugin extends DebugPanelPlugin_base {
+    [x: string]: any;
+    constructor(debugToggle: any);
+    version: string;
+    panel: DebugPanel;
+    /**
+     * show the debug panel
+     */
+    show(): void;
+    /**
+     * hide the debug panel
+     */
+    hide(): void;
+    /**
+     * toggle the debug panel visibility state
+     */
+    toggle(): void;
+}
+import DebugPanel from "./debugPanel";
+export {};

package.json

@@ -38,6 +38,7 @@
   },
   "main": "dist/@melonjs/debug-plugin.js",
   "module": "dist/@melonjs/debug-plugin.js",
+  "types": "dist/index.d.ts",
   "sideEffects": false,
   "files": [
     "dist/@melonjs/debug-plugin.js",
@@ -61,12 +62,14 @@
     "eslint-plugin-jsdoc": "^44.2.2",
     "rollup": "^3.21.6",
     "rollup-plugin-bundle-size": "^1.0.3",
-    "rollup-plugin-string": "^3.0.0"
+    "rollup-plugin-string": "^3.0.0",
+    "typescript": "^5.0.4"
   },
   "scripts": {
-    "build": "npm run lint && rollup -c --silent",
+    "build": "npm run lint && rollup -c --silent && npm run types",
     "lint": "eslint src/**.js rollup.config.mjs",
     "prepublishOnly": "npm run build",
-    "clean": "del-cli --force build/*.*"
+    "clean": "del-cli --force dist/*.*",
+    "types": "tsc"
   }
 }

src/index.js

@@ -1,5 +1,5 @@
 import { utils, plugin } from "melonjs";
-import DebugPanel from "./debugPanel.js";
+import DebugPanel from "./debugPanel";
 
 /**
  * @classdesc

tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compilerOptions": {
+      "target": "es2020",
+      "allowJs": true,
+      "checkJs": false,
+      "skipLibCheck": true,
+      "emitDeclarationOnly": true,
+      "declaration": true,
+      "declarationDir": "dist",
+      "removeComments": false,
+      "strict": true,
+      "noImplicitAny": true,
+      "moduleResolution": "node",
+      "resolveJsonModule": true,
+  },
+  "include": ["src/index.js"],
+  "exclude": ["node_modules"]
+}