Typescript - DropshadowFilter does not overlap with PIXI.Filter

[win-chen]

Hi there, I'm using Typescript in my project and I'm running into the error:

Conversion of type 'DropShadowFilter' to type 'Filter' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first.
  Type 'DropShadowFilter' is missing the following properties from type 'Filter': antialias, _state, blendRequired, gpuProgram, and 18 more.ts(2352)

Reproduce with:

import * as PIXI from "pixi.js";
import { DropShadowFilter } from '@pixi/filter-drop-shadow';

const dropshadow = new DropShadowFilter({
  distance: 2, 
  blur: 5, 
  color: 0
});

function concatFilter(obj: PIXI.Sprite, filter: PIXI.Filter) {
    obj.filters = [(obj.filters || [])].flat().concat(filter);
}

const sprite = new PIXI.Sprite();

concatFilter(sprite, dropshadow) // <-- error

Dependency versions: "@pixi/filter-drop-shadow": "^5.2.0", "pixi.js": "^8.0.4",

[bigtimebuddy]

You should use the pixi-filters package @ v6 and import the filter "pixi-filters/drop-shadow". All the @pixi/filter-* are v7 only.