@eva/plugin-renderer-filter 2.1.0-beta.2 → 2.1.0-beta.4

package/dist/plugin-renderer-filter.cjs.js

@@ -0,0 +1,296 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var eva_js = require('@eva/eva.js');
+var pluginRenderer = require('@eva/plugin-renderer');
+var pixi_js = require('pixi.js');
+
+/**
+ * Filter 组件
+ *
+ * 给挂载它的 GameObject 应用一组 PixiJS 内置 2D 滤镜:Blur / ColorMatrix / Displacement / Noise / Alpha。
+ * 实现层是 PixiJS DisplayObject.filters 数组,FilterSystem 把 spec 实例化为 PixiJS Filter 实例并绑到容器上。
+ *
+ * @example
+ * ```typescript
+ * sprite.addComponent(new Filter({
+ *   filters: [
+ *     { type: "blur", strength: 8 },
+ *     { type: "colorMatrix", preset: "sepia" },
+ *   ],
+ * }));
+ * ```
+ */
+class Filter extends eva_js.Component {
+    constructor() {
+        super(...arguments);
+        this.filters = [];
+        this.filterArea = null;
+    }
+    init(params) {
+        var _a, _b;
+        if (params) {
+            this.filters = (_a = params.filters) !== null && _a !== void 0 ? _a : [];
+            this.filterArea = (_b = params.filterArea) !== null && _b !== void 0 ? _b : null;
+        }
+    }
+}
+Filter.componentName = "Filter";
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+function createBlurFilter(spec) {
+    var _a, _b;
+    const strength = (_a = spec.strength) !== null && _a !== void 0 ? _a : 8;
+    const opts = {
+        strength,
+        quality: (_b = spec.quality) !== null && _b !== void 0 ? _b : 4,
+    };
+    if (spec.blurX != null)
+        opts.strengthX = spec.blurX;
+    if (spec.blurY != null)
+        opts.strengthY = spec.blurY;
+    return new pixi_js.BlurFilter(opts);
+}
+
+function createColorMatrixFilter(spec) {
+    var _a;
+    const cm = new pixi_js.ColorMatrixFilter();
+    if (spec.matrix && spec.matrix.length === 20) {
+        cm.matrix = spec.matrix;
+        return cm;
+    }
+    const arg = (_a = spec.presetArg) !== null && _a !== void 0 ? _a : 1;
+    switch (spec.preset) {
+        case "sepia":
+            cm.sepia(true);
+            break;
+        case "grayscale":
+            cm.greyscale(arg, true);
+            break;
+        case "negative":
+            cm.negative(true);
+            break;
+        case "polaroid":
+            cm.polaroid(true);
+            break;
+        case "vintage":
+            cm.vintage(true);
+            break;
+        case "lsd":
+            cm.lsd(true);
+            break;
+        case "predator":
+            cm.predator(arg, true);
+            break;
+        case "kodachrome":
+            cm.kodachrome(true);
+            break;
+        case "browni":
+            cm.browni(true);
+            break;
+        case "technicolor":
+            cm.technicolor(true);
+            break;
+        case "blackAndWhite":
+            cm.blackAndWhite(true);
+            break;
+        case "tint":
+            cm.tint(arg, true);
+            break;
+        case "saturate":
+            cm.saturate(arg, true);
+            break;
+        case "brightness":
+            cm.brightness(arg, true);
+            break;
+        case "contrast":
+            cm.contrast(arg, true);
+            break;
+        case "hue":
+            cm.hue(arg * 360, true);
+            break;
+        case "night":
+            cm.night(arg, true);
+            break;
+    }
+    return cm;
+}
+
+/**
+ * Build a DisplacementFilter from FilterSpec.
+ * Pulls the displacement texture from the Eva.js resource registry.
+ * If the resource isn't ready yet, returns a no-op filter (caller can later swap).
+ */
+function createDisplacementFilter(spec) {
+    var _a, _b, _c, _d, _e, _f;
+    const scale = { x: (_a = spec.scaleX) !== null && _a !== void 0 ? _a : 20, y: (_b = spec.scaleY) !== null && _b !== void 0 ? _b : 20 };
+    let sprite;
+    if (spec.resource) {
+        const res = (_d = (_c = eva_js.resource).getResource) === null || _d === void 0 ? void 0 : _d.call(_c, spec.resource);
+        const data = (_f = (_e = res === null || res === void 0 ? void 0 : res.data) !== null && _e !== void 0 ? _e : res === null || res === void 0 ? void 0 : res.instance) !== null && _f !== void 0 ? _f : null;
+        const tex = (data === null || data === void 0 ? void 0 : data.texture) instanceof pixi_js.Texture
+            ? data.texture
+            : (data === null || data === void 0 ? void 0 : data.image)
+                ? pixi_js.Texture.from(data.image)
+                : null;
+        sprite = new pixi_js.Sprite(tex !== null && tex !== void 0 ? tex : pixi_js.Texture.EMPTY);
+    }
+    else {
+        sprite = new pixi_js.Sprite(pixi_js.Texture.EMPTY);
+    }
+    return new pixi_js.DisplacementFilter({ sprite, scale });
+}
+
+function createNoiseFilter(spec) {
+    var _a, _b;
+    return new pixi_js.NoiseFilter({
+        noise: (_a = spec.noise) !== null && _a !== void 0 ? _a : 0.5,
+        seed: (_b = spec.seed) !== null && _b !== void 0 ? _b : Math.random(),
+    });
+}
+
+function createAlphaFilter(spec) {
+    var _a;
+    return new pixi_js.AlphaFilter({ alpha: (_a = spec.alpha) !== null && _a !== void 0 ? _a : 1 });
+}
+
+let FilterSystem = class FilterSystem extends pluginRenderer.Renderer {
+    constructor() {
+        super(...arguments);
+        this.name = "FilterSystem";
+        this.bound = new Map();
+        this.elapsed = 0;
+    }
+    init() {
+        this.renderSystem = this.game.getSystem(pluginRenderer.RendererSystem);
+        this.renderSystem.rendererManager.register(this);
+    }
+    rendererUpdate(_gameObject) {
+        // no-op (filters are static; filterArea applied on change only)
+    }
+    componentChanged(changed) {
+        if (changed.componentName !== "Filter")
+            return;
+        const id = changed.gameObject.id;
+        if (changed.type === eva_js.OBSERVER_TYPE.REMOVE) {
+            this.removeFilters(id);
+            return;
+        }
+        // ADD or CHANGE
+        this.applyFilters(changed.gameObject, changed.component);
+    }
+    applyFilters(go, component) {
+        const container = this.containerManager.getContainer(go.id);
+        if (!container)
+            return;
+        // Dispose existing
+        this.disposeBound(go.id);
+        const specs = (component.filters || []).filter((s) => s.enabled !== false);
+        const pixiFilters = specs.map((s) => this.createOne(s)).filter(Boolean);
+        container.filters = pixiFilters;
+        if (component.filterArea) {
+            const fa = component.filterArea;
+            container.filterArea = { x: fa.x, y: fa.y, width: fa.width, height: fa.height };
+        }
+        else {
+            container.filterArea = null;
+        }
+        this.bound.set(go.id, { pixiFilters, specs });
+    }
+    removeFilters(id) {
+        const container = this.containerManager.getContainer(id);
+        if (container) {
+            container.filters = null;
+            container.filterArea = null;
+        }
+        this.disposeBound(id);
+    }
+    disposeBound(id) {
+        var _a, _b;
+        const b = this.bound.get(id);
+        if (!b)
+            return;
+        for (const f of b.pixiFilters) {
+            try {
+                (_b = (_a = f).destroy) === null || _b === void 0 ? void 0 : _b.call(_a);
+            }
+            catch (_c) {
+                /* ignore */
+            }
+        }
+        this.bound.delete(id);
+    }
+    createOne(spec) {
+        switch (spec.type) {
+            case "blur":
+                return createBlurFilter(spec);
+            case "colorMatrix":
+                return createColorMatrixFilter(spec);
+            case "displacement":
+                return createDisplacementFilter(spec);
+            case "noise":
+                return createNoiseFilter(spec);
+            case "alpha":
+                return createAlphaFilter(spec);
+            default:
+                return null;
+        }
+    }
+    update(time) {
+        var _a;
+        // Drain componentObserver so componentChanged fires for ADD/CHANGE/REMOVE.
+        super.update(time);
+        // Animate noise seed for filters with noiseAnimSpeed
+        const dt = ((_a = time === null || time === void 0 ? void 0 : time.deltaTime) !== null && _a !== void 0 ? _a : 16) / 1000;
+        this.elapsed += dt;
+        for (const { pixiFilters, specs } of this.bound.values()) {
+            for (let i = 0; i < specs.length; i++) {
+                const s = specs[i];
+                if (s.type === "noise" && s.noiseAnimSpeed) {
+                    const f = pixiFilters[i];
+                    if (f)
+                        f.seed = (this.elapsed * s.noiseAnimSpeed) % 1;
+                }
+            }
+        }
+    }
+};
+FilterSystem = __decorate([
+    eva_js.decorators.componentObserver({
+        Filter: [
+            { prop: ["filters"], deep: true },
+            { prop: ["filterArea"], deep: true },
+        ],
+    })
+], FilterSystem);
+var FilterSystem$1 = FilterSystem;
+
+exports.Filter = Filter;
+exports.FilterSystem = FilterSystem$1;

