gl-draw 0.9.0-beta.7 → 0.9.0-beta.71

package/dist/index.module.js

@@ -1,306 +1,79 @@
-var q = Object.defineProperty, Y = Object.defineProperties;
-var Z = Object.getOwnPropertyDescriptors;
-var _ = Object.getOwnPropertySymbols;
-var $ = Object.prototype.hasOwnProperty, J = Object.prototype.propertyIsEnumerable;
-var z = (n, e, t) => e in n ? q(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, y = (n, e) => {
+var V = Object.defineProperty, I = Object.defineProperties;
+var j = Object.getOwnPropertyDescriptors;
+var y = Object.getOwnPropertySymbols;
+var k = Object.prototype.hasOwnProperty, H = Object.prototype.propertyIsEnumerable;
+var R = (r, e, t) => e in r ? V(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t, v = (r, e) => {
   for (var t in e || (e = {}))
-    $.call(e, t) && z(n, t, e[t]);
-  if (_)
-    for (var t of _(e))
-      J.call(e, t) && z(n, t, e[t]);
-  return n;
-}, O = (n, e) => Y(n, Z(e));
-import * as f from "three";
-import Q from "deepmerge";
-import ee from "three/examples/jsm/libs/stats.module";
-import te from "lil-gui";
-import { d as ne } from "./disposeMesh.module.js";
+    k.call(e, t) && R(r, t, e[t]);
+  if (y)
+    for (var t of y(e))
+      H.call(e, t) && R(r, t, e[t]);
+  return r;
+}, S = (r, e) => I(r, j(e));
+import * as l from "three";
+import { ShaderMaterial as N, Uniform as z, REVISION as U } from "three";
+import * as M from "@tweenjs/tween.js";
+import { e as W } from "./events.module.js";
+import _ from "deepmerge";
+import X from "three/examples/jsm/libs/stats.module";
+import q from "lil-gui";
+import { T as Q, C as $ } from "./colorCorrection.module.js";
+import { d as Y } from "./disposeMesh.module.js";
 import "idb-keyval";
-import { OrbitControls as se } from "three/examples/jsm/controls/OrbitControls";
-import { CSS3DRenderer as re } from "three/examples/jsm/renderers/CSS3DRenderer";
-import { CSS2DRenderer as ie } from "three/examples/jsm/renderers/CSS2DRenderer";
-import { EffectComposer as oe, RenderPass as ae, CopyPass as ce, FXAAEffect as le, BlendFunction as fe, EffectPass as A, SelectiveBloomEffect as de } from "postprocessing";
-import { i as he } from "./isPlainObject.module.js";
-import { B as Ue } from "./BaseObject.module.js";
-import "./makePromiseCreator.module.js";
-var x = {}, ue = {
-  get exports() {
-    return x;
-  },
-  set exports(n) {
-    x = n;
-  }
-}, P = typeof Reflect == "object" ? Reflect : null, j = P && typeof P.apply == "function" ? P.apply : function(e, t, s) {
-  return Function.prototype.apply.call(e, t, s);
-}, L;
-P && typeof P.ownKeys == "function" ? L = P.ownKeys : Object.getOwnPropertySymbols ? L = function(e) {
-  return Object.getOwnPropertyNames(e).concat(Object.getOwnPropertySymbols(e));
-} : L = function(e) {
-  return Object.getOwnPropertyNames(e);
-};
-function me(n) {
-  console && console.warn && console.warn(n);
-}
-var B = Number.isNaN || function(e) {
-  return e !== e;
-};
-function l() {
-  l.init.call(this);
-}
-ue.exports = l;
-x.once = Ce;
-l.EventEmitter = l;
-l.prototype._events = void 0;
-l.prototype._eventsCount = 0;
-l.prototype._maxListeners = void 0;
-var D = 10;
-function R(n) {
-  if (typeof n != "function")
-    throw new TypeError('The "listener" argument must be of type Function. Received type ' + typeof n);
-}
-Object.defineProperty(l, "defaultMaxListeners", {
-  enumerable: !0,
-  get: function() {
-    return D;
-  },
-  set: function(n) {
-    if (typeof n != "number" || n < 0 || B(n))
-      throw new RangeError('The value of "defaultMaxListeners" is out of range. It must be a non-negative number. Received ' + n + ".");
-    D = n;
-  }
-});
-l.init = function() {
-  (this._events === void 0 || this._events === Object.getPrototypeOf(this)._events) && (this._events = /* @__PURE__ */ Object.create(null), this._eventsCount = 0), this._maxListeners = this._maxListeners || void 0;
-};
-l.prototype.setMaxListeners = function(e) {
-  if (typeof e != "number" || e < 0 || B(e))
-    throw new RangeError('The value of "n" is out of range. It must be a non-negative number. Received ' + e + ".");
-  return this._maxListeners = e, this;
-};
-function G(n) {
-  return n._maxListeners === void 0 ? l.defaultMaxListeners : n._maxListeners;
-}
-l.prototype.getMaxListeners = function() {
-  return G(this);
-};
-l.prototype.emit = function(e) {
-  for (var t = [], s = 1; s < arguments.length; s++)
-    t.push(arguments[s]);
-  var r = e === "error", o = this._events;
-  if (o !== void 0)
-    r = r && o.error === void 0;
-  else if (!r)
-    return !1;
-  if (r) {
-    var i;
-    if (t.length > 0 && (i = t[0]), i instanceof Error)
-      throw i;
-    var a = new Error("Unhandled error." + (i ? " (" + i.message + ")" : ""));
-    throw a.context = i, a;
-  }
-  var c = o[e];
-  if (c === void 0)
-    return !1;
-  if (typeof c == "function")
-    j(c, this, t);
-  else
-    for (var h = c.length, d = H(c, h), s = 0; s < h; ++s)
-      j(d[s], this, t);
-  return !0;
-};
-function N(n, e, t, s) {
-  var r, o, i;
-  if (R(t), o = n._events, o === void 0 ? (o = n._events = /* @__PURE__ */ Object.create(null), n._eventsCount = 0) : (o.newListener !== void 0 && (n.emit(
-    "newListener",
-    e,
-    t.listener ? t.listener : t
-  ), o = n._events), i = o[e]), i === void 0)
-    i = o[e] = t, ++n._eventsCount;
-  else if (typeof i == "function" ? i = o[e] = s ? [t, i] : [i, t] : s ? i.unshift(t) : i.push(t), r = G(n), r > 0 && i.length > r && !i.warned) {
-    i.warned = !0;
-    var a = new Error("Possible EventEmitter memory leak detected. " + i.length + " " + String(e) + " listeners added. Use emitter.setMaxListeners() to increase limit");
-    a.name = "MaxListenersExceededWarning", a.emitter = n, a.type = e, a.count = i.length, me(a);
-  }
-  return n;
-}
-l.prototype.addListener = function(e, t) {
-  return N(this, e, t, !1);
-};
-l.prototype.on = l.prototype.addListener;
-l.prototype.prependListener = function(e, t) {
-  return N(this, e, t, !0);
-};
-function pe() {
-  if (!this.fired)
-    return this.target.removeListener(this.type, this.wrapFn), this.fired = !0, arguments.length === 0 ? this.listener.call(this.target) : this.listener.apply(this.target, arguments);
-}
-function F(n, e, t) {
-  var s = { fired: !1, wrapFn: void 0, target: n, type: e, listener: t }, r = pe.bind(s);
-  return r.listener = t, s.wrapFn = r, r;
-}
-l.prototype.once = function(e, t) {
-  return R(t), this.on(e, F(this, e, t)), this;
-};
-l.prototype.prependOnceListener = function(e, t) {
-  return R(t), this.prependListener(e, F(this, e, t)), this;
-};
-l.prototype.removeListener = function(e, t) {
-  var s, r, o, i, a;
-  if (R(t), r = this._events, r === void 0)
-    return this;
-  if (s = r[e], s === void 0)
-    return this;
-  if (s === t || s.listener === t)
-    --this._eventsCount === 0 ? this._events = /* @__PURE__ */ Object.create(null) : (delete r[e], r.removeListener && this.emit("removeListener", e, s.listener || t));
-  else if (typeof s != "function") {
-    for (o = -1, i = s.length - 1; i >= 0; i--)
-      if (s[i] === t || s[i].listener === t) {
-        a = s[i].listener, o = i;
-        break;
-      }
-    if (o < 0)
-      return this;
-    o === 0 ? s.shift() : ve(s, o), s.length === 1 && (r[e] = s[0]), r.removeListener !== void 0 && this.emit("removeListener", e, a || t);
-  }
-  return this;
-};
-l.prototype.off = l.prototype.removeListener;
-l.prototype.removeAllListeners = function(e) {
-  var t, s, r;
-  if (s = this._events, s === void 0)
-    return this;
-  if (s.removeListener === void 0)
-    return arguments.length === 0 ? (this._events = /* @__PURE__ */ Object.create(null), this._eventsCount = 0) : s[e] !== void 0 && (--this._eventsCount === 0 ? this._events = /* @__PURE__ */ Object.create(null) : delete s[e]), this;
-  if (arguments.length === 0) {
-    var o = Object.keys(s), i;
-    for (r = 0; r < o.length; ++r)
-      i = o[r], i !== "removeListener" && this.removeAllListeners(i);
-    return this.removeAllListeners("removeListener"), this._events = /* @__PURE__ */ Object.create(null), this._eventsCount = 0, this;
-  }
-  if (t = s[e], typeof t == "function")
-    this.removeListener(e, t);
-  else if (t !== void 0)
-    for (r = t.length - 1; r >= 0; r--)
-      this.removeListener(e, t[r]);
-  return this;
-};
-function V(n, e, t) {
-  var s = n._events;
-  if (s === void 0)
-    return [];
-  var r = s[e];
-  return r === void 0 ? [] : typeof r == "function" ? t ? [r.listener || r] : [r] : t ? ge(r) : H(r, r.length);
-}
-l.prototype.listeners = function(e) {
-  return V(this, e, !0);
-};
-l.prototype.rawListeners = function(e) {
-  return V(this, e, !1);
-};
-l.listenerCount = function(n, e) {
-  return typeof n.listenerCount == "function" ? n.listenerCount(e) : k.call(n, e);
-};
-l.prototype.listenerCount = k;
-function k(n) {
-  var e = this._events;
-  if (e !== void 0) {
-    var t = e[n];
-    if (typeof t == "function")
-      return 1;
-    if (t !== void 0)
-      return t.length;
-  }
-  return 0;
-}
-l.prototype.eventNames = function() {
-  return this._eventsCount > 0 ? L(this._events) : [];
-};
-function H(n, e) {
-  for (var t = new Array(e), s = 0; s < e; ++s)
-    t[s] = n[s];
-  return t;
-}
-function ve(n, e) {
-  for (; e + 1 < n.length; e++)
-    n[e] = n[e + 1];
-  n.pop();
-}
-function ge(n) {
-  for (var e = new Array(n.length), t = 0; t < e.length; ++t)
-    e[t] = n[t].listener || n[t];
-  return e;
-}
-function Ce(n, e) {
-  return new Promise(function(t, s) {
-    function r(i) {
-      n.removeListener(e, o), s(i);
-    }
-    function o() {
-      typeof n.removeListener == "function" && n.removeListener("error", r), t([].slice.call(arguments));
-    }
-    W(n, e, o, { once: !0 }), e !== "error" && be(n, r, { once: !0 });
-  });
-}
-function be(n, e, t) {
-  typeof n.on == "function" && W(n, "error", e, t);
-}
-function W(n, e, t, s) {
-  if (typeof n.on == "function")
-    s.once ? n.once(e, t) : n.on(e, t);
-  else if (typeof n.addEventListener == "function")
-    n.addEventListener(e, function r(o) {
-      s.once && n.removeEventListener(e, r), t(o);
-    });
-  else
-    throw new TypeError('The "emitter" argument must be of type EventEmitter. Received type ' + typeof n);
-}
-class M {
+import "esus-lite";
+import { OrbitControls as Z } from "three/examples/jsm/controls/OrbitControls";
+import { CSS3DRenderer as J } from "three/examples/jsm/renderers/CSS3DRenderer";
+import { CSS2DRenderer as K } from "three/examples/jsm/renderers/CSS2DRenderer";
+import { Pass as ee, EffectComposer as te, RenderPass as se, CopyPass as re, FXAAEffect as oe, BlendFunction as ne, EffectPass as A, SelectiveBloomEffect as ie } from "postprocessing";
+import { i as ae } from "./isPlainObject.module.js";
+import { B as je } from "./BaseObject.module.js";
+class x {
   constructor(e) {
     this.guiParams = {}, e && (this.guiParams = e);
   }
   showGui(e) {
     e && Object.keys(this.guiParams).forEach((t) => {
-      const s = e.addFolder(t), r = this.guiParams[t];
-      Object.keys(r).forEach((o) => {
+      const s = e.addFolder(t), n = this.guiParams[t];
+      Object.keys(n).forEach((i) => {
         const {
-          min: i,
-          max: a,
-          step: c,
-          name: h,
-          paramMap: d,
-          items: m,
-          value: p,
-          target: v
-        } = r[o], S = o.toLowerCase().indexOf("color") > -1;
-        let u;
-        const w = typeof p == "undefined" && v, C = w ? v() : r[o], b = w ? o : "value";
-        m ? u = s.add(C, b, m) : S ? u = s.addColor(C, b) : u = s.add(C, b), u = u.name(h || o), typeof i != "undefined" && (u = u.min(i)), typeof a != "undefined" && (u = u.max(a)), typeof c != "undefined" && (u = u.step(c)), u = u.onChange(() => {
-          this.setTargetValue(t, o, C[b], d);
-        }), w && u.listen();
+          min: o,
+          max: c,
+          step: a,
+          name: d,
+          paramMap: m,
+          items: p,
+          value: f,
+          target: u
+        } = n[i], E = i.toLowerCase().indexOf("color") > -1;
+        let h;
+        const b = typeof f == "undefined" && u, C = b ? u() : n[i], P = b ? i : "value";
+        p ? h = s.add(C, P, p) : E ? h = s.addColor(C, P) : h = s.add(C, P), h = h.name(d || i), typeof o != "undefined" && (h = h.min(o)), typeof c != "undefined" && (h = h.max(c)), typeof a != "undefined" && (h = h.step(a)), h = h.onChange(() => {
+          this.setTargetValue(t, i, C[P], m);
+        }), b && h.listen();
       });
     });
   }
-  setTargetValue(e, t, s, r) {
+  setTargetValue(e, t, s, n) {
     const {
-      onChange: o,
-      target: i,
-      value: a
-    } = this.guiParams[e][t], c = t.toLowerCase().indexOf("color") > -1;
-    if (i && !(typeof a == "undefined" && i)) {
-      let d = i();
-      Array.isArray(d) || (d = [d]), d.forEach((m) => {
-        if (m)
-          if (c)
+      onChange: i,
+      target: o,
+      value: c
+    } = this.guiParams[e][t], a = t.toLowerCase().indexOf("color") > -1;
+    if (o && !(typeof c == "undefined" && o)) {
+      let m = o();
+      Array.isArray(m) || (m = [m]), m.forEach((p) => {
+        if (p)
+          if (a)
             try {
-              m[r || t].set(s);
-            } catch (p) {
-              t !== "color" && !r && console.warn(`${t} is not a color,set paramMap`);
+              p[n || t].set(s);
+            } catch (f) {
+              t !== "color" && !n && console.warn(`${t} is not a color,set paramMap`);
             }
           else
-            m[r || t] = s;
+            p[n || t] = s;
       });
     }
-    o && o(s);
+    i && i(s);
   }
   setTargetValueByParams() {
     Object.keys(this.guiParams).forEach((e) => {
@@ -311,58 +84,60 @@ class M {
     });
   }
 }
-const T = {
-  None: f.NoToneMapping,
-  Linear: f.LinearToneMapping,
-  Reinhard: f.ReinhardToneMapping,
-  Cineon: f.CineonToneMapping,
-  ACESFilmic: f.ACESFilmicToneMapping
-}, ye = {
+const D = {
+  None: l.NoToneMapping,
+  Linear: l.LinearToneMapping,
+  Reinhard: l.ReinhardToneMapping,
+  Cineon: l.CineonToneMapping,
+  ACESFilmic: l.ACESFilmicToneMapping
+}, ce = {
   antialias: !1,
   devicePixelRatio: window.devicePixelRatio,
   powerPreference: "high-performance",
   toneMapping: "None",
   toneMappingExposure: 1,
   alpha: !1,
-  outputEncoding: f.LinearEncoding,
+  outputEncoding: Q.Linear,
+  outputColorSpace: $.sRGB,
   logarithmicDepthBuffer: !1,
   preserveDrawingBuffer: !1,
   stencil: !1,
   depth: !1,
   physicallyCorrectLights: !1
 };
-class Pe {
+class le {
   constructor(e) {
     this.options = e;
-    const { width: t, height: s, rendererParams: r } = e, {
-      canvas: o,
-      context: i,
-      alpha: a,
-      devicePixelRatio: c,
-      antialias: h,
-      powerPreference: d,
-      toneMapping: m,
-      toneMappingExposure: p,
-      outputEncoding: v,
-      logarithmicDepthBuffer: S,
-      preserveDrawingBuffer: u,
-      stencil: w,
-      depth: C,
-      physicallyCorrectLights: b
-    } = r, g = new f.WebGLRenderer({
-      canvas: o,
-      context: i,
-      alpha: a,
-      antialias: h,
-      powerPreference: d,
-      logarithmicDepthBuffer: S,
-      preserveDrawingBuffer: u,
-      stencil: w,
-      depth: C
+    const { width: t, height: s, rendererParams: n } = e, {
+      canvas: i,
+      context: o,
+      alpha: c,
+      devicePixelRatio: a,
+      antialias: d,
+      powerPreference: m,
+      toneMapping: p,
+      toneMappingExposure: f,
+      outputEncoding: u,
+      outputColorSpace: E,
+      logarithmicDepthBuffer: h,
+      preserveDrawingBuffer: b,
+      stencil: C,
+      depth: P,
+      physicallyCorrectLights: T
+    } = n, g = new l.WebGLRenderer({
+      canvas: i,
+      context: o,
+      alpha: c,
+      antialias: d,
+      powerPreference: m,
+      logarithmicDepthBuffer: h,
+      preserveDrawingBuffer: b,
+      stencil: C,
+      depth: P
     });
-    g.setSize(t, s), g.setPixelRatio(c), g.toneMapping = T[m], g.toneMappingExposure = p, g.outputEncoding = v;
-    const X = +f.REVISION < 150 ? "physicallyCorrectLights" : "useLegacyLights";
-    g[X] = b, this.renderer = g;
+    g.setSize(t, s), g.setPixelRatio(a), g.toneMapping = D[p], g.toneMappingExposure = f, +l.REVISION < 152 ? g.outputEncoding = u : g.outputColorSpace = E;
+    const G = +l.REVISION < 150 ? "physicallyCorrectLights" : "useLegacyLights";
+    g[G] = T, this.renderer = g;
   }
   setSize(e, t) {
     this.renderer.setSize(e, t);
@@ -372,11 +147,11 @@ class Pe {
     this.renderer.render(e, t);
   }
   setGui(e) {
-    new M({
+    new x({
       renderer: {
         toneMapping: {
           value: this.options.rendererParams.toneMapping,
-          items: T,
+          items: D,
           target: () => this.renderer
         },
         toneMappingExposure: {
@@ -393,25 +168,26 @@ class Pe {
     (e = this.renderer) == null || e.clear(), (t = this.renderer) == null || t.dispose(), (s = this.renderer) == null || s.renderLists.dispose();
   }
 }
-const we = {
+const de = {
   fov: 45,
   near: 1,
-  far: 1e3
+  far: 1e3,
+  up: new l.Vector3(0, 1, 0)
 };
-class Ee {
+class me {
   constructor(e) {
-    this.oldCameraPosition = new f.Vector3(), this.oldCameraRotation = new f.Euler(), this.customCamera = !1, this.options = e;
-    const { width: t, height: s, cameraParams: r } = e;
-    if (r instanceof f.Camera)
-      this.camera = r, this.customCamera = !0;
+    this.oldCameraPosition = new l.Vector3(), this.oldCameraRotation = new l.Euler(), this.customCamera = !1, this.options = e;
+    const { width: t, height: s, cameraParams: n } = e;
+    if (n instanceof l.Camera)
+      this.camera = n, this.customCamera = !0;
     else {
-      const { fov: o, far: i, near: a } = r, c = new f.PerspectiveCamera(
-        o,
+      const { fov: i, far: o, near: c, up: a } = n, d = new l.PerspectiveCamera(
+        i,
         t / s,
-        a,
-        i
+        c,
+        o
       );
-      c.position.set(0, 0, 400), c.lookAt(0, 0, 0), this.camera = c;
+      d.position.set(0, 0, 400), d.lookAt(0, 0, 0), d.up = a, this.camera = d;
     }
   }
   // 检查相机变化
@@ -420,10 +196,10 @@ class Ee {
     return this.oldCameraPosition = e.position.clone(), this.oldCameraRotation = e.rotation.clone(), !t;
   }
   setSize(e, t) {
-    this.camera instanceof f.PerspectiveCamera && (this.camera.aspect = e / t), this.camera.updateProjectionMatrix();
+    this.camera instanceof l.PerspectiveCamera && (this.camera.aspect = e / t), this.camera.updateProjectionMatrix();
   }
   setGui(e) {
-    const t = new M({
+    const t = new x({
       camera: {
         x: {
           min: -1e4,
@@ -463,7 +239,7 @@ class Ee {
         }
       }
     });
-    this.camera instanceof f.PerspectiveCamera && (t.guiParams.camera.fov = {
+    this.camera instanceof l.PerspectiveCamera && (t.guiParams.camera.fov = {
       min: 0,
       max: 90,
       step: 1,
@@ -474,43 +250,64 @@ class Ee {
     }), t.showGui(e);
   }
 }
-const Le = {
+const he = {
   background: null
 };
-class xe {
+class pe {
   constructor(e) {
     this.options = e;
-    const { camera: t, sceneParams: s } = e, { background: r } = s, o = new f.Scene();
-    r && (o.background = r), o.add(t), this.scene = o;
+    const { camera: t, sceneParams: s } = e, { background: n } = s, i = new l.Scene();
+    n && (i.background = n), i.add(t), this.scene = i;
   }
   addAxesHelper() {
     var t;
-    const e = new f.AxesHelper(100);
+    const e = new l.AxesHelper(100);
     (t = this.scene) == null || t.add(e);
   }
   dispose() {
     var e;
     (e = this.scene) == null || e.traverse((t) => {
-      ne(t);
+      Y(t);
     });
   }
 }
-class Re {
+class fe {
   constructor(e) {
     this.options = e;
-    const { camera: t, controlParams: s, customControl: r } = e, { domElement: o } = s, i = r ? new r(t, o) : new se(t, o);
-    i.minPolarAngle = Math.PI * 0.15, i.maxPolarAngle = Math.PI * 0.85, i.enableDamping = !0, i.dampingFactor = 0.063, i.autoRotate = !1, i.autoRotateSpeed = -60, i.enableZoom = !0, i.zoomSpeed = 0.2, this.control = i;
+    const { camera: t, controlParams: s, customControl: n } = e, { domElement: i } = s, o = n ? new n(t, i) : new Z(t, i);
+    o.enableDamping = !0, o.dampingFactor = 0.063, o.autoRotate = !1, o.autoRotateSpeed = -60, o.enableZoom = !0, o.zoomSpeed = 0.2, this.control = o;
   }
   limitPan({
     maxX: e = 1 / 0,
     minX: t = -1 / 0,
     maxZ: s = 1 / 0,
-    minZ: r = -1 / 0,
-    maxY: o = 1 / 0,
-    minY: i = -1 / 0
+    minZ: n = -1 / 0,
+    maxY: i = 1 / 0,
+    minY: o = -1 / 0
+  }) {
+    const c = this.limitPanV || new l.Vector3(), a = this.control, { camera: d } = this.options, m = new l.Vector3(t, o, n), p = new l.Vector3(e, i, s);
+    this.limitPanV = c, c.copy(a.target), a.target.clamp(m, p), c.sub(a.target), d.position.sub(c);
+  }
+  changeRotation({
+    vertical: e,
+    horizontal: t,
+    distance: s
   }) {
-    const a = this.limitPanV || new f.Vector3(), c = this.control, { camera: h } = this.options, d = new f.Vector3(t, i, r), m = new f.Vector3(e, o, s);
-    this.limitPanV = a, a.copy(c.target), c.target.clamp(d, m), a.sub(c.target), h.position.sub(a);
+    const { camera: n } = this.options, i = this.control, o = t != null ? t : i.getAzimuthalAngle(), c = e != null ? e : i.getPolarAngle(), a = new l.Vector3();
+    a.setFromSphericalCoords(
+      s != null ? s : n.position.distanceTo(i.target),
+      c,
+      o
+    );
+    const d = new l.Quaternion().setFromUnitVectors(
+      new l.Vector3(0, 1, 0),
+      n.up
+    );
+    a.applyQuaternion(d), n.position.set(
+      a.x + i.target.x,
+      a.y + i.target.y,
+      a.z + i.target.z
+    ), i.update();
   }
   update() {
     this.control.update();
@@ -519,59 +316,107 @@ class Re {
     this.control.dispose();
   }
 }
-const I = {
+const O = {
   zIndex: "auto"
 };
-class Se {
+class ue {
   constructor(e) {
     this.container = e;
   }
   addRenderer(e, t) {
-    const { container: s } = this, r = s.offsetWidth, o = s.offsetHeight, i = e === "css2d" ? new ie() : new re();
-    i.domElement.style.position = "absolute", i.domElement.style.top = "0", i.domElement.style.pointerEvents = "none", i.domElement.style.zIndex = t.zIndex, i.setSize(r, o), s.appendChild(i.domElement), e === "css2d" ? this.css2Drenderer = i : e === "css3d" && (this.css3Drenderer = i);
+    const { container: s } = this, n = s.offsetWidth, i = s.offsetHeight, o = e === "css2d" ? new K() : new J();
+    o.domElement.style.position = "absolute", o.domElement.style.top = "0", o.domElement.style.pointerEvents = "none", o.domElement.style.zIndex = t.zIndex, o.setSize(n, i), s.appendChild(o.domElement), e === "css2d" ? this.css2Drenderer = o : e === "css3d" && (this.css3Drenderer = o);
   }
   setSize(e, t) {
-    var s, r;
-    (s = this.css2Drenderer) == null || s.setSize(e, t), (r = this.css3Drenderer) == null || r.setSize(e, t);
+    var s, n;
+    (s = this.css2Drenderer) == null || s.setSize(e, t), (n = this.css3Drenderer) == null || n.setSize(e, t);
   }
   render(e, t) {
-    var s, r;
-    (s = this.css2Drenderer) == null || s.render(e, t), (r = this.css3Drenderer) == null || r.render(e, t);
+    var s, n;
+    (s = this.css2Drenderer) == null || s.render(e, t), (n = this.css3Drenderer) == null || n.render(e, t);
   }
   dispose() {
     this.css2Drenderer = void 0, this.css3Drenderer = void 0;
   }
 }
-const Oe = {
+const B = ["encodings_fragment", "colorspace_fragment"];
+class ge extends N {
+  constructor() {
+    super({
+      uniforms: {
+        inputBuffer: new z(null),
+        ratio: new z(1)
+      },
+      fragmentShader: `
+        uniform sampler2D inputBuffer;
+        uniform float ratio;
+        varying vec2 vUv;
+        void main() {
+          vec4 texel = texture2D(inputBuffer, vUv);
+          gl_FragColor = texel * ratio;
+          // Support automatic output encoding.
+          #include <${+U < 154 ? B[0] : B[1]}>
+
+        }
+      `,
+      vertexShader: `
+        varying vec2 vUv;
+        void main() {
+	        vUv = position.xy * 0.5 + 0.5;
+          gl_Position = vec4(position.xy, 1.0, 1.0);
+        }
+      `,
+      toneMapped: !1,
+      depthWrite: !1,
+      depthTest: !1
+    });
+  }
+}
+class Ce extends ee {
+  constructor() {
+    super("CrossFadePass"), this.fullscreenMaterial = new ge();
+  }
+  render(e, t, s) {
+    const n = this.fullscreenMaterial;
+    n.uniforms.inputBuffer.value = t.texture, e.setRenderTarget(this.renderToScreen ? null : s), e.render(this.scene, this.camera);
+  }
+}
+const Pe = {
   luminanceThreshold: 0.1,
   luminanceSmoothing: 0.3,
   mipmapBlur: !0,
   intensity: 4
 };
-class Me {
+class ve {
   constructor(e) {
     this.active = !0, this.options = e;
-    const { renderer: t, scene: s, camera: r, composerParams: o } = e, { multisampling: i } = o, { maxSamples: a } = t.capabilities, c = new oe(t, {
-      multisampling: Math.min(i, a)
+    const { renderer: t, scene: s, camera: n, composerParams: i } = e, { multisampling: o } = i, { maxSamples: c } = t.capabilities, a = new te(t, {
+      multisampling: Math.min(o, c)
     });
-    c.addPass(new ae(s, r)), this.finalComposer = c, this.renderer = t, this.scene = s, this.camera = r;
+    a.addPass(new se(s, n)), this.finalComposer = a, this.renderer = t, this.scene = s, this.camera = n;
   }
   addCopyPass() {
-    const e = new ce();
+    const e = new re();
     e.renderToScreen = !0, this.finalComposer.addPass(e), this.copyPass = e;
   }
+  addCrossFadePass() {
+    const e = new Ce();
+    this.finalComposer.addPass(e), this.crossFadePass = e;
+  }
   addFXAAPass() {
-    const { camera: e } = this, t = new le({ blendFunction: fe.NORMAL }), s = new A(e, t);
+    const { camera: e } = this, t = new oe({ blendFunction: ne.NORMAL }), s = new A(e, t);
     this.finalComposer.addPass(s), this.fxaaPass = s;
   }
   addBloomPass(e) {
-    const { camera: t, scene: s } = this, r = new de(s, t, y({}, e)), o = new A(t, r);
-    o.enabled = !1, this.finalComposer.addPass(o), this.bloomPass = o, this.bloomEffect = r;
+    const { camera: t, scene: s } = this, n = new ie(s, t, v({}, e)), i = new A(t, n);
+    i.enabled = !1, this.finalComposer.addPass(i), this.bloomPass = i, this.bloomEffect = n;
+  }
+  aaa() {
   }
   addBloomGui(e) {
     if (!this.bloomEffect)
       return;
-    new M({
+    new x({
       bloom: {
         intensity: {
           min: 0,
@@ -616,16 +461,16 @@ class Me {
       }
     }).showGui(e);
   }
-  toggleBloomSelection(e) {
+  toggleBloomSelection(e, t) {
     if (!this.bloomEffect || !this.bloomPass) {
       console.warn("err:pencil.options.bloom");
       return;
     }
-    this.bloomEffect.selection.toggle(e), this.bloomPass.enabled = !!this.bloomEffect.selection.size;
+    e ? t === !0 ? this.bloomEffect.selection.add(e) : t === !1 ? this.bloomEffect.selection.delete(e) : this.bloomEffect.selection.toggle(e) : this.bloomEffect.selection.clear(), this.bloomPass.enabled = !!this.bloomEffect.selection.size;
   }
   getSize() {
     const { renderer: e } = this.options;
-    return e.getSize(new f.Vector2());
+    return e.getSize(new l.Vector2());
   }
   enable() {
     this.active || (this.active = !0);
@@ -643,40 +488,40 @@ class Me {
     this.finalComposer.dispose();
   }
 }
-const _e = () => {
+const be = () => {
   try {
-    const n = document.createElement("canvas");
-    return !!(window.WebGL2RenderingContext && n.getContext("webgl2"));
-  } catch (n) {
+    const r = document.createElement("canvas");
+    return !!(window.WebGL2RenderingContext && r.getContext("webgl2"));
+  } catch (r) {
     return !1;
   }
-}, E = !1, K = _e() !== !1, U = class {
-  constructor(n) {
-    this.raycaster = new f.Raycaster(), this.installPlugins = /* @__PURE__ */ new Map(), this.event = new x.EventEmitter(), this.clock = new f.Clock(), this.userData = {}, this.options = Q(U.options, n, {
-      isMergeableObject: he
+}, w = !1, F = be() !== !1, L = class {
+  constructor(r, e) {
+    this.raycaster = new l.Raycaster(), this.installPlugins = /* @__PURE__ */ new Map(), this.event = new W.EventEmitter(), this.clock = new l.Clock(), this.userData = {}, this.options = _(L.options, r, {
+      isMergeableObject: ae
     });
     const {
-      container: e,
-      stats: t,
-      gui: s,
-      resizeObserver: r
+      container: t,
+      stats: s,
+      gui: n,
+      resizeObserver: i
     } = this.options;
-    if (s) {
-      const o = new te();
+    if (n) {
+      const o = new q();
       o.open(!1), this.gui = o;
     }
-    if (t) {
-      const o = new ee();
-      o.showPanel(0), o.dom.style.position = "absolute", e.appendChild(o.dom), this.stats = o;
+    if (s) {
+      const o = new X();
+      o.showPanel(0), o.dom.style.position = "absolute", t.appendChild(o.dom), this.stats = o;
     }
-    this.init(), this.initComposer(), this.initCSSRenderer(), this.initControl(), r && this.initResizeObserver(), this.clock.getDelta(), this.clock.getElapsedTime();
+    this.init(), this.initComposer(), this.initCSSRenderer(), this.initControl(), i && this.initResizeObserver(), this.clock.getDelta(), this.clock.getElapsedTime(), e && (Array.isArray(e) ? e.forEach((o) => this.use(o)) : this.use(e));
   }
   get renderer() {
     return this.rendererController.renderer;
   }
   get control() {
-    var n;
-    return (n = this.controlController) == null ? void 0 : n.control;
+    var r;
+    return (r = this.controlController) == null ? void 0 : r.control;
   }
   get camera() {
     return this.cameraController.camera;
@@ -684,147 +529,160 @@ const _e = () => {
   get scene() {
     return this.sceneController.scene;
   }
-  use(n, ...e) {
-    this.installPlugins.has(n) ? console.log("plugin already installed") : typeof n.install == "function" && (n.install(this, ...e), this.installPlugins.set(n, !0));
+  use(r, ...e) {
+    this.installPlugins.has(r) ? console.log("plugin already installed") : typeof r.install == "function" && (r.install(this, ...e), this.installPlugins.set(r, !0));
   }
   init() {
     const {
-      container: n,
+      container: r,
       isdev: e,
       axesHelper: t,
       renderer: s,
-      scene: r,
-      camera: o
-    } = this.options, { width: i, height: a } = this.getSize(), c = new Ee({
+      scene: n,
+      camera: i
+    } = this.options, { width: o, height: c } = this.getSize(), a = new me({
       isdev: e,
-      width: i,
-      height: a,
-      cameraParams: o
+      width: o,
+      height: c,
+      cameraParams: i
     });
-    this.gui && c.setGui(this.gui);
-    const h = c.camera, d = new xe({
-      camera: h,
-      sceneParams: r
-    }), m = d.scene, p = new Pe({
-      width: i,
-      height: a,
-      scene: m,
-      camera: h,
+    this.gui && a.setGui(this.gui);
+    const d = a.camera, m = new pe({
+      camera: d,
+      sceneParams: n
+    }), p = m.scene, f = new le({
+      width: o,
+      height: c,
+      scene: p,
+      camera: d,
       isdev: e,
-      rendererParams: O(y({}, s), {
+      rendererParams: S(v({}, s), {
         antialias: !1
       })
     });
-    this.gui && p.setGui(this.gui);
-    const v = p.renderer;
-    t && d.addAxesHelper(), this.sceneController = d, this.rendererController = p, this.cameraController = c, n.appendChild(v.domElement);
+    this.gui && f.setGui(this.gui);
+    const u = f.renderer;
+    t && m.addAxesHelper(), this.sceneController = m, this.rendererController = f, this.cameraController = a, r.appendChild(u.domElement);
   }
   initComposer() {
     const {
-      bloom: n,
+      bloom: r,
       bloomParams: e,
-      renderer: t,
-      multisampling: s,
-      passes: r
+      crossOpacity: t,
+      renderer: s,
+      multisampling: n,
+      passes: i
     } = this.options;
-    let { antialias: o } = t;
-    o === "msaa" && !K && (o = !1, console.warn("MSAA is not supported on this browser"));
-    const i = new Me({
+    let { antialias: o } = s;
+    o === "msaa" && !F && (o = !1, console.warn("MSAA is not supported on this browser"));
+    const c = new ve({
       renderer: this.renderer,
       scene: this.scene,
       camera: this.camera,
       composerParams: {
-        multisampling: o === "msaa" ? s : 0,
-        type: f.UnsignedByteType,
-        encoding: t.outputEncoding
+        multisampling: o === "msaa" ? n : 0,
+        type: l.UnsignedByteType,
+        encoding: s.outputEncoding
       }
     });
-    this.composerController = i, n && (i.addBloomPass(e), this.gui && i.addBloomGui(this.gui)), o === "fxaa" && i.addFXAAPass(), r && r.forEach((a) => {
-      i.finalComposer.addPass(a);
-    }), i.addCopyPass();
+    this.composerController = c, r && (c.addBloomPass(e), this.gui && c.addBloomGui(this.gui)), o === "fxaa" && c.addFXAAPass(), t && c.addCrossFadePass(), i && i.forEach((a) => {
+      c.finalComposer.addPass(a);
+    }), c.addCopyPass();
+  }
+  get opacity() {
+    const { crossFadePass: r } = this.composerController;
+    return r ? r.fullscreenMaterial.uniforms.ratio.value : 1;
+  }
+  set opacity(r) {
+    const { crossFadePass: e } = this.composerController;
+    if (!e) {
+      console.warn("err:pencil.options.crossOpacity");
+      return;
+    }
+    e.fullscreenMaterial.uniforms.ratio.value = r;
   }
   initCSSRenderer() {
     const {
-      container: n,
+      container: r,
       css2DRenderer: e,
       css3DRenderer: t,
       css2DRendererParams: s,
-      css3DRendererParams: r
+      css3DRendererParams: n
     } = this.options;
     if (e || t) {
-      const o = new Se(n);
-      e && o.addRenderer("css2d", s), t && o.addRenderer("css3d", r), this.cssRendererController = o;
+      const i = new ue(r);
+      e && i.addRenderer("css2d", s), t && i.addRenderer("css3d", n), this.cssRendererController = i;
     }
   }
   initControl() {
-    const { control: n, controlParams: e } = this.options;
-    if (n) {
-      const t = new Re({
+    const { control: r, controlParams: e } = this.options;
+    if (r) {
+      const t = new fe({
         camera: this.camera,
         controlParams: {
           domElement: (e == null ? void 0 : e.domElement) || this.renderer.domElement
         },
-        customControl: typeof n == "boolean" ? void 0 : n
+        customControl: typeof r == "boolean" ? void 0 : r
       });
       this.controlController = t;
     }
   }
   getSize() {
-    const { container: n } = this.options;
+    const { container: r } = this.options;
     return {
-      width: n.offsetWidth,
-      height: n.offsetHeight
+      width: r.offsetWidth,
+      height: r.offsetHeight
     };
   }
   initResizeObserver() {
-    const { container: n } = this.options;
+    const { container: r } = this.options;
     if (this.resizeObserver)
       return;
     const e = new ResizeObserver((t) => {
       for (const s of t) {
-        const r = s.contentRect;
-        this.handeleResize(r.width, r.height), this.render();
+        const n = s.contentRect;
+        this.handeleResize(n.width, n.height), this.render();
       }
     });
-    e.observe(n), this.resizeObserver = e;
+    e.observe(r), this.resizeObserver = e;
   }
-  handeleResize(n, e) {
+  handeleResize(r, e, t = !0) {
     const {
-      rendererController: t,
-      cameraController: s,
-      composerController: r,
+      rendererController: s,
+      cameraController: n,
+      composerController: i,
       cssRendererController: o
     } = this;
-    s == null || s.setSize(n, e), t == null || t.setSize(n, e), r == null || r.setSize(n, e), o == null || o.setSize(n, e), this.installPlugins.forEach((i, a) => {
-      var c;
-      (c = a.setSize) == null || c.call(a, n, e);
-    }), this.event.emit("resize", { width: n, height: e });
-  }
-  pick(n, e, t = !1) {
-    const { raycaster: s, options: r } = this, { container: o } = r, i = new f.Vector2(), a = o.getBoundingClientRect();
-    if (i.x = (n.clientX - a.left) / (a.right - a.left) * 2 - 1, i.y = -((n.clientY - a.top) / (a.bottom - a.top)) * 2 + 1, this.camera && this.scene) {
-      s.setFromCamera(i, this.camera);
-      const c = s.intersectObjects(
+    n == null || n.setSize(r, e), s == null || s.setSize(r, e), i == null || i.setSize(r, e), o == null || o.setSize(r, e), this.installPlugins.forEach((c, a) => {
+      var d;
+      (d = a.setSize) == null || d.call(a, r, e);
+    }), t && this.event.emit("resize", { width: r, height: e });
+  }
+  pick(r, e, t = !1) {
+    const { raycaster: s, options: n } = this, { container: i } = n, o = new l.Vector2(), c = i.getBoundingClientRect();
+    if (o.x = (r.clientX - c.left) / (c.right - c.left) * 2 - 1, o.y = -((r.clientY - c.top) / (c.bottom - c.top)) * 2 + 1, this.camera && this.scene) {
+      s.setFromCamera(o, this.camera);
+      const a = s.intersectObjects(
         e || this.scene.children,
         t
       );
-      if (c.length)
+      if (a.length)
         return {
-          object: c[0].object,
-          intersects: c
+          object: a[0].object,
+          intersects: a
         };
     }
   }
   render() {
-    var i, a, c, h, d;
-    const { renderer: n, scene: e, camera: t, clock: s } = this;
-    if (!n || !e || !t || this.options.staticRender && !this.cameraController.checkCameraChange())
+    var o, c, a, d, m;
+    const { renderer: r, scene: e, camera: t, clock: s } = this;
+    if (!r || !e || !t || this.options.staticRender && !this.cameraController.checkCameraChange())
       return;
-    const r = s.getDelta(), o = s.getElapsedTime();
-    (i = this.controlController) == null || i.update(), this.installPlugins.forEach((m, p) => {
-      var v;
-      (v = p.update) == null || v.call(p, r, o);
-    }), (a = this.composerController) != null && a.active ? this.composerController.render() : (c = this.rendererController) == null || c.render(), (h = this.cssRendererController) == null || h.render(e, t), (d = this.stats) == null || d.update(), this.event.emit("render", { delta: r, elapsed: o });
+    const n = s.getDelta(), i = s.getElapsedTime();
+    M.update(), (o = this.controlController) == null || o.update(), this.installPlugins.forEach((p, f) => {
+      var u;
+      (u = f.update) == null || u.call(f, n, i);
+    }), (c = this.composerController) != null && c.active ? this.composerController.render() : (a = this.rendererController) == null || a.render(), (d = this.cssRendererController) == null || d.render(e, t), (m = this.stats) == null || m.update(), this.event.emit("render", { delta: n, elapsed: i });
   }
   start() {
     this.renderer.setAnimationLoop(this.render.bind(this)), this.event.emit("start");
@@ -833,38 +691,39 @@ const _e = () => {
     this.renderer.setAnimationLoop(null), this.event.emit("stop");
   }
   dispose() {
-    var n, e, t, s, r, o, i;
-    this.stop(), this.handeleResize(0, 0), (n = this.resizeObserver) == null || n.unobserve(this.options.container), this.installPlugins.forEach((a, c) => {
-      var h;
-      (h = c.dispose) == null || h.call(c);
-    }), (e = this.controlController) == null || e.dispose(), (t = this.cssRendererController) == null || t.dispose(), (s = this.sceneController) == null || s.dispose(), (r = this.composerController) == null || r.dispose(), (o = this.rendererController) == null || o.dispose(), this.controlController = void 0, this.cssRendererController = void 0, (i = this.gui) == null || i.destroy(), this.event.removeAllListeners(), this.installPlugins.clear();
+    var r, e, t, s, n, i, o;
+    this.stop(), M.removeAll(), this.handeleResize(0, 0), (r = this.resizeObserver) == null || r.unobserve(this.options.container), this.installPlugins.forEach((c, a) => {
+      var d;
+      (d = a.dispose) == null || d.call(a);
+    }), (e = this.controlController) == null || e.dispose(), (t = this.cssRendererController) == null || t.dispose(), (s = this.sceneController) == null || s.dispose(), (n = this.composerController) == null || n.dispose(), (i = this.rendererController) == null || i.dispose(), this.controlController = void 0, this.cssRendererController = void 0, (o = this.gui) == null || o.destroy(), this.event.removeAllListeners(), this.installPlugins.clear();
   }
 };
-let ze = U;
-ze.options = {
-  isdev: E,
-  stats: E,
-  gui: E,
-  axesHelper: E,
-  control: E,
+let we = L;
+we.options = {
+  isdev: w,
+  stats: w,
+  gui: w,
+  axesHelper: w,
+  control: w,
   resizeObserver: !0,
-  renderer: O(y({}, ye), {
-    antialias: K ? "msaa" : "fxaa"
+  renderer: S(v({}, ce), {
+    antialias: F ? "msaa" : "fxaa"
   }),
   staticRender: !1,
   multisampling: 4,
-  scene: Le,
-  camera: we,
+  scene: he,
+  camera: de,
   bloom: !1,
-  bloomParams: Oe,
+  bloomParams: Pe,
+  crossOpacity: !1,
   css2DRenderer: !1,
-  css2DRendererParams: y({}, I),
+  css2DRendererParams: v({}, O),
   css3DRenderer: !1,
-  css3DRendererParams: y({}, I)
+  css3DRendererParams: v({}, O)
 };
 export {
-  Ue as BaseObject,
-  M as GUIObject,
-  ze as Pencil,
-  ze as default
+  je as BaseObject,
+  x as GUIObject,
+  we as Pencil,
+  we as default
 };