@tresjs/post-processing 0.3.0 → 0.4.0

package/dist/core/EffectComposer.vue.d.ts

@@ -1,6 +1,5 @@
 import type { PropType as __PropType } from 'vue';
-import { Scene } from 'three';
-import { TresCamera, TresObject } from '@tresjs/core';
+import { TresObject } from '@tresjs/core';
 export type EffectComposerProps = {
     enabled?: boolean;
     children?: TresObject[];
@@ -11,13 +10,12 @@ export type EffectComposerProps = {
     autoClear?: boolean;
     multisampling?: number;
     frameBufferType?: number;
-    scene?: Scene;
-    camera?: TresCamera;
 };
 declare const _sfc_main: import("vue").DefineComponent<{
     enabled: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     children: {
         type: __PropType<TresObject[] | undefined>;
@@ -26,14 +24,17 @@ declare const _sfc_main: import("vue").DefineComponent<{
     depthBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: undefined;
     };
     disableNormalPass: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     stencilBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: undefined;
     };
     resolutionScale: {
         type: __PropType<number | undefined>;
@@ -42,27 +43,23 @@ declare const _sfc_main: import("vue").DefineComponent<{
     autoClear: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     multisampling: {
         type: __PropType<number | undefined>;
         required: false;
+        default: number;
     };
     frameBufferType: {
         type: __PropType<number | undefined>;
         required: false;
-    };
-    scene: {
-        type: __PropType<Scene | undefined>;
-        required: false;
-    };
-    camera: {
-        type: __PropType<TresCamera | undefined>;
-        required: false;
+        default: 1016;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     enabled: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     children: {
         type: __PropType<TresObject[] | undefined>;
@@ -71,14 +68,17 @@ declare const _sfc_main: import("vue").DefineComponent<{
     depthBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: undefined;
     };
     disableNormalPass: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     stencilBuffer: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: undefined;
     };
     resolutionScale: {
         type: __PropType<number | undefined>;
@@ -87,22 +87,25 @@ declare const _sfc_main: import("vue").DefineComponent<{
     autoClear: {
         type: __PropType<boolean | undefined>;
         required: false;
+        default: boolean;
     };
     multisampling: {
         type: __PropType<number | undefined>;
         required: false;
+        default: number;
     };
     frameBufferType: {
         type: __PropType<number | undefined>;
         required: false;
-    };
-    scene: {
-        type: __PropType<Scene | undefined>;
-        required: false;
-    };
-    camera: {
-        type: __PropType<TresCamera | undefined>;
-        required: false;
-    };
-}>>, {}, {}>;
+        default: 1016;
+    };
+}>>, {
+    enabled: boolean | undefined;
+    depthBuffer: boolean | undefined;
+    disableNormalPass: boolean | undefined;
+    stencilBuffer: boolean | undefined;
+    autoClear: boolean | undefined;
+    multisampling: number | undefined;
+    frameBufferType: number | undefined;
+}, {}>;
 export default _sfc_main;

package/dist/core/effects/Bloom.vue.d.ts

@@ -1,5 +1,5 @@
 import type { PropType as __PropType } from 'vue';
-import { BlurPass, KernelSize, BlendFunction } from 'postprocessing';
+import { KernelSize, BlendFunction } from 'postprocessing';
 export type BloomProps = {
     blendFunction?: BlendFunction;
     /**
@@ -10,27 +10,6 @@ export type BloomProps = {
      * @memberof BloomProps
      */
     intensity?: number;
-    /**
-     *  An efficient, incremental blur pass.
-     *
-     * @type {BlurPass}
-     * @memberof BloomProps
-     */
-    blurPass?: BlurPass;
-    /**
-     * The width of the render
-     *
-     * @type {number}
-     * @memberof BloomProps
-     */
-    width?: number;
-    /**
-     * The height of the render
-     *
-     * @type {number}
-     * @memberof BloomProps
-     */
-    height?: number;
     /**
      * The kernel size.
      *
@@ -77,18 +56,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<number | undefined>;
         required: false;
     };
-    blurPass: {
-        type: __PropType<import("postprocessing").KawaseBlurPass | undefined>;
-        required: false;
-    };
-    width: {
-        type: __PropType<number | undefined>;
-        required: false;
-    };
-    height: {
-        type: __PropType<number | undefined>;
-        required: false;
-    };
     kernelSize: {
         type: __PropType<KernelSize | undefined>;
         required: false;
@@ -114,18 +81,6 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<number | undefined>;
         required: false;
     };
-    blurPass: {
-        type: __PropType<import("postprocessing").KawaseBlurPass | undefined>;
-        required: false;
-    };
-    width: {
-        type: __PropType<number | undefined>;
-        required: false;
-    };
-    height: {
-        type: __PropType<number | undefined>;
-        required: false;
-    };
     kernelSize: {
         type: __PropType<KernelSize | undefined>;
         required: false;

package/dist/core/effects/Glitch.vue.d.ts

@@ -78,7 +78,7 @@ export interface GlitchProps {
      * @type {Texture}
      * @memberof GlitchProps
      */
-    peturbationMap?: Texture;
+    perturbationMap?: Texture;
     /**
      * The size of the generated noise map. Will be ignored if a perturbation map is provided.
      *
@@ -126,7 +126,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<Vector2 | undefined>;
         required: false;
     };
-    peturbationMap: {
+    perturbationMap: {
         type: __PropType<Texture | undefined>;
         required: false;
     };
@@ -171,7 +171,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         type: __PropType<Vector2 | undefined>;
         required: false;
     };
-    peturbationMap: {
+    perturbationMap: {
         type: __PropType<Texture | undefined>;
         required: false;
     };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import EffectComposer from './core/EffectComposer.vue';
 import Bloom from './core/effects/Bloom.vue';
 import Glitch from './core/effects/Glitch.vue';
 import Outline from './core/effects/Outline.vue';
-export { EffectComposer, Bloom, Glitch, Outline };
+import EffectComposer from './core/EffectComposer.vue';
+export { EffectComposer, Bloom, Outline, Glitch };

package/dist/tres-postprocessing.js

@@ -1,302 +1,74 @@
 /**
  * name: @tresjs/post-processing
- * version: v0.3.0
+ * version: v0.4.0
  * (c) 2023
  * description: Post-processing library for TresJS
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-import { inject as C, getCurrentInstance as k, onMounted as I, nextTick as q, getCurrentScope as J, onScopeDispose as Q, unref as D, ref as b, watch as p, computed as y, defineComponent as O, shallowRef as T, provide as Z, watchEffect as P, renderSlot as _, toRaw as S, onUnmounted as F } from "vue";
-import { HalfFloatType as ee } from "three";
-import { useTres as te, useRenderLoop as ne, normalizeColor as R } from "@tresjs/core";
-import { EffectComposer as ae, RenderPass as le, NormalPass as ue, DepthDownsamplingPass as oe, BlendFunction as W, BloomEffect as ie, EffectPass as L, GlitchMode as j, GlitchEffect as re, OutlineEffect as G } from "postprocessing";
-function A() {
-  const { state: e, setState: a } = C("useTres", te()), n = C("extend") || (() => {
-  });
-  return {
-    state: e,
-    setState: a,
-    extend: n
-  };
-}
-let w;
-function se() {
-  var e;
-  if (w !== void 0)
-    return w;
-  try {
-    let a;
-    const n = document.createElement("canvas");
-    return w = !!(window.WebGL2RenderingContext && (a = n.getContext("webgl2"))), a && ((e = a.getExtension("WEBGL_lose_context")) == null || e.loseContext()), w;
-  } catch {
-    return w = !1;
-  }
-}
-function N(e) {
-  return J() ? (Q(e), !0) : !1;
-}
-function H(e) {
-  return typeof e == "function" ? e() : D(e);
-}
-const ce = typeof window < "u", de = () => {
-};
-function fe(e, a = !0) {
-  k() ? I(e) : a ? e() : q(e);
-}
-function E(e) {
-  var a;
-  const n = H(e);
-  return (a = n == null ? void 0 : n.$el) != null ? a : n;
-}
-const X = ce ? window : void 0;
-function M(...e) {
-  let a, n, t, l;
-  if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([n, t, l] = e, a = X) : [a, n, t, l] = e, !a)
-    return de;
-  Array.isArray(n) || (n = [n]), Array.isArray(t) || (t = [t]);
-  const r = [], c = () => {
-    r.forEach((i) => i()), r.length = 0;
-  }, f = (i, o, s, d) => (i.addEventListener(o, s, d), () => i.removeEventListener(o, s, d)), v = p(
-    () => [E(a), H(l)],
-    ([i, o]) => {
-      c(), i && r.push(
-        ...n.flatMap((s) => t.map((d) => f(i, s, d, o)))
-      );
-    },
-    { immediate: !0, flush: "post" }
-  ), u = () => {
-    v(), c();
-  };
-  return N(u), u;
-}
-function ve() {
-  const e = b(!1);
-  return k() && I(() => {
-    e.value = !0;
-  }), e;
-}
-function me(e) {
-  const a = ve();
-  return y(() => (a.value, !!e()));
-}
-var $ = Object.getOwnPropertySymbols, he = Object.prototype.hasOwnProperty, be = Object.prototype.propertyIsEnumerable, ge = (e, a) => {
-  var n = {};
-  for (var t in e)
-    he.call(e, t) && a.indexOf(t) < 0 && (n[t] = e[t]);
-  if (e != null && $)
-    for (var t of $(e))
-      a.indexOf(t) < 0 && be.call(e, t) && (n[t] = e[t]);
-  return n;
-};
-function Se(e, a, n = {}) {
-  const t = n, { window: l = X } = t, r = ge(t, ["window"]);
-  let c;
-  const f = me(() => l && "ResizeObserver" in l), v = () => {
-    c && (c.disconnect(), c = void 0);
-  }, u = y(
-    () => Array.isArray(e) ? e.map((s) => E(s)) : [E(e)]
-  ), i = p(
-    u,
-    (s) => {
-      if (v(), f.value && l) {
-        c = new ResizeObserver(a);
-        for (const d of s)
-          d && c.observe(d, r);
-      }
-    },
-    { immediate: !0, flush: "post", deep: !0 }
-  ), o = () => {
-    v(), i();
-  };
-  return N(o), {
-    isSupported: f,
-    stop: o
-  };
-}
-function pe(e, a = {}) {
-  const {
-    reset: n = !0,
-    windowResize: t = !0,
-    windowScroll: l = !0,
-    immediate: r = !0
-  } = a, c = b(0), f = b(0), v = b(0), u = b(0), i = b(0), o = b(0), s = b(0), d = b(0);
-  function m() {
-    const g = E(e);
-    if (!g) {
-      n && (c.value = 0, f.value = 0, v.value = 0, u.value = 0, i.value = 0, o.value = 0, s.value = 0, d.value = 0);
-      return;
-    }
-    const h = g.getBoundingClientRect();
-    c.value = h.height, f.value = h.bottom, v.value = h.left, u.value = h.right, i.value = h.top, o.value = h.width, s.value = h.x, d.value = h.y;
-  }
-  return Se(e, m), p(() => E(e), (g) => !g && m()), l && M("scroll", m, { capture: !0, passive: !0 }), t && M("resize", m, { passive: !0 }), fe(() => {
-    r && m();
-  }), {
-    height: c,
-    bottom: f,
-    left: v,
-    right: u,
-    top: i,
-    width: o,
-    x: s,
-    y: d,
-    update: m
-  };
-}
-const z = Symbol(), Ee = /* @__PURE__ */ O({
-  __name: "EffectComposer",
-  props: {
-    enabled: { type: Boolean, default: !0 },
-    children: {},
-    depthBuffer: { type: Boolean },
-    disableNormalPass: { type: Boolean, default: !1 },
-    stencilBuffer: { type: Boolean },
-    resolutionScale: {},
-    autoClear: { type: Boolean, default: !0 },
-    multisampling: { default: 8 },
-    frameBufferType: { default: () => ee },
-    scene: {},
-    camera: {}
-  },
-  setup(e) {
-    const { state: a } = A(), n = T(null), t = y(() => e.scene || a.scene), l = y(() => e.camera || a.camera);
-    let r = null, c = null;
-    const f = se();
-    Z(z, n);
-    function v() {
-      n.value && (c = new ue(t.value, l.value), c.enabled = !1, n.value.addPass(c), e.resolutionScale !== void 0 && f && (r = new oe({
-        normalBuffer: c.texture,
-        resolutionScale: e.resolutionScale
-      }), r.enabled = !1, n.value.addPass(r)));
-    }
-    const u = y(() => {
-      var d;
-      return (d = a.canvas) == null ? void 0 : d.value;
-    }), { width: i, height: o } = pe(u);
-    P(() => {
-      n.value && i.value && o.value && n.value.setSize(i.value, o.value);
-    }), P(() => {
-      a.renderer && t.value && l.value && (n.value = new ae(a.renderer, {
-        depthBuffer: e.depthBuffer,
-        stencilBuffer: e.stencilBuffer,
-        multisampling: e.multisampling > 0 && f ? e.multisampling : 0,
-        frameBufferType: e.frameBufferType
-      }), n.value.addPass(new le(t.value, l.value)), e.disableNormalPass || v());
-    });
-    const { onLoop: s } = ne();
-    return s(({ delta: d }) => {
-      if (e.enabled && a.renderer && n.value && i.value && o.value) {
-        const m = a.renderer.autoClear;
-        a.renderer.autoClear = e.autoClear, e.stencilBuffer && !e.autoClear && a.renderer.clearStencil(), n.value.render(d), a.renderer.autoClear = m;
-      }
-    }), (d, m) => _(d.$slots, "default");
-  }
-}), Be = /* @__PURE__ */ O({
+import { defineComponent as _, inject as T, shallowRef as g, watchEffect as h, onUnmounted as w, computed as j, watch as F, provide as H, renderSlot as I } from "vue";
+import { useTresContext as P, normalizeColor as z, useRenderLoop as X } from "@tresjs/core";
+import { BloomEffect as O, EffectPass as M, GlitchEffect as k, GlitchMode as Y, OutlineEffect as A, EffectComposer as R, RenderPass as K, NormalPass as U, DepthDownsamplingPass as q } from "postprocessing";
+import { HalfFloatType as G } from "three";
+const x = Symbol(), ee = /* @__PURE__ */ _({
   __name: "Bloom",
   props: {
-    blendFunction: { default: () => W.ADD },
-    intensity: { default: 1 },
-    blurPass: {},
-    width: {},
-    height: {},
+    blendFunction: {},
+    intensity: {},
     kernelSize: {},
-    luminanceThreshold: { default: 0.9 },
-    luminanceSmoothing: { default: 0.025 },
-    mipmapBlur: { type: Boolean, default: !1 }
+    luminanceThreshold: {},
+    luminanceSmoothing: {},
+    mipmapBlur: { type: Boolean }
   },
-  setup(e, { expose: a }) {
-    const { state: n } = A(), t = C(z), l = b(null), r = b(null);
-    a({ pass: l, effect: r });
-    function c() {
-      r.value = new ie({
-        blendFunction: e.blendFunction,
-        mipmapBlur: e.mipmapBlur,
-        intensity: e.intensity,
-        luminanceThreshold: e.luminanceThreshold,
-        luminanceSmoothing: e.luminanceSmoothing
-      }), l.value = new L(D(n.camera), S(r.value));
-    }
-    function f() {
-      var i, o, s;
-      (i = r.value) == null || i.dispose(), (o = l.value) == null || o.dispose(), (s = t == null ? void 0 : t.value) == null || s.removePass(S(l.value));
-    }
-    const v = p(
-      () => [n.camera, t == null ? void 0 : t.value],
-      () => {
-        var i;
-        n.camera && t && t.value && (c(), (i = t == null ? void 0 : t.value) == null || i.addPass(S(l.value)));
-      }
-    ), u = p(
-      () => [e.blendFunction, e.mipmapBlur, e.intensity, e.luminanceThreshold, e.luminanceSmoothing],
-      () => {
-        var i;
-        l.value && (f(), c(), (i = t == null ? void 0 : t.value) == null || i.addPass(S(l.value)));
-      }
-    );
-    return F(() => {
-      f(), v(), u();
-    }), (i, o) => null;
+  setup(f, { expose: o }) {
+    const l = f, n = T(x), t = g(null), e = g(null);
+    o({ pass: t, effect: e });
+    const { camera: i } = P();
+    let s;
+    return s = h(() => {
+      !i.value || !(n != null && n.value) || (s == null || s(), !e.value && (e.value = new O(l), t.value = new M(i.value, e.value), n.value.addPass(t.value)));
+    }), h(() => {
+      if (!e.value)
+        return;
+      const a = new O();
+      e.value.intensity = l.intensity !== void 0 ? l.intensity : a.intensity, e.value.kernelSize = l.kernelSize !== void 0 ? l.kernelSize : a.kernelSize, e.value.luminanceMaterial.smoothing = l.luminanceSmoothing !== void 0 ? l.luminanceSmoothing : a.luminanceMaterial.smoothing, e.value.luminanceMaterial.threshold = l.luminanceThreshold !== void 0 ? l.luminanceThreshold : a.luminanceMaterial.threshold, a.dispose();
+    }), w(() => {
+      var a, d, v;
+      t.value && ((a = n == null ? void 0 : n.value) == null || a.removePass(t.value)), (d = e.value) == null || d.dispose(), (v = t.value) == null || v.dispose();
+    }), (a, d) => null;
   }
-}), xe = /* @__PURE__ */ O({
+}), le = /* @__PURE__ */ _({
   __name: "Glitch",
   props: {
-    blendFunction: { default: () => W.ADD },
+    blendFunction: {},
     delay: {},
     duration: {},
     strength: {},
     mode: {},
     active: { type: Boolean },
-    ratio: { default: 0.85 },
-    columns: { default: 0.05 },
+    ratio: {},
+    columns: {},
     chromaticAberrationOffset: {},
-    peturbationMap: {},
-    dtSize: { default: 64 }
+    perturbationMap: {},
+    dtSize: {}
   },
-  setup(e, { expose: a }) {
-    const { state: n } = A(), t = C(z), l = b(null), r = b(null);
-    a({ pass: l });
-    function c() {
-      r.value = new re({
-        blendFunction: e.blendFunction,
-        delay: e.delay,
-        duration: e.duration,
-        strength: e.strength,
-        ratio: e.ratio,
-        columns: e.columns,
-        chromaticAberrationOffset: e.chromaticAberrationOffset,
-        dtSize: e.dtSize
-      }), l.value = new L(D(n.camera), S(r.value));
-    }
-    function f() {
-      var o, s, d;
-      (o = r.value) == null || o.dispose(), (s = l.value) == null || s.dispose(), (d = t == null ? void 0 : t.value) == null || d.removePass(S(l.value));
-    }
-    const v = p(
-      () => [n.camera, t == null ? void 0 : t.value],
-      () => {
-        var o;
-        n.camera && t && t.value && (c(), (o = t == null ? void 0 : t.value) == null || o.addPass(S(l.value)));
-      }
-    ), u = p(
-      () => [e.delay, e.duration, e.strength, e.ratio, e.columns, e.chromaticAberrationOffset, e.peturbationMap, e.dtSize],
-      () => {
-        var o, s;
-        l.value && ((o = t == null ? void 0 : t.value) == null || o.removePass(S(l.value)), c(), (s = t == null ? void 0 : t.value) == null || s.addPass(S(l.value)));
-      }
-    );
-    P(() => {
-      l.value && (l.value.mode = e.active ? e.mode || j.SPORADIC : j.DISABLED);
-    });
-    const i = p(
-      () => e.active,
-      (o) => {
-        l.value && (l.value.enabled = o);
-      }
-    );
-    return F(() => {
-      f(), v(), u(), i();
-    }), (o, s) => null;
+  setup(f, { expose: o }) {
+    const l = f, n = T(x), t = g(null), e = g(null);
+    o({ pass: t, effect: e });
+    const { camera: i } = P();
+    let s;
+    return s = h(() => {
+      !i.value || !(n != null && n.value) || (s == null || s(), !e.value && (e.value = new k(l), t.value = new M(i.value, e.value), n.value.addPass(t.value)));
+    }), h(() => {
+      if (!e.value)
+        return;
+      const a = new k(), d = () => l.mode !== void 0 ? l.active === !1 ? Y.DISABLED : l.mode : a.mode;
+      e.value.mode = d(), e.value.ratio = l.ratio !== void 0 ? l.ratio : a.ratio, e.value.delay = l.delay !== void 0 ? l.delay : a.delay, e.value.columns = l.columns !== void 0 ? l.columns : a.columns, e.value.duration = l.duration !== void 0 ? l.duration : a.duration, e.value.strength = l.strength !== void 0 ? l.strength : a.strength, e.value.perturbationMap = l.perturbationMap !== void 0 ? l.perturbationMap : a.perturbationMap, e.value.chromaticAberrationOffset = l.chromaticAberrationOffset !== void 0 ? l.chromaticAberrationOffset : a.chromaticAberrationOffset;
+    }), w(() => {
+      var a, d, v;
+      t.value && ((a = n == null ? void 0 : n.value) == null || a.removePass(t.value)), (d = e.value) == null || d.dispose(), (v = t.value) == null || v.dispose();
+    }), (a, d) => null;
   }
-}), Oe = /* @__PURE__ */ O({
+}), ae = /* @__PURE__ */ _({
   __name: "Outline",
   props: {
     outlinedObjects: {},
@@ -315,78 +87,143 @@ const z = Symbol(), Ee = /* @__PURE__ */ O({
     hiddenEdgeColor: {},
     visibleEdgeColor: {}
   },
-  setup(e) {
-    const a = e, { state: n } = A(), t = C(z), l = T(null), r = T(null), c = (u) => u !== void 0 ? R(u).getHex() : void 0, f = y(() => {
+  setup(f, { expose: o }) {
+    const l = f, n = T(x), t = g(null), e = g(null);
+    o({ pass: t, effect: e });
+    const i = (u) => u !== void 0 ? z(u).getHex() : void 0, s = j(() => {
       const {
         blur: u,
-        xRay: i,
-        kernelSize: o,
-        pulseSpeed: s,
-        resolutionX: d,
-        resolutionY: m,
-        patternScale: g,
-        edgeStrength: h,
-        multisampling: B,
-        blendFunction: x,
-        patternTexture: Y,
-        resolutionScale: K,
-        hiddenEdgeColor: U,
-        visibleEdgeColor: V
-      } = a;
+        xRay: c,
+        kernelSize: p,
+        pulseSpeed: r,
+        resolutionX: m,
+        resolutionY: S,
+        patternScale: B,
+        edgeStrength: C,
+        multisampling: y,
+        blendFunction: E,
+        patternTexture: N,
+        resolutionScale: D,
+        hiddenEdgeColor: $,
+        visibleEdgeColor: W
+      } = l;
       return {
         blur: u,
-        xRay: i,
-        kernelSize: o,
-        pulseSpeed: s,
-        resolutionX: d,
-        resolutionY: m,
-        patternScale: g,
-        edgeStrength: h,
-        blendFunction: x,
-        multisampling: B,
-        patternTexture: Y,
-        resolutionScale: K,
-        hiddenEdgeColor: c(U),
-        visibleEdgeColor: c(V)
+        xRay: c,
+        kernelSize: p,
+        pulseSpeed: r,
+        resolutionX: m,
+        resolutionY: S,
+        patternScale: B,
+        edgeStrength: C,
+        blendFunction: E,
+        multisampling: y,
+        patternTexture: N,
+        resolutionScale: D,
+        hiddenEdgeColor: i($),
+        visibleEdgeColor: i(W)
       };
-    }), v = P(() => {
-      var u;
-      n.camera && t && t.value && n.scene && (r.value = new G(n.scene, n.camera, f.value), l.value = new L(n.camera, r.value), (u = t.value) == null || u.addPass(l.value), v());
-    });
-    return p(
-      [() => a.outlinedObjects, r],
-      // whatchEffect is intentionally not used here as it would result in an endless loop
+    }), { camera: a, scene: d } = P();
+    let v;
+    return v = h(() => {
+      !a.value || !(n != null && n.value) || !d.value || (v == null || v(), !e.value && (e.value = new A(d.value, a.value, s.value), t.value = new M(a.value, e.value), n.value.addPass(t.value)));
+    }), F(
+      [() => l.outlinedObjects, e],
+      // watchEffect is intentionally not used here as it would result in an endless loop
       () => {
         var u;
-        (u = r.value) == null || u.selection.set(a.outlinedObjects || []);
+        (u = e.value) == null || u.selection.set(l.outlinedObjects || []);
       },
       {
         immediate: !0
       }
-    ), P(() => {
-      if (!r.value)
+    ), h(() => {
+      if (!e.value)
         return;
-      const u = new G(), {
-        blur: i,
-        xRay: o,
-        kernelSize: s,
-        pulseSpeed: d,
-        patternScale: m,
-        edgeStrength: g,
-        multisampling: h,
-        hiddenEdgeColor: B,
-        visibleEdgeColor: x
-      } = f.value;
-      r.value.blur = i !== void 0 ? i : u.blur, r.value.xRay = o !== void 0 ? o : u.xRay, r.value.pulseSpeed = d !== void 0 ? d : u.pulseSpeed, r.value.kernelSize = s !== void 0 ? s : u.kernelSize, r.value.edgeStrength = g !== void 0 ? g : u.edgeStrength, r.value.patternScale = m !== void 0 ? m : u.patternScale, r.value.multisampling = h !== void 0 ? h : u.multisampling, r.value.hiddenEdgeColor = B !== void 0 ? R(B) : u.hiddenEdgeColor, r.value.visibleEdgeColor = x !== void 0 ? R(x) : u.visibleEdgeColor, u.dispose();
-    }), F(() => {
-      var u, i, o, s;
-      (u = r.value) == null || u.selection.clear(), l.value && ((i = t == null ? void 0 : t.value) == null || i.removePass(l.value)), (o = r.value) == null || o.dispose(), (s = l.value) == null || s.dispose();
-    }), (u, i) => null;
+      const u = new A(), {
+        blur: c,
+        xRay: p,
+        kernelSize: r,
+        pulseSpeed: m,
+        patternScale: S,
+        edgeStrength: B,
+        multisampling: C,
+        hiddenEdgeColor: y,
+        visibleEdgeColor: E
+      } = s.value;
+      e.value.blur = c !== void 0 ? c : u.blur, e.value.xRay = p !== void 0 ? p : u.xRay, e.value.pulseSpeed = m !== void 0 ? m : u.pulseSpeed, e.value.kernelSize = r !== void 0 ? r : u.kernelSize, e.value.edgeStrength = B !== void 0 ? B : u.edgeStrength, e.value.patternScale = S !== void 0 ? S : u.patternScale, e.value.multisampling = C !== void 0 ? C : u.multisampling, e.value.hiddenEdgeColor = y !== void 0 ? z(y) : u.hiddenEdgeColor, e.value.visibleEdgeColor = E !== void 0 ? z(E) : u.visibleEdgeColor, u.dispose();
+    }), w(() => {
+      var u, c, p, r;
+      (u = e.value) == null || u.selection.clear(), t.value && ((c = n == null ? void 0 : n.value) == null || c.removePass(t.value)), (p = e.value) == null || p.dispose(), (r = t.value) == null || r.dispose();
+    }), (u, c) => null;
+  }
+});
+let b;
+function L() {
+  var f;
+  if (b !== void 0)
+    return b;
+  try {
+    let o;
+    const l = document.createElement("canvas");
+    return b = !!(window.WebGL2RenderingContext && (o = l.getContext("webgl2"))), o && ((f = o.getExtension("WEBGL_lose_context")) == null || f.loseContext()), b;
+  } catch {
+    return b = !1;
+  }
+}
+const te = /* @__PURE__ */ _({
+  __name: "EffectComposer",
+  props: {
+    enabled: { type: Boolean, default: !0 },
+    children: {},
+    depthBuffer: { type: Boolean, default: void 0 },
+    disableNormalPass: { type: Boolean, default: !1 },
+    stencilBuffer: { type: Boolean, default: void 0 },
+    resolutionScale: {},
+    autoClear: { type: Boolean, default: !0 },
+    multisampling: { default: 0 },
+    frameBufferType: { default: G }
+  },
+  setup(f) {
+    const o = f, { scene: l, camera: n, renderer: t, sizes: e } = P(), i = g(null);
+    let s = null, a = null;
+    H(x, i);
+    const d = () => {
+      i.value && (a = new U(l.value, n.value), a.enabled = !1, i.value.addPass(a), o.resolutionScale !== void 0 && L() && (s = new q({
+        normalBuffer: a.texture,
+        resolutionScale: o.resolutionScale
+      }), s.enabled = !1, i.value.addPass(s)));
+    };
+    h(() => {
+      i.value && e.width.value && e.height.value && i.value.setSize(e.width.value, e.height.value);
+    });
+    const v = j(() => {
+      const r = new R(), m = {
+        depthBuffer: o.depthBuffer !== void 0 ? o.depthBuffer : r.inputBuffer.depthBuffer,
+        stencilBuffer: o.stencilBuffer !== void 0 ? o.stencilBuffer : r.inputBuffer.stencilBuffer,
+        multisampling: L() ? 0 : o.multisampling !== void 0 ? o.multisampling : r.multisampling,
+        frameBufferType: o.frameBufferType !== void 0 ? o.frameBufferType : G
+      };
+      return r.dispose(), m;
+    }), u = () => {
+      !t.value && !l.value && !n.value || (i.value = new R(t.value, v.value), i.value.addPass(new K(l.value, n.value)), o.disableNormalPass || d());
+    }, c = F([e.height, e.width], () => {
+      !e.height.value && !e.width.value || (h(u), c == null || c());
+    }), { onLoop: p } = X();
+    return p(({ delta: r }) => {
+      if (o.enabled && t.value && i.value && e.width.value && e.height.value) {
+        const m = t.value.autoClear;
+        t.value.autoClear = o.autoClear, o.stencilBuffer && !o.autoClear && t.value.clearStencil(), i.value.render(r), t.value.autoClear = m;
+      }
+    }), w(() => {
+      var r;
+      (r = i.value) == null || r.dispose();
+    }), (r, m) => I(r.$slots, "default");
   }
 });
 export {
-  Be as Bloom,
-  Ee as EffectComposer,
-  xe as Glitch,
-  Oe as Outline
+  ee as Bloom,
+  te as EffectComposer,
+  le as Glitch,
+  ae as Outline
 };

package/dist/tres-postprocessing.umd.cjs

@@ -1,8 +1,8 @@
 /**
  * name: @tresjs/post-processing
- * version: v0.3.0
+ * version: v0.4.0
  * (c) 2023
  * description: Post-processing library for TresJS
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
  */
-(function(b,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("three"),require("@tresjs/core"),require("postprocessing")):typeof define=="function"&&define.amd?define(["exports","vue","three","@tresjs/core","postprocessing"],t):(b=typeof globalThis<"u"?globalThis:b||self,t(b["tres-postprocessing"]={},b.Vue,b.Three,b.TresjsCore,b.Postprocessing))})(this,function(b,t,j,g,v){"use strict";function P(){const{state:e,setState:l}=t.inject("useTres",g.useTres()),a=t.inject("extend")||(()=>{});return{state:e,setState:l,extend:a}}let C;function F(){var e;if(C!==void 0)return C;try{let l;const a=document.createElement("canvas");return C=!!(window.WebGL2RenderingContext&&(l=a.getContext("webgl2"))),l&&((e=l.getExtension("WEBGL_lose_context"))==null||e.loseContext()),C}catch{return C=!1}}function R(e){return t.getCurrentScope()?(t.onScopeDispose(e),!0):!1}function x(e){return typeof e=="function"?e():t.unref(e)}const M=typeof window<"u",D=()=>{};function L(e,l=!0){t.getCurrentInstance()?t.onMounted(e):l?e():t.nextTick(e)}function E(e){var l;const a=x(e);return(l=a==null?void 0:a.$el)!=null?l:a}const A=M?window:void 0;function z(...e){let l,a,n,o;if(typeof e[0]=="string"||Array.isArray(e[0])?([a,n,o]=e,l=A):[l,a,n,o]=e,!l)return D;Array.isArray(a)||(a=[a]),Array.isArray(n)||(n=[n]);const s=[],d=()=>{s.forEach(u=>u()),s.length=0},m=(u,r,c,f)=>(u.addEventListener(r,c,f),()=>u.removeEventListener(r,c,f)),h=t.watch(()=>[E(l),x(o)],([u,r])=>{d(),u&&s.push(...a.flatMap(c=>n.map(f=>m(u,c,f,r))))},{immediate:!0,flush:"post"}),i=()=>{h(),d()};return R(i),i}function G(){const e=t.ref(!1);return t.getCurrentInstance()&&t.onMounted(()=>{e.value=!0}),e}function $(e){const l=G();return t.computed(()=>(l.value,!!e()))}var T=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable,W=(e,l)=>{var a={};for(var n in e)k.call(e,n)&&l.indexOf(n)<0&&(a[n]=e[n]);if(e!=null&&T)for(var n of T(e))l.indexOf(n)<0&&I.call(e,n)&&(a[n]=e[n]);return a};function N(e,l,a={}){const n=a,{window:o=A}=n,s=W(n,["window"]);let d;const m=$(()=>o&&"ResizeObserver"in o),h=()=>{d&&(d.disconnect(),d=void 0)},i=t.computed(()=>Array.isArray(e)?e.map(c=>E(c)):[E(e)]),u=t.watch(i,c=>{if(h(),m.value&&o){d=new ResizeObserver(l);for(const f of c)f&&d.observe(f,s)}},{immediate:!0,flush:"post",deep:!0}),r=()=>{h(),u()};return R(r),{isSupported:m,stop:r}}function q(e,l={}){const{reset:a=!0,windowResize:n=!0,windowScroll:o=!0,immediate:s=!0}=l,d=t.ref(0),m=t.ref(0),h=t.ref(0),i=t.ref(0),u=t.ref(0),r=t.ref(0),c=t.ref(0),f=t.ref(0);function w(){const S=E(e);if(!S){a&&(d.value=0,m.value=0,h.value=0,i.value=0,u.value=0,r.value=0,c.value=0,f.value=0);return}const y=S.getBoundingClientRect();d.value=y.height,m.value=y.bottom,h.value=y.left,i.value=y.right,u.value=y.top,r.value=y.width,c.value=y.x,f.value=y.y}return N(e,w),t.watch(()=>E(e),S=>!S&&w()),o&&z("scroll",w,{capture:!0,passive:!0}),n&&z("resize",w,{passive:!0}),L(()=>{s&&w()}),{height:d,bottom:m,left:h,right:i,top:u,width:r,x:c,y:f,update:w}}const p=Symbol(),U=t.defineComponent({__name:"EffectComposer",props:{enabled:{type:Boolean,default:!0},children:{},depthBuffer:{type:Boolean},disableNormalPass:{type:Boolean,default:!1},stencilBuffer:{type:Boolean},resolutionScale:{},autoClear:{type:Boolean,default:!0},multisampling:{default:8},frameBufferType:{default:()=>j.HalfFloatType},scene:{},camera:{}},setup(e){const{state:l}=P(),a=t.shallowRef(null),n=t.computed(()=>e.scene||l.scene),o=t.computed(()=>e.camera||l.camera);let s=null,d=null;const m=F();t.provide(p,a);function h(){a.value&&(d=new v.NormalPass(n.value,o.value),d.enabled=!1,a.value.addPass(d),e.resolutionScale!==void 0&&m&&(s=new v.DepthDownsamplingPass({normalBuffer:d.texture,resolutionScale:e.resolutionScale}),s.enabled=!1,a.value.addPass(s)))}const i=t.computed(()=>{var f;return(f=l.canvas)==null?void 0:f.value}),{width:u,height:r}=q(i);t.watchEffect(()=>{a.value&&u.value&&r.value&&a.value.setSize(u.value,r.value)}),t.watchEffect(()=>{l.renderer&&n.value&&o.value&&(a.value=new v.EffectComposer(l.renderer,{depthBuffer:e.depthBuffer,stencilBuffer:e.stencilBuffer,multisampling:e.multisampling>0&&m?e.multisampling:0,frameBufferType:e.frameBufferType}),a.value.addPass(new v.RenderPass(n.value,o.value)),e.disableNormalPass||h())});const{onLoop:c}=g.useRenderLoop();return c(({delta:f})=>{if(e.enabled&&l.renderer&&a.value&&u.value&&r.value){const w=l.renderer.autoClear;l.renderer.autoClear=e.autoClear,e.stencilBuffer&&!e.autoClear&&l.renderer.clearStencil(),a.value.render(f),l.renderer.autoClear=w}}),(f,w)=>t.renderSlot(f.$slots,"default")}}),H=t.defineComponent({__name:"Bloom",props:{blendFunction:{default:()=>v.BlendFunction.ADD},intensity:{default:1},blurPass:{},width:{},height:{},kernelSize:{},luminanceThreshold:{default:.9},luminanceSmoothing:{default:.025},mipmapBlur:{type:Boolean,default:!1}},setup(e,{expose:l}){const{state:a}=P(),n=t.inject(p),o=t.ref(null),s=t.ref(null);l({pass:o,effect:s});function d(){s.value=new v.BloomEffect({blendFunction:e.blendFunction,mipmapBlur:e.mipmapBlur,intensity:e.intensity,luminanceThreshold:e.luminanceThreshold,luminanceSmoothing:e.luminanceSmoothing}),o.value=new v.EffectPass(t.unref(a.camera),t.toRaw(s.value))}function m(){var u,r,c;(u=s.value)==null||u.dispose(),(r=o.value)==null||r.dispose(),(c=n==null?void 0:n.value)==null||c.removePass(t.toRaw(o.value))}const h=t.watch(()=>[a.camera,n==null?void 0:n.value],()=>{var u;a.camera&&n&&n.value&&(d(),(u=n==null?void 0:n.value)==null||u.addPass(t.toRaw(o.value)))}),i=t.watch(()=>[e.blendFunction,e.mipmapBlur,e.intensity,e.luminanceThreshold,e.luminanceSmoothing],()=>{var u;o.value&&(m(),d(),(u=n==null?void 0:n.value)==null||u.addPass(t.toRaw(o.value)))});return t.onUnmounted(()=>{m(),h(),i()}),(u,r)=>null}}),V=t.defineComponent({__name:"Glitch",props:{blendFunction:{default:()=>v.BlendFunction.ADD},delay:{},duration:{},strength:{},mode:{},active:{type:Boolean},ratio:{default:.85},columns:{default:.05},chromaticAberrationOffset:{},peturbationMap:{},dtSize:{default:64}},setup(e,{expose:l}){const{state:a}=P(),n=t.inject(p),o=t.ref(null),s=t.ref(null);l({pass:o});function d(){s.value=new v.GlitchEffect({blendFunction:e.blendFunction,delay:e.delay,duration:e.duration,strength:e.strength,ratio:e.ratio,columns:e.columns,chromaticAberrationOffset:e.chromaticAberrationOffset,dtSize:e.dtSize}),o.value=new v.EffectPass(t.unref(a.camera),t.toRaw(s.value))}function m(){var r,c,f;(r=s.value)==null||r.dispose(),(c=o.value)==null||c.dispose(),(f=n==null?void 0:n.value)==null||f.removePass(t.toRaw(o.value))}const h=t.watch(()=>[a.camera,n==null?void 0:n.value],()=>{var r;a.camera&&n&&n.value&&(d(),(r=n==null?void 0:n.value)==null||r.addPass(t.toRaw(o.value)))}),i=t.watch(()=>[e.delay,e.duration,e.strength,e.ratio,e.columns,e.chromaticAberrationOffset,e.peturbationMap,e.dtSize],()=>{var r,c;o.value&&((r=n==null?void 0:n.value)==null||r.removePass(t.toRaw(o.value)),d(),(c=n==null?void 0:n.value)==null||c.addPass(t.toRaw(o.value)))});t.watchEffect(()=>{o.value&&(o.value.mode=e.active?e.mode||v.GlitchMode.SPORADIC:v.GlitchMode.DISABLED)});const u=t.watch(()=>e.active,r=>{o.value&&(o.value.enabled=r)});return t.onUnmounted(()=>{m(),h(),i(),u()}),(r,c)=>null}}),X=t.defineComponent({__name:"Outline",props:{outlinedObjects:{},blur:{type:Boolean},xRay:{type:Boolean},kernelSize:{},pulseSpeed:{},resolutionX:{},resolutionY:{},edgeStrength:{},patternScale:{},multisampling:{},blendFunction:{},patternTexture:{},resolutionScale:{},hiddenEdgeColor:{},visibleEdgeColor:{}},setup(e){const l=e,{state:a}=P(),n=t.inject(p),o=t.shallowRef(null),s=t.shallowRef(null),d=i=>i!==void 0?g.normalizeColor(i).getHex():void 0,m=t.computed(()=>{const{blur:i,xRay:u,kernelSize:r,pulseSpeed:c,resolutionX:f,resolutionY:w,patternScale:S,edgeStrength:y,multisampling:B,blendFunction:O,patternTexture:Y,resolutionScale:K,hiddenEdgeColor:J,visibleEdgeColor:Q}=l;return{blur:i,xRay:u,kernelSize:r,pulseSpeed:c,resolutionX:f,resolutionY:w,patternScale:S,edgeStrength:y,blendFunction:O,multisampling:B,patternTexture:Y,resolutionScale:K,hiddenEdgeColor:d(J),visibleEdgeColor:d(Q)}}),h=t.watchEffect(()=>{var i;a.camera&&n&&n.value&&a.scene&&(s.value=new v.OutlineEffect(a.scene,a.camera,m.value),o.value=new v.EffectPass(a.camera,s.value),(i=n.value)==null||i.addPass(o.value),h())});return t.watch([()=>l.outlinedObjects,s],()=>{var i;(i=s.value)==null||i.selection.set(l.outlinedObjects||[])},{immediate:!0}),t.watchEffect(()=>{if(!s.value)return;const i=new v.OutlineEffect,{blur:u,xRay:r,kernelSize:c,pulseSpeed:f,patternScale:w,edgeStrength:S,multisampling:y,hiddenEdgeColor:B,visibleEdgeColor:O}=m.value;s.value.blur=u!==void 0?u:i.blur,s.value.xRay=r!==void 0?r:i.xRay,s.value.pulseSpeed=f!==void 0?f:i.pulseSpeed,s.value.kernelSize=c!==void 0?c:i.kernelSize,s.value.edgeStrength=S!==void 0?S:i.edgeStrength,s.value.patternScale=w!==void 0?w:i.patternScale,s.value.multisampling=y!==void 0?y:i.multisampling,s.value.hiddenEdgeColor=B!==void 0?g.normalizeColor(B):i.hiddenEdgeColor,s.value.visibleEdgeColor=O!==void 0?g.normalizeColor(O):i.visibleEdgeColor,i.dispose()}),t.onUnmounted(()=>{var i,u,r,c;(i=s.value)==null||i.selection.clear(),o.value&&((u=n==null?void 0:n.value)==null||u.removePass(o.value)),(r=s.value)==null||r.dispose(),(c=o.value)==null||c.dispose()}),(i,u)=>null}});b.Bloom=H,b.EffectComposer=U,b.Glitch=V,b.Outline=X,Object.defineProperty(b,Symbol.toStringTag,{value:"Module"})});
+(function(v,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue"),require("@tresjs/core"),require("postprocessing"),require("three")):typeof define=="function"&&define.amd?define(["exports","vue","@tresjs/core","postprocessing","three"],l):(v=typeof globalThis<"u"?globalThis:v||self,l(v["tres-postprocessing"]={},v.Vue,v.TresjsCore,v.Postprocessing,v.Three))})(this,function(v,l,S,d,x){"use strict";const E=Symbol(),z=l.defineComponent({__name:"Bloom",props:{blendFunction:{},intensity:{},kernelSize:{},luminanceThreshold:{},luminanceSmoothing:{},mipmapBlur:{type:Boolean}},setup(h,{expose:i}){const t=h,o=l.inject(E),n=l.shallowRef(null),e=l.shallowRef(null);i({pass:n,effect:e});const{camera:r}=S.useTresContext();let f;return f=l.watchEffect(()=>{!r.value||!(o!=null&&o.value)||(f==null||f(),!e.value&&(e.value=new d.BloomEffect(t),n.value=new d.EffectPass(r.value,e.value),o.value.addPass(n.value)))}),l.watchEffect(()=>{if(!e.value)return;const a=new d.BloomEffect;e.value.intensity=t.intensity!==void 0?t.intensity:a.intensity,e.value.kernelSize=t.kernelSize!==void 0?t.kernelSize:a.kernelSize,e.value.luminanceMaterial.smoothing=t.luminanceSmoothing!==void 0?t.luminanceSmoothing:a.luminanceMaterial.smoothing,e.value.luminanceMaterial.threshold=t.luminanceThreshold!==void 0?t.luminanceThreshold:a.luminanceMaterial.threshold,a.dispose()}),l.onUnmounted(()=>{var a,c,m;n.value&&((a=o==null?void 0:o.value)==null||a.removePass(n.value)),(c=e.value)==null||c.dispose(),(m=n.value)==null||m.dispose()}),(a,c)=>null}}),R=l.defineComponent({__name:"Glitch",props:{blendFunction:{},delay:{},duration:{},strength:{},mode:{},active:{type:Boolean},ratio:{},columns:{},chromaticAberrationOffset:{},perturbationMap:{},dtSize:{}},setup(h,{expose:i}){const t=h,o=l.inject(E),n=l.shallowRef(null),e=l.shallowRef(null);i({pass:n,effect:e});const{camera:r}=S.useTresContext();let f;return f=l.watchEffect(()=>{!r.value||!(o!=null&&o.value)||(f==null||f(),!e.value&&(e.value=new d.GlitchEffect(t),n.value=new d.EffectPass(r.value,e.value),o.value.addPass(n.value)))}),l.watchEffect(()=>{if(!e.value)return;const a=new d.GlitchEffect,c=()=>t.mode!==void 0?t.active===!1?d.GlitchMode.DISABLED:t.mode:a.mode;e.value.mode=c(),e.value.ratio=t.ratio!==void 0?t.ratio:a.ratio,e.value.delay=t.delay!==void 0?t.delay:a.delay,e.value.columns=t.columns!==void 0?t.columns:a.columns,e.value.duration=t.duration!==void 0?t.duration:a.duration,e.value.strength=t.strength!==void 0?t.strength:a.strength,e.value.perturbationMap=t.perturbationMap!==void 0?t.perturbationMap:a.perturbationMap,e.value.chromaticAberrationOffset=t.chromaticAberrationOffset!==void 0?t.chromaticAberrationOffset:a.chromaticAberrationOffset}),l.onUnmounted(()=>{var a,c,m;n.value&&((a=o==null?void 0:o.value)==null||a.removePass(n.value)),(c=e.value)==null||c.dispose(),(m=n.value)==null||m.dispose()}),(a,c)=>null}}),O=l.defineComponent({__name:"Outline",props:{outlinedObjects:{},blur:{type:Boolean},xRay:{type:Boolean},kernelSize:{},pulseSpeed:{},resolutionX:{},resolutionY:{},edgeStrength:{},patternScale:{},multisampling:{},blendFunction:{},patternTexture:{},resolutionScale:{},hiddenEdgeColor:{},visibleEdgeColor:{}},setup(h,{expose:i}){const t=h,o=l.inject(E),n=l.shallowRef(null),e=l.shallowRef(null);i({pass:n,effect:e});const r=u=>u!==void 0?S.normalizeColor(u).getHex():void 0,f=l.computed(()=>{const{blur:u,xRay:p,kernelSize:g,pulseSpeed:s,resolutionX:C,resolutionY:w,patternScale:y,edgeStrength:B,multisampling:P,blendFunction:_,patternTexture:M,resolutionScale:k,hiddenEdgeColor:A,visibleEdgeColor:G}=t;return{blur:u,xRay:p,kernelSize:g,pulseSpeed:s,resolutionX:C,resolutionY:w,patternScale:y,edgeStrength:B,blendFunction:_,multisampling:P,patternTexture:M,resolutionScale:k,hiddenEdgeColor:r(A),visibleEdgeColor:r(G)}}),{camera:a,scene:c}=S.useTresContext();let m;return m=l.watchEffect(()=>{!a.value||!(o!=null&&o.value)||!c.value||(m==null||m(),!e.value&&(e.value=new d.OutlineEffect(c.value,a.value,f.value),n.value=new d.EffectPass(a.value,e.value),o.value.addPass(n.value)))}),l.watch([()=>t.outlinedObjects,e],()=>{var u;(u=e.value)==null||u.selection.set(t.outlinedObjects||[])},{immediate:!0}),l.watchEffect(()=>{if(!e.value)return;const u=new d.OutlineEffect,{blur:p,xRay:g,kernelSize:s,pulseSpeed:C,patternScale:w,edgeStrength:y,multisampling:B,hiddenEdgeColor:P,visibleEdgeColor:_}=f.value;e.value.blur=p!==void 0?p:u.blur,e.value.xRay=g!==void 0?g:u.xRay,e.value.pulseSpeed=C!==void 0?C:u.pulseSpeed,e.value.kernelSize=s!==void 0?s:u.kernelSize,e.value.edgeStrength=y!==void 0?y:u.edgeStrength,e.value.patternScale=w!==void 0?w:u.patternScale,e.value.multisampling=B!==void 0?B:u.multisampling,e.value.hiddenEdgeColor=P!==void 0?S.normalizeColor(P):u.hiddenEdgeColor,e.value.visibleEdgeColor=_!==void 0?S.normalizeColor(_):u.visibleEdgeColor,u.dispose()}),l.onUnmounted(()=>{var u,p,g,s;(u=e.value)==null||u.selection.clear(),n.value&&((p=o==null?void 0:o.value)==null||p.removePass(n.value)),(g=e.value)==null||g.dispose(),(s=n.value)==null||s.dispose()}),(u,p)=>null}});let b;function T(){var h;if(b!==void 0)return b;try{let i;const t=document.createElement("canvas");return b=!!(window.WebGL2RenderingContext&&(i=t.getContext("webgl2"))),i&&((h=i.getExtension("WEBGL_lose_context"))==null||h.loseContext()),b}catch{return b=!1}}const j=l.defineComponent({__name:"EffectComposer",props:{enabled:{type:Boolean,default:!0},children:{},depthBuffer:{type:Boolean,default:void 0},disableNormalPass:{type:Boolean,default:!1},stencilBuffer:{type:Boolean,default:void 0},resolutionScale:{},autoClear:{type:Boolean,default:!0},multisampling:{default:0},frameBufferType:{default:x.HalfFloatType}},setup(h){const i=h,{scene:t,camera:o,renderer:n,sizes:e}=S.useTresContext(),r=l.shallowRef(null);let f=null,a=null;l.provide(E,r);const c=()=>{r.value&&(a=new d.NormalPass(t.value,o.value),a.enabled=!1,r.value.addPass(a),i.resolutionScale!==void 0&&T()&&(f=new d.DepthDownsamplingPass({normalBuffer:a.texture,resolutionScale:i.resolutionScale}),f.enabled=!1,r.value.addPass(f)))};l.watchEffect(()=>{r.value&&e.width.value&&e.height.value&&r.value.setSize(e.width.value,e.height.value)});const m=l.computed(()=>{const s=new d.EffectComposer,C={depthBuffer:i.depthBuffer!==void 0?i.depthBuffer:s.inputBuffer.depthBuffer,stencilBuffer:i.stencilBuffer!==void 0?i.stencilBuffer:s.inputBuffer.stencilBuffer,multisampling:T()?0:i.multisampling!==void 0?i.multisampling:s.multisampling,frameBufferType:i.frameBufferType!==void 0?i.frameBufferType:x.HalfFloatType};return s.dispose(),C}),u=()=>{!n.value&&!t.value&&!o.value||(r.value=new d.EffectComposer(n.value,m.value),r.value.addPass(new d.RenderPass(t.value,o.value)),i.disableNormalPass||c())},p=l.watch([e.height,e.width],()=>{!e.height.value&&!e.width.value||(l.watchEffect(u),p==null||p())}),{onLoop:g}=S.useRenderLoop();return g(({delta:s})=>{if(i.enabled&&n.value&&r.value&&e.width.value&&e.height.value){const C=n.value.autoClear;n.value.autoClear=i.autoClear,i.stencilBuffer&&!i.autoClear&&n.value.clearStencil(),r.value.render(s),n.value.autoClear=C}}),l.onUnmounted(()=>{var s;(s=r.value)==null||s.dispose()}),(s,C)=>l.renderSlot(s.$slots,"default")}});v.Bloom=z,v.EffectComposer=j,v.Glitch=R,v.Outline=O,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/post-processing",
   "description": "Post-processing library for TresJS",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "type": "module",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "files": [
@@ -42,11 +42,11 @@
     "docs:preview": "vitepress preview docs"
   },
   "peerDependencies": {
-    "@tresjs/core": ">=2.3.0",
     "three": ">=0.133",
     "vue": ">=3.3"
   },
   "dependencies": {
+    "@tresjs/core": "^3.0.1",
     "@vueuse/core": "^10.2.0",
     "postprocessing": "^6.32.1",
     "three-stdlib": "^2.23.10"
@@ -54,8 +54,6 @@
   "devDependencies": {
     "@alvarosabu/prettier-config": "^1.3.0",
     "@release-it/conventional-changelog": "^5.1.1",
-    "@tresjs/cientos": "2.1.4",
-    "@tresjs/core": "2.3.0",
     "@types/three": "^0.152.1",
     "@vitejs/plugin-vue": "^4.2.3",
     "gsap": "^3.12.1",

package/dist/core/useCore.d.ts

@@ -1,11 +0,0 @@
-/**
- * Allows to use and extend the state of the core package.
- *
- * @export
- * @return {*}
- */
-export declare function useCore(): {
-    state: import("@tresjs/core").TresState;
-    setState: (key: string, value: any) => void;
-    extend: (objects: any) => void;
-};