package/dist/plugin-renderer-filter.cjs.prod.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@eva/eva.js"),t=require("@eva/plugin-renderer"),r=require("pixi.js");class i extends e.Component{constructor(){super(...arguments),this.filters=[],this.filterArea=null}init(e){var t,r;e&&(this.filters=null!==(t=e.filters)&&void 0!==t?t:[],this.filterArea=null!==(r=e.filterArea)&&void 0!==r?r:null)}}i.componentName="Filter","function"==typeof SuppressedError&&SuppressedError;let n=class extends t.Renderer{constructor(){super(...arguments),this.name="FilterSystem",this.bound=new Map,this.elapsed=0}init(){this.renderSystem=this.game.getSystem(t.RendererSystem),this.renderSystem.rendererManager.register(this)}rendererUpdate(e){}componentChanged(t){if("Filter"!==t.componentName)return;const r=t.gameObject.id;t.type!==e.OBSERVER_TYPE.REMOVE?this.applyFilters(t.gameObject,t.component):this.removeFilters(r)}applyFilters(e,t){const r=this.containerManager.getContainer(e.id);if(!r)return;this.disposeBound(e.id);const i=(t.filters||[]).filter(e=>!1!==e.enabled),n=i.map(e=>this.createOne(e)).filter(Boolean);if(r.filters=n,t.filterArea){const e=t.filterArea;r.filterArea={x:e.x,y:e.y,width:e.width,height:e.height}}else r.filterArea=null;this.bound.set(e.id,{pixiFilters:n,specs:i})}removeFilters(e){const t=this.containerManager.getContainer(e);t&&(t.filters=null,t.filterArea=null),this.disposeBound(e)}disposeBound(e){var t,r;const i=this.bound.get(e);if(i){for(const e of i.pixiFilters)try{null===(r=(t=e).destroy)||void 0===r||r.call(t)}catch(e){}this.bound.delete(e)}}createOne(t){switch(t.type){case"blur":return function(e){var t,i;const n={strength:null!==(t=e.strength)&&void 0!==t?t:8,quality:null!==(i=e.quality)&&void 0!==i?i:4};return null!=e.blurX&&(n.strengthX=e.blurX),null!=e.blurY&&(n.strengthY=e.blurY),new r.BlurFilter(n)}(t);case"colorMatrix":return function(e){var t;const i=new r.ColorMatrixFilter;if(e.matrix&&20===e.matrix.length)return i.matrix=e.matrix,i;const n=null!==(t=e.presetArg)&&void 0!==t?t:1;switch(e.preset){case"sepia":i.sepia(!0);break;case"grayscale":i.greyscale(n,!0);break;case"negative":i.negative(!0);break;case"polaroid":i.polaroid(!0);break;case"vintage":i.vintage(!0);break;case"lsd":i.lsd(!0);break;case"predator":i.predator(n,!0);break;case"kodachrome":i.kodachrome(!0);break;case"browni":i.browni(!0);break;case"technicolor":i.technicolor(!0);break;case"blackAndWhite":i.blackAndWhite(!0);break;case"tint":i.tint(n,!0);break;case"saturate":i.saturate(n,!0);break;case"brightness":i.brightness(n,!0);break;case"contrast":i.contrast(n,!0);break;case"hue":i.hue(360*n,!0);break;case"night":i.night(n,!0)}return i}(t);case"displacement":return function(t){var i,n,s,l,a,o;const c={x:null!==(i=t.scaleX)&&void 0!==i?i:20,y:null!==(n=t.scaleY)&&void 0!==n?n:20};let u;if(t.resource){const i=null===(l=(s=e.resource).getResource)||void 0===l?void 0:l.call(s,t.resource),n=null!==(o=null!==(a=null==i?void 0:i.data)&&void 0!==a?a:null==i?void 0:i.instance)&&void 0!==o?o:null,c=(null==n?void 0:n.texture)instanceof r.Texture?n.texture:(null==n?void 0:n.image)?r.Texture.from(n.image):null;u=new r.Sprite(null!=c?c:r.Texture.EMPTY)}else u=new r.Sprite(r.Texture.EMPTY);return new r.DisplacementFilter({sprite:u,scale:c})}(t);case"noise":return function(e){var t,i;return new r.NoiseFilter({noise:null!==(t=e.noise)&&void 0!==t?t:.5,seed:null!==(i=e.seed)&&void 0!==i?i:Math.random()})}(t);case"alpha":return function(e){var t;return new r.AlphaFilter({alpha:null!==(t=e.alpha)&&void 0!==t?t:1})}(t);default:return null}}update(e){var t;super.update(e);const r=(null!==(t=null==e?void 0:e.deltaTime)&&void 0!==t?t:16)/1e3;this.elapsed+=r;for(const{pixiFilters:e,specs:t}of this.bound.values())for(let r=0;r<t.length;r++){const i=t[r];if("noise"===i.type&&i.noiseAnimSpeed){const t=e[r];t&&(t.seed=this.elapsed*i.noiseAnimSpeed%1)}}}};n=function(e,t,r,i){var n,s=arguments.length,l=s<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,r):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,r,i);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(l=(s<3?n(l):s>3?n(t,r,l):n(t,r))||l);return s>3&&l&&Object.defineProperty(t,r,l),l}([e.decorators.componentObserver({Filter:[{prop:["filters"],deep:!0},{prop:["filterArea"],deep:!0}]})],n);var s=n;exports.Filter=i,exports.FilterSystem=s;

