chore: Update to support v8

pixijs-userland · Dec 19, 2024 · 5841537 · 5841537
1 parent 500c8fc
commit 5841537
Show file tree

Hide file tree

Showing 8 changed files with 11,022 additions and 19,288 deletions.
diff --git a/.github/workflows/build.yml → .github/workflows/main.yml b/.github/workflows/build.yml → .github/workflows/main.yml
@@ -1,23 +1,21 @@
-name: Build CI
+name: Automation
 on:
   push:
-    branches: [ '**' ]
-    tags: [ '**' ]
+    branches: ['**']
+    tags: ['**']
   release:
-    types: [ 'created' ]
+    types: ['created']
   pull_request:
-    branches: [ '**' ]
+    branches: ['**']
 jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
-    - name: Use Node.js 16.x
-      uses: actions/setup-node@v3
+    - uses: actions/checkout@v4
+    - name: Use Node.js 20.x
+      uses: actions/setup-node@v4
       with:
-        node-version: 16
-    - name: Install npm
-      run: npm install -g npm@8
+        node-version: 20
     - name: Install dependencies
       run: npm ci
     - name: Build

diff --git a/examples/index.html b/examples/index.html
@@ -13,25 +13,34 @@
     </head>
     <body>
         <h1>Rectangle Helpers</h1>
-        <script src="https://pixijs.download/dev/pixi.min.js"></script>
-        <script src="../dist/pixi-rectangle-helpers.js"></script>
-        <script>
-            const app = new PIXI.Application({ background: '#999' });
-            document.body.appendChild(app.view);
-
-            const shape = new PIXI.Sprite(PIXI.Texture.WHITE);
-            shape.scale.set(10);
-            shape.x = (app.screen.width - shape.width) / 2;
-            shape.y = (app.screen.height - shape.height) / 2;
-
-            shape.interactive = true;
-            shape.cursor = 'pointer';
-            shape.onclick = () => {
-                const bounds = shape.getBounds();
-                // Expand the bounds by 10 pixels!
-                Object.assign(shape, bounds.expand(10));
-            };
-            app.stage.addChild(shape);
+        <script type="importmap">
+            {
+                "imports": {
+                    "pixi.js": "https://cdn.jsdelivr.net/npm/pixi.js@8/dist/pixi.mjs",
+                    "@pixi/rectangle-helpers": "../dist/pixi-rectangle-helpers.mjs"
+                }
+            }
+        </script>
+        <script type="module">
+            import { Application, Texture, Sprite, Rectangle } from 'pixi.js';
+            import '@pixi/rectangle-helpers';
+            const app = new Application();
+            await app.init({ background: '#999' });
+            document.body.appendChild(app.canvas);
+            app.stage.addChild(new Sprite({
+                texture: Texture.WHITE,
+                width: 100,
+                height: 100,
+                x: (app.screen.width - 100) / 2,
+                y: (app.screen.height - 100) / 2,
+                eventMode: 'static',
+                cursor: 'pointer',
+                onclick: (event) => {
+                    const { rectangle } = event.target.getBounds();
+                    // Expand the bounds by 10 pixels!
+                    Object.assign(event.target, rectangle.expand(10));
+                }
+            }));
         </script>
     </body>
 </html>
diff --git a/global.d.ts b/global.d.ts
@@ -2,7 +2,7 @@
  * PixiJS uses a special global type object called GlobalMixins
  * this can be used to add methods to existing PixiJS classes.
  */
-declare namespace GlobalMixins {
+declare namespace PixiMixins {
 	interface Rectangle {
 		expand(amount: number): this;
 	}