Chore: Convert systems into extensions (pixijs#8423)

packages/canvas-renderer/src/CanvasContextSystem.ts

@@ -1,7 +1,7 @@
 import { Matrix } from '@pixi/math';
 
 import type { CanvasRenderer } from './CanvasRenderer';
-import type { ISystem } from '@pixi/core';
+import { ExtensionMetadata, ExtensionType, ISystem } from '@pixi/core';
 import { mapCanvasBlendModesToPixi } from './utils/mapCanvasBlendModesToPixi';
 import { BLEND_MODES, SCALE_MODES } from '@pixi/constants';
 import { settings } from '@pixi/settings';
@@ -38,6 +38,12 @@ export type SmoothingEnabledProperties =
  */
 export class CanvasContextSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type:  ExtensionType.CanvasRendererSystem,
+        name: 'canvasContext',
+    };
+
     /** A reference to the current renderer */
     private renderer: CanvasRenderer;
 

packages/canvas-renderer/src/CanvasMaskSystem.ts

@@ -2,7 +2,7 @@ import { Polygon, SHAPES } from '@pixi/math';
 
 import type { CanvasRenderer } from './CanvasRenderer';
 import type { Graphics } from '@pixi/graphics';
-import type { ISystem, MaskData } from '@pixi/core';
+import { ExtensionMetadata, ExtensionType, ISystem, MaskData } from '@pixi/core';
 import type { Container } from '@pixi/display';
 
 /**
@@ -14,6 +14,12 @@ import type { Container } from '@pixi/display';
  */
 export class CanvasMaskSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type:  ExtensionType.CanvasRendererSystem,
+        name: 'mask',
+    };
+
     /** A reference to the current renderer */
     private renderer: CanvasRenderer;
     private _foundShapes: Array<Graphics> = [];

packages/canvas-renderer/src/CanvasObjectRendererSystem.ts

@@ -1,7 +1,14 @@
 import { Matrix } from '@pixi/math';
 
 import type { CanvasRenderer } from './CanvasRenderer';
-import { BaseRenderTexture, CanvasResource, IRendererRenderOptions, ISystem, RenderTexture } from '@pixi/core';
+import {
+    BaseRenderTexture,
+    CanvasResource,
+    ExtensionMetadata,
+    ExtensionType,
+    IRendererRenderOptions,
+    ISystem,
+    RenderTexture } from '@pixi/core';
 import { BLEND_MODES } from '@pixi/constants';
 import { CanvasRenderTarget, hex2string, rgb2hex } from '@pixi/utils';
 import { DisplayObject } from 'pixi.js';
@@ -14,6 +21,12 @@ import { CrossPlatformCanvasRenderingContext2D } from './CanvasContextSystem';
  */
 export class CanvasObjectRendererSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type:  ExtensionType.CanvasRendererSystem,
+        name: 'objectRenderer',
+    };
+
     /** A reference to the current renderer */
     private renderer: CanvasRenderer;
     renderingToScreen: boolean;

packages/canvas-renderer/src/CanvasRenderer.ts

@@ -165,19 +165,7 @@ export class CanvasRenderer extends SystemManager<CanvasRenderer> implements IRe
 
         const systemConfig = {
             runners: ['init', 'destroy', 'contextChange', 'reset', 'update', 'postrender', 'prerender', 'resize'],
-            systems: {
-                // systems shared by all renderers..
-                textureGenerator: GenerateTextureSystem,
-                background: BackgroundSystem,
-                _view: ViewSystem,
-                _plugin: PluginSystem,
-                startup: StartupSystem,
-
-                // canvas systems..
-                mask: CanvasMaskSystem,
-                canvasContext: CanvasContextSystem,
-                objectRenderer: CanvasObjectRendererSystem,
-            }
+            systems: CanvasRenderer.__systems,
         };
 
         this.setup(systemConfig);
@@ -558,7 +546,11 @@ export class CanvasRenderer extends SystemManager<CanvasRenderer> implements IRe
         return false;
     }
 