package/dist/plugin-renderer-filter.d.ts

@@ -0,0 +1,85 @@
+import { Component } from '@eva/eva.js';
+import { ComponentChanged } from '@eva/eva.js';
+import { ContainerManager } from '@eva/plugin-renderer';
+import { GameObject } from '@eva/eva.js';
+import { Renderer } from '@eva/plugin-renderer';
+import { RendererSystem } from '@eva/plugin-renderer';
+
+export declare type ColorMatrixPreset = "sepia" | "grayscale" | "negative" | "polaroid" | "vintage" | "lsd" | "predator" | "kodachrome" | "browni" | "technicolor" | "blackAndWhite" | "tint" | "saturate" | "brightness" | "contrast" | "hue" | "night";
+
+/**
+ * Filter 组件
+ *
+ * 给挂载它的 GameObject 应用一组 PixiJS 内置 2D 滤镜:Blur / ColorMatrix / Displacement / Noise / Alpha。
+ * 实现层是 PixiJS DisplayObject.filters 数组,FilterSystem 把 spec 实例化为 PixiJS Filter 实例并绑到容器上。
+ *
+ * @example
+ * ```typescript
+ * sprite.addComponent(new Filter({
+ *   filters: [
+ *     { type: "blur", strength: 8 },
+ *     { type: "colorMatrix", preset: "sepia" },
+ *   ],
+ * }));
+ * ```
+ */
+export declare class Filter extends Component<FilterParams> {
+    static componentName: string;
+    filters: FilterSpec[];
+    filterArea: FilterParams["filterArea"] | null;
+    init(params?: FilterParams): void;
+}
+
+export declare interface FilterParams {
+    filters?: FilterSpec[];
+    filterArea?: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+}
+
+/**
+ * 单条 filter spec — 各类型共用的字段池,只读自己关心的字段。
+ */
+export declare interface FilterSpec {
+    type: FilterType;
+    enabled?: boolean;
+    strength?: number;
+    quality?: number;
+    blurX?: number;
+    blurY?: number;
+    preset?: ColorMatrixPreset;
+    presetArg?: number;
+    matrix?: number[];
+    resource?: string;
+    scaleX?: number;
+    scaleY?: number;
+    noise?: number;
+    seed?: number;
+    noiseAnimSpeed?: number;
+    alpha?: number;
+}
+
+export declare class FilterSystem extends Renderer {
+    name: string;
+    containerManager: ContainerManager;
+    renderSystem: RendererSystem;
+    private bound;
+    private elapsed;
+    init(): void;
+    rendererUpdate(_gameObject: GameObject): void;
+    componentChanged(changed: ComponentChanged): void;
+    private applyFilters;
+    private removeFilters;
+    private disposeBound;
+    private createOne;
+    update(time?: {
+        deltaTime: number;
+    }): void;
+}
+
+export declare type FilterType = "blur" | "colorMatrix" | "displacement" | "noise" | "alpha";
+
+export { }

