diff --git a/.npmrc b/.npmrc
index 581701ce..3cec49d6 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1 +1,2 @@
-package-manager-strict=false
\ No newline at end of file
+package-manager-strict=false
+link-workspace-packages=true
\ No newline at end of file
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 00000000..7a73a41b
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,2 @@
+{
+}
\ No newline at end of file
diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts
index 42e55821..82264300 100644
--- a/docs/.vitepress/config.ts
+++ b/docs/.vitepress/config.ts
@@ -78,7 +78,7 @@ const themeConfig: DefaultTheme.Config = {
           { text: 'NineSlicePlane', link: '/guide/elements/nine-slice-plane' },
           { text: 'ParticleContainer', link: '/guide/elements/particle-container' },
           { text: 'SimplePlane', link: '/guide/elements/simple-plane' },
-          { text: 'SimpleRope', link: '/guide/elements/simple-rope' },
+          { text: 'MeshRope', link: '/guide/elements/mesh-rope' },
           { text: 'Sprite', link: '/guide/elements/sprite' },
           { text: 'Text', link: '/guide/elements/text' },
           { text: 'TilingSprite', link: '/guide/elements/tiling-sprite' },
diff --git a/docs/.vitepress/theme/components/Markdown/ApiDrawMode.md b/docs/.vitepress/theme/components/Markdown/ApiDrawMode.md
index b30dbdfb..885e8965 100644
--- a/docs/.vitepress/theme/components/Markdown/ApiDrawMode.md
+++ b/docs/.vitepress/theme/components/Markdown/ApiDrawMode.md
@@ -1 +1 @@
-^[number] [DRAW_MODES](https://pixijs.download/release/docs/PIXI.html#DRAW_MODES)
\ No newline at end of file
+^[number] [Topology](https://pixijs.download/release/docs/PIXI.html#Topology)
\ No newline at end of file
diff --git a/docs/guide/api-reference/renderer.md b/docs/guide/api-reference/renderer.md
index 4cfe8f39..704ae704 100644
--- a/docs/guide/api-reference/renderer.md
+++ b/docs/guide/api-reference/renderer.md
@@ -14,7 +14,7 @@ Currently, the following PixiJS objects are supported out of the box:
 - [SimplePlane](http://pixijs.download/release/docs/PIXI.SimplePlane.html)
 - [TilingSprite](http://pixijs.download/release/docs/PIXI.TilingSprite.html)
 - [NineSlicePlane](http://pixijs.download/release/docs/PIXI.NineSlicePlane.html)
-- [SimpleRope](http://pixijs.download/release/docs/PIXI.SimpleRope.html)
+- [MeshRope](http://pixijs.download/release/docs/PIXI.MeshRope.html)
 - [Mesh](http://pixijs.download/release/docs/PIXI.AnimatedSprite.html)
 - [BlurFilter](https://pixijs.download/release/docs/PIXI.BlurFilter.html)
 - [AlphaFilter](https://pixijs.download/release/docs/PIXI.AlphaFilter.html)
diff --git a/docs/guide/elements/demo/simple-rope.vue b/docs/guide/elements/demo/mesh-rope.vue
similarity index 97%
rename from docs/guide/elements/demo/simple-rope.vue
rename to docs/guide/elements/demo/mesh-rope.vue
index ea0687dd..052584b9 100644
--- a/docs/guide/elements/demo/simple-rope.vue
+++ b/docs/guide/elements/demo/mesh-rope.vue
@@ -20,7 +20,7 @@ onTick(() => {
 </script>
 
 <template>
-  <simple-rope
+  <mesh-rope
     texture="/assets/snake.png"
     :x="20"
     :y="120"
diff --git a/docs/guide/elements/simple-rope.md b/docs/guide/elements/mesh-rope.md
similarity index 58%
rename from docs/guide/elements/simple-rope.md
rename to docs/guide/elements/mesh-rope.md
index 82246bd3..9b1aef4c 100644
--- a/docs/guide/elements/simple-rope.md
+++ b/docs/guide/elements/mesh-rope.md
@@ -1,26 +1,26 @@
-# SimpleRope
+# MeshRope
 
-Creates a [SimpleRope](https://pixijs.download/release/docs/PIXI.SimpleRope.html)
+Creates a [MeshRope](https://pixijs.download/release/docs/PIXI.MeshRope.html)
 
 The rope allows you to draw a texture across several points and then manipulate these points
 
-<demo src="./demo/simple-rope.vue" :width="400" />
+<demo src="./demo/mesh-rope.vue" :width="400" />
 
 ## API
 
-### SimpleRope Attributes
+### MeshRope Attributes
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| texture | ^[string] ^[object]`PIXI.Texture` | `undefined` | The texture to use on the SimpleRope. |
+| texture | ^[string] ^[object]`PIXI.Texture` | `undefined` | The texture to use on the MeshRope. |
 | points | ^[Array<object>]`PIXI.IPoint[]` | `undefined` | An array of points or point-like objects to construct this rope. |
 
-> more props in [Container Props](/guide/elements/container#container-props) and [PIXI.SimpleRope](https://pixijs.download/release/docs/PIXI.SimpleRope.html)
+> more props in [Container Props](/guide/elements/container#container-props) and [PIXI.MeshRope](https://pixijs.download/release/docs/PIXI.MeshRope.html)
 
-### SimpleRope Events
+### MeshRope Events
 
 | Name | Type | Description |
 | --- | --- | --- |
-| render | ^[function]`(el: SimpleRope): void` | custom render function |
+| render | ^[function]`(el: MeshRope): void` | custom render function |
 
 > more events in [Container Events](/guide/elements/container#container-events)
\ No newline at end of file
diff --git a/docs/guide/elements/mesh.md b/docs/guide/elements/mesh.md
index f9b58ee4..f63edaa0 100644
--- a/docs/guide/elements/mesh.md
+++ b/docs/guide/elements/mesh.md
@@ -19,7 +19,7 @@ Pretty much all WebGL can be broken down into the following:
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
 | blend-mode | <api-blend-mode /> | `BLEND_MODES.NORMAL` | The blend mode to be applied to the sprite. |
-| draw-mode | <api-draw-mode /> | `DRAW_MODES.TRIANGLES` | The draw mode to be used. |
+| draw-mode | <api-draw-mode /> | `Topology` | The draw mode to be used. |
 | geometry | ^[object]`PIXI.Geometry` | `undefined` | The geometry the mesh will use. |
 
 > more props in [Container Props](/guide/elements/container#container-props) and [PIXI.Mesh](https://pixijs.download/release/docs/PIXI.Mesh.html)
diff --git a/docs/guide/elements/nine-slice-plane.md b/docs/guide/elements/nine-slice-plane.md
index 244f4f31..b13bf5e8 100644
--- a/docs/guide/elements/nine-slice-plane.md
+++ b/docs/guide/elements/nine-slice-plane.md
@@ -13,7 +13,7 @@ Allows you to stretch a texture using 9-slice scaling. The corners will remain u
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
 | blend-mode | <api-blend-mode /> | `BLEND_MODES.NORMAL` | The blend mode to be applied to the sprite. |
-| draw-mode | <api-draw-mode /> | `DRAW_MODES.TRIANGLES` | The draw mode to be used. |
+| draw-mode | <api-draw-mode /> | `Topology` | The draw mode to be used. |
 | texture | ^[string] ^[object]`PIXI.Texture` | `undefined` | The texture to use on the NineSlicePlane. |
 | left-width | ^[number] | `undefined` | The width of the left column of the grid |
 | right-width | ^[number] | `undefined` | The width of the right column of the grid |
diff --git a/docs/guide/elements/simple-plane.md b/docs/guide/elements/simple-plane.md
index bf9087d8..a928ace1 100644
--- a/docs/guide/elements/simple-plane.md
+++ b/docs/guide/elements/simple-plane.md
@@ -12,7 +12,7 @@ The SimplePlane allows you to draw a texture across several points and then mani
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| draw-mode | <api-draw-mode /> | `DRAW_MODES.TRIANGLES` | The draw mode to be used. |
+| draw-mode | <api-draw-mode /> | `Topology` | The draw mode to be used. |
 | texture | ^[string] ^[object]`PIXI.Texture` | `undefined` | The texture to use on the NineSlicePlane. |
 | geometry | ^[object]`PIXI.Geometry` | `undefined` | The geometry to use on the SimplePlane. |
 | vertices | ^[number]`number` | `10` | The number of vertices in the axis |
diff --git a/docs/package.json b/docs/package.json
index d5833901..cace7f0d 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -17,7 +17,7 @@
     "gsap": "^3.12.5",
     "naive-ui": "^2.38.2",
     "nanoid": "^4.0.2",
-    "pixi.js": "^7.4.2",
+    "pixi.js": "^8.2.5",
     "unocss": "^0.60.0",
     "vue": "^3.4.27",
     "vue3-pixi": "workspace:^"
diff --git a/packages/vue3-pixi-nuxt/package.json b/packages/vue3-pixi-nuxt/package.json
index 55577eab..3805b18a 100644
--- a/packages/vue3-pixi-nuxt/package.json
+++ b/packages/vue3-pixi-nuxt/package.json
@@ -35,14 +35,16 @@
   "dependencies": {
     "@antfu/utils": "^0.7.8",
     "@nuxt/kit": "^3.11.2",
+    "@xmldom/xmldom": "^0.8.10",
     "mlly": "^1.7.0",
+    "nuxi": "^3.12.0",
     "pkg-types": "^1.1.1",
     "sirv": "^2.0.4",
     "vue-demi": "^0.14.8",
-    "vue3-pixi": "latest"
+    "vue3-pixi": "workspace:1.0.0"
   },
   "devDependencies": {
-    "@nuxt/module-builder": "^0.7.0",
+    "@nuxt/module-builder": "^0.7.1",
     "@nuxt/schema": "^3.11.2",
     "@vue/runtime-core": "^3.4.27",
     "nuxt": "^3.11.2"
diff --git a/packages/vue3-pixi-nuxt/playground/nuxt.config.ts b/packages/vue3-pixi-nuxt/playground/nuxt.config.ts
new file mode 100644
index 00000000..afc610f8
--- /dev/null
+++ b/packages/vue3-pixi-nuxt/playground/nuxt.config.ts
@@ -0,0 +1,6 @@
+import { defineNuxtConfig } from 'nuxt/config'
+
+export default defineNuxtConfig({
+  devtools: { enabled: true },
+  modules: ['vue3-pixi-nuxt'],
+})
diff --git a/packages/vue3-pixi-nuxt/playground/pages/index.vue b/packages/vue3-pixi-nuxt/playground/pages/index.vue
new file mode 100644
index 00000000..bdb00775
--- /dev/null
+++ b/packages/vue3-pixi-nuxt/playground/pages/index.vue
@@ -0,0 +1,10 @@
+<script setup>
+</script>
+
+<template>
+  <Application :width="800" :height="600">
+    <text :anchor="0.5" :x="120" :y="120" :style="{ fill: 'white' }">
+      Hello NuxtJS World
+    </text>
+  </Application>
+</template>
diff --git a/packages/vue3-pixi-ui/package.json b/packages/vue3-pixi-ui/package.json
index 5b23e7fd..8d0e8531 100644
--- a/packages/vue3-pixi-ui/package.json
+++ b/packages/vue3-pixi-ui/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@pixi/ui": "^0.10.5",
-    "pixi.js": "^7.4.2",
+    "pixi.js": "^8.2.5",
     "vue-demi": "^0.14.8",
     "vue3-pixi": "workspace:^"
   },
diff --git a/packages/vue3-pixi/README.md b/packages/vue3-pixi/README.md
index 3f2eacba..b7067688 100644
--- a/packages/vue3-pixi/README.md
+++ b/packages/vue3-pixi/README.md
@@ -107,7 +107,7 @@ The Vue Plugin detects any texture props containing the path to an image and rep
 - [SimplePlane](http://pixijs.download/release/docs/PIXI.SimplePlane.html)
 - [TilingSprite](http://pixijs.download/release/docs/PIXI.TilingSprite.html)
 - [NineSlicePlane](http://pixijs.download/release/docs/PIXI.NineSlicePlane.html)
-- [SimpleRope](http://pixijs.download/release/docs/PIXI.SimpleRope.html)
+- [MeshRope](http://pixijs.download/release/docs/PIXI.MeshRope.html)
 - [Mesh](http://pixijs.download/release/docs/PIXI.AnimatedSprite.html)
 
 ## Props
diff --git a/packages/vue3-pixi/package.json b/packages/vue3-pixi/package.json
index 53733a0f..94f380d8 100644
--- a/packages/vue3-pixi/package.json
+++ b/packages/vue3-pixi/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vue3-pixi",
   "type": "module",
-  "version": "0.9.3",
+  "version": "1.0.0",
   "description": "Vue createRenderer for PixiJS",
   "license": "MIT",
   "homepage": "https://github.com/hairyf/vue3-pixi#readme",
@@ -61,7 +61,8 @@
     "@antfu/utils": "^0.7.8",
     "@vueuse/core": "^10.10.0",
     "nanoid": "^4.0.2",
-    "pixi.js": "^7.4.2",
+    "pixi-filters": "^6.0.4",
+    "pixi.js": "^8.2.5",
     "vue-demi": "^0.14.8"
   },
   "devDependencies": {
diff --git a/packages/vue3-pixi/src/compiler.ts b/packages/vue3-pixi/src/compiler.ts
index 3bb9118e..4d2dbb92 100644
--- a/packages/vue3-pixi/src/compiler.ts
+++ b/packages/vue3-pixi/src/compiler.ts
@@ -8,15 +8,14 @@ const elementNames = [
   'animated-sprite',
   'mesh',
   'simple-plane',
-  'nine-slice-plane',
-  'simple-rope',
+  'nine-slice-sprite',
+  'mesh-rope',
 
   'filter',
   'blur-filter',
   'alpha-filter',
   'displacement-filter',
   'color-matrix-filter',
-  'f-x-a-a-filter',
 ]
 
 const prefix = 'pixi-'
diff --git a/packages/vue3-pixi/src/components/application/index.ts b/packages/vue3-pixi/src/components/application/index.ts
index c0e76981..02cf5c9a 100644
--- a/packages/vue3-pixi/src/components/application/index.ts
+++ b/packages/vue3-pixi/src/components/application/index.ts
@@ -1,8 +1,7 @@
 /* eslint-disable vue/one-component-per-file */
-import { defineComponent, getCurrentInstance, h, markRaw, onMounted, onUnmounted, ref, renderSlot, warn, watch } from 'vue-demi'
-import { throttle } from '@antfu/utils'
+import { defineComponent, getCurrentInstance, h, markRaw, onMounted, onUnmounted, ref, renderSlot } from 'vue-demi'
 import { Application as _Application } from 'pixi.js'
-import type { ColorSource, Container } from 'pixi.js'
+import type { ColorSource, Container, GpuPowerPreference } from 'pixi.js'
 import type { App, PropType } from 'vue-demi'
 import { createApp } from '../../renderer'
 import { appInjectKey } from '../../composables'
@@ -15,60 +14,51 @@ export interface ApplicationInst {
 
 export const Application = defineComponent({
   props: {
-    antialias: { type: Boolean, default: true },
-    autoDensity: { type: Boolean, default: true },
+    antialias: { type: Boolean, default: undefined },
+    autoDensity: { type: Boolean, default: undefined },
     autoStart: { type: Boolean, default: true },
-    background: [Number, String, Array] as PropType<ColorSource>,
-    backgroundColor: [Number, String, Array] as PropType<ColorSource>,
+    alpha: { type: Boolean, default: undefined },
+    backgroundColor: [Number, String, Array, Object] as PropType<ColorSource>,
     backgroundAlpha: { type: Number, default: 1 },
-    clearBeforeRender: { type: Boolean, default: true },
-    forceCanvas: Boolean,
-    alpha: Number,
-    depth: Boolean,
-    desynchronized: Boolean,
-    failIfMajorPerformanceCaveat: Boolean,
-    powerPreference: String as PropType<WebGLPowerPreference>,
-    premultipliedAlpha: Boolean,
-    preserveDrawingBuffer: Boolean,
-    stencil: { type: Boolean, default: true },
-    width: Number,
-    height: Number,
-    resolution: Number,
+    clearBeforeRender: { type: Boolean, default: undefined },
+    hello: { type: Boolean, default: undefined },
+    textureGCActive: { type: Boolean, default: undefined },
+    textureGCAMaxIdle: { type: Number, default: undefined },
+    textureGCCheckCountMax: { type: Number, default: undefined },
+    bezierSmoothness: { type: Number, default: undefined },
+    premultipliedAlpha: { type: Boolean, default: undefined },
+    preserveDrawingBuffer: { type: Boolean, default: undefined },
+    forceFallbackAdapter: { type: Boolean, default: undefined },
+    depth: { type: Boolean, default: undefined },
+    failIfMajorPerformanceCaveat: { type: Boolean, default: undefined },
+    powerPreference: { type: String as PropType<GpuPowerPreference>, default: undefined },
     resizeTo: Object as PropType<HTMLElement | Window | undefined>,
+    roundPixels: { type: Boolean, default: undefined },
+    useBackBuffer: { type: Boolean, default: undefined },
+    width: { type: Number, default: undefined },
+    height: { type: Number, default: undefined },
+    resolution: { type: Number, default: 1 },
+
+    // @TODO: Add webgl/webgpu
   },
   setup(props, { slots, expose }) {
     const { appContext } = getCurrentInstance()!
     const canvas = ref<HTMLCanvasElement>()
-    const pixiApp = ref()
+    const pixiApp = ref<_Application>()
 
     let app: App<Container> | undefined
 
-    function mount() {
-      const context = canvas.value?.getContext('webgl', {
-        alpha: props.alpha,
-        antialias: props.antialias,
-        depth: props.depth,
-        desynchronized: props.desynchronized,
-        failIfMajorPerformanceCaveat: props.failIfMajorPerformanceCaveat,
-        powerPreference: props.powerPreference,
-        premultipliedAlpha: props.premultipliedAlpha,
-        preserveDrawingBuffer: props.preserveDrawingBuffer,
-        stencil: props.stencil,
-      })
-
-      if (!context)
-        warn('could not crate webgl context')
+    async function mount() {
+      const inst = new _Application()
+      await inst.init({ canvas: canvas.value, ...props })
 
-      const inst = new _Application({ view: canvas.value, ...props })
       pixiApp.value = markRaw(inst)
 
-      app = createApp({
-        render: () => renderSlot(slots, 'default'),
-      })
+      app = createApp({ render: () => renderSlot(slots, 'default') })
 
       inheritParent(app, appContext)
 
-      app.provide(appInjectKey, pixiApp)
+      app.provide(appInjectKey, pixiApp.value)
       app.mount(pixiApp.value.stage)
     }
     function unmount() {
@@ -78,18 +68,6 @@ export const Application = defineComponent({
       pixiApp.value?.destroy()
       pixiApp.value = undefined
     }
-    function resize() {
-      if (!pixiApp.value)
-        return
-      const width = props.width || pixiApp.value.renderer.width
-      const height = props.height || pixiApp.value.renderer.height
-      pixiApp.value.renderer.resize(width, height)
-    }
-
-    watch(
-      () => [props.width, props.height],
-      throttle(50, resize),
-    )
     onMounted(mount)
     onUnmounted(unmount)
 
diff --git a/packages/vue3-pixi/src/components/external/index.ts b/packages/vue3-pixi/src/components/external/index.ts
index 399c73ab..009fe6c6 100644
--- a/packages/vue3-pixi/src/components/external/index.ts
+++ b/packages/vue3-pixi/src/components/external/index.ts
@@ -15,7 +15,7 @@ export const External = defineComponent({
     const pixiApp = ref(inject(appInjectKey)!)
     const childApp = ref<App>()
 
-    const root = props.root || pixiApp.value.view.parentNode as HTMLElement
+    const root = props.root || pixiApp.value.canvas.parentNode as HTMLElement
 
     function mount() {
       if (!root)
diff --git a/packages/vue3-pixi/src/components/loader/index.ts b/packages/vue3-pixi/src/components/loader/index.ts
index e5089a2b..3c254a05 100644
--- a/packages/vue3-pixi/src/components/loader/index.ts
+++ b/packages/vue3-pixi/src/components/loader/index.ts
@@ -4,7 +4,7 @@ import { Assets } from 'pixi.js'
 import type { ExtractPropTypes, PropType } from 'vue-demi'
 import { defineComponent, onBeforeUnmount, ref, renderSlot, watch } from 'vue-demi'
 
-import type { IBaseTextureOptions, Texture, UnresolvedAsset as _UnresolvedAsset } from 'pixi.js'
+import type { Texture, TextureOptions, UnresolvedAsset as _UnresolvedAsset } from 'pixi.js'
 import type { Awaitable } from '@antfu/utils'
 import { isString } from '@antfu/utils'
 import { setTextureOptions } from '../../renderer'
@@ -26,7 +26,7 @@ export const loaderProps = {
     required: true as const,
   },
   options: {
-    type: Object as PropType<IBaseTextureOptions>,
+    type: Object as PropType<TextureOptions>,
     default: () => ({}),
   },
   bundleIds: String,
diff --git a/packages/vue3-pixi/src/composables/useRenderer.ts b/packages/vue3-pixi/src/composables/useRenderer.ts
index b9c82af8..f9f47ccf 100644
--- a/packages/vue3-pixi/src/composables/useRenderer.ts
+++ b/packages/vue3-pixi/src/composables/useRenderer.ts
@@ -1,10 +1,10 @@
-import type { Application, ICanvas, IRenderer } from 'pixi.js'
+import type { Application, Renderer } from 'pixi.js'
 import type { Ref } from 'vue-demi'
 import { computed, unref } from 'vue-demi'
 
 import { useApplication } from './useApplication'
 
-export function useRenderer(app?: Ref<Application<ICanvas>>): Ref<IRenderer> {
+export function useRenderer(app?: Ref<Application>): Ref<Renderer> {
   const useApp = app || useApplication()
   return computed(() => unref(useApp)?.renderer)
 }
diff --git a/packages/vue3-pixi/src/composables/useScreen.ts b/packages/vue3-pixi/src/composables/useScreen.ts
index 6057c383..f44ecae2 100644
--- a/packages/vue3-pixi/src/composables/useScreen.ts
+++ b/packages/vue3-pixi/src/composables/useScreen.ts
@@ -1,13 +1,13 @@
 import type { Ref } from 'vue-demi'
 import { computed, unref } from 'vue-demi'
 
-import type { Application, ICanvas } from 'pixi.js'
+import type { Application } from 'pixi.js'
 import { Rectangle } from 'pixi.js'
 
 import { computedWithControl, useResizeObserver } from '@vueuse/core'
 import { useApplication } from './useApplication'
 
-export function useScreen(app?: Ref<Application<ICanvas>>): Ref<Rectangle> {
+export function useScreen(app?: Ref<Application>): Ref<Rectangle> {
   const useApp = app || useApplication()
   const view = computed(() => unref(useApp).view as HTMLCanvasElement)
   const defaultRectangle = new Rectangle()
diff --git a/packages/vue3-pixi/src/composables/useStage.ts b/packages/vue3-pixi/src/composables/useStage.ts
index 026bb91c..ded50f0b 100644
--- a/packages/vue3-pixi/src/composables/useStage.ts
+++ b/packages/vue3-pixi/src/composables/useStage.ts
@@ -1,4 +1,4 @@
-import type { Application, Container, ICanvas } from 'pixi.js'
+import type { Application, Container, Renderer } from 'pixi.js'
 import type { Ref } from 'vue-demi'
 import { computed, unref } from 'vue-demi'
 
@@ -6,7 +6,7 @@ import { useApplication } from './useApplication'
 
 export type StageInst = Container & EventTarget
 
-export function useStage(app?: Ref<Application<ICanvas>>): Ref<StageInst> {
+export function useStage(app?: Ref<Application<Renderer>>): Ref<StageInst> {
   const useApp = app || useApplication()
   return computed(() => unref(useApp)?.stage as any)
 }
diff --git a/packages/vue3-pixi/src/elements/FXAAFilter.ts b/packages/vue3-pixi/src/elements/FXAAFilter.ts
deleted file mode 100644
index 79577f74..00000000
--- a/packages/vue3-pixi/src/elements/FXAAFilter.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import type {
-  ComponentOptionsMixin,
-  DefineComponent,
-  VNodeProps,
-} from 'vue-demi'
-import type { FXAAFilter } from 'pixi.js'
-import type { AllowedFilterProps, ExtractFilterProps } from './props'
-
-export interface FXAAFilterProps extends ExtractFilterProps<FXAAFilter> {}
-
-export interface FXAAFilterEvents {
-  render: [FXAAFilterInst]
-}
-
-export type FXAAFilterInst = FXAAFilter
-
-export type FXAAFilterComponent = DefineComponent<
-FXAAFilterProps,
-  {},
-  unknown,
-  {},
-  {},
-  ComponentOptionsMixin,
-  ComponentOptionsMixin,
-  (keyof FXAAFilterEvents)[],
-  keyof FXAAFilterEvents,
-  VNodeProps & AllowedFilterProps,
-  Readonly<FXAAFilterProps> & {
-    [key in keyof FXAAFilterEvents as `on${Capitalize<key>}`]?:
-    | ((...args: FXAAFilterEvents[key]) => any)
-    | undefined;
-  },
-  {}
->
diff --git a/packages/vue3-pixi/src/elements/animatedSprite.ts b/packages/vue3-pixi/src/elements/animatedSprite.ts
index 4166673c..5e9c9c4a 100644
--- a/packages/vue3-pixi/src/elements/animatedSprite.ts
+++ b/packages/vue3-pixi/src/elements/animatedSprite.ts
@@ -15,14 +15,12 @@ export interface AnimatedSpriteProps extends AllowedPixiProps {
   playing?: boolean
   gotoAndPlay?: number
 
-  anchor?: PIXI.IPointData | number
+  anchor?: Partial<PIXI.PointData> | number
   anchorX?: number
   anchorY?: number
 
   blendMode?: PIXI.BLEND_MODES
 
-  pluginName?: string
-
   tint?: PIXI.ColorSource
 
   animationSpeed?: number
diff --git a/packages/vue3-pixi/src/elements/bitmapText.ts b/packages/vue3-pixi/src/elements/bitmapText.ts
index 0babb82a..aac36092 100644
--- a/packages/vue3-pixi/src/elements/bitmapText.ts
+++ b/packages/vue3-pixi/src/elements/bitmapText.ts
@@ -6,14 +6,13 @@ import type {
 import type * as PIXI from 'pixi.js'
 import type { AllowedPixiProps } from './props'
 import type { PixiEvents } from './events'
-
 export interface BitmapTextProps {
   text?: string | number
-  style?: Partial<PIXI.IBitmapTextStyle>
+  style?: Partial<PIXI.TextStyle>
 
   align?: string
 
-  anchor?: PIXI.IPointData | number
+  anchor?: Partial<PIXI.PointData> | number
   anchorX?: number
   anchorY?: number
 
diff --git a/packages/vue3-pixi/src/elements/displacementFilter.ts b/packages/vue3-pixi/src/elements/displacementFilter.ts
index 21783ba4..4be15bd7 100644
--- a/packages/vue3-pixi/src/elements/displacementFilter.ts
+++ b/packages/vue3-pixi/src/elements/displacementFilter.ts
@@ -3,11 +3,11 @@ import type {
   DefineComponent,
   VNodeProps,
 } from 'vue-demi'
-import type { DisplacementFilter, ISpriteMaskTarget } from 'pixi.js'
+import type { DisplacementFilter, Sprite } from 'pixi.js'
 import type { AllowedFilterProps, ExtractFilterProps } from './props'
 
 export interface DisplacementFilterProps extends ExtractFilterProps<DisplacementFilter> {
-  sprite: ISpriteMaskTarget
+  sprite: Sprite
 }
 
 export interface DisplacementFilterEvents {
diff --git a/packages/vue3-pixi/src/elements/events/index.ts b/packages/vue3-pixi/src/elements/events/index.ts
index ffcd0439..59d5a589 100644
--- a/packages/vue3-pixi/src/elements/events/index.ts
+++ b/packages/vue3-pixi/src/elements/events/index.ts
@@ -1,9 +1,3 @@
-import type { Container, DisplayObject } from 'pixi.js'
+import type { ContainerChild, ContainerEvents } from 'pixi.js'
 
-export interface PixiEvents {
-  added: [container: Container]
-  childAdded: [child: DisplayObject, container: Container, index: number]
-  childRemoved: [child: DisplayObject, container: Container, index: number]
-  destroyed: []
-  removed: [container: Container]
-}
+export interface PixiEvents<C extends ContainerChild = ContainerChild> extends ContainerEvents<C> { }
diff --git a/packages/vue3-pixi/src/elements/graphics.ts b/packages/vue3-pixi/src/elements/graphics.ts
index 6137fbcf..e4f0a438 100644
--- a/packages/vue3-pixi/src/elements/graphics.ts
+++ b/packages/vue3-pixi/src/elements/graphics.ts
@@ -9,11 +9,7 @@ import type { PixiEvents } from './events'
 
 export interface GraphicsProps {
   blendMode?: PIXI.BLEND_MODES
-  pluginName?: string
-  shader?: PIXI.Shader
-  tint?: PIXI.ColorSource
-  geometry?: PIXI.GraphicsGeometry
-  isMask?: boolean
+  geometry?: PIXI.GraphicsOptions | PIXI.GraphicsContext
 }
 
 export interface GraphicsEvents extends PixiEvents {
diff --git a/packages/vue3-pixi/src/elements/mesh.ts b/packages/vue3-pixi/src/elements/mesh.ts
index 87d24c88..74f06f67 100644
--- a/packages/vue3-pixi/src/elements/mesh.ts
+++ b/packages/vue3-pixi/src/elements/mesh.ts
@@ -9,9 +9,9 @@ import type { PixiEvents } from './events'
 
 export interface MeshProps {
   geometry: PIXI.Geometry
-  shader: PIXI.Shader | PIXI.MeshMaterial
+  shader: PIXI.Shader
   blendMode?: PIXI.BLEND_MODES
-  drawMode?: PIXI.DRAW_MODES
+  drawMode?: PIXI.Topology
   material?: PIXI.Shader
   roundPixels?: boolean
   size?: number
diff --git a/packages/vue3-pixi/src/elements/simpleRope.ts b/packages/vue3-pixi/src/elements/meshRope.ts
similarity index 53%
rename from packages/vue3-pixi/src/elements/simpleRope.ts
rename to packages/vue3-pixi/src/elements/meshRope.ts
index cde32db8..a582fd3c 100644
--- a/packages/vue3-pixi/src/elements/simpleRope.ts
+++ b/packages/vue3-pixi/src/elements/meshRope.ts
@@ -7,14 +7,14 @@ import type * as PIXI from 'pixi.js'
 import type { AllowedPixiProps } from './props'
 import type { PixiEvents } from './events'
 
-export interface SimpleRopeProps {
+export interface MeshRopeProps {
   texture: string | PIXI.Texture
-  points: PIXI.IPoint[]
+  points: PIXI.Point[]
   textureScale?: number
   autoUpdate?: number
-  shader?: PIXI.Shader | PIXI.MeshMaterial
+  shader?: PIXI.Shader
   blendMode?: PIXI.BLEND_MODES
-  drawMode?: PIXI.DRAW_MODES
+  drawMode?: PIXI.Topology
   material?: PIXI.Shader
   roundPixels?: boolean
   size?: number
@@ -24,26 +24,26 @@ export interface SimpleRopeProps {
   canvasPadding?: number
 }
 
-export interface SimpleRopeEvents extends PixiEvents {
-  render: [SimpleRopeInst]
+export interface MeshRopeEvents extends PixiEvents {
+  render: [MeshRopeInst]
 }
 
-export type SimpleRopeInst = PIXI.SimpleRope & EventTarget
+export type MeshRopeInst = PIXI.MeshRope & EventTarget
 
-export type SimpleRopeComponent = DefineComponent<
-SimpleRopeProps,
+export type MeshRopeComponent = DefineComponent<
+MeshRopeProps,
   {},
   unknown,
   {},
   {},
   ComponentOptionsMixin,
   ComponentOptionsMixin,
-  (keyof SimpleRopeEvents)[],
-  keyof SimpleRopeEvents,
+  (keyof MeshRopeEvents)[],
+  keyof MeshRopeEvents,
   VNodeProps & AllowedPixiProps,
-  Readonly<SimpleRopeProps> & {
-    [key in keyof SimpleRopeEvents as `on${Capitalize<key>}`]?:
-    | ((...args: SimpleRopeEvents[key]) => any)
+  Readonly<MeshRopeProps> & {
+    [key in keyof MeshRopeEvents as `on${Capitalize<key>}`]?:
+    | ((...args: MeshRopeEvents[key]) => any)
     | undefined;
   },
   {}
diff --git a/packages/vue3-pixi/src/elements/nineSlicePlane.ts b/packages/vue3-pixi/src/elements/nineSliceSprite.ts
similarity index 77%
rename from packages/vue3-pixi/src/elements/nineSlicePlane.ts
rename to packages/vue3-pixi/src/elements/nineSliceSprite.ts
index c1f309c2..f0c2d846 100644
--- a/packages/vue3-pixi/src/elements/nineSlicePlane.ts
+++ b/packages/vue3-pixi/src/elements/nineSliceSprite.ts
@@ -7,7 +7,7 @@ import type * as PIXI from 'pixi.js'
 import type { AllowedPixiProps } from './props'
 import type { PixiEvents } from './events'
 
-export interface NineSlicePlaneProps {
+export interface NineSliceSpriteProps {
   texture: PIXI.Texture | string
   leftWidth?: number
   rightWidth?: number
@@ -16,9 +16,9 @@ export interface NineSlicePlaneProps {
   verticesX?: number
   verticesY?: number
 
-  shader?: PIXI.Shader | PIXI.MeshMaterial
+  shader?: PIXI.Shader
   blendMode?: PIXI.BLEND_MODES
-  drawMode?: PIXI.DRAW_MODES
+  drawMode?: PIXI.Topology
   material?: PIXI.Shader
   roundPixels?: boolean
   size?: number
@@ -35,10 +35,10 @@ export interface NineSliceEvents extends PixiEvents {
   render: [NineSliceInst]
 }
 
-export type NineSliceInst = PIXI.NineSlicePlane & EventTarget
+export type NineSliceInst = PIXI.NineSliceSprite & EventTarget
 
-export type NineSlicePlaneComponent = DefineComponent<
-NineSlicePlaneProps,
+export type NineSliceSpriteComponent = DefineComponent<
+  NineSliceSpriteProps,
   {},
   unknown,
   {},
@@ -48,7 +48,7 @@ NineSlicePlaneProps,
   (keyof NineSliceEvents)[],
   keyof NineSliceEvents,
   VNodeProps & AllowedPixiProps,
-  Readonly<NineSlicePlaneProps> & {
+  Readonly<NineSliceSpriteProps> & {
     [key in keyof NineSliceEvents as `on${Capitalize<key>}`]?:
     | ((...args: NineSliceEvents[key]) => any)
     | undefined;
diff --git a/packages/vue3-pixi/src/elements/props/index.ts b/packages/vue3-pixi/src/elements/props/index.ts
index 59485d44..cd24e394 100644
--- a/packages/vue3-pixi/src/elements/props/index.ts
+++ b/packages/vue3-pixi/src/elements/props/index.ts
@@ -4,8 +4,7 @@ import type {
   EventMode,
   Filter,
   IHitArea,
-  IPointData,
-  MaskData,
+  PointData,
   Rectangle,
 } from 'pixi.js'
 
@@ -33,21 +32,21 @@ export interface AllowedPixiProps {
   hitArea?: IHitArea
   eventMode?: EventMode
 
-  mask?: Container | MaskData | null
+  mask?: Container | null
 
   name?: string
 
   x?: number
   y?: number
-  position?: Partial<IPointData> | number | [number, number]
+  position?: Partial<PointData> | number | [number, number]
   positionY?: number
   positionX?: number
 
-  anchor?: Partial<IPointData> | number | [number, number]
+  anchor?: Partial<PointData> | number | [number, number]
   anchorX?: number
   anchorY?: number
 
-  pivot?: Partial<IPointData> | number | [number, number]
+  pivot?: Partial<PointData> | number | [number, number]
   pivotX?: number
   pivotY?: number
 
@@ -56,13 +55,13 @@ export interface AllowedPixiProps {
   rotation?: number
   angle?: number
 
-  scale?: Partial<IPointData> | number | [number, number]
+  scale?: Partial<PointData> | number | [number, number]
   scaleX?: number
   scaleY?: number
   width?: number
   height?: number
 
-  skew?: Partial<IPointData> | number | [number, number]
+  skew?: Partial<PointData> | number | [number, number]
   skewX?: number
   skewY?: number
 
diff --git a/packages/vue3-pixi/src/elements/simplePlane.ts b/packages/vue3-pixi/src/elements/simplePlane.ts
index 1df008a1..f89122c6 100644
--- a/packages/vue3-pixi/src/elements/simplePlane.ts
+++ b/packages/vue3-pixi/src/elements/simplePlane.ts
@@ -9,11 +9,11 @@ import type { PixiEvents } from './events'
 
 export interface SimplePlaneProps {
   texture: string | PIXI.Texture
-  points: PIXI.IPoint[]
+  points: PIXI.Point[]
 
   shader?: PIXI.Shader | PIXI.MeshMaterial
   blendMode?: PIXI.BLEND_MODES
-  drawMode?: PIXI.DRAW_MODES
+  drawMode?: PIXI.Topology
   material?: PIXI.Shader
   roundPixels?: boolean
   size?: number
diff --git a/packages/vue3-pixi/src/elements/sprite.ts b/packages/vue3-pixi/src/elements/sprite.ts
index 042cece2..34d25189 100644
--- a/packages/vue3-pixi/src/elements/sprite.ts
+++ b/packages/vue3-pixi/src/elements/sprite.ts
@@ -8,7 +8,7 @@ import type { AllowedPixiProps } from './props'
 import type { PixiEvents } from './events'
 export interface SpriteProps extends AllowedPixiProps {
   texture: string | PIXI.Texture
-  textureOptions?: PIXI.IBaseTextureOptions
+  textureOptions?: PIXI.TextureOptions
 
   blendMode?: PIXI.BLEND_MODES
 
diff --git a/packages/vue3-pixi/src/elements/text.ts b/packages/vue3-pixi/src/elements/text.ts
index 3da98688..ba255552 100644
--- a/packages/vue3-pixi/src/elements/text.ts
+++ b/packages/vue3-pixi/src/elements/text.ts
@@ -9,11 +9,9 @@ import type { PixiEvents } from './events'
 
 export interface TextProps {
   text?: string | number
-  style?: PIXI.TextStyle | Partial<PIXI.ITextStyle>
+  style?: PIXI.TextStyle | Partial<PIXI.TextStyle>
 
-  canvas?: PIXI.ICanvas
   context?: PIXI.ICanvasRenderingContext2D
-  resolution?: number
 
   width?: number
 }
diff --git a/packages/vue3-pixi/src/elements/tilingSprite.ts b/packages/vue3-pixi/src/elements/tilingSprite.ts
index 28029b97..2e227fec 100644
--- a/packages/vue3-pixi/src/elements/tilingSprite.ts
+++ b/packages/vue3-pixi/src/elements/tilingSprite.ts
@@ -9,11 +9,11 @@ import type { PixiEvents } from './events'
 
 export interface TilingSpriteProps {
   texture: string | PIXI.Texture
-  textureOptions?: PIXI.IBaseTextureOptions
+  textureOptions?: PIXI.TextureOptions
   width?: number
   height?: number
 
-  anchor?: PIXI.IPointData | number
+  anchor?: Partial<PIXI.PointData> | number
   anchorX?: number
   anchorY?: number
 
@@ -25,11 +25,11 @@ export interface TilingSpriteProps {
 
   clampMargin?: number
 
-  tilePosition?: Partial<PIXI.IPointData> | number | [number, number]
+  tilePosition?: Partial<PIXI.PointData> | number | [number, number]
   tilePositionX?: number
   tilePositionY?: number
 
-  tileScale?: Partial<PIXI.IPointData> | number | [number, number]
+  tileScale?: Partial<PIXI.PointData> | number | [number, number]
   tileScaleX?: number
   tileScaleY?: number
 
diff --git a/packages/vue3-pixi/src/global.ts b/packages/vue3-pixi/src/global.ts
index 8a745b58..31eae2fb 100644
--- a/packages/vue3-pixi/src/global.ts
+++ b/packages/vue3-pixi/src/global.ts
@@ -1,8 +1,8 @@
 import '@vue/runtime-core'
 import 'pixi.js'
-import type { SimpleRopeComponent } from './elements/simpleRope'
+import type { MeshRopeComponent } from './elements/meshRope'
 import type { SimplePlaneComponent } from './elements/simplePlane'
-import type { NineSlicePlaneComponent } from './elements/nineSlicePlane'
+import type { NineSliceSpriteComponent } from './elements/NineSliceSprite'
 import type { MeshComponent } from './elements/mesh'
 import type { AnimatedSpriteComponent } from './elements/animatedSprite'
 import type { TilingSpriteComponent } from './elements/tilingSprite'
@@ -16,7 +16,6 @@ import type { BlurFilterComponent } from './elements/blurFilter'
 import type { AlphaFilterComponent } from './elements/alphaFilter'
 import type { DisplacementFilterComponent } from './elements/displacementFilter'
 import type { ColorMatrixFilterComponent } from './elements/colorMatrixFilter'
-import type { FXAAFilterComponent } from './elements/FXAAFilter'
 import type { ParticleContainerComponent } from './elements/particleContainer'
 
 declare module '@vue/runtime-core' {
@@ -69,11 +68,11 @@ declare module '@vue/runtime-core' {
     SimplePlane: SimplePlaneComponent
     PixiSimplePlane: SimplePlaneComponent
 
-    NineSlicePlane: NineSlicePlaneComponent
-    PixiNineSlicePlane: NineSlicePlaneComponent
+    NineSliceSprite: NineSliceSpriteComponent
+    PixiNineSliceSprite: NineSliceSpriteComponent
 
-    SimpleRope: SimpleRopeComponent
-    PixiSimpleRope: SimpleRopeComponent
+    MeshRope: MeshRopeComponent
+    PixiMeshRope: MeshRopeComponent
   }
 }
 
@@ -88,9 +87,9 @@ declare module 'pixi.js' {
   }
 }
 
-export * from './elements/simpleRope'
+export * from './elements/meshRope'
 export * from './elements/simplePlane'
-export * from './elements/nineSlicePlane'
+export * from './elements/nineSliceSprite'
 export * from './elements/mesh'
 export * from './elements/animatedSprite'
 export * from './elements/tilingSprite'
@@ -104,7 +103,6 @@ export * from './elements/blurFilter'
 export * from './elements/alphaFilter'
 export * from './elements/displacementFilter'
 export * from './elements/colorMatrixFilter'
-export * from './elements/FXAAFilter'
 export * from './elements/props'
 export * from './elements/events'
 export * from './elements/particleContainer'
diff --git a/packages/vue3-pixi/src/renderer/internal/custom.ts b/packages/vue3-pixi/src/renderer/internal/custom.ts
index 6a50892f..efcd0ffe 100644
--- a/packages/vue3-pixi/src/renderer/internal/custom.ts
+++ b/packages/vue3-pixi/src/renderer/internal/custom.ts
@@ -1,8 +1,12 @@
-import { Sprite } from 'pixi.js'
+import type { ContainerOptions } from 'pixi.js'
+import { Container } from 'pixi.js'
+
+export class Empty extends Container {
+  constructor(options?: ContainerOptions) {
+    super(options)
+    this.visible = false
+    this.renderable = false
+  }
 
-export class Empty extends Sprite {
-  render() {}
-  visible = false
-  renderable = false
   _vp_empty = true
 }
diff --git a/packages/vue3-pixi/src/renderer/internal/default-renderer.ts b/packages/vue3-pixi/src/renderer/internal/default-renderer.ts
index 69f0788d..10f5fe71 100644
--- a/packages/vue3-pixi/src/renderer/internal/default-renderer.ts
+++ b/packages/vue3-pixi/src/renderer/internal/default-renderer.ts
@@ -1,3 +1,26 @@
+// imported by default
+import 'pixi.js/accessibility'
+import 'pixi.js/app'
+import 'pixi.js/events'
+import 'pixi.js/filters'
+import 'pixi.js/sprite-tiling'
+import 'pixi.js/text'
+import 'pixi.js/text-bitmap'
+import 'pixi.js/text-html'
+import 'pixi.js/graphics'
+import 'pixi.js/mesh'
+import 'pixi.js/sprite-nine-slice'
+
+// not added by default, everyone needs to import these manually
+import 'pixi.js/advanced-blend-modes'
+import 'pixi.js/unsafe-eval'
+import 'pixi.js/prepare'
+import 'pixi.js/math-extras'
+import 'pixi.js/dds'
+import 'pixi.js/ktx'
+import 'pixi.js/ktx2'
+import 'pixi.js/basis'
+
 import {
   AlphaFilter,
   AnimatedSprite,
@@ -6,15 +29,14 @@ import {
   ColorMatrixFilter,
   Container,
   DisplacementFilter,
-  FXAAFilter,
   Graphics,
   Mesh,
-  NineSlicePlane,
+  // -- Strange thing
+  // -- why are these three empty?
+  // MeshPlane,
+  // MeshRope,
+  // NineSliceSprite,
   NoiseFilter,
-  ParticleContainer,
-  SimpleMesh,
-  SimplePlane,
-  SimpleRope,
   Sprite,
   Text,
   TilingSprite,
@@ -29,34 +51,13 @@ const ContainerRender: RendererOptions = {
   createElement: () => new Container(),
 }
 
-const ParticleContainerRender: RendererOptions = {
-  name: 'ParticleContainer',
-  createElement: props => new ParticleContainer(
-    props['max-size'] || props.maxSize,
-    props.properties,
-  ),
-  patchProp(el: ParticleContainer, key, prev, next) {
-    switch (key) {
-      case 'max-size':
-      case 'properties':
-        break
-      default:
-        defuPatchProp(el, key, prev, next)
-    }
-  },
-}
-
 const SpriteRender: RendererOptions = {
   name: 'Sprite',
-  createElement: props => new Sprite(normalizeTexture(props.texture)),
-  remove(node: Sprite) {
-    node.destroy()
-  },
-}
-
-const SimpleMeshRender: RendererOptions = {
-  name: 'SimpleMesh',
-  createElement: props => new SimpleMesh(normalizeTexture(props.texture)),
+  createElement: props => new Sprite({
+    ...props,
+    texture: normalizeTexture(props.texture),
+  }),
+  remove: (node: Sprite) => node.destroy(),
 }
 
 const GraphicsRender: RendererOptions = {
@@ -66,11 +67,10 @@ const GraphicsRender: RendererOptions = {
 
 const TextRender: RendererOptions = {
   name: 'Text',
-  createElement: props => new Text(
-    props.text,
-    props.style,
-    props.canvas,
-  ),
+  createElement: props => new Text({
+    text: props.text,
+    style: props.style,
+  }),
   patchProp(el: Text, key, prev, next) {
     switch (key) {
       case 'text':
@@ -87,10 +87,10 @@ const TextRender: RendererOptions = {
 
 const BitmapTextRender: RendererOptions = {
   name: 'BitmapText',
-  createElement: props => new BitmapText(
-    props.text,
-    props.style,
-  ),
+  createElement: props => new BitmapText({
+    text: props.text,
+    style: props.style,
+  }),
   patchProp(el: BitmapText, key, prev, next) {
     switch (key) {
       case 'text':
@@ -98,7 +98,7 @@ const BitmapTextRender: RendererOptions = {
         break
       case 'style':
         break
-      case 'dirty':
+      case 'sortDirty':
       case 'roundPixels':
         patchBooleanProp(el, key, prev, next)
         break
@@ -110,11 +110,11 @@ const BitmapTextRender: RendererOptions = {
 
 const TilingSpriteRender: RendererOptions = {
   name: 'TilingSprite',
-  createElement: props => new TilingSprite(
-    normalizeTexture(props!.texture),
-    props.width,
-    props.height,
-  ),
+  createElement: props => new TilingSprite({
+    texture: normalizeTexture(props!.texture),
+    width: props.width,
+    height: props.height,
+  }),
   patchProp(el: TilingSprite, key, prev, next) {
     switch (key) {
       case 'width':
@@ -170,18 +170,13 @@ const AnimatedSpriteRender: RendererOptions = {
 
 const MeshRender: RendererOptions = {
   name: 'Mesh',
-  createElement: props => new Mesh(
-    props.geometry,
-    props.shader,
-    props.state,
-    props.drawMode,
-  ),
+  // TODO(drawMode): undetermined
+  createElement: props => new Mesh(props as any),
   patchProp(el: Mesh, key, prev, next) {
     switch (key) {
       case 'geometry':
       case 'shader':
       case 'state':
-      case 'drawMode':
         setSkipFirstValue(el, key, () => el[key] = next)
         break
       case 'roundPixels':
@@ -193,60 +188,57 @@ const MeshRender: RendererOptions = {
   },
 }
 
-const NineSlicePlaneRender: RendererOptions = {
-  name: 'NineSlicePlane',
-  createElement: props => new NineSlicePlane(
-    normalizeTexture(props.texture),
-  ),
-  patchProp(el: NineSlicePlane, key, prev, next) {
-    switch (key) {
-      case 'roundPixels':
-      case 'autoResize':
-        patchBooleanProp(el, key, prev, next)
-        break
-      default:
-        defuPatchProp(el, key, prev, next)
-    }
-  },
-}
+// const NineSliceSpriteRender: RendererOptions = {
+//   name: 'NineSliceSprite',
+//   createElement: props => new NineSliceSprite(
+//     normalizeTexture(props.texture),
+//   ),
+//   patchProp(el: NineSliceSprite, key, prev, next) {
+//     switch (key) {
+//       case 'roundPixels':
+//       case 'autoResize':
+//         patchBooleanProp(el, key, prev, next)
+//         break
+//       default:
+//         defuPatchProp(el, key, prev, next)
+//     }
+//   },
+// }
 
-const SimplePlaneRender: RendererOptions = {
-  name: 'SimplePlane',
-  createElement: (props) => {
-    return new SimplePlane(
-      normalizeTexture(props.texture),
-      props.width,
-      props.height,
-    )
-  },
-}
+// TODO: SimplePlane -> MeshPlane files
+// const MeshPlaneRender: RendererOptions = {
+//   name: 'MeshPlane',
+//   createElement: (props) => {
+//     return new MeshPlane({
+//       texture: normalizeTexture(props.texture),
+//       width: props.width,
+//       height: props.height,
+//     })
+//   },
+// }
 
-const SimpleRopeRender: RendererOptions = {
-  name: 'SimpleRope',
-  createElement: (props) => {
-    return new SimpleRope(
-      normalizeTexture(props.texture),
-      props.points,
-    )
-  },
-  patchProp(el: NineSlicePlane, key, prev, next) {
-    switch (key) {
-      case 'texture':
-      case 'points':
-        break
-      default:
-        defuPatchProp(el, key, prev, next)
-    }
-  },
-}
+// const MeshRopeRender: RendererOptions = {
+//   name: 'MeshRope',
+//   createElement: (props) => {
+//     return new MeshRope({
+//       texture: normalizeTexture(props.texture),
+//       points: props.points,
+//     })
+//   },
+//   patchProp(el: NineSliceSprite, key, prev, next) {
+//     switch (key) {
+//       case 'texture':
+//       case 'points':
+//         break
+//       default:
+//         defuPatchProp(el, key, prev, next)
+//     }
+//   },
+// }
 
 const BlurFilterRender: RendererOptions = {
   name: 'BlurFilter',
-  createElement: props => new BlurFilter(
-    props.blur,
-    props.quality,
-    props.resolution,
-  ),
+  createElement: props => new BlurFilter(props as any),
 }
 
 const AlphaFilterRender: RendererOptions = {
@@ -264,7 +256,7 @@ const DisplacementFilterRender: RendererOptions = {
     switch (key) {
       case 'sprite':
       case 'scale':
-        setSkipFirstValue(el, key, () => el.scale = next)
+        // setSkipFirstValue(el, key, () => el.scale = next)
         break
       default:
         defuPatchProp(el, key, prev, next)
@@ -279,10 +271,7 @@ const ColorMatrixFilterRender: RendererOptions = {
 
 const NoiseFilterRender: RendererOptions = {
   name: 'NoiseFilter',
-  createElement: props => new NoiseFilter(
-    props.noise,
-    props.seed,
-  ),
+  createElement: props => new NoiseFilter(props as any),
   patchProp(el: NoiseFilter, key, prev, next) {
     switch (key) {
       case 'noise':
@@ -295,29 +284,21 @@ const NoiseFilterRender: RendererOptions = {
   },
 }
 
-const FXAAFilterRender: RendererOptions = {
-  name: 'FXAAFilter',
-  createElement: () => new FXAAFilter(),
-}
-
 export const defaultRenderer: Renderer = [
   ContainerRender,
-  ParticleContainerRender,
   SpriteRender,
-  SimpleMeshRender,
   GraphicsRender,
   TextRender,
   BitmapTextRender,
   TilingSpriteRender,
   AnimatedSpriteRender,
   MeshRender,
-  NineSlicePlaneRender,
-  SimplePlaneRender,
-  SimpleRopeRender,
+  // NineSliceSpriteRender,
+  // MeshPlaneRender,
+  // MeshRopeRender,
   BlurFilterRender,
   AlphaFilterRender,
   DisplacementFilterRender,
   ColorMatrixFilterRender,
   NoiseFilterRender,
-  FXAAFilterRender,
 ]
diff --git a/packages/vue3-pixi/src/renderer/internal/options.ts b/packages/vue3-pixi/src/renderer/internal/options.ts
index d3051f1f..5b83edc4 100644
--- a/packages/vue3-pixi/src/renderer/internal/options.ts
+++ b/packages/vue3-pixi/src/renderer/internal/options.ts
@@ -2,16 +2,22 @@ import type { Container, Filter } from 'pixi.js'
 
 export function insertFilter(child: Filter, parent: Container, _anchor: any) {
   parent.filters ??= []
+  parent.filters = Array.isArray(parent.filters) ? parent.filters : [parent.filters]
+
   function remove() {
-    const index = parent.filters!.indexOf(child)
+    const index = parent.filters.indexOf(child)
     parent.filters?.splice(index >>> 0, 1)
   }
   child.parent = parent
   child.destroy = remove
-  parent.filters!.push(child)
+
+  parent.filters.push(child)
 }
 
 export function nextSiblingFilter(node: Filter) {
+  node.parent.filters ??= []
+  node.parent.filters = Array.isArray(parent.filters) ? parent.filters : [parent.filters]
+
   const index = node.parent.filters!.indexOf(node)
   if (node.parent.filters!.length <= index + 1)
     return null
diff --git a/packages/vue3-pixi/src/renderer/internal/utils.ts b/packages/vue3-pixi/src/renderer/internal/utils.ts
index d9c57860..de666e64 100644
--- a/packages/vue3-pixi/src/renderer/internal/utils.ts
+++ b/packages/vue3-pixi/src/renderer/internal/utils.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import type { Container, DisplayObject } from 'pixi.js'
+import type { Container } from 'pixi.js'
 import type { Renderer, RendererOptions } from 'vue-demi'
 import { camelize } from 'vue-demi'
 import { isCustomElement } from '../../compiler'
@@ -36,7 +36,9 @@ export function rendererWithCapture(options: RendererOptions<Container, Containe
   return options
 }
 
-export function rendererWithOptions(renderer: Renderer<Container<DisplayObject>> & Record<string, any>) {
+export function rendererWithOptions(
+  renderer: Renderer<Container<Container>> & Record<string, any>,
+) {
   const _createApp = renderer.createApp
   const _render = renderer.render
   function createApp(...args: any[]) {
diff --git a/packages/vue3-pixi/src/renderer/nodeOps.ts b/packages/vue3-pixi/src/renderer/nodeOps.ts
index 8fdcc64b..f77bd07b 100644
--- a/packages/vue3-pixi/src/renderer/nodeOps.ts
+++ b/packages/vue3-pixi/src/renderer/nodeOps.ts
@@ -1,5 +1,11 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import { BitmapText, Container, DisplayObject, Filter, Text, Texture } from 'pixi.js'
+import {
+  BitmapText,
+  Container,
+  Filter,
+  Text,
+  Texture,
+} from 'pixi.js'
 import { camelize, markRaw, warn } from 'vue-demi'
 import { isOn } from './utils'
 import { Empty, insertContainer, insertFilter, nextSiblingContainer, nextSiblingFilter, renderers } from './internal'
@@ -21,10 +27,10 @@ export function createElement(prefix: string, name: string, _?: boolean, _1?: st
   }
   const element = is(props ?? {})
 
-  if (element instanceof DisplayObject) {
+  if (element instanceof Container) {
     // @ts-expect-error
     if (isOn(props) && element.eventMode === 'auto')
-    // @ts-expect-error
+      // @ts-expect-error
       element.eventMode = 'static'
   }
 
diff --git a/packages/vue3-pixi/src/renderer/renderer.ts b/packages/vue3-pixi/src/renderer/renderer.ts
index 6c5aca3b..f2f0dee1 100644
--- a/packages/vue3-pixi/src/renderer/renderer.ts
+++ b/packages/vue3-pixi/src/renderer/renderer.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import type { Container, DisplayObject } from 'pixi.js'
+import type { Container } from 'pixi.js'
 
 import type { Renderer as _Renderer } from 'vue-demi'
 import { createRenderer as _createRenderer } from 'vue-demi'
@@ -9,7 +9,8 @@ import { nodeOps as _nodeOps } from './nodeOps'
 import type { use } from './internal'
 import { rendererWithCapture, rendererWithOptions } from './internal'
 
-export interface VuePIXIRenderer<T = Container<DisplayObject>> extends _Renderer<T> {
+export interface VuePIXIRenderer<T = Container<Container>>
+  extends _Renderer<T> {
   use: typeof use
 }
 
diff --git a/packages/vue3-pixi/src/renderer/utils/index.ts b/packages/vue3-pixi/src/renderer/utils/index.ts
index 0847ad16..9d39b629 100644
--- a/packages/vue3-pixi/src/renderer/utils/index.ts
+++ b/packages/vue3-pixi/src/renderer/utils/index.ts
@@ -1,9 +1,9 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import type { IBaseTextureOptions } from 'pixi.js'
+import type { TextureOptions } from 'pixi.js'
 
 import { Texture } from 'pixi.js'
 
-export function setTextureOptions(texture: Texture, options: IBaseTextureOptions = {}) {
+export function setTextureOptions(texture: Texture, options: TextureOptions = {}) {
   for (const key in options)
     // @ts-expect-error
     texture.baseTexture[key] = options[key]
diff --git a/packages/vue3-pixi/src/types/index.ts b/packages/vue3-pixi/src/types/index.ts
new file mode 100644
index 00000000..5f478b07
--- /dev/null
+++ b/packages/vue3-pixi/src/types/index.ts
@@ -0,0 +1,4 @@
+export interface PointAttribute {
+  x: number
+  y: number
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 21e54b65..6838b2c3 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -61,8 +61,8 @@ importers:
         specifier: ^4.0.2
         version: 4.0.2
       pixi.js:
-        specifier: ^7.4.2
-        version: 7.4.2
+        specifier: ^8.2.5
+        version: 8.2.5
       unocss:
         specifier: ^0.60.0
         version: 0.60.4(postcss@8.4.38)(vite@5.2.12)
@@ -100,9 +100,12 @@ importers:
       nanoid:
         specifier: ^4.0.2
         version: 4.0.2
+      pixi-filters:
+        specifier: ^6.0.4
+        version: 6.0.4(pixi.js@8.2.5)
       pixi.js:
-        specifier: ^7.4.2
-        version: 7.4.2
+        specifier: ^8.2.5
+        version: 8.2.5
       vue-demi:
         specifier: ^0.14.8
         version: 0.14.8(vue@3.4.27)
@@ -136,8 +139,8 @@ importers:
         specifier: ^0.10.5
         version: 0.10.5(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/events@7.4.2)(@pixi/graphics@7.4.2)(@pixi/sprite@7.4.2)(@pixi/text-bitmap@7.4.2)(@pixi/text-html@7.4.2)(@pixi/text@7.4.2)
       pixi.js:
-        specifier: ^7.4.2
-        version: 7.4.2
+        specifier: ^8.2.5
+        version: 8.2.5
       vue-demi:
         specifier: ^0.14.8
         version: 0.14.8(vue@3.4.27)
@@ -1568,28 +1571,6 @@ packages:
       '@pixi/sprite': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
     dev: false
 
-  /@pixi/accessibility@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/events@7.4.2):
-    resolution: {integrity: sha512-R6VEolm8uyy1FB1F2qaLKxVbzXAFTZCF2ka8fl9lsz7We6ZfO4QpXv9ur7DvzratjCQUQVCKo0/V7xL5q1EV/g==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-      '@pixi/events': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/events': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-    dev: false
-
-  /@pixi/app@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2):
-    resolution: {integrity: sha512-ugkH3kOgjT8P1mTMY29yCOgEh+KuVMAn8uBxeY0aMqaUgIMysfpnFv+Aepp2CtvI9ygr22NC+OiKl+u+eEaQHw==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-    dev: false
-
   /@pixi/assets@7.4.2(@pixi/core@7.4.2):
     resolution: {integrity: sha512-anxho59H9egZwoaEdM5aLvYyxoz6NCy3CaQIvNHD1bbGg8L16Ih0e26QSBR5fu53jl8OjT6M7s+p6n7uu4+fGA==}
     peerDependencies:
@@ -1609,16 +1590,6 @@ packages:
     resolution: {integrity: sha512-nezytU2pw587fQstUu1AsJZDVEynjskwOL+kibwcdxsMBFqPsFFNA7xl0ii/gXuDi6M0xj3mfRJj8pBSc2jCfA==}
     dev: false
 
-  /@pixi/compressed-textures@7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-VJrt7el6O4ZJSWkeOGXwrhJaiLg1UBhHB3fj42VR4YloYkAxpfd9K6s6IcbcVz7n9L48APKBMgHyaB2pX2Ck/A==}
-    peerDependencies:
-      '@pixi/assets': 7.4.2
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/assets': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/core': 7.4.2
-    dev: false
-
   /@pixi/constants@7.4.2:
     resolution: {integrity: sha512-N9vn6Wpz5WIQg7ugUg2+SdqD2u2+NM0QthE8YzLJ4tLH2Iz+/TrnPKUJzeyIqbg3sxJG5ZpGGPiacqIBpy1KyA==}
     dev: false
@@ -1658,62 +1629,6 @@ packages:
     resolution: {integrity: sha512-Hmx2+O0yZ8XIvgomHM9GZEGcy9S9Dd8flmtOK5Aa3fXs/8v7xD08+ANQpN9ZqWU2Xs+C6UBlpqlt2BWALvKKKA==}
     dev: false
 
-  /@pixi/extract@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-JOX27TRWjVEjauGBbF8PU7/g6LYXnivehdgqS5QlVDv1CNHTOrz/j3MdKcVWOhyZPbH5c9sh7lxyRxvd9AIuTQ==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-alpha@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-9OsKJ+yvY2wIcQXwswj5HQBiwNGymwmqdxfp7mo+nZSBoDmxUqvMZzE9UNJ3eUlswuNvNRO8zNOsQvwdz7WFww==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-blur@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-gOXBbIUx6CRZP1fmsis2wLzzSsofrqmIHhbf1gIkZMIQaLsc9T7brj+PaLTTiOiyJgnvGN5j20RZnkERWWKV0Q==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-color-matrix@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-ykZiR59Gvj80UKs9qm7jeUTKvn+wWk6HBVJOmJbK9jFK5juakDWp7BbH26U78Q61EWj97kI1FdfcbMkuQ7rqkA==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-displacement@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-QS/eWp/ivsxef3xapNeGwpPX7vrqQQeo99Fux4k5zsvplnNEsf91t6QYJLG776AbZEu/qh8VYRBA5raIVY/REw==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-fxaa@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-U/ptJgDsfs/r8y2a6gCaiPfDu2IFAxpQ4wtfmBpz6vRhqeE4kI8yNIUx5dZbui57zlsJaW0BNacOQxHU0vLkyQ==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
-  /@pixi/filter-noise@7.4.2(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-Vy9ViBFhZEGh6xKkd3kFWErolZTwv1Y5Qb1bV7qPIYbvBECYsqzlR4uCrrjBV6KKm0PufpG/+NKC5vICZaqKzg==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-    dev: false
-
   /@pixi/graphics@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2):
     resolution: {integrity: sha512-jH4/Tum2RqWzHGzvlwEr7HIVduoLO57Ze705N2zQPkUD57TInn5911aGUeoua7f/wK8cTLGzgB9BzSo2kTdcHw==}
     peerDependencies:
@@ -1750,62 +1665,6 @@ packages:
       '@pixi/display': 7.4.2(@pixi/core@7.4.2)
     dev: false
 
-  /@pixi/mixin-cache-as-bitmap@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2):
-    resolution: {integrity: sha512-6dgthi2ruUT/lervSrFDQ7vXkEsHo6CxdgV7W/wNdW1dqgQlKfDvO6FhjXzyIMRLSooUf5FoeluVtfsjkUIYrw==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-      '@pixi/sprite': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/sprite': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-    dev: false
-
-  /@pixi/mixin-get-child-by-name@7.4.2(@pixi/display@7.4.2):
-    resolution: {integrity: sha512-0Cfw8JpQhsixprxiYph4Lj+B5n83Kk4ftNMXgM5xtZz+tVLz5s91qR0MqcdzwTGTJ7utVygiGmS4/3EfR/duRQ==}
-    peerDependencies:
-      '@pixi/display': 7.4.2
-    dependencies:
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-    dev: false
-
-  /@pixi/mixin-get-global-position@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2):
-    resolution: {integrity: sha512-LcsahbVdX4DFS2IcGfNp4KaXuu7SjAwUp/flZSGIfstyKOKb5FWFgihtqcc9ZT4coyri3gs2JbILZub/zPZj1w==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-    dev: false
-
-  /@pixi/particle-container@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2):
-    resolution: {integrity: sha512-B78Qq86kt0lEa5WtB2YFIm3+PjhKfw9La9R++GBSgABl+g13s2UaZ6BIPxvY3JxWMdxPm4iPrQPFX1QWRN68mw==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-      '@pixi/sprite': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/sprite': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-    dev: false
-
-  /@pixi/prepare@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/graphics@7.4.2)(@pixi/text@7.4.2):
-    resolution: {integrity: sha512-PugyMzReCHXUzc3so9PPJj2OdHwibpUNWyqG4mWY2UUkb6c8NAGK1AnAPiscOvLilJcv/XQSFoNhX+N1jrvJEg==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2
-      '@pixi/graphics': 7.4.2
-      '@pixi/text': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/graphics': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/text': 7.4.2(@pixi/core@7.4.2)(@pixi/sprite@7.4.2)
-    dev: false
-
   /@pixi/runner@7.4.2:
     resolution: {integrity: sha512-LPBpwym4vdyyDY5ucF4INQccaGyxztERyLTY1YN6aqJyyMmnc7iqXlIKt+a0euMBtNoLoxy6MWMvIuZj0JfFPA==}
     dev: false
@@ -1818,16 +1677,6 @@ packages:
       ismobilejs: 1.1.1
     dev: false
 
-  /@pixi/sprite-animated@7.4.2(@pixi/core@7.4.2)(@pixi/sprite@7.4.2):
-    resolution: {integrity: sha512-QPT6yxCUGOBN+98H3pyIZ1ZO6Y7BN1o0Q2IMZEsD1rNfZJrTYS3Q8VlCG5t2YlFlcB8j5iBo24bZb6FUxLOmsQ==}
-    peerDependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/sprite': 7.4.2
-    dependencies:
-      '@pixi/core': 7.4.2
-      '@pixi/sprite': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-    dev: false
-
   /@pixi/sprite-tiling@7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2):
     resolution: {integrity: sha512-Z8PP6ewy3nuDYL+NeEdltHAhuucVgia33uzAitvH3OqqRSx6a6YRBFbNLUM9Sx+fBO2Lk3PpV1g6QZX+NE5LOg==}
     peerDependencies:
@@ -1850,16 +1699,6 @@ packages:
       '@pixi/display': 7.4.2(@pixi/core@7.4.2)
     dev: false
 
-  /@pixi/spritesheet@7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2):
-    resolution: {integrity: sha512-YIvHdpXW+AYp8vD0NkjJmrdnVHTZKidCnx6k8ATSuuvCT6O5Tuh2N/Ul2oDj4/QaePy0lVhyhAbZpJW00Jr7mQ==}
-    peerDependencies:
-      '@pixi/assets': 7.4.2
-      '@pixi/core': 7.4.2
-    dependencies:
-      '@pixi/assets': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/core': 7.4.2
-    dev: false
-
   /@pixi/text-bitmap@7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/mesh@7.4.2)(@pixi/text@7.4.2):
     resolution: {integrity: sha512-lPBMJ83JnpFVL+6ckQ8KO8QmwdPm0z9Zs/M0NgFKH2F+BcjelRNnk80NI3O0qBDYSEDQIE+cFbKoZ213kf7zwA==}
     peerDependencies:
@@ -2001,6 +1840,7 @@ packages:
     resolution: {integrity: sha512-C/zbRYRXFjWvz9Z4haRxcTdnkPt1BtCkz+7RtBSuNmKzMzp3ZxdM28Mpccn6pt28/UWUCTXa+b0Mx1k3g6NOMA==}
     cpu: [arm]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2008,6 +1848,7 @@ packages:
     resolution: {integrity: sha512-l3m9ewPgjQSXrUMHg93vt0hYCGnrMOcUpTz6FLtbwljo2HluS4zTXFy2571YQbisTnfTKPZ01u/ukJdQTLGh9A==}
     cpu: [arm]
     os: [linux]
+    libc: [musl]
     requiresBuild: true
     optional: true
 
@@ -2015,6 +1856,7 @@ packages:
     resolution: {integrity: sha512-rJ5D47d8WD7J+7STKdCUAgmQk49xuFrRi9pZkWoRD1UeSMakbcepWXPF8ycChBoAqs1pb2wzvbY6Q33WmN2ftw==}
     cpu: [arm64]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2022,6 +1864,7 @@ packages:
     resolution: {integrity: sha512-be6Yx37b24ZwxQ+wOQXXLZqpq4jTckJhtGlWGZs68TgdKXJgw54lUUoFYrg6Zs/kjzAQwEwYbp8JxZVzZLRepQ==}
     cpu: [arm64]
     os: [linux]
+    libc: [musl]
     requiresBuild: true
     optional: true
 
@@ -2029,6 +1872,7 @@ packages:
     resolution: {integrity: sha512-hNVMQK+qrA9Todu9+wqrXOHxFiD5YmdEi3paj6vP02Kx1hjd2LLYR2eaN7DsEshg09+9uzWi2W18MJDlG0cxJA==}
     cpu: [ppc64]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2036,6 +1880,7 @@ packages:
     resolution: {integrity: sha512-ROCM7i+m1NfdrsmvwSzoxp9HFtmKGHEqu5NNDiZWQtXLA8S5HBCkVvKAxJ8U+CVctHwV2Gb5VUaK7UAkzhDjlg==}
     cpu: [riscv64]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2043,6 +1888,7 @@ packages:
     resolution: {integrity: sha512-0UyyRHyDN42QL+NbqevXIIUnKA47A+45WyasO+y2bGJ1mhQrfrtXUpTxCOrfxCR4esV3/RLYyucGVPiUsO8xjg==}
     cpu: [s390x]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2050,6 +1896,7 @@ packages:
     resolution: {integrity: sha512-xuglR2rBVHA5UsI8h8UbX4VJ470PtGCf5Vpswh7p2ukaqBGFTnsfzxUBetoWBWymHMxbIG0Cmx7Y9qDZzr648w==}
     cpu: [x64]
     os: [linux]
+    libc: [glibc]
     requiresBuild: true
     optional: true
 
@@ -2057,6 +1904,7 @@ packages:
     resolution: {integrity: sha512-LKaqQL9osY/ir2geuLVvRRs+utWUNilzdE90TpyoX0eNqPzWjRm14oMEE+YLve4k/NAqCdPkGYDaDF5Sw+xBfg==}
     cpu: [x64]
     os: [linux]
+    libc: [musl]
     requiresBuild: true
     optional: true
 
@@ -2100,6 +1948,10 @@ packages:
   /@types/estree@1.0.5:
     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 
+  /@types/gradient-parser@0.1.5:
+    resolution: {integrity: sha512-r7K3NkJz3A95WkVVmjs0NcchhHstC2C/VIYNX4JC6tieviUNo774FFeOHjThr3Vw/WCeMP9kAT77MKbIRlO/4w==}
+    dev: false
+
   /@types/json-schema@7.0.15:
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
     dev: true
@@ -2720,6 +2572,15 @@ packages:
       - '@vue/composition-api'
       - vue
 
+  /@webgpu/types@0.1.43:
+    resolution: {integrity: sha512-HoP+d+m+Kuq8CsE63BZ3+BYBKAemrqbHUNrCalxrUju5XW+q/094Q3oeIa+2pTraEbO8ckJmGpibzyGT4OV4YQ==}
+    dev: false
+
+  /@xmldom/xmldom@0.8.10:
+    resolution: {integrity: sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==}
+    engines: {node: '>=10.0.0'}
+    dev: false
+
   /abbrev@2.0.0:
     resolution: {integrity: sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
@@ -4409,6 +4270,10 @@ packages:
     resolution: {integrity: sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==}
     dev: false
 
+  /eventemitter3@5.0.1:
+    resolution: {integrity: sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==}
+    dev: false
+
   /evtd@0.2.4:
     resolution: {integrity: sha512-qaeGN5bx63s/AXgQo8gj6fBkxge+OoLddLniox5qtLAEY5HSnuSlISXVPxnSae1dWblvTh4/HoMIB+mbMsvZzw==}
     dev: false
@@ -6432,6 +6297,10 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
+  /parse-svg-path@0.1.2:
+    resolution: {integrity: sha512-JyPSBnkTJ0AI8GGJLfMXvKq42cj5c006fnLz6fXy6zfoVjJizi8BNTpu8on8ziI1cKy9d9DGNuY17Ce7wuejpQ==}
+    dev: false
+
   /parse5@7.1.2:
     resolution: {integrity: sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==}
     dependencies:
@@ -6509,6 +6378,15 @@ packages:
     engines: {node: '>= 6'}
     dev: true
 
+  /pixi-filters@6.0.4(pixi.js@8.2.5):
+    resolution: {integrity: sha512-W9SjOTF4yo+v9t5YOBtsWhJoFLLRM6DsIk1C2YBNiQhdyX7J/5UIJtPlTMhZ7wQKoFUiyeUAaCzTEdmw/TVD6w==}
+    peerDependencies:
+      pixi.js: '>=8.0.0-0'
+    dependencies:
+      '@types/gradient-parser': 0.1.5
+      pixi.js: 8.2.5
+    dev: false
+
   /pixi-projection@1.0.0(@pixi-spine/base@4.0.3)(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/graphics@7.4.2)(@pixi/mesh-extras@7.4.2)(@pixi/mesh@7.4.2)(@pixi/sprite-tiling@7.4.2)(@pixi/sprite@7.4.2)(@pixi/text@7.4.2):
     resolution: {integrity: sha512-+fV7SA69OLxNR3nXOoR6Z5vFTqcp3oH/+sHXsQ+Jw6J9nOK+APzlrnCcO3ftB9Y/GIVgR3+HIDpKpRWe6EPPSw==}
     engines: {node: '>=16', npm: '>=8'}
@@ -6534,39 +6412,18 @@ packages:
       '@pixi/text': 7.4.2(@pixi/core@7.4.2)(@pixi/sprite@7.4.2)
     dev: false
 
-  /pixi.js@7.4.2:
-    resolution: {integrity: sha512-TifqgHGNofO7UCEbdZJOpUu7dUnpu4YZ0o76kfCqxDa4RS8ITc9zjECCbtalmuNXkVhSEZmBKQvE7qhHMqw/xg==}
+  /pixi.js@8.2.5:
+    resolution: {integrity: sha512-cpN4f4Duj2mDPQeDQJQ33LXA8wIGMpWbhld1SklEwESRULYPUsY84zXC8B+Cyl+zojcXH7eY1OMEdbbIPMb+rA==}
     dependencies:
-      '@pixi/accessibility': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/events@7.4.2)
-      '@pixi/app': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-      '@pixi/assets': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/compressed-textures': 7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2)
-      '@pixi/core': 7.4.2
-      '@pixi/display': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/events': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-      '@pixi/extensions': 7.4.2
-      '@pixi/extract': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-alpha': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-blur': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-color-matrix': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-displacement': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-fxaa': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/filter-noise': 7.4.2(@pixi/core@7.4.2)
-      '@pixi/graphics': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/mesh': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-      '@pixi/mesh-extras': 7.4.2(@pixi/core@7.4.2)(@pixi/mesh@7.4.2)
-      '@pixi/mixin-cache-as-bitmap': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/mixin-get-child-by-name': 7.4.2(@pixi/display@7.4.2)
-      '@pixi/mixin-get-global-position': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-      '@pixi/particle-container': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/prepare': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/graphics@7.4.2)(@pixi/text@7.4.2)
-      '@pixi/sprite': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)
-      '@pixi/sprite-animated': 7.4.2(@pixi/core@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/sprite-tiling': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/spritesheet': 7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2)
-      '@pixi/text': 7.4.2(@pixi/core@7.4.2)(@pixi/sprite@7.4.2)
-      '@pixi/text-bitmap': 7.4.2(@pixi/assets@7.4.2)(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/mesh@7.4.2)(@pixi/text@7.4.2)
-      '@pixi/text-html': 7.4.2(@pixi/core@7.4.2)(@pixi/display@7.4.2)(@pixi/sprite@7.4.2)(@pixi/text@7.4.2)
+      '@pixi/colord': 2.9.6
+      '@types/css-font-loading-module': 0.0.12
+      '@types/earcut': 2.1.4
+      '@webgpu/types': 0.1.43
+      '@xmldom/xmldom': 0.8.10
+      earcut: 2.2.4
+      eventemitter3: 5.0.1
+      ismobilejs: 1.1.1
+      parse-svg-path: 0.1.2
     dev: false
 
   /pkg-types@1.1.1: