Merge branch 'dev' into next

packages/canvas-particle-container/src/ParticleContainer.ts

@@ -1,5 +1,4 @@
 import { ParticleContainer } from '@pixi/particle-container';
-import type { Sprite } from '@pixi/sprite';
 import type { CanvasRenderer } from '@pixi/canvas-renderer';
 
 /**
@@ -34,7 +33,7 @@ ParticleContainer.prototype.renderCanvas = function renderCanvas(renderer: Canva
 
     for (let i = 0; i < this.children.length; ++i)
     {
-        const child = this.children[i] as Sprite;
+        const child = this.children[i];
 
         if (!child.visible)
         {

packages/display/src/Container.ts

@@ -53,13 +53,13 @@ export interface Container extends GlobalMixins.Container, DisplayObject {}
  * ```
  * @memberof PIXI
  */
-export class Container extends DisplayObject
+export class Container<T extends DisplayObject = DisplayObject> extends DisplayObject
 {
     /**
      * The array of children of this container.
      * @readonly
      */
-    public readonly children: DisplayObject[];
+    public readonly children: T[];
 
     /**
      * If set to true, the container will sort its children by zIndex value
@@ -128,7 +128,7 @@ export class Container extends DisplayObject
      * @param {...PIXI.DisplayObject} children - The DisplayObject(s) to add to the container
      * @returns {PIXI.DisplayObject} - The first child that was added.
      */
-    addChild<T extends DisplayObject[]>(...children: T): T[0]
+    addChild<U extends T[]>(...children: U): U[0]
     {
         // if there is only one argument we can bypass looping through the them
         if (children.length > 1)
@@ -176,7 +176,7 @@ export class Container extends DisplayObject
      * @param {number} index - The index to place the child in
      * @returns {PIXI.DisplayObject} The child that was added.
      */
-    addChildAt<T extends DisplayObject>(child: T, index: number): T
+    addChildAt<U extends T>(child: U, index: number): U
     {
         if (index < 0 || index > this.children.length)
         {
@@ -212,7 +212,7 @@ export class Container extends DisplayObject
      * @param child - First display object to swap
      * @param child2 - Second display object to swap
      */
-    swapChildren(child: DisplayObject, child2: DisplayObject): void
+    swapChildren(child: T, child2: T): void
     {
         if (child === child2)
         {
@@ -232,7 +232,7 @@ export class Container extends DisplayObject
      * @param child - The DisplayObject instance to identify
      * @returns - The index position of the child display object to identify
      */
-    getChildIndex(child: DisplayObject): number
+    getChildIndex(child: T): number
     {
         const index = this.children.indexOf(child);
 
@@ -249,7 +249,7 @@ export class Container extends DisplayObject
      * @param child - The child DisplayObject instance for which you want to change the index number
      * @param index - The resulting index number for the child display object
      */
-    setChildIndex(child: DisplayObject, index: number): void
+    setChildIndex(child: T, index: number): void
     {
         if (index < 0 || index >= this.children.length)
         {
@@ -269,7 +269,7 @@ export class Container extends DisplayObject
      * @param index - The index to get the child at
      * @returns - The child at the given index, if any.
      */
-    getChildAt(index: number): DisplayObject
+    getChildAt(index: number): T
     {
         if (index < 0 || index >= this.children.length)
         {
@@ -284,7 +284,7 @@ export class Container extends DisplayObject
      * @param {...PIXI.DisplayObject} children - The DisplayObject(s) to remove
      * @returns {PIXI.DisplayObject} The first child that was removed.
      */
-    removeChild<T extends DisplayObject[]>(...children: T): T[0]
+    removeChild<U extends T[]>(...children: U): U[0]
     {
         // if there is only one argument we can bypass looping through the them
         if (children.length > 1)
@@ -324,7 +324,7 @@ export class Container extends DisplayObject
      * @param index - The index to get the child from
      * @returns The child that was removed.
      */
-    removeChildAt(index: number): DisplayObject
+    removeChildAt(index: number): T
     {
         const child = this.getChildAt(index);
 
@@ -350,7 +350,7 @@ export class Container extends DisplayObject
      * @param endIndex - The ending position. Default value is size of the container.
      * @returns - List of removed children
      */
-    removeChildren(beginIndex = 0, endIndex = this.children.length): DisplayObject[]
+    removeChildren(beginIndex = 0, endIndex = this.children.length): T[]
     {
         const begin = beginIndex;
         const end = endIndex;

packages/mixin-get-child-by-name/global.d.ts

@@ -7,6 +7,9 @@ declare namespace GlobalMixins
 
     interface Container
     {
-        getChildByName(name: string, isRecursive?: boolean): import('@pixi/display').DisplayObject;
+        getChildByName<T extends import('@pixi/display').DisplayObject = import('@pixi/display').DisplayObject>(
+            name: string,
+            deep?: boolean,
+        ): T;
     }
 }

packages/mixin-get-child-by-name/src/index.ts

@@ -17,7 +17,10 @@ DisplayObject.prototype.name = null;
  * @param {boolean}[deep=false] - Whether to search recursively
  * @returns {PIXI.DisplayObject} The child with the specified name.
  */
-Container.prototype.getChildByName = function getChildByName(name: string, deep?: boolean): DisplayObject
+Container.prototype.getChildByName = function getChildByName<T extends DisplayObject = DisplayObject>(
+    name: string,
+    deep?: boolean,
+): T
 {
     for (let i = 0, j = this.children.length; i < j; i++)
     {
@@ -38,7 +41,7 @@ Container.prototype.getChildByName = function getChildByName(name: string, deep?
                 continue;
             }
 
-            const target = (this.children[i] as Container).getChildByName(name, true);
+            const target = child.getChildByName<T>(name, true);
 
             if (target)
             {

packages/particle-container/package.json

@@ -42,6 +42,7 @@
     "@pixi/core": "6.4.2",
     "@pixi/display": "6.4.2",
     "@pixi/math": "6.4.2",
+    "@pixi/sprite": "6.4.2",
     "@pixi/utils": "6.4.2"
   }
 }

packages/particle-container/src/ParticleBuffer.ts

@@ -2,7 +2,7 @@ import { createIndicesForQuads } from '@pixi/utils';
 import { Geometry, Buffer } from '@pixi/core';
 import { TYPES } from '@pixi/constants';
 
-import type { DisplayObject } from '@pixi/display';
+import type { Sprite } from '@pixi/sprite';
 import type { IParticleRendererProperty } from './ParticleRenderer';
 
 /*
@@ -185,7 +185,7 @@ export class ParticleBuffer
      * @param startIndex - The index to start at.
      * @param amount - The number to upload.
      */
-    uploadDynamic(children: DisplayObject[], startIndex: number, amount: number): void
+    uploadDynamic(children: Sprite[], startIndex: number, amount: number): void
     {
         for (let i = 0; i < this.dynamicProperties.length; i++)
         {
@@ -205,7 +205,7 @@ export class ParticleBuffer
      * @param startIndex - The index to start at.
      * @param amount - The number to upload.
      */
-    uploadStatic(children: DisplayObject[], startIndex: number, amount: number): void
+    uploadStatic(children: Sprite[], startIndex: number, amount: number): void
     {
         for (let i = 0; i < this.staticProperties.length; i++)
         {

packages/particle-container/src/ParticleContainer.ts

@@ -5,6 +5,7 @@ import { hex2rgb } from '@pixi/utils';
 import type { BaseTexture, Renderer } from '@pixi/core';
 import type { ParticleBuffer } from './ParticleBuffer';
 import type { IDestroyOptions } from '@pixi/display';
+import type { Sprite } from '@pixi/sprite';
 
 export interface IParticleProperties
 {
@@ -41,7 +42,7 @@ export interface IParticleProperties
  * And here you have a hundred sprites that will be rendered at the speed of light.
  * @memberof PIXI
  */
-export class ParticleContainer extends Container
+export class ParticleContainer extends Container<Sprite>
 {
     /**
      * The blend mode to be applied to the sprite. Apply a value of `PIXI.BLEND_MODES.NORMAL`
@@ -208,7 +209,7 @@ export class ParticleContainer extends Container
 
         if (!this.baseTexture)
         {
-            this.baseTexture = (this.children[0] as any)._texture.baseTexture;
+            this.baseTexture = this.children[0]._texture.baseTexture;
             if (!this.baseTexture.valid)
             {
                 this.baseTexture.once('update', () => this.onChildrenChange(0));

packages/particle-container/src/ParticleRenderer.ts

@@ -6,9 +6,9 @@ import { ParticleBuffer } from './ParticleBuffer';
 import fragment from './particles.frag';
 import vertex from './particles.vert';
 
-import type { DisplayObject } from '@pixi/display';
 import type { ParticleContainer } from './ParticleContainer';
 import type { Renderer, ExtensionMetadata } from '@pixi/core';
+import type { Sprite } from '@pixi/sprite';
 
 export interface IParticleRendererProperty
 {
@@ -141,10 +141,11 @@ export class ParticleRenderer extends ObjectRenderer
             buffers = container._buffers = this.generateBuffers(container);
         }
 
-        const baseTexture = (children[0] as any)._texture.baseTexture;
+        const baseTexture = children[0]._texture.baseTexture;
+        const premultiplied = baseTexture.alphaMode > 0;
 
         // if the uvs have not updated then no point rendering just yet!
-        this.state.blendMode = correctBlendMode(container.blendMode, baseTexture.alphaMode);
+        this.state.blendMode = correctBlendMode(container.blendMode, premultiplied);
         renderer.state.set(this.state);
 
         const gl = renderer.gl;
@@ -156,7 +157,7 @@ export class ParticleRenderer extends ObjectRenderer
         this.shader.uniforms.translationMatrix = m.toArray(true);
 
         this.shader.uniforms.uColor = premultiplyRgba(container.tintRgb,
-            container.worldAlpha, this.shader.uniforms.uColor, baseTexture.alphaMode);
+            container.worldAlpha, this.shader.uniforms.uColor, premultiplied);
 
         this.shader.uniforms.uSampler = baseTexture;
 
@@ -235,15 +236,15 @@ export class ParticleRenderer extends ObjectRenderer
 
     /**
      * Uploads the vertices.
-     * @param children - the array of display objects to render
+     * @param children - the array of sprites to render
      * @param startIndex - the index to start from in the children array
      * @param amount - the amount of children that will have their vertices uploaded
      * @param array - The vertices to upload.
      * @param stride - Stride to use for iteration.
      * @param offset - Offset to start at.
      */
     public uploadVertices(
-        children: DisplayObject[], startIndex: number, amount: number,
+        children: Sprite[], startIndex: number, amount: number,
         array: number[], stride: number, offset: number
     ): void
     {
@@ -254,7 +255,7 @@ export class ParticleRenderer extends ObjectRenderer
 
         for (let i = 0; i < amount; ++i)
         {
-            const sprite: any = children[startIndex + i];
+            const sprite = children[startIndex + i];
             const texture = sprite._texture;
             const sx = sprite.scale.x;
             const sy = sprite.scale.y;
@@ -298,15 +299,15 @@ export class ParticleRenderer extends ObjectRenderer
 
     /**
      * Uploads the position.
-     * @param children - the array of display objects to render
+     * @param children - the array of sprites to render
      * @param startIndex - the index to start from in the children array
      * @param amount - the amount of children that will have their positions uploaded
      * @param array - The vertices to upload.
      * @param stride - Stride to use for iteration.
      * @param offset - Offset to start at.
      */
     public uploadPosition(
-        children: DisplayObject[], startIndex: number, amount: number,
+        children: Sprite[], startIndex: number, amount: number,
         array: number[], stride: number, offset: number
     ): void
     {
@@ -332,15 +333,15 @@ export class ParticleRenderer extends ObjectRenderer
 
     /**
      * Uploads the rotation.
-     * @param children - the array of display objects to render
+     * @param children - the array of sprites to render
      * @param startIndex - the index to start from in the children array
      * @param amount - the amount of children that will have their rotation uploaded
      * @param array - The vertices to upload.
      * @param stride - Stride to use for iteration.
      * @param offset - Offset to start at.
      */
     public uploadRotation(
-        children: DisplayObject[], startIndex: number, amount: number,
+        children: Sprite[], startIndex: number, amount: number,
         array: number[], stride: number, offset: number
     ): void
     {
@@ -359,21 +360,21 @@ export class ParticleRenderer extends ObjectRenderer
 
     /**
      * Uploads the UVs.
-     * @param children - the array of display objects to render
+     * @param children - the array of sprites to render
      * @param startIndex - the index to start from in the children array
      * @param amount - the amount of children that will have their rotation uploaded
      * @param array - The vertices to upload.
      * @param stride - Stride to use for iteration.
      * @param offset - Offset to start at.
      */
     public uploadUvs(
-        children: DisplayObject[], startIndex: number, amount: number,
+        children: Sprite[], startIndex: number, amount: number,
         array: number[], stride: number, offset: number
     ): void
     {
         for (let i = 0; i < amount; ++i)
         {
-            const textureUvs = (children[startIndex + i] as any)._texture._uvs;
+            const textureUvs = children[startIndex + i]._texture._uvs;
 
             if (textureUvs)
             {
@@ -413,21 +414,21 @@ export class ParticleRenderer extends ObjectRenderer
 
     /**
      * Uploads the tint.
-     * @param children - the array of display objects to render
+     * @param children - the array of sprites to render
      * @param startIndex - the index to start from in the children array
      * @param amount - the amount of children that will have their rotation uploaded
      * @param array - The vertices to upload.
      * @param stride - Stride to use for iteration.
      * @param offset - Offset to start at.
      */
     public uploadTint(
-        children: DisplayObject[], startIndex: number, amount: number,
+        children: Sprite[], startIndex: number, amount: number,
         array: number[], stride: number, offset: number
     ): void
     {
         for (let i = 0; i < amount; ++i)
         {
-            const sprite: any = children[startIndex + i];
+            const sprite = children[startIndex + i];
             const premultiplied = sprite._texture.baseTexture.alphaMode > 0;
             const alpha = sprite.alpha;
 

packages/sprite-tiling/src/TilingSpriteRenderer.ts

@@ -97,6 +97,7 @@ export class TilingSpriteRenderer extends ObjectRenderer
 
         const tex = ts._texture;
         const baseTex = tex.baseTexture;
+        const premultiplied = baseTex.alphaMode > 0;
         const lt = ts.tileTransform.localTransform;
         const uv = ts.uvMatrix;
         let isSimple = baseTex.isPowerOfTwo
@@ -152,14 +153,14 @@ export class TilingSpriteRenderer extends ObjectRenderer
 
         shader.uniforms.uTransform = tempMat.toArray(true);
         shader.uniforms.uColor = premultiplyTintToRgba(ts.tint, ts.worldAlpha,
-            shader.uniforms.uColor, baseTex.alphaMode as any);
+            shader.uniforms.uColor, premultiplied);
         shader.uniforms.translationMatrix = ts.transform.worldTransform.toArray(true);
         shader.uniforms.uSampler = tex;
 
         renderer.shader.bind(shader);
         renderer.geometry.bind(quad);
 
-        this.state.blendMode = correctBlendMode(ts.blendMode, baseTex.alphaMode as any);
+        this.state.blendMode = correctBlendMode(ts.blendMode, premultiplied);
         renderer.state.set(this.state);
         renderer.geometry.draw(this.renderer.gl.TRIANGLES, 6, 0);
     }