package/dist/plugin-renderer-filter.esm.js

@@ -0,0 +1,291 @@
+import { Component, resource, OBSERVER_TYPE, decorators } from '@eva/eva.js';
+import { Renderer, RendererSystem } from '@eva/plugin-renderer';
+import { BlurFilter, ColorMatrixFilter, Texture, Sprite, DisplacementFilter, NoiseFilter, AlphaFilter } from 'pixi.js';
+
+/**
+ * Filter 组件
+ *
+ * 给挂载它的 GameObject 应用一组 PixiJS 内置 2D 滤镜:Blur / ColorMatrix / Displacement / Noise / Alpha。
+ * 实现层是 PixiJS DisplayObject.filters 数组,FilterSystem 把 spec 实例化为 PixiJS Filter 实例并绑到容器上。
+ *
+ * @example
+ * ```typescript
+ * sprite.addComponent(new Filter({
+ *   filters: [
+ *     { type: "blur", strength: 8 },
+ *     { type: "colorMatrix", preset: "sepia" },
+ *   ],
+ * }));
+ * ```
+ */
+class Filter extends Component {
+    constructor() {
+        super(...arguments);
+        this.filters = [];
+        this.filterArea = null;
+    }
+    init(params) {
+        var _a, _b;
+        if (params) {
+            this.filters = (_a = params.filters) !== null && _a !== void 0 ? _a : [];
+            this.filterArea = (_b = params.filterArea) !== null && _b !== void 0 ? _b : null;
+        }
+    }
+}
+Filter.componentName = "Filter";
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+function createBlurFilter(spec) {
+    var _a, _b;
+    const strength = (_a = spec.strength) !== null && _a !== void 0 ? _a : 8;
+    const opts = {
+        strength,
+        quality: (_b = spec.quality) !== null && _b !== void 0 ? _b : 4,
+    };
+    if (spec.blurX != null)
+        opts.strengthX = spec.blurX;
+    if (spec.blurY != null)
+        opts.strengthY = spec.blurY;
+    return new BlurFilter(opts);
+}
+
+function createColorMatrixFilter(spec) {
+    var _a;
+    const cm = new ColorMatrixFilter();
+    if (spec.matrix && spec.matrix.length === 20) {
+        cm.matrix = spec.matrix;
+        return cm;
+    }
+    const arg = (_a = spec.presetArg) !== null && _a !== void 0 ? _a : 1;
+    switch (spec.preset) {
+        case "sepia":
+            cm.sepia(true);
+            break;
+        case "grayscale":
+            cm.greyscale(arg, true);
+            break;
+        case "negative":
+            cm.negative(true);
+            break;
+        case "polaroid":
+            cm.polaroid(true);
+            break;
+        case "vintage":
+            cm.vintage(true);
+            break;
+        case "lsd":
+            cm.lsd(true);
+            break;
+        case "predator":
+            cm.predator(arg, true);
+            break;
+        case "kodachrome":
+            cm.kodachrome(true);
+            break;
+        case "browni":
+            cm.browni(true);
+            break;
+        case "technicolor":
+            cm.technicolor(true);
+            break;
+        case "blackAndWhite":
+            cm.blackAndWhite(true);
+            break;
+        case "tint":
+            cm.tint(arg, true);
+            break;
+        case "saturate":
+            cm.saturate(arg, true);
+            break;
+        case "brightness":
+            cm.brightness(arg, true);
+            break;
+        case "contrast":
+            cm.contrast(arg, true);
+            break;
+        case "hue":
+            cm.hue(arg * 360, true);
+            break;
+        case "night":
+            cm.night(arg, true);
+            break;
+    }
+    return cm;
+}
+
+/**
+ * Build a DisplacementFilter from FilterSpec.
+ * Pulls the displacement texture from the Eva.js resource registry.
+ * If the resource isn't ready yet, returns a no-op filter (caller can later swap).
+ */
+function createDisplacementFilter(spec) {
+    var _a, _b, _c, _d, _e, _f;
+    const scale = { x: (_a = spec.scaleX) !== null && _a !== void 0 ? _a : 20, y: (_b = spec.scaleY) !== null && _b !== void 0 ? _b : 20 };
+    let sprite;
+    if (spec.resource) {
+        const res = (_d = (_c = resource).getResource) === null || _d === void 0 ? void 0 : _d.call(_c, spec.resource);
+        const data = (_f = (_e = res === null || res === void 0 ? void 0 : res.data) !== null && _e !== void 0 ? _e : res === null || res === void 0 ? void 0 : res.instance) !== null && _f !== void 0 ? _f : null;
+        const tex = (data === null || data === void 0 ? void 0 : data.texture) instanceof Texture
+            ? data.texture
+            : (data === null || data === void 0 ? void 0 : data.image)
+                ? Texture.from(data.image)
+                : null;
+        sprite = new Sprite(tex !== null && tex !== void 0 ? tex : Texture.EMPTY);
+    }
+    else {
+        sprite = new Sprite(Texture.EMPTY);
+    }
+    return new DisplacementFilter({ sprite, scale });
+}
+
+function createNoiseFilter(spec) {
+    var _a, _b;
+    return new NoiseFilter({
+        noise: (_a = spec.noise) !== null && _a !== void 0 ? _a : 0.5,
+        seed: (_b = spec.seed) !== null && _b !== void 0 ? _b : Math.random(),
+    });
+}
+
+function createAlphaFilter(spec) {
+    var _a;
+    return new AlphaFilter({ alpha: (_a = spec.alpha) !== null && _a !== void 0 ? _a : 1 });
+}
+
+let FilterSystem = class FilterSystem extends Renderer {
+    constructor() {
+        super(...arguments);
+        this.name = "FilterSystem";
+        this.bound = new Map();
+        this.elapsed = 0;
+    }
+    init() {
+        this.renderSystem = this.game.getSystem(RendererSystem);
+        this.renderSystem.rendererManager.register(this);
+    }
+    rendererUpdate(_gameObject) {
+        // no-op (filters are static; filterArea applied on change only)
+    }
+    componentChanged(changed) {
+        if (changed.componentName !== "Filter")
+            return;
+        const id = changed.gameObject.id;
+        if (changed.type === OBSERVER_TYPE.REMOVE) {
+            this.removeFilters(id);
+            return;
+        }
+        // ADD or CHANGE
+        this.applyFilters(changed.gameObject, changed.component);
+    }
+    applyFilters(go, component) {
+        const container = this.containerManager.getContainer(go.id);
+        if (!container)
+            return;
+        // Dispose existing
+        this.disposeBound(go.id);
+        const specs = (component.filters || []).filter((s) => s.enabled !== false);
+        const pixiFilters = specs.map((s) => this.createOne(s)).filter(Boolean);
+        container.filters = pixiFilters;
+        if (component.filterArea) {
+            const fa = component.filterArea;
+            container.filterArea = { x: fa.x, y: fa.y, width: fa.width, height: fa.height };
+        }
+        else {
+            container.filterArea = null;
+        }
+        this.bound.set(go.id, { pixiFilters, specs });
+    }
+    removeFilters(id) {
+        const container = this.containerManager.getContainer(id);
+        if (container) {
+            container.filters = null;
+            container.filterArea = null;
+        }
+        this.disposeBound(id);
+    }
+    disposeBound(id) {
+        var _a, _b;
+        const b = this.bound.get(id);
+        if (!b)
+            return;
+        for (const f of b.pixiFilters) {
+            try {
+                (_b = (_a = f).destroy) === null || _b === void 0 ? void 0 : _b.call(_a);
+            }
+            catch (_c) {
+                /* ignore */
+            }
+        }
+        this.bound.delete(id);
+    }
+    createOne(spec) {
+        switch (spec.type) {
+            case "blur":
+                return createBlurFilter(spec);
+            case "colorMatrix":
+                return createColorMatrixFilter(spec);
+            case "displacement":
+                return createDisplacementFilter(spec);
+            case "noise":
+                return createNoiseFilter(spec);
+            case "alpha":
+                return createAlphaFilter(spec);
+            default:
+                return null;
+        }
+    }
+    update(time) {
+        var _a;
+        // Drain componentObserver so componentChanged fires for ADD/CHANGE/REMOVE.
+        super.update(time);
+        // Animate noise seed for filters with noiseAnimSpeed
+        const dt = ((_a = time === null || time === void 0 ? void 0 : time.deltaTime) !== null && _a !== void 0 ? _a : 16) / 1000;
+        this.elapsed += dt;
+        for (const { pixiFilters, specs } of this.bound.values()) {
+            for (let i = 0; i < specs.length; i++) {
+                const s = specs[i];
+                if (s.type === "noise" && s.noiseAnimSpeed) {
+                    const f = pixiFilters[i];
+                    if (f)
+                        f.seed = (this.elapsed * s.noiseAnimSpeed) % 1;
+                }
+            }
+        }
+    }
+};
+FilterSystem = __decorate([
+    decorators.componentObserver({
+        Filter: [
+            { prop: ["filters"], deep: true },
+            { prop: ["filterArea"], deep: true },
+        ],
+    })
+], FilterSystem);
+var FilterSystem$1 = FilterSystem;
+
+export { Filter, FilterSystem$1 as FilterSystem };