-    static __plugins: IRendererPlugins = {};
+    /** @private */
+    static readonly __plugins: IRendererPlugins = {};
+
+    /** @private */
+    static readonly __systems: Record<string, any> = {};
 
     /**
      * Collection of installed plugins. These are included by default in PIXI, but can be excluded
@@ -578,3 +570,14 @@ extensions.handle(
     (extension) => { CanvasRenderer.__plugins[extension.name] = extension.ref; },
     (extension) => { delete CanvasRenderer.__plugins[extension.name]; }
 );
+extensions.handle(
+    ExtensionType.CanvasRendererSystem,
+    (extension) => { CanvasRenderer.__systems[extension.name] = extension.ref; },
+    (extension) => { delete CanvasRenderer.__systems[extension.name]; }
+);
+
+extensions.add(
+    CanvasMaskSystem,
+    CanvasContextSystem,
+    CanvasObjectRendererSystem
+);

packages/core/src/Renderer.ts

@@ -318,35 +318,7 @@ export class Renderer extends SystemManager<Renderer> implements IRenderer
 
         const systemConfig = {
             runners: ['init', 'destroy', 'contextChange', 'reset', 'update', 'postrender', 'prerender', 'resize'],
-            systems: {
-                // systems shared by all renderers..
-                textureGenerator: GenerateTextureSystem,
-                background: BackgroundSystem,
-                _view: ViewSystem,
-                _plugin: PluginSystem,
-                startup: StartupSystem,
-
-                // low level WebGL systems
-                context: ContextSystem,
-                state: StateSystem,
-                shader: ShaderSystem,
-                texture: TextureSystem,
-                buffer: BufferSystem,
-                geometry: GeometrySystem,
-                framebuffer: FramebufferSystem,
-
-                // high level pixi specific rendering
-                mask: MaskSystem,
-                scissor: ScissorSystem,
-                stencil: StencilSystem,
-                projection: ProjectionSystem,
-                textureGC: TextureGCSystem,
-                filter: FilterSystem,
-                renderTexture: RenderTextureSystem,
-                batch: BatchSystem,
-                objectRenderer: ObjectRendererSystem,
-                _multisample: MultisampleSystem,
-            }
+            systems: Renderer.__systems,
         };
 
         this.setup(systemConfig);
@@ -647,16 +619,15 @@ export class Renderer extends SystemManager<Renderer> implements IRenderer
      * Collection of installed plugins. These are included by default in PIXI, but can be excluded
      * by creating a custom build. Consult the README for more information about creating custom
      * builds and excluding plugins.
-     * @readonly
-     * @property {PIXI.AccessibilityManager} accessibility Support tabbing interactive elements.
-     * @property {PIXI.Extract} extract Extract image data from renderer.
-     * @property {PIXI.InteractionManager} interaction Handles mouse, touch and pointer events.
-     * @property {PIXI.ParticleRenderer} particle Renderer for ParticleContainer objects.
-     * @property {PIXI.Prepare} prepare Pre-render display objects.
-     * @property {PIXI.BatchRenderer} batch Batching of Sprite, Graphics and Mesh objects.
-     * @property {PIXI.TilingSpriteRenderer} tilingSprite Renderer for TilingSprite objects.
-     */
-    static __plugins: IRendererPlugins = {};
+     * @private
+     */
+    static readonly __plugins: IRendererPlugins = {};
+
+    /**
+     * The collection of installed systems.
+     * @private
+     */
+    static readonly __systems: Record<string, any> = {};
 }
 
 // Handle registration of extensions
@@ -665,3 +636,35 @@ extensions.handle(
     (extension) => { Renderer.__plugins[extension.name] = extension.ref; },
     (extension) => { delete Renderer.__plugins[extension.name]; }
 );
+extensions.handle(
+    ExtensionType.RendererSystem,
+    (extension) => { Renderer.__systems[extension.name] = extension.ref; },
+    (extension) => { delete Renderer.__systems[extension.name]; }
+);
+
+extensions.add(
+    GenerateTextureSystem,
+    BackgroundSystem,
+    ViewSystem,
+    PluginSystem,
+    StartupSystem,
+    // low level WebGL systems
+    ContextSystem,
+    StateSystem,
+    ShaderSystem,
+    TextureSystem,
+    BufferSystem,
+    GeometrySystem,
+    FramebufferSystem,
+    // high level pixi specific rendering
+    MaskSystem,
+    ScissorSystem,
+    StencilSystem,
+    ProjectionSystem,
+    TextureGCSystem,
+    FilterSystem,
+    RenderTextureSystem,
+    BatchSystem,
+    ObjectRendererSystem,
+    MultisampleSystem
+);

packages/core/src/background/BackgroundSystem.ts

@@ -1,4 +1,5 @@
 import { hex2rgb, hex2string } from '@pixi/utils';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 import { ISystem } from '../system/ISystem';
 
 export interface BackgroundOptions
@@ -17,6 +18,15 @@ export interface BackgroundOptions
  */
 export class BackgroundSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: [
+            ExtensionType.RendererSystem,
+            ExtensionType.CanvasRendererSystem
+        ],
+        name: 'background',
+    };
+
     /**
      * This sets if the CanvasRenderer will clear the canvas or not before the new render pass.
      * If the scene is NOT transparent PixiJS will use a canvas sized fillRect operation every

packages/core/src/batch/BatchSystem.ts

@@ -4,13 +4,20 @@ import type { ISystem } from '../system/ISystem';
 import type { Renderer } from '../Renderer';
 import type { BaseTexture } from '../textures/BaseTexture';
 import type { BatchTextureArray } from './BatchTextureArray';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 /**
  * System plugin to the renderer to manage batching.
  * @memberof PIXI
  */
 export class BatchSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'batch',