package/index.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./dist/plugin-renderer-filter.cjs.prod.js');
+} else {
+  module.exports = require('./dist/plugin-renderer-filter.cjs.js');
+}

package/package.json

@@ -1,21 +1,22 @@
 {
   "name": "@eva/plugin-renderer-filter",
-  "version": "2.1.0-beta.2",
+  "version": "2.1.0-beta.4",
   "description": "@eva/plugin-renderer-filter — wraps PixiJS built-in 2D filters (Blur/ColorMatrix/Displacement/Noise/Alpha) as Eva.js components.",
-  "main": "lib/index.ts",
-  "module": "lib/index.ts",
-  "types": "lib/index.ts",
+  "main": "index.js",
+  "module": "dist/plugin-renderer-filter.esm.js",
+  "types": "dist/plugin-renderer-filter.d.ts",
   "files": [
-    "lib"
+    "index.js",
+    "dist"
   ],
   "keywords": [
     "eva.js"
   ],
   "license": "MIT",
   "dependencies": {
-    "@eva/eva.js": "2.1.0-beta.2",
+    "@eva/eva.js": "2.1.0-beta.4",
     "@eva/inspector-decorator": "^2.0.0-beta.0",
-    "@eva/plugin-renderer": "2.1.0-beta.2",
+    "@eva/plugin-renderer": "2.1.0-beta.4",
     "pixi.js": "^8.17.0"
   }
 }

package/lib/component.ts

@@ -1,89 +0,0 @@
-import { Component } from "@eva/eva.js";
-
-export type FilterType = "blur" | "colorMatrix" | "displacement" | "noise" | "alpha";
-
-export type ColorMatrixPreset =
-	| "sepia"
-	| "grayscale"
-	| "negative"
-	| "polaroid"
-	| "vintage"
-	| "lsd"
-	| "predator"
-	| "kodachrome"
-	| "browni"
-	| "technicolor"
-	| "blackAndWhite"
-	| "tint"
-	| "saturate"
-	| "brightness"
-	| "contrast"
-	| "hue"
-	| "night";
-
-/**
- * 单条 filter spec — 各类型共用的字段池,只读自己关心的字段。
- */
-export interface FilterSpec {
-	type: FilterType;
-	enabled?: boolean;
-
-	// BlurFilter
-	strength?: number;
-	quality?: number;
-	blurX?: number;
-	blurY?: number;
-
-	// ColorMatrixFilter
-	preset?: ColorMatrixPreset;
-	presetArg?: number;
-	matrix?: number[];
-
-	// DisplacementFilter
-	resource?: string;
-	scaleX?: number;
-	scaleY?: number;
-
-	// NoiseFilter
-	noise?: number;
-	seed?: number;
-	noiseAnimSpeed?: number;
-
-	// AlphaFilter
-	alpha?: number;
-}
-
-export interface FilterParams {
-	filters?: FilterSpec[];
-	filterArea?: { x: number; y: number; width: number; height: number };
-}
-
-/**
- * Filter 组件
- *
- * 给挂载它的 GameObject 应用一组 PixiJS 内置 2D 滤镜:Blur / ColorMatrix / Displacement / Noise / Alpha。
- * 实现层是 PixiJS DisplayObject.filters 数组,FilterSystem 把 spec 实例化为 PixiJS Filter 实例并绑到容器上。
- *
- * @example
- * ```typescript
- * sprite.addComponent(new Filter({
- *   filters: [
- *     { type: "blur", strength: 8 },
- *     { type: "colorMatrix", preset: "sepia" },
- *   ],
- * }));
- * ```
- */
-export default class Filter extends Component<FilterParams> {
-	static componentName: string = "Filter";
-
-	filters: FilterSpec[] = [];
-	filterArea: FilterParams["filterArea"] | null = null;
-
-	init(params?: FilterParams) {
-		if (params) {
-			this.filters = params.filters ?? [];
-			this.filterArea = params.filterArea ?? null;
-		}
-	}
-}