+    };
+
     /** An empty renderer. */
     public readonly emptyRenderer: ObjectRenderer;
 

packages/core/src/context/ContextSystem.ts

@@ -5,6 +5,7 @@ import type { ISystem } from '../system/ISystem';
 import type { Renderer } from '../Renderer';
 import type { WebGLExtensions } from './WebGLExtensions';
 import { IRenderingContext } from '../IRenderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 let CONTEXT_UID_COUNTER = 0;
 
@@ -33,6 +34,12 @@ export interface ContextOptions
  */
 export class ContextSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'context',
+    };
+
     /**
      * Either 1 or 2 to reflect the WebGL version being used.
      * @readonly

packages/core/src/extensions.ts

@@ -10,7 +10,9 @@ enum ExtensionType
 // eslint-disable-next-line @typescript-eslint/indent
 {
     Application = 'application',
+    RendererSystem = 'renderer-webgl-system',
     RendererPlugin = 'renderer-webgl-plugin',
+    CanvasRendererSystem = 'renderer-canvas-system',
     CanvasRendererPlugin = 'renderer-canvas-plugin',
     Loader = 'loader',
 }

packages/core/src/filters/FilterSystem.ts

@@ -12,6 +12,7 @@ import type { IFilterTarget } from './IFilterTarget';
 import type { ISpriteMaskTarget } from './spriteMask/SpriteMaskFilter';
 import type { RenderTexture } from '../renderTexture/RenderTexture';
 import type { Renderer } from '../Renderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 const tempPoints = [new Point(), new Point(), new Point(), new Point()];
 const tempMatrix = new Matrix();
@@ -43,6 +44,12 @@ const tempMatrix = new Matrix();
  */
 export class FilterSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'filter',
+    };
+
     /**
      * List of filters for the FilterSystem
      * @member {object[]}

packages/core/src/framebuffer/FramebufferSystem.ts

@@ -7,6 +7,7 @@ import { GLFramebuffer } from './GLFramebuffer';
 import type { ISystem } from '../system/ISystem';
 import type { Renderer } from '../Renderer';
 import { IRenderingContext } from '../IRenderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 const tempRectangle = new Rectangle();
 
@@ -16,6 +17,12 @@ const tempRectangle = new Rectangle();
  */
 export class FramebufferSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'framebuffer',
+    };
+
     /** A list of managed framebuffers. */
     public readonly managedFramebuffers: Array<Framebuffer>;
     public current: Framebuffer;

packages/core/src/framebuffer/MultisampleSystem.ts

@@ -2,13 +2,20 @@ import { MSAA_QUALITY } from '@pixi/constants';
 import { ISystem } from '../system/ISystem';
 import { Renderer } from '../Renderer';
 import { IRenderingContext } from '../IRenderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 /**
  * System that manages the multisample property on the WebGL renderer
  * @memberof PIXI
  */
 export class MultisampleSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: '_multisample',
+    };
+
     /**
      * The number of msaa samples of the canvas.
      * @readonly

packages/core/src/geometry/BufferSystem.ts

@@ -4,6 +4,7 @@ import type { Renderer } from '../Renderer';
 import type { Buffer } from './Buffer';
 import type { ISystem } from '../system/ISystem';
 import { IRenderingContext } from '../IRenderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 /**
  * System plugin to the renderer to manage buffers.
@@ -24,6 +25,12 @@ import { IRenderingContext } from '../IRenderer';
  */
 export class BufferSystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'buffer',
+    };
+
     CONTEXT_UID: number;
     gl: IRenderingContext;
 

packages/core/src/geometry/GeometrySystem.ts

@@ -10,6 +10,7 @@ import type { Shader } from '../shader/Shader';
 import type { Program } from '../shader/Program';
 import type { Dict } from '@pixi/utils';
 import { IRenderingContext } from '../IRenderer';
+import { ExtensionMetadata, ExtensionType } from '../extensions';
 
 const byteSizeMap: {[key: number]: number} = { 5126: 4, 5123: 2, 5121: 1 };
 
@@ -19,6 +20,12 @@ const byteSizeMap: {[key: number]: number} = { 5126: 4, 5123: 2, 5121: 1 };
  */
 export class GeometrySystem implements ISystem
 {
+    /** @ignore */
+    static extension: ExtensionMetadata = {
+        type: ExtensionType.RendererSystem,
+        name: 'geometry',
+    };
+
     /**
      * `true` if we has `*_vertex_array_object` extension.
      * @readonly