package/lib/filters/alpha.ts

@@ -1,6 +0,0 @@
-import { AlphaFilter } from "pixi.js";
-import type { FilterSpec } from "../component";
-
-export function createAlphaFilter(spec: FilterSpec): AlphaFilter {
-	return new AlphaFilter({ alpha: spec.alpha ?? 1 } as any);
-}

package/lib/filters/blur.ts

@@ -1,13 +0,0 @@
-import { BlurFilter } from "pixi.js";
-import type { FilterSpec } from "../component";
-
-export function createBlurFilter(spec: FilterSpec): BlurFilter {
-	const strength = spec.strength ?? 8;
-	const opts: any = {
-		strength,
-		quality: spec.quality ?? 4,
-	};
-	if (spec.blurX != null) opts.strengthX = spec.blurX;
-	if (spec.blurY != null) opts.strengthY = spec.blurY;
-	return new BlurFilter(opts);
-}

package/lib/filters/colorMatrix.ts

@@ -1,31 +0,0 @@
-import { ColorMatrixFilter } from "pixi.js";
-import type { FilterSpec } from "../component";
-
-export function createColorMatrixFilter(spec: FilterSpec): ColorMatrixFilter {
-	const cm = new ColorMatrixFilter();
-	if (spec.matrix && spec.matrix.length === 20) {
-		(cm as any).matrix = spec.matrix as any;
-		return cm;
-	}
-	const arg = spec.presetArg ?? 1;
-	switch (spec.preset) {
-		case "sepia": (cm as any).sepia(true); break;
-		case "grayscale": (cm as any).greyscale(arg, true); break;
-		case "negative": (cm as any).negative(true); break;
-		case "polaroid": (cm as any).polaroid(true); break;
-		case "vintage": (cm as any).vintage(true); break;
-		case "lsd": (cm as any).lsd(true); break;
-		case "predator": (cm as any).predator(arg, true); break;
-		case "kodachrome": (cm as any).kodachrome(true); break;
-		case "browni": (cm as any).browni(true); break;
-		case "technicolor": (cm as any).technicolor(true); break;
-		case "blackAndWhite": (cm as any).blackAndWhite(true); break;
-		case "tint": (cm as any).tint(arg, true); break;
-		case "saturate": (cm as any).saturate(arg, true); break;
-		case "brightness": (cm as any).brightness(arg, true); break;
-		case "contrast": (cm as any).contrast(arg, true); break;
-		case "hue": (cm as any).hue(arg * 360, true); break;
-		case "night": (cm as any).night(arg, true); break;
-	}
-	return cm;
-}

package/lib/filters/displacement.ts

@@ -1,27 +0,0 @@
-import { DisplacementFilter, Sprite, Texture } from "pixi.js";
-import { resource } from "@eva/eva.js";
-import type { FilterSpec } from "../component";
-
-/**
- * Build a DisplacementFilter from FilterSpec.
- * Pulls the displacement texture from the Eva.js resource registry.
- * If the resource isn't ready yet, returns a no-op filter (caller can later swap).
- */
-export function createDisplacementFilter(spec: FilterSpec): DisplacementFilter {
-	const scale = { x: spec.scaleX ?? 20, y: spec.scaleY ?? 20 };
-	let sprite: Sprite;
-	if (spec.resource) {
-		const res = (resource as any).getResource?.(spec.resource);
-		const data = res?.data ?? res?.instance ?? null;
-		const tex: Texture | null =
-			data?.texture instanceof Texture
-				? data.texture
-				: data?.image
-					? Texture.from(data.image)
-					: null;
-		sprite = new Sprite(tex ?? Texture.EMPTY);
-	} else {
-		sprite = new Sprite(Texture.EMPTY);
-	}
-	return new DisplacementFilter({ sprite, scale });
-}

package/lib/filters/noise.ts

@@ -1,9 +0,0 @@
-import { NoiseFilter } from "pixi.js";
-import type { FilterSpec } from "../component";
-
-export function createNoiseFilter(spec: FilterSpec): NoiseFilter {
-	return new NoiseFilter({
-		noise: spec.noise ?? 0.5,
-		seed: spec.seed ?? Math.random(),
-	} as any);
-}

package/lib/index.ts

@@ -1,3 +0,0 @@
-export { default as Filter } from "./component";
-export { default as FilterSystem } from "./system";
-export type { FilterParams, FilterSpec, FilterType, ColorMatrixPreset } from "./component";

package/lib/system.ts

@@ -1,137 +0,0 @@
-import {
-	GameObject,
-	decorators,
-	ComponentChanged,
-	OBSERVER_TYPE,
-} from "@eva/eva.js";
-import { ContainerManager, RendererSystem, Renderer } from "@eva/plugin-renderer";
-import type { Filter as PIXIFilter, Rectangle } from "pixi.js";
-import FilterComponent, { FilterSpec } from "./component";
-import { createBlurFilter } from "./filters/blur";
-import { createColorMatrixFilter } from "./filters/colorMatrix";
-import { createDisplacementFilter } from "./filters/displacement";
-import { createNoiseFilter } from "./filters/noise";
-import { createAlphaFilter } from "./filters/alpha";
-
-interface BoundFilter {
-	pixiFilters: PIXIFilter[];
-	specs: FilterSpec[];
-}
-
-@decorators.componentObserver({
-	Filter: [
-		{ prop: ["filters"], deep: true },
-		{ prop: ["filterArea"], deep: true },
-	],
-})
-export default class FilterSystem extends Renderer {
-	name: string = "FilterSystem";
-	containerManager: ContainerManager;
-	renderSystem: RendererSystem;
-
-	private bound: Map<number, BoundFilter> = new Map();
-	private elapsed = 0;
-
-	init() {
-		this.renderSystem = this.game.getSystem(RendererSystem) as RendererSystem;
-		this.renderSystem.rendererManager.register(this);
-	}
-
-	rendererUpdate(_gameObject: GameObject) {
-		// no-op (filters are static; filterArea applied on change only)
-	}
-
-	componentChanged(changed: ComponentChanged) {
-		if (changed.componentName !== "Filter") return;
-		const id = changed.gameObject.id;
-
-		if (changed.type === OBSERVER_TYPE.REMOVE) {
-			this.removeFilters(id);
-			return;
-		}
-
-		// ADD or CHANGE
-		this.applyFilters(changed.gameObject, changed.component as FilterComponent);
-	}
-
-	private applyFilters(go: GameObject, component: FilterComponent) {
-		const container = this.containerManager.getContainer(go.id);
-		if (!container) return;
-
-		// Dispose existing
-		this.disposeBound(go.id);
-
-		const specs: FilterSpec[] = (component.filters || []).filter(
-			(s) => s.enabled !== false,
-		);
-		const pixiFilters = specs.map((s) => this.createOne(s)).filter(Boolean) as PIXIFilter[];
-
-		(container as any).filters = pixiFilters;
-
-		if (component.filterArea) {
-			const fa = component.filterArea;
-			(container as any).filterArea = { x: fa.x, y: fa.y, width: fa.width, height: fa.height } as Rectangle;
-		} else {
-			(container as any).filterArea = null;
-		}
-
-		this.bound.set(go.id, { pixiFilters, specs });
-	}
-
-	private removeFilters(id: number) {
-		const container = this.containerManager.getContainer(id);
-		if (container) {
-			(container as any).filters = null;
-			(container as any).filterArea = null;
-		}
-		this.disposeBound(id);
-	}
-
-	private disposeBound(id: number) {
-		const b = this.bound.get(id);
-		if (!b) return;
-		for (const f of b.pixiFilters) {
-			try {
-				(f as any).destroy?.();
-			} catch {
-				/* ignore */
-			}
-		}
-		this.bound.delete(id);
-	}
-
-	private createOne(spec: FilterSpec): PIXIFilter | null {
-		switch (spec.type) {
-			case "blur":
-				return createBlurFilter(spec) as unknown as PIXIFilter;
-			case "colorMatrix":
-				return createColorMatrixFilter(spec) as unknown as PIXIFilter;
-			case "displacement":
-				return createDisplacementFilter(spec) as unknown as PIXIFilter;
-			case "noise":
-				return createNoiseFilter(spec) as unknown as PIXIFilter;
-			case "alpha":
-				return createAlphaFilter(spec) as unknown as PIXIFilter;
-			default:
-				return null;
-		}
-	}
-
-	update(time?: { deltaTime: number }) {
-		// Drain componentObserver so componentChanged fires for ADD/CHANGE/REMOVE.
-		super.update(time as any);
-
-		// Animate noise seed for filters with noiseAnimSpeed
-		const dt = (time?.deltaTime ?? 16) / 1000;
-		this.elapsed += dt;
-		for (const { pixiFilters, specs } of this.bound.values()) {
-			for (let i = 0; i < specs.length; i++) {
-				const s = specs[i];
-				if (s.type === "noise" && s.noiseAnimSpeed) {
-					const f = pixiFilters[i] as any;
-					if (f) f.seed = (this.elapsed * s.noiseAnimSpeed) % 1;
-				}
-			}
-		}
-	}
-}