@ericchen1990/pano-view 2.2.1 → 2.3.0

package/dist/index.mjs

@@ -1,4 +1,2242 @@
 "use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// ../../node_modules/.pnpm/howler@2.2.4/node_modules/howler/dist/howler.js
+var require_howler = __commonJS({
+  "../../node_modules/.pnpm/howler@2.2.4/node_modules/howler/dist/howler.js"(exports) {
+    "use strict";
+    (function() {
+      "use strict";
+      var HowlerGlobal2 = function() {
+        this.init();
+      };
+      HowlerGlobal2.prototype = {
+        /**
+         * Initialize the global Howler object.
+         * @return {Howler}
+         */
+        init: function() {
+          var self = this || Howler3;
+          self._counter = 1e3;
+          self._html5AudioPool = [];
+          self.html5PoolSize = 10;
+          self._codecs = {};
+          self._howls = [];
+          self._muted = false;
+          self._volume = 1;
+          self._canPlayEvent = "canplaythrough";
+          self._navigator = typeof window !== "undefined" && window.navigator ? window.navigator : null;
+          self.masterGain = null;
+          self.noAudio = false;
+          self.usingWebAudio = true;
+          self.autoSuspend = true;
+          self.ctx = null;
+          self.autoUnlock = true;
+          self._setup();
+          return self;
+        },
+        /**
+         * Get/set the global volume for all sounds.
+         * @param  {Float} vol Volume from 0.0 to 1.0.
+         * @return {Howler/Float}     Returns self or current volume.
+         */
+        volume: function(vol) {
+          var self = this || Howler3;
+          vol = parseFloat(vol);
+          if (!self.ctx) {
+            setupAudioContext();
+          }
+          if (typeof vol !== "undefined" && vol >= 0 && vol <= 1) {
+            self._volume = vol;
+            if (self._muted) {
+              return self;
+            }
+            if (self.usingWebAudio) {
+              self.masterGain.gain.setValueAtTime(vol, Howler3.ctx.currentTime);
+            }
+            for (var i = 0; i < self._howls.length; i++) {
+              if (!self._howls[i]._webAudio) {
+                var ids = self._howls[i]._getSoundIds();
+                for (var j = 0; j < ids.length; j++) {
+                  var sound = self._howls[i]._soundById(ids[j]);
+                  if (sound && sound._node) {
+                    sound._node.volume = sound._volume * vol;
+                  }
+                }
+              }
+            }
+            return self;
+          }
+          return self._volume;
+        },
+        /**
+         * Handle muting and unmuting globally.
+         * @param  {Boolean} muted Is muted or not.
+         */
+        mute: function(muted) {
+          var self = this || Howler3;
+          if (!self.ctx) {
+            setupAudioContext();
+          }
+          self._muted = muted;
+          if (self.usingWebAudio) {
+            self.masterGain.gain.setValueAtTime(muted ? 0 : self._volume, Howler3.ctx.currentTime);
+          }
+          for (var i = 0; i < self._howls.length; i++) {
+            if (!self._howls[i]._webAudio) {
+              var ids = self._howls[i]._getSoundIds();
+              for (var j = 0; j < ids.length; j++) {
+                var sound = self._howls[i]._soundById(ids[j]);
+                if (sound && sound._node) {
+                  sound._node.muted = muted ? true : sound._muted;
+                }
+              }
+            }
+          }
+          return self;
+        },
+        /**
+         * Handle stopping all sounds globally.
+         */
+        stop: function() {
+          var self = this || Howler3;
+          for (var i = 0; i < self._howls.length; i++) {
+            self._howls[i].stop();
+          }
+          return self;
+        },
+        /**
+         * Unload and destroy all currently loaded Howl objects.
+         * @return {Howler}
+         */
+        unload: function() {
+          var self = this || Howler3;
+          for (var i = self._howls.length - 1; i >= 0; i--) {
+            self._howls[i].unload();
+          }
+          if (self.usingWebAudio && self.ctx && typeof self.ctx.close !== "undefined") {
+            self.ctx.close();
+            self.ctx = null;
+            setupAudioContext();
+          }
+          return self;
+        },
+        /**
+         * Check for codec support of specific extension.
+         * @param  {String} ext Audio file extention.
+         * @return {Boolean}
+         */
+        codecs: function(ext) {
+          return (this || Howler3)._codecs[ext.replace(/^x-/, "")];
+        },
+        /**
+         * Setup various state values for global tracking.
+         * @return {Howler}
+         */
+        _setup: function() {
+          var self = this || Howler3;
+          self.state = self.ctx ? self.ctx.state || "suspended" : "suspended";
+          self._autoSuspend();
+          if (!self.usingWebAudio) {
+            if (typeof Audio !== "undefined") {
+              try {
+                var test = new Audio();
+                if (typeof test.oncanplaythrough === "undefined") {
+                  self._canPlayEvent = "canplay";
+                }
+              } catch (e) {
+                self.noAudio = true;
+              }
+            } else {
+              self.noAudio = true;
+            }
+          }
+          try {
+            var test = new Audio();
+            if (test.muted) {
+              self.noAudio = true;
+            }
+          } catch (e) {
+          }
+          if (!self.noAudio) {
+            self._setupCodecs();
+          }
+          return self;
+        },
+        /**
+         * Check for browser support for various codecs and cache the results.
+         * @return {Howler}
+         */
+        _setupCodecs: function() {
+          var self = this || Howler3;
+          var audioTest = null;
+          try {
+            audioTest = typeof Audio !== "undefined" ? new Audio() : null;
+          } catch (err) {
+            return self;
+          }
+          if (!audioTest || typeof audioTest.canPlayType !== "function") {
+            return self;
+          }
+          var mpegTest = audioTest.canPlayType("audio/mpeg;").replace(/^no$/, "");
+          var ua = self._navigator ? self._navigator.userAgent : "";
+          var checkOpera = ua.match(/OPR\/(\d+)/g);
+          var isOldOpera = checkOpera && parseInt(checkOpera[0].split("/")[1], 10) < 33;
+          var checkSafari = ua.indexOf("Safari") !== -1 && ua.indexOf("Chrome") === -1;
+          var safariVersion = ua.match(/Version\/(.*?) /);
+          var isOldSafari = checkSafari && safariVersion && parseInt(safariVersion[1], 10) < 15;
+          self._codecs = {
+            mp3: !!(!isOldOpera && (mpegTest || audioTest.canPlayType("audio/mp3;").replace(/^no$/, ""))),
+            mpeg: !!mpegTest,
+            opus: !!audioTest.canPlayType('audio/ogg; codecs="opus"').replace(/^no$/, ""),
+            ogg: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ""),
+            oga: !!audioTest.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/, ""),
+            wav: !!(audioTest.canPlayType('audio/wav; codecs="1"') || audioTest.canPlayType("audio/wav")).replace(/^no$/, ""),
+            aac: !!audioTest.canPlayType("audio/aac;").replace(/^no$/, ""),
+            caf: !!audioTest.canPlayType("audio/x-caf;").replace(/^no$/, ""),
+            m4a: !!(audioTest.canPlayType("audio/x-m4a;") || audioTest.canPlayType("audio/m4a;") || audioTest.canPlayType("audio/aac;")).replace(/^no$/, ""),
+            m4b: !!(audioTest.canPlayType("audio/x-m4b;") || audioTest.canPlayType("audio/m4b;") || audioTest.canPlayType("audio/aac;")).replace(/^no$/, ""),
+            mp4: !!(audioTest.canPlayType("audio/x-mp4;") || audioTest.canPlayType("audio/mp4;") || audioTest.canPlayType("audio/aac;")).replace(/^no$/, ""),
+            weba: !!(!isOldSafari && audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, "")),
+            webm: !!(!isOldSafari && audioTest.canPlayType('audio/webm; codecs="vorbis"').replace(/^no$/, "")),
+            dolby: !!audioTest.canPlayType('audio/mp4; codecs="ec-3"').replace(/^no$/, ""),
+            flac: !!(audioTest.canPlayType("audio/x-flac;") || audioTest.canPlayType("audio/flac;")).replace(/^no$/, "")
+          };
+          return self;
+        },
+        /**
+         * Some browsers/devices will only allow audio to be played after a user interaction.
+         * Attempt to automatically unlock audio on the first user interaction.
+         * Concept from: http://paulbakaus.com/tutorials/html5/web-audio-on-ios/
+         * @return {Howler}
+         */
+        _unlockAudio: function() {
+          var self = this || Howler3;
+          if (self._audioUnlocked || !self.ctx) {
+            return;
+          }
+          self._audioUnlocked = false;
+          self.autoUnlock = false;
+          if (!self._mobileUnloaded && self.ctx.sampleRate !== 44100) {
+            self._mobileUnloaded = true;
+            self.unload();
+          }
+          self._scratchBuffer = self.ctx.createBuffer(1, 1, 22050);
+          var unlock = function(e) {
+            while (self._html5AudioPool.length < self.html5PoolSize) {
+              try {
+                var audioNode = new Audio();
+                audioNode._unlocked = true;
+                self._releaseHtml5Audio(audioNode);
+              } catch (e2) {
+                self.noAudio = true;
+                break;
+              }
+            }
+            for (var i = 0; i < self._howls.length; i++) {
+              if (!self._howls[i]._webAudio) {
+                var ids = self._howls[i]._getSoundIds();
+                for (var j = 0; j < ids.length; j++) {
+                  var sound = self._howls[i]._soundById(ids[j]);
+                  if (sound && sound._node && !sound._node._unlocked) {
+                    sound._node._unlocked = true;
+                    sound._node.load();
+                  }
+                }
+              }
+            }
+            self._autoResume();
+            var source = self.ctx.createBufferSource();
+            source.buffer = self._scratchBuffer;
+            source.connect(self.ctx.destination);
+            if (typeof source.start === "undefined") {
+              source.noteOn(0);
+            } else {
+              source.start(0);
+            }
+            if (typeof self.ctx.resume === "function") {
+              self.ctx.resume();
+            }
+            source.onended = function() {
+              source.disconnect(0);
+              self._audioUnlocked = true;
+              document.removeEventListener("touchstart", unlock, true);
+              document.removeEventListener("touchend", unlock, true);
+              document.removeEventListener("click", unlock, true);
+              document.removeEventListener("keydown", unlock, true);
+              for (var i2 = 0; i2 < self._howls.length; i2++) {
+                self._howls[i2]._emit("unlock");
+              }
+            };
+          };
+          document.addEventListener("touchstart", unlock, true);
+          document.addEventListener("touchend", unlock, true);
+          document.addEventListener("click", unlock, true);
+          document.addEventListener("keydown", unlock, true);
+          return self;
+        },
+        /**
+         * Get an unlocked HTML5 Audio object from the pool. If none are left,
+         * return a new Audio object and throw a warning.
+         * @return {Audio} HTML5 Audio object.
+         */
+        _obtainHtml5Audio: function() {
+          var self = this || Howler3;
+          if (self._html5AudioPool.length) {
+            return self._html5AudioPool.pop();
+          }
+          var testPlay = new Audio().play();
+          if (testPlay && typeof Promise !== "undefined" && (testPlay instanceof Promise || typeof testPlay.then === "function")) {
+            testPlay.catch(function() {
+              console.warn("HTML5 Audio pool exhausted, returning potentially locked audio object.");
+            });
+          }
+          return new Audio();
+        },
+        /**
+         * Return an activated HTML5 Audio object to the pool.
+         * @return {Howler}
+         */
+        _releaseHtml5Audio: function(audio) {
+          var self = this || Howler3;
+          if (audio._unlocked) {
+            self._html5AudioPool.push(audio);
+          }
+          return self;
+        },
+        /**
+         * Automatically suspend the Web Audio AudioContext after no sound has played for 30 seconds.
+         * This saves processing/energy and fixes various browser-specific bugs with audio getting stuck.
+         * @return {Howler}
+         */
+        _autoSuspend: function() {
+          var self = this;
+          if (!self.autoSuspend || !self.ctx || typeof self.ctx.suspend === "undefined" || !Howler3.usingWebAudio) {
+            return;
+          }
+          for (var i = 0; i < self._howls.length; i++) {
+            if (self._howls[i]._webAudio) {
+              for (var j = 0; j < self._howls[i]._sounds.length; j++) {
+                if (!self._howls[i]._sounds[j]._paused) {
+                  return self;
+                }
+              }
+            }
+          }
+          if (self._suspendTimer) {
+            clearTimeout(self._suspendTimer);
+          }
+          self._suspendTimer = setTimeout(function() {
+            if (!self.autoSuspend) {
+              return;
+            }
+            self._suspendTimer = null;
+            self.state = "suspending";
+            var handleSuspension = function() {
+              self.state = "suspended";
+              if (self._resumeAfterSuspend) {
+                delete self._resumeAfterSuspend;
+                self._autoResume();
+              }
+            };
+            self.ctx.suspend().then(handleSuspension, handleSuspension);
+          }, 3e4);
+          return self;
+        },
+        /**
+         * Automatically resume the Web Audio AudioContext when a new sound is played.
+         * @return {Howler}
+         */
+        _autoResume: function() {
+          var self = this;
+          if (!self.ctx || typeof self.ctx.resume === "undefined" || !Howler3.usingWebAudio) {
+            return;
+          }
+          if (self.state === "running" && self.ctx.state !== "interrupted" && self._suspendTimer) {
+            clearTimeout(self._suspendTimer);
+            self._suspendTimer = null;
+          } else if (self.state === "suspended" || self.state === "running" && self.ctx.state === "interrupted") {
+            self.ctx.resume().then(function() {
+              self.state = "running";
+              for (var i = 0; i < self._howls.length; i++) {
+                self._howls[i]._emit("resume");
+              }
+            });
+            if (self._suspendTimer) {
+              clearTimeout(self._suspendTimer);
+              self._suspendTimer = null;
+            }
+          } else if (self.state === "suspending") {
+            self._resumeAfterSuspend = true;
+          }
+          return self;
+        }
+      };
+      var Howler3 = new HowlerGlobal2();
+      var Howl3 = function(o) {
+        var self = this;
+        if (!o.src || o.src.length === 0) {
+          console.error("An array of source files must be passed with any new Howl.");
+          return;
+        }
+        self.init(o);
+      };
+      Howl3.prototype = {
+        /**
+         * Initialize a new Howl group object.
+         * @param  {Object} o Passed in properties for this group.
+         * @return {Howl}
+         */
+        init: function(o) {
+          var self = this;
+          if (!Howler3.ctx) {
+            setupAudioContext();
+          }
+          self._autoplay = o.autoplay || false;
+          self._format = typeof o.format !== "string" ? o.format : [o.format];
+          self._html5 = o.html5 || false;
+          self._muted = o.mute || false;
+          self._loop = o.loop || false;
+          self._pool = o.pool || 5;
+          self._preload = typeof o.preload === "boolean" || o.preload === "metadata" ? o.preload : true;
+          self._rate = o.rate || 1;
+          self._sprite = o.sprite || {};
+          self._src = typeof o.src !== "string" ? o.src : [o.src];
+          self._volume = o.volume !== void 0 ? o.volume : 1;
+          self._xhr = {
+            method: o.xhr && o.xhr.method ? o.xhr.method : "GET",
+            headers: o.xhr && o.xhr.headers ? o.xhr.headers : null,
+            withCredentials: o.xhr && o.xhr.withCredentials ? o.xhr.withCredentials : false
+          };
+          self._duration = 0;
+          self._state = "unloaded";
+          self._sounds = [];
+          self._endTimers = {};
+          self._queue = [];
+          self._playLock = false;
+          self._onend = o.onend ? [{ fn: o.onend }] : [];
+          self._onfade = o.onfade ? [{ fn: o.onfade }] : [];
+          self._onload = o.onload ? [{ fn: o.onload }] : [];
+          self._onloaderror = o.onloaderror ? [{ fn: o.onloaderror }] : [];
+          self._onplayerror = o.onplayerror ? [{ fn: o.onplayerror }] : [];
+          self._onpause = o.onpause ? [{ fn: o.onpause }] : [];
+          self._onplay = o.onplay ? [{ fn: o.onplay }] : [];
+          self._onstop = o.onstop ? [{ fn: o.onstop }] : [];
+          self._onmute = o.onmute ? [{ fn: o.onmute }] : [];
+          self._onvolume = o.onvolume ? [{ fn: o.onvolume }] : [];
+          self._onrate = o.onrate ? [{ fn: o.onrate }] : [];
+          self._onseek = o.onseek ? [{ fn: o.onseek }] : [];
+          self._onunlock = o.onunlock ? [{ fn: o.onunlock }] : [];
+          self._onresume = [];
+          self._webAudio = Howler3.usingWebAudio && !self._html5;
+          if (typeof Howler3.ctx !== "undefined" && Howler3.ctx && Howler3.autoUnlock) {
+            Howler3._unlockAudio();
+          }
+          Howler3._howls.push(self);
+          if (self._autoplay) {
+            self._queue.push({
+              event: "play",
+              action: function() {
+                self.play();
+              }
+            });
+          }
+          if (self._preload && self._preload !== "none") {
+            self.load();
+          }
+          return self;
+        },
+        /**
+         * Load the audio file.
+         * @return {Howler}
+         */
+        load: function() {
+          var self = this;
+          var url = null;
+          if (Howler3.noAudio) {
+            self._emit("loaderror", null, "No audio support.");
+            return;
+          }
+          if (typeof self._src === "string") {
+            self._src = [self._src];
+          }
+          for (var i = 0; i < self._src.length; i++) {
+            var ext, str;
+            if (self._format && self._format[i]) {
+              ext = self._format[i];
+            } else {
+              str = self._src[i];
+              if (typeof str !== "string") {
+                self._emit("loaderror", null, "Non-string found in selected audio sources - ignoring.");
+                continue;
+              }
+              ext = /^data:audio\/([^;,]+);/i.exec(str);
+              if (!ext) {
+                ext = /\.([^.]+)$/.exec(str.split("?", 1)[0]);
+              }
+              if (ext) {
+                ext = ext[1].toLowerCase();
+              }
+            }
+            if (!ext) {
+              console.warn('No file extension was found. Consider using the "format" property or specify an extension.');
+            }
+            if (ext && Howler3.codecs(ext)) {
+              url = self._src[i];
+              break;
+            }
+          }
+          if (!url) {
+            self._emit("loaderror", null, "No codec support for selected audio sources.");
+            return;
+          }
+          self._src = url;
+          self._state = "loading";
+          if (window.location.protocol === "https:" && url.slice(0, 5) === "http:") {
+            self._html5 = true;
+            self._webAudio = false;
+          }
+          new Sound2(self);
+          if (self._webAudio) {
+            loadBuffer(self);
+          }
+          return self;
+        },
+        /**
+         * Play a sound or resume previous playback.
+         * @param  {String/Number} sprite   Sprite name for sprite playback or sound id to continue previous.
+         * @param  {Boolean} internal Internal Use: true prevents event firing.
+         * @return {Number}          Sound ID.
+         */
+        play: function(sprite, internal) {
+          var self = this;
+          var id = null;
+          if (typeof sprite === "number") {
+            id = sprite;
+            sprite = null;
+          } else if (typeof sprite === "string" && self._state === "loaded" && !self._sprite[sprite]) {
+            return null;
+          } else if (typeof sprite === "undefined") {
+            sprite = "__default";
+            if (!self._playLock) {
+              var num = 0;
+              for (var i = 0; i < self._sounds.length; i++) {
+                if (self._sounds[i]._paused && !self._sounds[i]._ended) {
+                  num++;
+                  id = self._sounds[i]._id;
+                }
+              }
+              if (num === 1) {
+                sprite = null;
+              } else {
+                id = null;
+              }
+            }
+          }
+          var sound = id ? self._soundById(id) : self._inactiveSound();
+          if (!sound) {
+            return null;
+          }
+          if (id && !sprite) {
+            sprite = sound._sprite || "__default";
+          }
+          if (self._state !== "loaded") {
+            sound._sprite = sprite;
+            sound._ended = false;
+            var soundId = sound._id;
+            self._queue.push({
+              event: "play",
+              action: function() {
+                self.play(soundId);
+              }
+            });
+            return soundId;
+          }
+          if (id && !sound._paused) {
+            if (!internal) {
+              self._loadQueue("play");
+            }
+            return sound._id;
+          }
+          if (self._webAudio) {
+            Howler3._autoResume();
+          }
+          var seek = Math.max(0, sound._seek > 0 ? sound._seek : self._sprite[sprite][0] / 1e3);
+          var duration = Math.max(0, (self._sprite[sprite][0] + self._sprite[sprite][1]) / 1e3 - seek);
+          var timeout = duration * 1e3 / Math.abs(sound._rate);
+          var start = self._sprite[sprite][0] / 1e3;
+          var stop = (self._sprite[sprite][0] + self._sprite[sprite][1]) / 1e3;
+          sound._sprite = sprite;
+          sound._ended = false;
+          var setParams = function() {
+            sound._paused = false;
+            sound._seek = seek;
+            sound._start = start;
+            sound._stop = stop;
+            sound._loop = !!(sound._loop || self._sprite[sprite][2]);
+          };
+          if (seek >= stop) {
+            self._ended(sound);
+            return;
+          }
+          var node = sound._node;
+          if (self._webAudio) {
+            var playWebAudio = function() {
+              self._playLock = false;
+              setParams();
+              self._refreshBuffer(sound);
+              var vol = sound._muted || self._muted ? 0 : sound._volume;
+              node.gain.setValueAtTime(vol, Howler3.ctx.currentTime);
+              sound._playStart = Howler3.ctx.currentTime;
+              if (typeof node.bufferSource.start === "undefined") {
+                sound._loop ? node.bufferSource.noteGrainOn(0, seek, 86400) : node.bufferSource.noteGrainOn(0, seek, duration);
+              } else {
+                sound._loop ? node.bufferSource.start(0, seek, 86400) : node.bufferSource.start(0, seek, duration);
+              }
+              if (timeout !== Infinity) {
+                self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout);
+              }
+              if (!internal) {
+                setTimeout(function() {
+                  self._emit("play", sound._id);
+                  self._loadQueue();
+                }, 0);
+              }
+            };
+            if (Howler3.state === "running" && Howler3.ctx.state !== "interrupted") {
+              playWebAudio();
+            } else {
+              self._playLock = true;
+              self.once("resume", playWebAudio);
+              self._clearTimer(sound._id);
+            }
+          } else {
+            var playHtml5 = function() {
+              node.currentTime = seek;
+              node.muted = sound._muted || self._muted || Howler3._muted || node.muted;
+              node.volume = sound._volume * Howler3.volume();
+              node.playbackRate = sound._rate;
+              try {
+                var play = node.play();
+                if (play && typeof Promise !== "undefined" && (play instanceof Promise || typeof play.then === "function")) {
+                  self._playLock = true;
+                  setParams();
+                  play.then(function() {
+                    self._playLock = false;
+                    node._unlocked = true;
+                    if (!internal) {
+                      self._emit("play", sound._id);
+                    } else {
+                      self._loadQueue();
+                    }
+                  }).catch(function() {
+                    self._playLock = false;
+                    self._emit("playerror", sound._id, "Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction.");
+                    sound._ended = true;
+                    sound._paused = true;
+                  });
+                } else if (!internal) {
+                  self._playLock = false;
+                  setParams();
+                  self._emit("play", sound._id);
+                }
+                node.playbackRate = sound._rate;
+                if (node.paused) {
+                  self._emit("playerror", sound._id, "Playback was unable to start. This is most commonly an issue on mobile devices and Chrome where playback was not within a user interaction.");
+                  return;
+                }
+                if (sprite !== "__default" || sound._loop) {
+                  self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout);
+                } else {
+                  self._endTimers[sound._id] = function() {
+                    self._ended(sound);
+                    node.removeEventListener("ended", self._endTimers[sound._id], false);
+                  };
+                  node.addEventListener("ended", self._endTimers[sound._id], false);
+                }
+              } catch (err) {
+                self._emit("playerror", sound._id, err);
+              }
+            };
+            if (node.src === "data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA") {
+              node.src = self._src;
+              node.load();
+            }
+            var loadedNoReadyState = window && window.ejecta || !node.readyState && Howler3._navigator.isCocoonJS;
+            if (node.readyState >= 3 || loadedNoReadyState) {
+              playHtml5();
+            } else {
+              self._playLock = true;
+              self._state = "loading";
+              var listener = function() {
+                self._state = "loaded";
+                playHtml5();
+                node.removeEventListener(Howler3._canPlayEvent, listener, false);
+              };
+              node.addEventListener(Howler3._canPlayEvent, listener, false);
+              self._clearTimer(sound._id);
+            }
+          }
+          return sound._id;
+        },
+        /**
+         * Pause playback and save current position.
+         * @param  {Number} id The sound ID (empty to pause all in group).
+         * @return {Howl}
+         */
+        pause: function(id) {
+          var self = this;
+          if (self._state !== "loaded" || self._playLock) {
+            self._queue.push({
+              event: "pause",
+              action: function() {
+                self.pause(id);
+              }
+            });
+            return self;
+          }
+          var ids = self._getSoundIds(id);
+          for (var i = 0; i < ids.length; i++) {
+            self._clearTimer(ids[i]);
+            var sound = self._soundById(ids[i]);
+            if (sound && !sound._paused) {
+              sound._seek = self.seek(ids[i]);
+              sound._rateSeek = 0;
+              sound._paused = true;
+              self._stopFade(ids[i]);
+              if (sound._node) {
+                if (self._webAudio) {
+                  if (!sound._node.bufferSource) {
+                    continue;
+                  }
+                  if (typeof sound._node.bufferSource.stop === "undefined") {
+                    sound._node.bufferSource.noteOff(0);
+                  } else {
+                    sound._node.bufferSource.stop(0);
+                  }
+                  self._cleanBuffer(sound._node);
+                } else if (!isNaN(sound._node.duration) || sound._node.duration === Infinity) {
+                  sound._node.pause();
+                }
+              }
+            }
+            if (!arguments[1]) {
+              self._emit("pause", sound ? sound._id : null);
+            }
+          }
+          return self;
+        },
+        /**
+         * Stop playback and reset to start.
+         * @param  {Number} id The sound ID (empty to stop all in group).
+         * @param  {Boolean} internal Internal Use: true prevents event firing.
+         * @return {Howl}
+         */
+        stop: function(id, internal) {
+          var self = this;
+          if (self._state !== "loaded" || self._playLock) {
+            self._queue.push({
+              event: "stop",
+              action: function() {
+                self.stop(id);
+              }
+            });
+            return self;
+          }
+          var ids = self._getSoundIds(id);
+          for (var i = 0; i < ids.length; i++) {
+            self._clearTimer(ids[i]);
+            var sound = self._soundById(ids[i]);
+            if (sound) {
+              sound._seek = sound._start || 0;
+              sound._rateSeek = 0;
+              sound._paused = true;
+              sound._ended = true;
+              self._stopFade(ids[i]);
+              if (sound._node) {
+                if (self._webAudio) {
+                  if (sound._node.bufferSource) {
+                    if (typeof sound._node.bufferSource.stop === "undefined") {
+                      sound._node.bufferSource.noteOff(0);
+                    } else {
+                      sound._node.bufferSource.stop(0);
+                    }
+                    self._cleanBuffer(sound._node);
+                  }
+                } else if (!isNaN(sound._node.duration) || sound._node.duration === Infinity) {
+                  sound._node.currentTime = sound._start || 0;
+                  sound._node.pause();
+                  if (sound._node.duration === Infinity) {
+                    self._clearSound(sound._node);
+                  }
+                }
+              }
+              if (!internal) {
+                self._emit("stop", sound._id);
+              }
+            }
+          }
+          return self;
+        },
+        /**
+         * Mute/unmute a single sound or all sounds in this Howl group.
+         * @param  {Boolean} muted Set to true to mute and false to unmute.
+         * @param  {Number} id    The sound ID to update (omit to mute/unmute all).
+         * @return {Howl}
+         */
+        mute: function(muted, id) {
+          var self = this;
+          if (self._state !== "loaded" || self._playLock) {
+            self._queue.push({
+              event: "mute",
+              action: function() {
+                self.mute(muted, id);
+              }
+            });
+            return self;
+          }
+          if (typeof id === "undefined") {
+            if (typeof muted === "boolean") {
+              self._muted = muted;
+            } else {
+              return self._muted;
+            }
+          }
+          var ids = self._getSoundIds(id);
+          for (var i = 0; i < ids.length; i++) {
+            var sound = self._soundById(ids[i]);
+            if (sound) {
+              sound._muted = muted;
+              if (sound._interval) {
+                self._stopFade(sound._id);
+              }
+              if (self._webAudio && sound._node) {
+                sound._node.gain.setValueAtTime(muted ? 0 : sound._volume, Howler3.ctx.currentTime);
+              } else if (sound._node) {
+                sound._node.muted = Howler3._muted ? true : muted;
+              }
+              self._emit("mute", sound._id);
+            }
+          }
+          return self;
+        },
+        /**
+         * Get/set the volume of this sound or of the Howl group. This method can optionally take 0, 1 or 2 arguments.
+         *   volume() -> Returns the group's volume value.
+         *   volume(id) -> Returns the sound id's current volume.
+         *   volume(vol) -> Sets the volume of all sounds in this Howl group.
+         *   volume(vol, id) -> Sets the volume of passed sound id.
+         * @return {Howl/Number} Returns self or current volume.
+         */
+        volume: function() {
+          var self = this;
+          var args = arguments;
+          var vol, id;
+          if (args.length === 0) {
+            return self._volume;
+          } else if (args.length === 1 || args.length === 2 && typeof args[1] === "undefined") {
+            var ids = self._getSoundIds();
+            var index = ids.indexOf(args[0]);
+            if (index >= 0) {
+              id = parseInt(args[0], 10);
+            } else {
+              vol = parseFloat(args[0]);
+            }
+          } else if (args.length >= 2) {
+            vol = parseFloat(args[0]);
+            id = parseInt(args[1], 10);
+          }
+          var sound;
+          if (typeof vol !== "undefined" && vol >= 0 && vol <= 1) {
+            if (self._state !== "loaded" || self._playLock) {
+              self._queue.push({
+                event: "volume",
+                action: function() {
+                  self.volume.apply(self, args);
+                }
+              });
+              return self;
+            }
+            if (typeof id === "undefined") {
+              self._volume = vol;
+            }
+            id = self._getSoundIds(id);
+            for (var i = 0; i < id.length; i++) {
+              sound = self._soundById(id[i]);
+              if (sound) {
+                sound._volume = vol;
+                if (!args[2]) {
+                  self._stopFade(id[i]);
+                }
+                if (self._webAudio && sound._node && !sound._muted) {
+                  sound._node.gain.setValueAtTime(vol, Howler3.ctx.currentTime);
+                } else if (sound._node && !sound._muted) {
+                  sound._node.volume = vol * Howler3.volume();
+                }
+                self._emit("volume", sound._id);
+              }
+            }
+          } else {
+            sound = id ? self._soundById(id) : self._sounds[0];
+            return sound ? sound._volume : 0;
+          }
+          return self;
+        },
+        /**
+         * Fade a currently playing sound between two volumes (if no id is passed, all sounds will fade).
+         * @param  {Number} from The value to fade from (0.0 to 1.0).
+         * @param  {Number} to   The volume to fade to (0.0 to 1.0).
+         * @param  {Number} len  Time in milliseconds to fade.
+         * @param  {Number} id   The sound id (omit to fade all sounds).
+         * @return {Howl}
+         */
+        fade: function(from, to, len, id) {
+          var self = this;
+          if (self._state !== "loaded" || self._playLock) {
+            self._queue.push({
+              event: "fade",
+              action: function() {
+                self.fade(from, to, len, id);
+              }
+            });
+            return self;
+          }
+          from = Math.min(Math.max(0, parseFloat(from)), 1);
+          to = Math.min(Math.max(0, parseFloat(to)), 1);
+          len = parseFloat(len);
+          self.volume(from, id);
+          var ids = self._getSoundIds(id);
+          for (var i = 0; i < ids.length; i++) {
+            var sound = self._soundById(ids[i]);
+            if (sound) {
+              if (!id) {
+                self._stopFade(ids[i]);
+              }
+              if (self._webAudio && !sound._muted) {
+                var currentTime = Howler3.ctx.currentTime;
+                var end = currentTime + len / 1e3;
+                sound._volume = from;
+                sound._node.gain.setValueAtTime(from, currentTime);
+                sound._node.gain.linearRampToValueAtTime(to, end);
+              }
+              self._startFadeInterval(sound, from, to, len, ids[i], typeof id === "undefined");
+            }
+          }
+          return self;
+        },
+        /**
+         * Starts the internal interval to fade a sound.
+         * @param  {Object} sound Reference to sound to fade.
+         * @param  {Number} from The value to fade from (0.0 to 1.0).
+         * @param  {Number} to   The volume to fade to (0.0 to 1.0).
+         * @param  {Number} len  Time in milliseconds to fade.
+         * @param  {Number} id   The sound id to fade.
+         * @param  {Boolean} isGroup   If true, set the volume on the group.
+         */
+        _startFadeInterval: function(sound, from, to, len, id, isGroup) {
+          var self = this;
+          var vol = from;
+          var diff = to - from;
+          var steps = Math.abs(diff / 0.01);
+          var stepLen = Math.max(4, steps > 0 ? len / steps : len);
+          var lastTick = Date.now();
+          sound._fadeTo = to;
+          sound._interval = setInterval(function() {
+            var tick = (Date.now() - lastTick) / len;
+            lastTick = Date.now();
+            vol += diff * tick;
+            vol = Math.round(vol * 100) / 100;
+            if (diff < 0) {
+              vol = Math.max(to, vol);
+            } else {
+              vol = Math.min(to, vol);
+            }
+            if (self._webAudio) {
+              sound._volume = vol;
+            } else {
+              self.volume(vol, sound._id, true);
+            }
+            if (isGroup) {
+              self._volume = vol;
+            }
+            if (to < from && vol <= to || to > from && vol >= to) {
+              clearInterval(sound._interval);
+              sound._interval = null;
+              sound._fadeTo = null;
+              self.volume(to, sound._id);
+              self._emit("fade", sound._id);
+            }
+          }, stepLen);
+        },
+        /**
+         * Internal method that stops the currently playing fade when
+         * a new fade starts, volume is changed or the sound is stopped.
+         * @param  {Number} id The sound id.
+         * @return {Howl}
+         */
+        _stopFade: function(id) {
+          var self = this;
+          var sound = self._soundById(id);
+          if (sound && sound._interval) {
+            if (self._webAudio) {
+              sound._node.gain.cancelScheduledValues(Howler3.ctx.currentTime);
+            }
+            clearInterval(sound._interval);
+            sound._interval = null;
+            self.volume(sound._fadeTo, id);
+            sound._fadeTo = null;
+            self._emit("fade", id);
+          }
+          return self;
+        },
+        /**
+         * Get/set the loop parameter on a sound. This method can optionally take 0, 1 or 2 arguments.
+         *   loop() -> Returns the group's loop value.
+         *   loop(id) -> Returns the sound id's loop value.
+         *   loop(loop) -> Sets the loop value for all sounds in this Howl group.
+         *   loop(loop, id) -> Sets the loop value of passed sound id.
+         * @return {Howl/Boolean} Returns self or current loop value.
+         */
+        loop: function() {
+          var self = this;
+          var args = arguments;
+          var loop, id, sound;
+          if (args.length === 0) {
+            return self._loop;
+          } else if (args.length === 1) {
+            if (typeof args[0] === "boolean") {
+              loop = args[0];
+              self._loop = loop;
+            } else {
+              sound = self._soundById(parseInt(args[0], 10));
+              return sound ? sound._loop : false;
+            }
+          } else if (args.length === 2) {
+            loop = args[0];
+            id = parseInt(args[1], 10);
+          }
+          var ids = self._getSoundIds(id);
+          for (var i = 0; i < ids.length; i++) {
+            sound = self._soundById(ids[i]);
+            if (sound) {
+              sound._loop = loop;
+              if (self._webAudio && sound._node && sound._node.bufferSource) {
+                sound._node.bufferSource.loop = loop;
+                if (loop) {
+                  sound._node.bufferSource.loopStart = sound._start || 0;
+                  sound._node.bufferSource.loopEnd = sound._stop;
+                  if (self.playing(ids[i])) {
+                    self.pause(ids[i], true);
+                    self.play(ids[i], true);
+                  }
+                }
+              }
+            }
+          }
+          return self;
+        },
+        /**
+         * Get/set the playback rate of a sound. This method can optionally take 0, 1 or 2 arguments.
+         *   rate() -> Returns the first sound node's current playback rate.
+         *   rate(id) -> Returns the sound id's current playback rate.
+         *   rate(rate) -> Sets the playback rate of all sounds in this Howl group.
+         *   rate(rate, id) -> Sets the playback rate of passed sound id.
+         * @return {Howl/Number} Returns self or the current playback rate.
+         */
+        rate: function() {
+          var self = this;
+          var args = arguments;
+          var rate, id;
+          if (args.length === 0) {
+            id = self._sounds[0]._id;
+          } else if (args.length === 1) {
+            var ids = self._getSoundIds();
+            var index = ids.indexOf(args[0]);
+            if (index >= 0) {
+              id = parseInt(args[0], 10);
+            } else {
+              rate = parseFloat(args[0]);
+            }
+          } else if (args.length === 2) {
+            rate = parseFloat(args[0]);
+            id = parseInt(args[1], 10);
+          }
+          var sound;
+          if (typeof rate === "number") {
+            if (self._state !== "loaded" || self._playLock) {
+              self._queue.push({
+                event: "rate",
+                action: function() {
+                  self.rate.apply(self, args);
+                }
+              });
+              return self;
+            }
+            if (typeof id === "undefined") {
+              self._rate = rate;
+            }
+            id = self._getSoundIds(id);
+            for (var i = 0; i < id.length; i++) {
+              sound = self._soundById(id[i]);
+              if (sound) {
+                if (self.playing(id[i])) {
+                  sound._rateSeek = self.seek(id[i]);
+                  sound._playStart = self._webAudio ? Howler3.ctx.currentTime : sound._playStart;
+                }
+                sound._rate = rate;
+                if (self._webAudio && sound._node && sound._node.bufferSource) {
+                  sound._node.bufferSource.playbackRate.setValueAtTime(rate, Howler3.ctx.currentTime);
+                } else if (sound._node) {
+                  sound._node.playbackRate = rate;
+                }
+                var seek = self.seek(id[i]);
+                var duration = (self._sprite[sound._sprite][0] + self._sprite[sound._sprite][1]) / 1e3 - seek;
+                var timeout = duration * 1e3 / Math.abs(sound._rate);
+                if (self._endTimers[id[i]] || !sound._paused) {
+                  self._clearTimer(id[i]);
+                  self._endTimers[id[i]] = setTimeout(self._ended.bind(self, sound), timeout);
+                }
+                self._emit("rate", sound._id);
+              }
+            }
+          } else {
+            sound = self._soundById(id);
+            return sound ? sound._rate : self._rate;
+          }
+          return self;
+        },
+        /**
+         * Get/set the seek position of a sound. This method can optionally take 0, 1 or 2 arguments.
+         *   seek() -> Returns the first sound node's current seek position.
+         *   seek(id) -> Returns the sound id's current seek position.
+         *   seek(seek) -> Sets the seek position of the first sound node.
+         *   seek(seek, id) -> Sets the seek position of passed sound id.
+         * @return {Howl/Number} Returns self or the current seek position.
+         */
+        seek: function() {
+          var self = this;
+          var args = arguments;
+          var seek, id;
+          if (args.length === 0) {
+            if (self._sounds.length) {
+              id = self._sounds[0]._id;
+            }
+          } else if (args.length === 1) {
+            var ids = self._getSoundIds();
+            var index = ids.indexOf(args[0]);
+            if (index >= 0) {
+              id = parseInt(args[0], 10);
+            } else if (self._sounds.length) {
+              id = self._sounds[0]._id;
+              seek = parseFloat(args[0]);
+            }
+          } else if (args.length === 2) {
+            seek = parseFloat(args[0]);
+            id = parseInt(args[1], 10);
+          }
+          if (typeof id === "undefined") {
+            return 0;
+          }
+          if (typeof seek === "number" && (self._state !== "loaded" || self._playLock)) {
+            self._queue.push({
+              event: "seek",
+              action: function() {
+                self.seek.apply(self, args);
+              }
+            });
+            return self;
+          }
+          var sound = self._soundById(id);
+          if (sound) {
+            if (typeof seek === "number" && seek >= 0) {
+              var playing = self.playing(id);
+              if (playing) {
+                self.pause(id, true);
+              }
+              sound._seek = seek;
+              sound._ended = false;
+              self._clearTimer(id);
+              if (!self._webAudio && sound._node && !isNaN(sound._node.duration)) {
+                sound._node.currentTime = seek;
+              }
+              var seekAndEmit = function() {
+                if (playing) {
+                  self.play(id, true);
+                }
+                self._emit("seek", id);
+              };
+              if (playing && !self._webAudio) {
+                var emitSeek = function() {
+                  if (!self._playLock) {
+                    seekAndEmit();
+                  } else {
+                    setTimeout(emitSeek, 0);
+                  }
+                };
+                setTimeout(emitSeek, 0);
+              } else {
+                seekAndEmit();
+              }
+            } else {
+              if (self._webAudio) {
+                var realTime = self.playing(id) ? Howler3.ctx.currentTime - sound._playStart : 0;
+                var rateSeek = sound._rateSeek ? sound._rateSeek - sound._seek : 0;
+                return sound._seek + (rateSeek + realTime * Math.abs(sound._rate));
+              } else {
+                return sound._node.currentTime;
+              }
+            }
+          }
+          return self;
+        },
+        /**
+         * Check if a specific sound is currently playing or not (if id is provided), or check if at least one of the sounds in the group is playing or not.
+         * @param  {Number}  id The sound id to check. If none is passed, the whole sound group is checked.
+         * @return {Boolean} True if playing and false if not.
+         */
+        playing: function(id) {
+          var self = this;
+          if (typeof id === "number") {
+            var sound = self._soundById(id);
+            return sound ? !sound._paused : false;
+          }
+          for (var i = 0; i < self._sounds.length; i++) {
+            if (!self._sounds[i]._paused) {
+              return true;
+            }
+          }
+          return false;
+        },
+        /**
+         * Get the duration of this sound. Passing a sound id will return the sprite duration.
+         * @param  {Number} id The sound id to check. If none is passed, return full source duration.
+         * @return {Number} Audio duration in seconds.
+         */
+        duration: function(id) {
+          var self = this;
+          var duration = self._duration;
+          var sound = self._soundById(id);
+          if (sound) {
+            duration = self._sprite[sound._sprite][1] / 1e3;
+          }
+          return duration;
+        },
+        /**
+         * Returns the current loaded state of this Howl.
+         * @return {String} 'unloaded', 'loading', 'loaded'
+         */
+        state: function() {
+          return this._state;
+        },
+        /**
+         * Unload and destroy the current Howl object.
+         * This will immediately stop all sound instances attached to this group.
+         */
+        unload: function() {
+          var self = this;
+          var sounds = self._sounds;
+          for (var i = 0; i < sounds.length; i++) {
+            if (!sounds[i]._paused) {
+              self.stop(sounds[i]._id);
+            }
+            if (!self._webAudio) {
+              self._clearSound(sounds[i]._node);
+              sounds[i]._node.removeEventListener("error", sounds[i]._errorFn, false);
+              sounds[i]._node.removeEventListener(Howler3._canPlayEvent, sounds[i]._loadFn, false);
+              sounds[i]._node.removeEventListener("ended", sounds[i]._endFn, false);
+              Howler3._releaseHtml5Audio(sounds[i]._node);
+            }
+            delete sounds[i]._node;
+            self._clearTimer(sounds[i]._id);
+          }
+          var index = Howler3._howls.indexOf(self);
+          if (index >= 0) {
+            Howler3._howls.splice(index, 1);
+          }
+          var remCache = true;
+          for (i = 0; i < Howler3._howls.length; i++) {
+            if (Howler3._howls[i]._src === self._src || self._src.indexOf(Howler3._howls[i]._src) >= 0) {
+              remCache = false;
+              break;
+            }
+          }
+          if (cache && remCache) {
+            delete cache[self._src];
+          }
+          Howler3.noAudio = false;
+          self._state = "unloaded";
+          self._sounds = [];
+          self = null;
+          return null;
+        },
+        /**
+         * Listen to a custom event.
+         * @param  {String}   event Event name.
+         * @param  {Function} fn    Listener to call.
+         * @param  {Number}   id    (optional) Only listen to events for this sound.
+         * @param  {Number}   once  (INTERNAL) Marks event to fire only once.
+         * @return {Howl}
+         */
+        on: function(event, fn, id, once) {
+          var self = this;
+          var events = self["_on" + event];
+          if (typeof fn === "function") {
+            events.push(once ? { id, fn, once } : { id, fn });
+          }
+          return self;
+        },
+        /**
+         * Remove a custom event. Call without parameters to remove all events.
+         * @param  {String}   event Event name.
+         * @param  {Function} fn    Listener to remove. Leave empty to remove all.
+         * @param  {Number}   id    (optional) Only remove events for this sound.
+         * @return {Howl}
+         */
+        off: function(event, fn, id) {
+          var self = this;
+          var events = self["_on" + event];
+          var i = 0;
+          if (typeof fn === "number") {
+            id = fn;
+            fn = null;
+          }
+          if (fn || id) {
+            for (i = 0; i < events.length; i++) {
+              var isId = id === events[i].id;
+              if (fn === events[i].fn && isId || !fn && isId) {
+                events.splice(i, 1);
+                break;
+              }
+            }
+          } else if (event) {
+            self["_on" + event] = [];
+          } else {
+            var keys = Object.keys(self);
+            for (i = 0; i < keys.length; i++) {
+              if (keys[i].indexOf("_on") === 0 && Array.isArray(self[keys[i]])) {
+                self[keys[i]] = [];
+              }
+            }
+          }
+          return self;
+        },
+        /**
+         * Listen to a custom event and remove it once fired.
+         * @param  {String}   event Event name.
+         * @param  {Function} fn    Listener to call.
+         * @param  {Number}   id    (optional) Only listen to events for this sound.
+         * @return {Howl}
+         */
+        once: function(event, fn, id) {
+          var self = this;
+          self.on(event, fn, id, 1);
+          return self;
+        },
+        /**
+         * Emit all events of a specific type and pass the sound id.
+         * @param  {String} event Event name.
+         * @param  {Number} id    Sound ID.
+         * @param  {Number} msg   Message to go with event.
+         * @return {Howl}
+         */
+        _emit: function(event, id, msg) {
+          var self = this;
+          var events = self["_on" + event];
+          for (var i = events.length - 1; i >= 0; i--) {
+            if (!events[i].id || events[i].id === id || event === "load") {
+              setTimeout(function(fn) {
+                fn.call(this, id, msg);
+              }.bind(self, events[i].fn), 0);
+              if (events[i].once) {
+                self.off(event, events[i].fn, events[i].id);
+              }
+            }
+          }
+          self._loadQueue(event);
+          return self;
+        },
+        /**
+         * Queue of actions initiated before the sound has loaded.
+         * These will be called in sequence, with the next only firing
+         * after the previous has finished executing (even if async like play).
+         * @return {Howl}
+         */
+        _loadQueue: function(event) {
+          var self = this;
+          if (self._queue.length > 0) {
+            var task = self._queue[0];
+            if (task.event === event) {
+              self._queue.shift();
+              self._loadQueue();
+            }
+            if (!event) {
+              task.action();
+            }
+          }
+          return self;
+        },
+        /**
+         * Fired when playback ends at the end of the duration.
+         * @param  {Sound} sound The sound object to work with.
+         * @return {Howl}
+         */
+        _ended: function(sound) {
+          var self = this;
+          var sprite = sound._sprite;
+          if (!self._webAudio && sound._node && !sound._node.paused && !sound._node.ended && sound._node.currentTime < sound._stop) {
+            setTimeout(self._ended.bind(self, sound), 100);
+            return self;
+          }
+          var loop = !!(sound._loop || self._sprite[sprite][2]);
+          self._emit("end", sound._id);
+          if (!self._webAudio && loop) {
+            self.stop(sound._id, true).play(sound._id);
+          }
+          if (self._webAudio && loop) {
+            self._emit("play", sound._id);
+            sound._seek = sound._start || 0;
+            sound._rateSeek = 0;
+            sound._playStart = Howler3.ctx.currentTime;
+            var timeout = (sound._stop - sound._start) * 1e3 / Math.abs(sound._rate);
+            self._endTimers[sound._id] = setTimeout(self._ended.bind(self, sound), timeout);
+          }
+          if (self._webAudio && !loop) {
+            sound._paused = true;
+            sound._ended = true;
+            sound._seek = sound._start || 0;
+            sound._rateSeek = 0;
+            self._clearTimer(sound._id);
+            self._cleanBuffer(sound._node);
+            Howler3._autoSuspend();
+          }
+          if (!self._webAudio && !loop) {
+            self.stop(sound._id, true);
+          }
+          return self;
+        },
+        /**
+         * Clear the end timer for a sound playback.
+         * @param  {Number} id The sound ID.
+         * @return {Howl}
+         */
+        _clearTimer: function(id) {
+          var self = this;
+          if (self._endTimers[id]) {
+            if (typeof self._endTimers[id] !== "function") {
+              clearTimeout(self._endTimers[id]);
+            } else {
+              var sound = self._soundById(id);
+              if (sound && sound._node) {
+                sound._node.removeEventListener("ended", self._endTimers[id], false);
+              }
+            }
+            delete self._endTimers[id];
+          }
+          return self;
+        },
+        /**
+         * Return the sound identified by this ID, or return null.
+         * @param  {Number} id Sound ID
+         * @return {Object}    Sound object or null.
+         */
+        _soundById: function(id) {
+          var self = this;
+          for (var i = 0; i < self._sounds.length; i++) {
+            if (id === self._sounds[i]._id) {
+              return self._sounds[i];
+            }
+          }
+          return null;
+        },
+        /**
+         * Return an inactive sound from the pool or create a new one.
+         * @return {Sound} Sound playback object.
+         */
+        _inactiveSound: function() {
+          var self = this;
+          self._drain();
+          for (var i = 0; i < self._sounds.length; i++) {
+            if (self._sounds[i]._ended) {
+              return self._sounds[i].reset();
+            }
+          }
+          return new Sound2(self);
+        },
+        /**
+         * Drain excess inactive sounds from the pool.
+         */
+        _drain: function() {
+          var self = this;
+          var limit = self._pool;
+          var cnt = 0;
+          var i = 0;
+          if (self._sounds.length < limit) {
+            return;
+          }
+          for (i = 0; i < self._sounds.length; i++) {
+            if (self._sounds[i]._ended) {
+              cnt++;
+            }
+          }
+          for (i = self._sounds.length - 1; i >= 0; i--) {
+            if (cnt <= limit) {
+              return;
+            }
+            if (self._sounds[i]._ended) {
+              if (self._webAudio && self._sounds[i]._node) {
+                self._sounds[i]._node.disconnect(0);
+              }
+              self._sounds.splice(i, 1);
+              cnt--;
+            }
+          }
+        },
+        /**
+         * Get all ID's from the sounds pool.
+         * @param  {Number} id Only return one ID if one is passed.
+         * @return {Array}    Array of IDs.
+         */
+        _getSoundIds: function(id) {
+          var self = this;
+          if (typeof id === "undefined") {
+            var ids = [];
+            for (var i = 0; i < self._sounds.length; i++) {
+              ids.push(self._sounds[i]._id);
+            }
+            return ids;
+          } else {
+            return [id];
+          }
+        },
+        /**
+         * Load the sound back into the buffer source.
+         * @param  {Sound} sound The sound object to work with.
+         * @return {Howl}
+         */
+        _refreshBuffer: function(sound) {
+          var self = this;
+          sound._node.bufferSource = Howler3.ctx.createBufferSource();
+          sound._node.bufferSource.buffer = cache[self._src];
+          if (sound._panner) {
+            sound._node.bufferSource.connect(sound._panner);
+          } else {
+            sound._node.bufferSource.connect(sound._node);
+          }
+          sound._node.bufferSource.loop = sound._loop;
+          if (sound._loop) {
+            sound._node.bufferSource.loopStart = sound._start || 0;
+            sound._node.bufferSource.loopEnd = sound._stop || 0;
+          }
+          sound._node.bufferSource.playbackRate.setValueAtTime(sound._rate, Howler3.ctx.currentTime);
+          return self;
+        },
+        /**
+         * Prevent memory leaks by cleaning up the buffer source after playback.
+         * @param  {Object} node Sound's audio node containing the buffer source.
+         * @return {Howl}
+         */
+        _cleanBuffer: function(node) {
+          var self = this;
+          var isIOS = Howler3._navigator && Howler3._navigator.vendor.indexOf("Apple") >= 0;
+          if (!node.bufferSource) {
+            return self;
+          }
+          if (Howler3._scratchBuffer && node.bufferSource) {
+            node.bufferSource.onended = null;
+            node.bufferSource.disconnect(0);
+            if (isIOS) {
+              try {
+                node.bufferSource.buffer = Howler3._scratchBuffer;
+              } catch (e) {
+              }
+            }
+          }
+          node.bufferSource = null;
+          return self;
+        },
+        /**
+         * Set the source to a 0-second silence to stop any downloading (except in IE).
+         * @param  {Object} node Audio node to clear.
+         */
+        _clearSound: function(node) {
+          var checkIE = /MSIE |Trident\//.test(Howler3._navigator && Howler3._navigator.userAgent);
+          if (!checkIE) {
+            node.src = "data:audio/wav;base64,UklGRigAAABXQVZFZm10IBIAAAABAAEARKwAAIhYAQACABAAAABkYXRhAgAAAAEA";
+          }
+        }
+      };
+      var Sound2 = function(howl) {
+        this._parent = howl;
+        this.init();
+      };
+      Sound2.prototype = {
+        /**
+         * Initialize a new Sound object.
+         * @return {Sound}
+         */
+        init: function() {
+          var self = this;
+          var parent = self._parent;
+          self._muted = parent._muted;
+          self._loop = parent._loop;
+          self._volume = parent._volume;
+          self._rate = parent._rate;
+          self._seek = 0;
+          self._paused = true;
+          self._ended = true;
+          self._sprite = "__default";
+          self._id = ++Howler3._counter;
+          parent._sounds.push(self);
+          self.create();
+          return self;
+        },
+        /**
+         * Create and setup a new sound object, whether HTML5 Audio or Web Audio.
+         * @return {Sound}
+         */
+        create: function() {
+          var self = this;
+          var parent = self._parent;
+          var volume = Howler3._muted || self._muted || self._parent._muted ? 0 : self._volume;
+          if (parent._webAudio) {
+            self._node = typeof Howler3.ctx.createGain === "undefined" ? Howler3.ctx.createGainNode() : Howler3.ctx.createGain();
+            self._node.gain.setValueAtTime(volume, Howler3.ctx.currentTime);
+            self._node.paused = true;
+            self._node.connect(Howler3.masterGain);
+          } else if (!Howler3.noAudio) {
+            self._node = Howler3._obtainHtml5Audio();
+            self._errorFn = self._errorListener.bind(self);
+            self._node.addEventListener("error", self._errorFn, false);
+            self._loadFn = self._loadListener.bind(self);
+            self._node.addEventListener(Howler3._canPlayEvent, self._loadFn, false);
+            self._endFn = self._endListener.bind(self);
+            self._node.addEventListener("ended", self._endFn, false);
+            self._node.src = parent._src;
+            self._node.preload = parent._preload === true ? "auto" : parent._preload;
+            self._node.volume = volume * Howler3.volume();
+            self._node.load();
+          }
+          return self;
+        },
+        /**
+         * Reset the parameters of this sound to the original state (for recycle).
+         * @return {Sound}
+         */
+        reset: function() {
+          var self = this;
+          var parent = self._parent;
+          self._muted = parent._muted;
+          self._loop = parent._loop;
+          self._volume = parent._volume;
+          self._rate = parent._rate;
+          self._seek = 0;
+          self._rateSeek = 0;
+          self._paused = true;
+          self._ended = true;
+          self._sprite = "__default";
+          self._id = ++Howler3._counter;
+          return self;
+        },
+        /**
+         * HTML5 Audio error listener callback.
+         */
+        _errorListener: function() {
+          var self = this;
+          self._parent._emit("loaderror", self._id, self._node.error ? self._node.error.code : 0);
+          self._node.removeEventListener("error", self._errorFn, false);
+        },
+        /**
+         * HTML5 Audio canplaythrough listener callback.
+         */
+        _loadListener: function() {
+          var self = this;
+          var parent = self._parent;
+          parent._duration = Math.ceil(self._node.duration * 10) / 10;
+          if (Object.keys(parent._sprite).length === 0) {
+            parent._sprite = { __default: [0, parent._duration * 1e3] };
+          }
+          if (parent._state !== "loaded") {
+            parent._state = "loaded";
+            parent._emit("load");
+            parent._loadQueue();
+          }
+          self._node.removeEventListener(Howler3._canPlayEvent, self._loadFn, false);
+        },
+        /**
+         * HTML5 Audio ended listener callback.
+         */
+        _endListener: function() {
+          var self = this;
+          var parent = self._parent;
+          if (parent._duration === Infinity) {
+            parent._duration = Math.ceil(self._node.duration * 10) / 10;
+            if (parent._sprite.__default[1] === Infinity) {
+              parent._sprite.__default[1] = parent._duration * 1e3;
+            }
+            parent._ended(self);
+          }
+          self._node.removeEventListener("ended", self._endFn, false);
+        }
+      };
+      var cache = {};
+      var loadBuffer = function(self) {
+        var url = self._src;
+        if (cache[url]) {
+          self._duration = cache[url].duration;
+          loadSound(self);
+          return;
+        }
+        if (/^data:[^;]+;base64,/.test(url)) {
+          var data = atob(url.split(",")[1]);
+          var dataView = new Uint8Array(data.length);
+          for (var i = 0; i < data.length; ++i) {
+            dataView[i] = data.charCodeAt(i);
+          }
+          decodeAudioData(dataView.buffer, self);
+        } else {
+          var xhr = new XMLHttpRequest();
+          xhr.open(self._xhr.method, url, true);
+          xhr.withCredentials = self._xhr.withCredentials;
+          xhr.responseType = "arraybuffer";
+          if (self._xhr.headers) {
+            Object.keys(self._xhr.headers).forEach(function(key) {
+              xhr.setRequestHeader(key, self._xhr.headers[key]);
+            });
+          }
+          xhr.onload = function() {
+            var code = (xhr.status + "")[0];
+            if (code !== "0" && code !== "2" && code !== "3") {
+              self._emit("loaderror", null, "Failed loading audio file with status: " + xhr.status + ".");
+              return;
+            }
+            decodeAudioData(xhr.response, self);
+          };
+          xhr.onerror = function() {
+            if (self._webAudio) {
+              self._html5 = true;
+              self._webAudio = false;
+              self._sounds = [];
+              delete cache[url];
+              self.load();
+            }
+          };
+          safeXhrSend(xhr);
+        }
+      };
+      var safeXhrSend = function(xhr) {
+        try {
+          xhr.send();
+        } catch (e) {
+          xhr.onerror();
+        }
+      };
+      var decodeAudioData = function(arraybuffer, self) {
+        var error = function() {
+          self._emit("loaderror", null, "Decoding audio data failed.");
+        };
+        var success = function(buffer) {
+          if (buffer && self._sounds.length > 0) {
+            cache[self._src] = buffer;
+            loadSound(self, buffer);
+          } else {
+            error();
+          }
+        };
+        if (typeof Promise !== "undefined" && Howler3.ctx.decodeAudioData.length === 1) {
+          Howler3.ctx.decodeAudioData(arraybuffer).then(success).catch(error);
+        } else {
+          Howler3.ctx.decodeAudioData(arraybuffer, success, error);
+        }
+      };
+      var loadSound = function(self, buffer) {
+        if (buffer && !self._duration) {
+          self._duration = buffer.duration;
+        }
+        if (Object.keys(self._sprite).length === 0) {
+          self._sprite = { __default: [0, self._duration * 1e3] };
+        }
+        if (self._state !== "loaded") {
+          self._state = "loaded";
+          self._emit("load");
+          self._loadQueue();
+        }
+      };
+      var setupAudioContext = function() {
+        if (!Howler3.usingWebAudio) {
+          return;
+        }
+        try {
+          if (typeof AudioContext !== "undefined") {
+            Howler3.ctx = new AudioContext();
+          } else if (typeof webkitAudioContext !== "undefined") {
+            Howler3.ctx = new webkitAudioContext();
+          } else {
+            Howler3.usingWebAudio = false;
+          }
+        } catch (e) {
+          Howler3.usingWebAudio = false;
+        }
+        if (!Howler3.ctx) {
+          Howler3.usingWebAudio = false;
+        }
+        var iOS = /iP(hone|od|ad)/.test(Howler3._navigator && Howler3._navigator.platform);
+        var appVersion = Howler3._navigator && Howler3._navigator.appVersion.match(/OS (\d+)_(\d+)_?(\d+)?/);
+        var version = appVersion ? parseInt(appVersion[1], 10) : null;
+        if (iOS && version && version < 9) {
+          var safari = /safari/.test(Howler3._navigator && Howler3._navigator.userAgent.toLowerCase());
+          if (Howler3._navigator && !safari) {
+            Howler3.usingWebAudio = false;
+          }
+        }
+        if (Howler3.usingWebAudio) {
+          Howler3.masterGain = typeof Howler3.ctx.createGain === "undefined" ? Howler3.ctx.createGainNode() : Howler3.ctx.createGain();
+          Howler3.masterGain.gain.setValueAtTime(Howler3._muted ? 0 : Howler3._volume, Howler3.ctx.currentTime);
+          Howler3.masterGain.connect(Howler3.ctx.destination);
+        }
+        Howler3._setup();
+      };
+      if (typeof define === "function" && define.amd) {
+        define([], function() {
+          return {
+            Howler: Howler3,
+            Howl: Howl3
+          };
+        });
+      }
+      if (typeof exports !== "undefined") {
+        exports.Howler = Howler3;
+        exports.Howl = Howl3;
+      }
+      if (typeof global !== "undefined") {
+        global.HowlerGlobal = HowlerGlobal2;
+        global.Howler = Howler3;
+        global.Howl = Howl3;
+        global.Sound = Sound2;
+      } else if (typeof window !== "undefined") {
+        window.HowlerGlobal = HowlerGlobal2;
+        window.Howler = Howler3;
+        window.Howl = Howl3;
+        window.Sound = Sound2;
+      }
+    })();
+    (function() {
+      "use strict";
+      HowlerGlobal.prototype._pos = [0, 0, 0];
+      HowlerGlobal.prototype._orientation = [0, 0, -1, 0, 1, 0];
+      HowlerGlobal.prototype.stereo = function(pan) {
+        var self = this;
+        if (!self.ctx || !self.ctx.listener) {
+          return self;
+        }
+        for (var i = self._howls.length - 1; i >= 0; i--) {
+          self._howls[i].stereo(pan);
+        }
+        return self;
+      };
+      HowlerGlobal.prototype.pos = function(x, y, z) {
+        var self = this;
+        if (!self.ctx || !self.ctx.listener) {
+          return self;
+        }
+        y = typeof y !== "number" ? self._pos[1] : y;
+        z = typeof z !== "number" ? self._pos[2] : z;
+        if (typeof x === "number") {
+          self._pos = [x, y, z];
+          if (typeof self.ctx.listener.positionX !== "undefined") {
+            self.ctx.listener.positionX.setTargetAtTime(self._pos[0], Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.positionY.setTargetAtTime(self._pos[1], Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.positionZ.setTargetAtTime(self._pos[2], Howler.ctx.currentTime, 0.1);
+          } else {
+            self.ctx.listener.setPosition(self._pos[0], self._pos[1], self._pos[2]);
+          }
+        } else {
+          return self._pos;
+        }
+        return self;
+      };
+      HowlerGlobal.prototype.orientation = function(x, y, z, xUp, yUp, zUp) {
+        var self = this;
+        if (!self.ctx || !self.ctx.listener) {
+          return self;
+        }
+        var or = self._orientation;
+        y = typeof y !== "number" ? or[1] : y;
+        z = typeof z !== "number" ? or[2] : z;
+        xUp = typeof xUp !== "number" ? or[3] : xUp;
+        yUp = typeof yUp !== "number" ? or[4] : yUp;
+        zUp = typeof zUp !== "number" ? or[5] : zUp;
+        if (typeof x === "number") {
+          self._orientation = [x, y, z, xUp, yUp, zUp];
+          if (typeof self.ctx.listener.forwardX !== "undefined") {
+            self.ctx.listener.forwardX.setTargetAtTime(x, Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.forwardY.setTargetAtTime(y, Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.forwardZ.setTargetAtTime(z, Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.upX.setTargetAtTime(xUp, Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.upY.setTargetAtTime(yUp, Howler.ctx.currentTime, 0.1);
+            self.ctx.listener.upZ.setTargetAtTime(zUp, Howler.ctx.currentTime, 0.1);
+          } else {
+            self.ctx.listener.setOrientation(x, y, z, xUp, yUp, zUp);
+          }
+        } else {
+          return or;
+        }
+        return self;
+      };
+      Howl.prototype.init = /* @__PURE__ */ (function(_super) {
+        return function(o) {
+          var self = this;
+          self._orientation = o.orientation || [1, 0, 0];
+          self._stereo = o.stereo || null;
+          self._pos = o.pos || null;
+          self._pannerAttr = {
+            coneInnerAngle: typeof o.coneInnerAngle !== "undefined" ? o.coneInnerAngle : 360,
+            coneOuterAngle: typeof o.coneOuterAngle !== "undefined" ? o.coneOuterAngle : 360,
+            coneOuterGain: typeof o.coneOuterGain !== "undefined" ? o.coneOuterGain : 0,
+            distanceModel: typeof o.distanceModel !== "undefined" ? o.distanceModel : "inverse",
+            maxDistance: typeof o.maxDistance !== "undefined" ? o.maxDistance : 1e4,
+            panningModel: typeof o.panningModel !== "undefined" ? o.panningModel : "HRTF",
+            refDistance: typeof o.refDistance !== "undefined" ? o.refDistance : 1,
+            rolloffFactor: typeof o.rolloffFactor !== "undefined" ? o.rolloffFactor : 1
+          };
+          self._onstereo = o.onstereo ? [{ fn: o.onstereo }] : [];
+          self._onpos = o.onpos ? [{ fn: o.onpos }] : [];
+          self._onorientation = o.onorientation ? [{ fn: o.onorientation }] : [];
+          return _super.call(this, o);
+        };
+      })(Howl.prototype.init);
+      Howl.prototype.stereo = function(pan, id) {
+        var self = this;
+        if (!self._webAudio) {
+          return self;
+        }
+        if (self._state !== "loaded") {
+          self._queue.push({
+            event: "stereo",
+            action: function() {
+              self.stereo(pan, id);
+            }
+          });
+          return self;
+        }
+        var pannerType = typeof Howler.ctx.createStereoPanner === "undefined" ? "spatial" : "stereo";
+        if (typeof id === "undefined") {
+          if (typeof pan === "number") {
+            self._stereo = pan;
+            self._pos = [pan, 0, 0];
+          } else {
+            return self._stereo;
+          }
+        }
+        var ids = self._getSoundIds(id);
+        for (var i = 0; i < ids.length; i++) {
+          var sound = self._soundById(ids[i]);
+          if (sound) {
+            if (typeof pan === "number") {
+              sound._stereo = pan;
+              sound._pos = [pan, 0, 0];
+              if (sound._node) {
+                sound._pannerAttr.panningModel = "equalpower";
+                if (!sound._panner || !sound._panner.pan) {
+                  setupPanner(sound, pannerType);
+                }
+                if (pannerType === "spatial") {
+                  if (typeof sound._panner.positionX !== "undefined") {
+                    sound._panner.positionX.setValueAtTime(pan, Howler.ctx.currentTime);
+                    sound._panner.positionY.setValueAtTime(0, Howler.ctx.currentTime);
+                    sound._panner.positionZ.setValueAtTime(0, Howler.ctx.currentTime);
+                  } else {
+                    sound._panner.setPosition(pan, 0, 0);
+                  }
+                } else {
+                  sound._panner.pan.setValueAtTime(pan, Howler.ctx.currentTime);
+                }
+              }
+              self._emit("stereo", sound._id);
+            } else {
+              return sound._stereo;
+            }
+          }
+        }
+        return self;
+      };
+      Howl.prototype.pos = function(x, y, z, id) {
+        var self = this;
+        if (!self._webAudio) {
+          return self;
+        }
+        if (self._state !== "loaded") {
+          self._queue.push({
+            event: "pos",
+            action: function() {
+              self.pos(x, y, z, id);
+            }
+          });
+          return self;
+        }
+        y = typeof y !== "number" ? 0 : y;
+        z = typeof z !== "number" ? -0.5 : z;
+        if (typeof id === "undefined") {
+          if (typeof x === "number") {
+            self._pos = [x, y, z];
+          } else {
+            return self._pos;
+          }
+        }
+        var ids = self._getSoundIds(id);
+        for (var i = 0; i < ids.length; i++) {
+          var sound = self._soundById(ids[i]);
+          if (sound) {
+            if (typeof x === "number") {
+              sound._pos = [x, y, z];
+              if (sound._node) {
+                if (!sound._panner || sound._panner.pan) {
+                  setupPanner(sound, "spatial");
+                }
+                if (typeof sound._panner.positionX !== "undefined") {
+                  sound._panner.positionX.setValueAtTime(x, Howler.ctx.currentTime);
+                  sound._panner.positionY.setValueAtTime(y, Howler.ctx.currentTime);
+                  sound._panner.positionZ.setValueAtTime(z, Howler.ctx.currentTime);
+                } else {
+                  sound._panner.setPosition(x, y, z);
+                }
+              }
+              self._emit("pos", sound._id);
+            } else {
+              return sound._pos;
+            }
+          }
+        }
+        return self;
+      };
+      Howl.prototype.orientation = function(x, y, z, id) {
+        var self = this;
+        if (!self._webAudio) {
+          return self;
+        }
+        if (self._state !== "loaded") {
+          self._queue.push({
+            event: "orientation",
+            action: function() {
+              self.orientation(x, y, z, id);
+            }
+          });
+          return self;
+        }
+        y = typeof y !== "number" ? self._orientation[1] : y;
+        z = typeof z !== "number" ? self._orientation[2] : z;
+        if (typeof id === "undefined") {
+          if (typeof x === "number") {
+            self._orientation = [x, y, z];
+          } else {
+            return self._orientation;
+          }
+        }
+        var ids = self._getSoundIds(id);
+        for (var i = 0; i < ids.length; i++) {
+          var sound = self._soundById(ids[i]);
+          if (sound) {
+            if (typeof x === "number") {
+              sound._orientation = [x, y, z];
+              if (sound._node) {
+                if (!sound._panner) {
+                  if (!sound._pos) {
+                    sound._pos = self._pos || [0, 0, -0.5];
+                  }
+                  setupPanner(sound, "spatial");
+                }
+                if (typeof sound._panner.orientationX !== "undefined") {
+                  sound._panner.orientationX.setValueAtTime(x, Howler.ctx.currentTime);
+                  sound._panner.orientationY.setValueAtTime(y, Howler.ctx.currentTime);
+                  sound._panner.orientationZ.setValueAtTime(z, Howler.ctx.currentTime);
+                } else {
+                  sound._panner.setOrientation(x, y, z);
+                }
+              }
+              self._emit("orientation", sound._id);
+            } else {
+              return sound._orientation;
+            }
+          }
+        }
+        return self;
+      };
+      Howl.prototype.pannerAttr = function() {
+        var self = this;
+        var args = arguments;
+        var o, id, sound;
+        if (!self._webAudio) {
+          return self;
+        }
+        if (args.length === 0) {
+          return self._pannerAttr;
+        } else if (args.length === 1) {
+          if (typeof args[0] === "object") {
+            o = args[0];
+            if (typeof id === "undefined") {
+              if (!o.pannerAttr) {
+                o.pannerAttr = {
+                  coneInnerAngle: o.coneInnerAngle,
+                  coneOuterAngle: o.coneOuterAngle,
+                  coneOuterGain: o.coneOuterGain,
+                  distanceModel: o.distanceModel,
+                  maxDistance: o.maxDistance,
+                  refDistance: o.refDistance,
+                  rolloffFactor: o.rolloffFactor,
+                  panningModel: o.panningModel
+                };
+              }
+              self._pannerAttr = {
+                coneInnerAngle: typeof o.pannerAttr.coneInnerAngle !== "undefined" ? o.pannerAttr.coneInnerAngle : self._coneInnerAngle,
+                coneOuterAngle: typeof o.pannerAttr.coneOuterAngle !== "undefined" ? o.pannerAttr.coneOuterAngle : self._coneOuterAngle,
+                coneOuterGain: typeof o.pannerAttr.coneOuterGain !== "undefined" ? o.pannerAttr.coneOuterGain : self._coneOuterGain,
+                distanceModel: typeof o.pannerAttr.distanceModel !== "undefined" ? o.pannerAttr.distanceModel : self._distanceModel,
+                maxDistance: typeof o.pannerAttr.maxDistance !== "undefined" ? o.pannerAttr.maxDistance : self._maxDistance,
+                refDistance: typeof o.pannerAttr.refDistance !== "undefined" ? o.pannerAttr.refDistance : self._refDistance,
+                rolloffFactor: typeof o.pannerAttr.rolloffFactor !== "undefined" ? o.pannerAttr.rolloffFactor : self._rolloffFactor,
+                panningModel: typeof o.pannerAttr.panningModel !== "undefined" ? o.pannerAttr.panningModel : self._panningModel
+              };
+            }
+          } else {
+            sound = self._soundById(parseInt(args[0], 10));
+            return sound ? sound._pannerAttr : self._pannerAttr;
+          }
+        } else if (args.length === 2) {
+          o = args[0];
+          id = parseInt(args[1], 10);
+        }
+        var ids = self._getSoundIds(id);
+        for (var i = 0; i < ids.length; i++) {
+          sound = self._soundById(ids[i]);
+          if (sound) {
+            var pa = sound._pannerAttr;
+            pa = {
+              coneInnerAngle: typeof o.coneInnerAngle !== "undefined" ? o.coneInnerAngle : pa.coneInnerAngle,
+              coneOuterAngle: typeof o.coneOuterAngle !== "undefined" ? o.coneOuterAngle : pa.coneOuterAngle,
+              coneOuterGain: typeof o.coneOuterGain !== "undefined" ? o.coneOuterGain : pa.coneOuterGain,
+              distanceModel: typeof o.distanceModel !== "undefined" ? o.distanceModel : pa.distanceModel,
+              maxDistance: typeof o.maxDistance !== "undefined" ? o.maxDistance : pa.maxDistance,
+              refDistance: typeof o.refDistance !== "undefined" ? o.refDistance : pa.refDistance,
+              rolloffFactor: typeof o.rolloffFactor !== "undefined" ? o.rolloffFactor : pa.rolloffFactor,
+              panningModel: typeof o.panningModel !== "undefined" ? o.panningModel : pa.panningModel
+            };
+            var panner = sound._panner;
+            if (!panner) {
+              if (!sound._pos) {
+                sound._pos = self._pos || [0, 0, -0.5];
+              }
+              setupPanner(sound, "spatial");
+              panner = sound._panner;
+            }
+            panner.coneInnerAngle = pa.coneInnerAngle;
+            panner.coneOuterAngle = pa.coneOuterAngle;
+            panner.coneOuterGain = pa.coneOuterGain;
+            panner.distanceModel = pa.distanceModel;
+            panner.maxDistance = pa.maxDistance;
+            panner.refDistance = pa.refDistance;
+            panner.rolloffFactor = pa.rolloffFactor;
+            panner.panningModel = pa.panningModel;
+          }
+        }
+        return self;
+      };
+      Sound.prototype.init = /* @__PURE__ */ (function(_super) {
+        return function() {
+          var self = this;
+          var parent = self._parent;
+          self._orientation = parent._orientation;
+          self._stereo = parent._stereo;
+          self._pos = parent._pos;
+          self._pannerAttr = parent._pannerAttr;
+          _super.call(this);
+          if (self._stereo) {
+            parent.stereo(self._stereo);
+          } else if (self._pos) {
+            parent.pos(self._pos[0], self._pos[1], self._pos[2], self._id);
+          }
+        };
+      })(Sound.prototype.init);
+      Sound.prototype.reset = /* @__PURE__ */ (function(_super) {
+        return function() {
+          var self = this;
+          var parent = self._parent;
+          self._orientation = parent._orientation;
+          self._stereo = parent._stereo;
+          self._pos = parent._pos;
+          self._pannerAttr = parent._pannerAttr;
+          if (self._stereo) {
+            parent.stereo(self._stereo);
+          } else if (self._pos) {
+            parent.pos(self._pos[0], self._pos[1], self._pos[2], self._id);
+          } else if (self._panner) {
+            self._panner.disconnect(0);
+            self._panner = void 0;
+            parent._refreshBuffer(self);
+          }
+          return _super.call(this);
+        };
+      })(Sound.prototype.reset);
+      var setupPanner = function(sound, type) {
+        type = type || "spatial";
+        if (type === "spatial") {
+          sound._panner = Howler.ctx.createPanner();
+          sound._panner.coneInnerAngle = sound._pannerAttr.coneInnerAngle;
+          sound._panner.coneOuterAngle = sound._pannerAttr.coneOuterAngle;
+          sound._panner.coneOuterGain = sound._pannerAttr.coneOuterGain;
+          sound._panner.distanceModel = sound._pannerAttr.distanceModel;
+          sound._panner.maxDistance = sound._pannerAttr.maxDistance;
+          sound._panner.refDistance = sound._pannerAttr.refDistance;
+          sound._panner.rolloffFactor = sound._pannerAttr.rolloffFactor;
+          sound._panner.panningModel = sound._pannerAttr.panningModel;
+          if (typeof sound._panner.positionX !== "undefined") {
+            sound._panner.positionX.setValueAtTime(sound._pos[0], Howler.ctx.currentTime);
+            sound._panner.positionY.setValueAtTime(sound._pos[1], Howler.ctx.currentTime);
+            sound._panner.positionZ.setValueAtTime(sound._pos[2], Howler.ctx.currentTime);
+          } else {
+            sound._panner.setPosition(sound._pos[0], sound._pos[1], sound._pos[2]);
+          }
+          if (typeof sound._panner.orientationX !== "undefined") {
+            sound._panner.orientationX.setValueAtTime(sound._orientation[0], Howler.ctx.currentTime);
+            sound._panner.orientationY.setValueAtTime(sound._orientation[1], Howler.ctx.currentTime);
+            sound._panner.orientationZ.setValueAtTime(sound._orientation[2], Howler.ctx.currentTime);
+          } else {
+            sound._panner.setOrientation(sound._orientation[0], sound._orientation[1], sound._orientation[2]);
+          }
+        } else {
+          sound._panner = Howler.ctx.createStereoPanner();
+          sound._panner.pan.setValueAtTime(sound._stereo, Howler.ctx.currentTime);
+        }
+        sound._panner.connect(sound._node);
+        if (!sound._paused) {
+          sound._parent.pause(sound._id, true).play(sound._id, true);
+        }
+      };
+    })();
+  }
+});
 
 // src/pano-viewer.tsx
 import { Canvas } from "@react-three/fiber";
@@ -4576,6 +6814,19 @@ var PanoViewer = forwardRef2(
       syncFullscreen();
       return subscribeFullscreenChange(syncFullscreen);
     }, []);
+    useEffect12(() => {
+      const root = rootRef.current;
+      if (!root) {
+        return;
+      }
+      const suppressNativeContextMenu = (event) => {
+        event.preventDefault();
+      };
+      root.addEventListener("contextmenu", suppressNativeContextMenu, true);
+      return () => {
+        root.removeEventListener("contextmenu", suppressNativeContextMenu, true);
+      };
+    }, []);
     const contextMenuActions = useMemo7(
       () => ({
         reset: () => {
@@ -4758,14 +7009,385 @@ var PanoViewer = forwardRef2(
   }
 );
 
+// src/background-audio.tsx
+import { useContext as useContext15, useEffect as useEffect13, useRef as useRef13 } from "react";
+
+// src/audio/howl.ts
+var import_howler = __toESM(require_howler());
+import_howler.Howler.autoUnlock = true;
+function sourceList(src) {
+  if (src == null) {
+    return [];
+  }
+  if (typeof src === "string") {
+    return src ? [src] : [];
+  }
+  return src.filter((item) => Boolean(item));
+}
+function createUnlockingHowl({
+  src,
+  loop,
+  crossOrigin,
+  isActive,
+  shouldRetryPlay,
+  onEnded,
+  onPlay,
+  onPause,
+  onLoadError,
+  onPlayError
+}) {
+  let disposed = false;
+  let blockedNotified = false;
+  const unlockListeners = [];
+  const removeUnlockListeners = () => {
+    for (const { type, listener } of unlockListeners) {
+      window.removeEventListener(type, listener, true);
+    }
+    unlockListeners.length = 0;
+  };
+  const instance = new import_howler.Howl({
+    src: [...src],
+    html5: false,
+    preload: true,
+    loop,
+    xhr: crossOrigin === "use-credentials" ? { withCredentials: true } : void 0,
+    onend: () => {
+      if (disposed || !isActive() || instance.loop()) {
+        return;
+      }
+      onEnded?.();
+    },
+    onplay: () => {
+      if (!disposed && isActive()) {
+        onPlay?.();
+      }
+    },
+    onpause: () => {
+      if (!disposed && isActive()) {
+        onPause?.();
+      }
+    },
+    onloaderror: (_soundId, error) => {
+      if (!disposed && isActive()) {
+        onLoadError?.(error);
+      }
+    },
+    onplayerror: (_soundId, error) => {
+      if (disposed || !isActive()) {
+        return;
+      }
+      if (!blockedNotified) {
+        blockedNotified = true;
+        onPlayError?.(error);
+      }
+      const retry = () => {
+        removeUnlockListeners();
+        if (!disposed && isActive() && shouldRetryPlay()) {
+          void import_howler.Howler.ctx?.resume();
+          instance.play();
+        }
+      };
+      removeUnlockListeners();
+      unlockListeners.push({ type: "pointerdown", listener: retry });
+      unlockListeners.push({ type: "keydown", listener: retry });
+      window.addEventListener("pointerdown", retry, { capture: true });
+      window.addEventListener("keydown", retry, { capture: true });
+    }
+  });
+  return {
+    howl: instance,
+    dispose: () => {
+      if (disposed) {
+        return;
+      }
+      disposed = true;
+      removeUnlockListeners();
+      instance.unload();
+    }
+  };
+}
+
+// src/hotspot/audio-spatial.ts
+import { MathUtils as MathUtils3, Vector3 as Vector35 } from "three";
+var LOOK_DIR = new Vector35();
+var SOURCE_DIR = new Vector35();
+var RIGHT_DIR = new Vector35();
+function clampAudioVolume(volume) {
+  if (!Number.isFinite(volume)) {
+    return 1;
+  }
+  return Math.max(0, Math.min(volume, 1));
+}
+function clampLookRange(range) {
+  if (!Number.isFinite(range)) {
+    return 360;
+  }
+  return Math.max(0, range);
+}
+function lookRangeGain(angleDegrees, range) {
+  if (range > 180) {
+    return 1;
+  }
+  if (range <= 0) {
+    return 0;
+  }
+  return Math.max(0, Math.min(1, 1 - angleDegrees / range));
+}
+function audioSpatialFromView(camera, position, range) {
+  camera.getWorldDirection(LOOK_DIR);
+  SOURCE_DIR.copy(panoPositionToVector3(position)).normalize();
+  const angleDegrees = MathUtils3.radToDeg(
+    Math.acos(MathUtils3.clamp(LOOK_DIR.dot(SOURCE_DIR), -1, 1))
+  );
+  RIGHT_DIR.set(1, 0, 0).applyQuaternion(camera.quaternion);
+  const pan = MathUtils3.clamp(
+    Math.atan2(SOURCE_DIR.dot(RIGHT_DIR), SOURCE_DIR.dot(LOOK_DIR)) / (Math.PI / 2),
+    -1,
+    1
+  );
+  return {
+    pan,
+    gain: lookRangeGain(angleDegrees, range)
+  };
+}
+
+// src/background-audio.tsx
+var DEFAULT_FADE_MS = 400;
+function resolveFadeMs(value) {
+  if (!Number.isFinite(value)) {
+    return DEFAULT_FADE_MS;
+  }
+  return Math.max(0, value);
+}
+function resolveBackgroundAudioUrls(src, sources, sceneId) {
+  if (sources !== void 0) {
+    if (sceneId === void 0) {
+      throw new Error("<BackgroundAudio> requires sceneId when sources is set.");
+    }
+    if (Object.prototype.hasOwnProperty.call(sources, sceneId)) {
+      return sourceList(sources[sceneId]);
+    }
+  }
+  return sourceList(src);
+}
+function applyNonSpatialMix(slot, loop, muted, volume) {
+  slot.handle.howl.stereo(0);
+  slot.handle.howl.loop(loop);
+  slot.handle.howl.mute(muted);
+  slot.handle.howl.volume(clampAudioVolume(volume));
+}
+function BackgroundAudio({
+  src,
+  sources,
+  sceneId,
+  playing,
+  loop = true,
+  muted = false,
+  volume = 1,
+  pauseWhenHidden = true,
+  fadeMs,
+  crossOrigin,
+  onPlaybackStateChange,
+  onPlaybackError,
+  onEnded,
+  onError
+}) {
+  const controlsRef = useContext15(PanoramaViewContext);
+  if (!controlsRef) {
+    throw new Error("<BackgroundAudio> must be rendered inside <PanoViewer>.");
+  }
+  const urls = resolveBackgroundAudioUrls(src, sources, sceneId);
+  const trackKey = urls.join("\0");
+  const currentRef = useRef13(null);
+  const outgoingRef = useRef13([]);
+  const fadingInRef = useRef13(false);
+  const isFirstTrackRef = useRef13(true);
+  const playingRef = useRef13(playing);
+  const loopRef = useRef13(loop);
+  const mutedRef = useRef13(muted);
+  const volumeRef = useRef13(volume);
+  const fadeMsRef = useRef13(resolveFadeMs(fadeMs));
+  const onPlaybackStateChangeRef = useRef13(onPlaybackStateChange);
+  const onPlaybackErrorRef = useRef13(onPlaybackError);
+  const onEndedRef = useRef13(onEnded);
+  const onErrorRef = useRef13(onError);
+  playingRef.current = playing;
+  loopRef.current = loop;
+  mutedRef.current = muted;
+  volumeRef.current = volume;
+  fadeMsRef.current = resolveFadeMs(fadeMs);
+  onPlaybackStateChangeRef.current = onPlaybackStateChange;
+  onPlaybackErrorRef.current = onPlaybackError;
+  onEndedRef.current = onEnded;
+  onErrorRef.current = onError;
+  useEffect13(() => {
+    return () => {
+      fadingInRef.current = false;
+      isFirstTrackRef.current = true;
+      currentRef.current?.handle.dispose();
+      currentRef.current = null;
+      for (const slot of outgoingRef.current) {
+        slot.handle.dispose();
+      }
+      outgoingRef.current = [];
+    };
+  }, []);
+  useEffect13(() => {
+    const previous = currentRef.current;
+    if (previous?.key === trackKey && previous.crossOrigin === crossOrigin) {
+      return;
+    }
+    const durationMs = fadeMsRef.current;
+    const targetVolume = clampAudioVolume(volumeRef.current);
+    const nextUrls = trackKey.length > 0 ? trackKey.split("\0") : [];
+    const retire = (slot) => {
+      const howl = slot.handle.howl;
+      const from = howl.volume();
+      outgoingRef.current.push(slot);
+      if (durationMs <= 0 || from <= 0 || !howl.playing()) {
+        slot.handle.dispose();
+        outgoingRef.current = outgoingRef.current.filter((item) => item !== slot);
+        return;
+      }
+      howl.once("fade", () => {
+        slot.handle.dispose();
+        outgoingRef.current = outgoingRef.current.filter((item) => item !== slot);
+      });
+      howl.fade(from, 0, durationMs);
+    };
+    if (nextUrls.length > 0) {
+      const incoming = {
+        key: trackKey,
+        crossOrigin,
+        handle: createUnlockingHowl({
+          src: nextUrls,
+          loop: loopRef.current,
+          crossOrigin,
+          isActive: () => currentRef.current?.key === trackKey,
+          shouldRetryPlay: () => currentRef.current?.key === trackKey && playingRef.current,
+          onEnded: () => {
+            onPlaybackStateChangeRef.current?.("ended");
+            onEndedRef.current?.();
+          },
+          onPlay: () => {
+            if (fadingInRef.current && currentRef.current === incoming) {
+              incoming.handle.howl.fade(
+                0,
+                clampAudioVolume(volumeRef.current),
+                durationMs
+              );
+            }
+            onPlaybackStateChangeRef.current?.("playing");
+          },
+          onPause: () => {
+            onPlaybackStateChangeRef.current?.("paused");
+          },
+          onLoadError: (error) => {
+            onErrorRef.current?.({ error });
+          },
+          onPlayError: (error) => {
+            onPlaybackStateChangeRef.current?.("blocked");
+            onPlaybackErrorRef.current?.(error);
+          }
+        })
+      };
+      const fadeIn = durationMs > 0 && !isFirstTrackRef.current;
+      isFirstTrackRef.current = false;
+      fadingInRef.current = fadeIn;
+      applyNonSpatialMix(
+        incoming,
+        loopRef.current,
+        mutedRef.current,
+        fadeIn ? 0 : targetVolume
+      );
+      if (fadeIn) {
+        incoming.handle.howl.once("fade", () => {
+          if (currentRef.current === incoming) {
+            fadingInRef.current = false;
+            incoming.handle.howl.volume(clampAudioVolume(volumeRef.current));
+          }
+        });
+      }
+      currentRef.current = incoming;
+      if (playingRef.current) {
+        incoming.handle.howl.play();
+      }
+    } else {
+      fadingInRef.current = false;
+      isFirstTrackRef.current = false;
+      currentRef.current = null;
+      if (previous && durationMs > 0 && previous.handle.howl.playing()) {
+        previous.handle.howl.once("fade", () => {
+          onPlaybackStateChangeRef.current?.("paused");
+        });
+      } else if (previous) {
+        onPlaybackStateChangeRef.current?.("paused");
+      }
+    }
+    if (previous) {
+      retire(previous);
+    }
+  }, [crossOrigin, trackKey]);
+  useEffect13(() => {
+    const howl = currentRef.current?.handle.howl;
+    if (!howl) {
+      return;
+    }
+    if (!playing) {
+      fadingInRef.current = false;
+      howl.pause();
+      for (const slot of outgoingRef.current) {
+        slot.handle.dispose();
+      }
+      outgoingRef.current = [];
+      return;
+    }
+    howl.play();
+  }, [playing, trackKey]);
+  useEffect13(() => {
+    const slot = currentRef.current;
+    if (!slot) {
+      return;
+    }
+    slot.handle.howl.loop(loop);
+    slot.handle.howl.mute(muted);
+    if (!fadingInRef.current) {
+      slot.handle.howl.volume(clampAudioVolume(volume));
+    }
+  }, [loop, muted, trackKey, volume]);
+  useEffect13(() => {
+    if (!pauseWhenHidden) {
+      return;
+    }
+    const handleVisibility = () => {
+      const howl = currentRef.current?.handle.howl;
+      if (document.hidden) {
+        howl?.pause();
+        for (const slot of outgoingRef.current) {
+          slot.handle.howl.pause();
+        }
+        return;
+      }
+      if (playingRef.current && howl) {
+        howl.play();
+      }
+    };
+    document.addEventListener("visibilitychange", handleVisibility);
+    return () => {
+      document.removeEventListener("visibilitychange", handleVisibility);
+    };
+  }, [pauseWhenHidden, trackKey]);
+  return null;
+}
+
 // src/pano-filter/pano-filter.tsx
-import { useContext as useContext15, useEffect as useEffect13, useMemo as useMemo8 } from "react";
+import { useContext as useContext16, useEffect as useEffect14, useMemo as useMemo8 } from "react";
 function PanoFilter({
   preset = "none",
   intensity,
   enabled = true
 }) {
-  const host = useContext15(PanoFilterHostContext);
+  const host = useContext16(PanoFilterHostContext);
   if (!host) {
     throw new Error("<PanoFilter> must be rendered inside <PanoViewer>.");
   }
@@ -4773,13 +7395,13 @@ function PanoFilter({
     () => resolvePanoFilterSnapshot({ preset, intensity, enabled }),
     [enabled, intensity, preset]
   );
-  useEffect13(() => {
+  useEffect14(() => {
     claimPanoFilter(host);
     return () => {
       releasePanoFilter(host);
     };
   }, [host]);
-  useEffect13(() => {
+  useEffect14(() => {
     setPanoFilterSnapshot(host, snapshot);
   }, [host, snapshot]);
   return null;
@@ -4790,20 +7412,20 @@ import { useFrame as useFrame6, useThree as useThree9 } from "@react-three/fiber
 import {
   forwardRef as forwardRef3,
   useCallback as useCallback7,
-  useContext as useContext16,
-  useEffect as useEffect14,
+  useContext as useContext17,
+  useEffect as useEffect15,
   useImperativeHandle as useImperativeHandle3,
-  useRef as useRef13,
+  useRef as useRef14,
   useState as useState6
 } from "react";
 
 // src/gyro-orientation.ts
-import { Euler as Euler2, MathUtils as MathUtils3, Quaternion, Vector3 as Vector35 } from "three";
+import { Euler as Euler2, MathUtils as MathUtils4, Quaternion, Vector3 as Vector36 } from "three";
 var DEVICE_FORWARD_CORRECTION = new Quaternion().setFromAxisAngle(
-  new Vector35(1, 0, 0),
+  new Vector36(1, 0, 0),
   -Math.PI / 2
 );
-var SCREEN_AXIS = new Vector35(0, 0, 1);
+var SCREEN_AXIS = new Vector36(0, 0, 1);
 function getScreenOrientationAngle() {
   if (typeof window === "undefined") {
     return 0;
@@ -4818,30 +7440,30 @@ function getScreenOrientationAngle() {
 function deviceOrientationToQuaternion(sample, screenOrientation) {
   const alpha = Number.isFinite(sample.compassHeading) ? 360 - sample.compassHeading : sample.alpha;
   const deviceEuler = new Euler2(
-    MathUtils3.degToRad(sample.beta),
-    MathUtils3.degToRad(alpha),
-    MathUtils3.degToRad(-sample.gamma),
+    MathUtils4.degToRad(sample.beta),
+    MathUtils4.degToRad(alpha),
+    MathUtils4.degToRad(-sample.gamma),
     "YXZ"
   );
   const screenCorrection = new Quaternion().setFromAxisAngle(
     SCREEN_AXIS,
-    -MathUtils3.degToRad(screenOrientation)
+    -MathUtils4.degToRad(screenOrientation)
   );
   return new Quaternion().setFromEuler(deviceEuler).multiply(DEVICE_FORWARD_CORRECTION).multiply(screenCorrection).normalize();
 }
 function quaternionToGyroPose(quaternion) {
   const euler = new Euler2().setFromQuaternion(quaternion, "YXZ");
   return {
-    yaw: MathUtils3.radToDeg(-euler.y),
-    pitch: MathUtils3.radToDeg(euler.x),
-    roll: MathUtils3.radToDeg(euler.z)
+    yaw: MathUtils4.radToDeg(-euler.y),
+    pitch: MathUtils4.radToDeg(euler.x),
+    roll: MathUtils4.radToDeg(euler.z)
   };
 }
 function createRelativeCalibration(deviceQuaternion, yaw, pitch) {
   const targetQuaternion = new Quaternion().setFromEuler(
     new Euler2(
-      MathUtils3.degToRad(pitch),
-      MathUtils3.degToRad(-yaw),
+      MathUtils4.degToRad(pitch),
+      MathUtils4.degToRad(-yaw),
       0,
       "YXZ"
     )
@@ -4895,24 +7517,24 @@ var Gyro = forwardRef3(function Gyro2({
   onDisable,
   onDenied
 }, ref) {
-  const controlsRef = useContext16(PanoramaViewContext);
-  const eventBus = useContext16(PanoEventBusContext);
+  const controlsRef = useContext17(PanoramaViewContext);
+  const eventBus = useContext17(PanoEventBusContext);
   const { gl } = useThree9();
   const [internallyDisabled, setInternallyDisabled] = useState6(false);
-  const availableRef = useRef13(false);
-  const availabilityReportedRef = useRef13(null);
-  const activeRef = useRef13(false);
-  const permissionRef = useRef13(deviceOrientationPermissionState);
-  const absoluteEventSourceRef = useRef13(null);
-  const rawQuaternionRef = useRef13(null);
-  const calibrationRef = useRef13(null);
-  const absoluteOffsetRef = useRef13({ yaw: 0, pitch: 0 });
-  const screenAngleRef = useRef13(getScreenOrientationAngle());
-  const startPoseRef = useRef13(null);
-  const enabledAtRef = useRef13(0);
-  const filteredPoseRef = useRef13(null);
-  const lastAppliedPoseRef = useRef13(null);
-  const callbacksRef = useRef13({
+  const availableRef = useRef14(false);
+  const availabilityReportedRef = useRef14(null);
+  const activeRef = useRef14(false);
+  const permissionRef = useRef14(deviceOrientationPermissionState);
+  const absoluteEventSourceRef = useRef14(null);
+  const rawQuaternionRef = useRef14(null);
+  const calibrationRef = useRef14(null);
+  const absoluteOffsetRef = useRef14({ yaw: 0, pitch: 0 });
+  const screenAngleRef = useRef14(getScreenOrientationAngle());
+  const startPoseRef = useRef14(null);
+  const enabledAtRef = useRef14(0);
+  const filteredPoseRef = useRef14(null);
+  const lastAppliedPoseRef = useRef14(null);
+  const callbacksRef = useRef14({
     onAvailable,
     onUnavailable,
     onEnable,
@@ -5057,22 +7679,22 @@ var Gyro = forwardRef3(function Gyro2({
     }),
     [requestPermission, resetSensor]
   );
-  useEffect14(() => {
+  useEffect15(() => {
     if (!enabled) {
       setInternallyDisabled(false);
     }
   }, [enabled]);
-  useEffect14(() => {
+  useEffect15(() => {
     const supported = typeof window !== "undefined" && window.isSecureContext && typeof DeviceOrientationEvent !== "undefined" && (desktopSupport || isMobileDevice());
     setAvailable(supported);
     return () => {
       availableRef.current = false;
     };
   }, [desktopSupport, setAvailable]);
-  useEffect14(() => {
+  useEffect15(() => {
     controlsRef.current?.setGyroTouchMode(touchMode);
   }, [controlsRef, touchMode]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!enabled || internallyDisabled || touchMode !== "disablegyro") {
       return;
     }
@@ -5086,7 +7708,7 @@ var Gyro = forwardRef3(function Gyro2({
       gl.domElement.removeEventListener("pointerdown", onPointerDown);
     };
   }, [enabled, gl, internallyDisabled, touchMode]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!enabled || internallyDisabled || !availableRef.current) {
       deactivate();
       return;
@@ -5251,11 +7873,11 @@ import { useThree as useThree12 } from "@react-three/fiber";
 import {
   forwardRef as forwardRef4,
   useCallback as useCallback8,
-  useContext as useContext18,
-  useEffect as useEffect18,
+  useContext as useContext19,
+  useEffect as useEffect19,
   useImperativeHandle as useImperativeHandle4,
   useMemo as useMemo10,
-  useRef as useRef17,
+  useRef as useRef18,
   useState as useState7
 } from "react";
 
@@ -5280,12 +7902,12 @@ async function detectWebVRCapabilities() {
 
 // src/webvr/reticle.tsx
 import { useFrame as useFrame7, useThree as useThree10 } from "@react-three/fiber";
-import { useRef as useRef14 } from "react";
+import { useRef as useRef15 } from "react";
 import {
   DoubleSide,
   Raycaster as Raycaster2,
   Vector2 as Vector22,
-  Vector3 as Vector36
+  Vector3 as Vector37
 } from "three";
 import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
 var CENTER_NDC = new Vector22(0, 0);
@@ -5371,13 +7993,13 @@ function WebVRReticle({
   dwellMs,
   visible
 }) {
-  const groupRef = useRef14(null);
-  const ringMeshRef = useRef14(null);
-  const directionRef = useRef14(new Vector36());
-  const raycasterRef = useRef14(new Raycaster2());
-  const hoveredRef = useRef14(null);
-  const dwellRef = useRef14(0);
-  const clickedRef = useRef14(false);
+  const groupRef = useRef15(null);
+  const ringMeshRef = useRef15(null);
+  const directionRef = useRef15(new Vector37());
+  const raycasterRef = useRef15(new Raycaster2());
+  const hoveredRef = useRef15(null);
+  const dwellRef = useRef15(0);
+  const clickedRef = useRef15(false);
   const { camera, gl, scene } = useThree10();
   useFrame7((_, deltaSeconds) => {
     const group = groupRef.current;
@@ -5540,7 +8162,7 @@ function WebVRReticle({
 
 // src/webvr/stereo.tsx
 import { useFrame as useFrame8, useThree as useThree11 } from "@react-three/fiber";
-import { useContext as useContext17, useEffect as useEffect15, useMemo as useMemo9, useRef as useRef15 } from "react";
+import { useContext as useContext18, useEffect as useEffect16, useMemo as useMemo9, useRef as useRef16 } from "react";
 import {
   Mesh as Mesh2,
   OrthographicCamera,
@@ -5626,25 +8248,25 @@ function WebVRStereoRenderer({
   screensize
 }) {
   const { camera, gl } = useThree11();
-  const runtime = useContext17(WebVRRuntimeContext);
-  const fallbackStereoRef = useRef15(null);
+  const runtime = useContext18(WebVRRuntimeContext);
+  const fallbackStereoRef = useRef16(null);
   if (!fallbackStereoRef.current) {
     fallbackStereoRef.current = new StereoCamera2();
   }
   const stereo = runtime?.stereoView.stereo ?? fallbackStereoRef.current;
-  const stereoRef = useRef15(stereo);
+  const stereoRef = useRef16(stereo);
   stereoRef.current = stereo;
   const resources = useMemo9(createDistortionResources, []);
-  const drawingSizeRef = useRef15(new Vector23());
-  const viewportRef = useRef15(new Vector4());
-  const scissorRef = useRef15(new Vector4());
-  const originalFovRef = useRef15(null);
-  const stereoActiveRef = useRef15(false);
-  const profileRef = useRef15(profile);
-  const screensizeRef = useRef15(screensize);
+  const drawingSizeRef = useRef16(new Vector23());
+  const viewportRef = useRef16(new Vector4());
+  const scissorRef = useRef16(new Vector4());
+  const originalFovRef = useRef16(null);
+  const stereoActiveRef = useRef16(false);
+  const profileRef = useRef16(profile);
+  const screensizeRef = useRef16(screensize);
   profileRef.current = profile;
   screensizeRef.current = screensize;
-  useEffect15(
+  useEffect16(
     () => () => {
       resources.geometry.dispose();
       resources.material.dispose();
@@ -5652,7 +8274,7 @@ function WebVRStereoRenderer({
     },
     [resources]
   );
-  useEffect15(() => {
+  useEffect16(() => {
     const originalRender = gl.render.bind(gl);
     gl.render = (sceneToRender, cameraToRender) => {
       if (!stereoActiveRef.current || !(cameraToRender instanceof PerspectiveCamera2)) {
@@ -5716,7 +8338,7 @@ function WebVRStereoRenderer({
       gl.render = originalRender;
     };
   }, [gl, resources]);
-  useEffect15(
+  useEffect16(
     () => () => {
       if (runtime) {
         runtime.stereoView.active = false;
@@ -5751,7 +8373,7 @@ function WebVRStereoRenderer({
 }
 
 // src/webvr/pointerlock.ts
-import { useEffect as useEffect16, useRef as useRef16 } from "react";
+import { useEffect as useEffect17, useRef as useRef17 } from "react";
 var POINTER_LOCK_CURSOR_ID = "webvr:pointerlock";
 async function requestWebVRPointerLock(element) {
   if (typeof document === "undefined") {
@@ -5784,11 +8406,11 @@ function exitWebVRPointerLock(element) {
 }
 function useWebVRPointerLock(enabled, element) {
   const cursor = usePanoCursor();
-  const cursorRef = useRef16(cursor);
-  const enabledRef = useRef16(enabled);
+  const cursorRef = useRef17(cursor);
+  const enabledRef = useRef17(enabled);
   cursorRef.current = cursor;
   enabledRef.current = enabled;
-  useEffect16(() => {
+  useEffect17(() => {
     if (!enabled || !element) {
       return;
     }
@@ -5818,7 +8440,7 @@ function useWebVRPointerLock(enabled, element) {
 }
 
 // src/webvr/wakelock.ts
-import { useEffect as useEffect17 } from "react";
+import { useEffect as useEffect18 } from "react";
 
 // src/webvr/wakelock-fallback.ts
 var WEBVR_WAKELOCK_FALLBACK_VIDEO_BASE64 = "AAAAIGZ0eXBpc29tAAACAGlzb21pc28yYXZjMW1wNDEAAAbBbW9vdgAAAGxtdmhkAAAAAAAAAAAAAAAAAAAD6AAAD4AAAQAAAQAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAAAxt0cmFrAAAAXHRraGQAAAADAAAAAAAAAAAAAAABAAAAAAAAAggAAAAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAABAAAAAQAAAAAAAkZWR0cwAAABxlbHN0AAAAAAAAAAEAAAIIAAAEAAABAAAAAAKTbWRpYQAAACBtZGhkAAAAAAAAAAAAAAAAAAAyAAAAGgBVxAAAAAAALWhkbHIAAAAAAAAAAHZpZGUAAAAAAAAAAAAAAABWaWRlb0hhbmRsZXIAAAACPm1pbmYAAAAUdm1oZAAAAAEAAAAAAAAAAAAAACRkaW5mAAAAHGRyZWYAAAAAAAAAAQAAAAx1cmwgAAAAAQAAAf5zdGJsAAAAvnN0c2QAAAAAAAAAAQAAAK5hdmMxAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAABAAEABIAAAASAAAAAAAAAABFUxhdmM2Mi4xMS4xMDAgbGlieDI2NAAAAAAAAAAAAAAAGP//AAAANGF2Y0MBZAAK/+EAF2dkAAqs2V7ARAAAAwAEAAADAMg8SJZYAQAGaOvjyyLA/fj4AAAAABBwYXNwAAAAAQAAAAEAAAAUYnRydAAAAAAAADQ5AAAAAAAAABhzdHRzAAAAAAAAAAEAAAANAAACAAAAABRzdHNzAAAAAAAAAAEAAAABAAAAeGN0dHMAAAAAAAAADQAAAAEAAAQAAAAAAQAACgAAAAABAAAEAAAAAAEAAAAAAAAAAQAAAgAAAAABAAAKAAAAAAEAAAQAAAAAAQAAAAAAAAABAAACAAAAAAEAAAoAAAAAAQAABAAAAAABAAAAAAAAAAEAAAIAAAAAKHN0c2MAAAAAAAAAAgAAAAEAAAADAAAAAQAAAAUAAAABAAAAAQAAAEhzdHN6AAAAAAAAAAAAAAANAAACxQAAAAwAAAAMAAAADAAAAAwAAAASAAAADgAAAAwAAAAMAAAAEgAAAA4AAAAMAAAADAAAACRzdGNvAAAAAAAAAAUAAAcGAAAJ5wAAChUAAAo/AAAKbwAAAtF0cmFrAAAAXHRraGQAAAADAAAAAAAAAAAAAAACAAAAAAAAD4AAAAAAAAAAAAAAAAEBAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAkZWR0cwAAABxlbHN0AAAAAAAAAAEAAA+AAAAEAAABAAAAAAJJbWRpYQAAACBtZGhkAAAAAAAAAAAAAAAAAAAfQAAAgABVxAAAAAAALWhkbHIAAAAAAAAAAHNvdW4AAAAAAAAAAAAAAABTb3VuZEhhbmRsZXIAAAAB9G1pbmYAAAAQc21oZAAAAAAAAAAAAAAAJGRpbmYAAAAcZHJlZgAAAAAAAAABAAAADHVybCAAAAABAAABuHN0YmwAAAB+c3RzZAAAAAAAAAABAAAAbm1wNGEAAAAAAAAAAQAAAAAAAAAAAAEAEAAAAAAfQAAAAAAANmVzZHMAAAAAA4CAgCUAAgAEgICAF0AVAAAAAAAfQAAAARsFgICABRWIVuUABoCAgAECAAAAFGJ0cnQAAAAAAAAfQAAAARsAAAAYc3R0cwAAAAAAAAABAAAAIAAABAAAAAAoc3RzYwAAAAAAAAACAAAAAQAAAAEAAAABAAAABgAAABsAAAABAAAAlHN0c3oAAAAAAAAAAAAAACAAAAAVAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAChzdGNvAAAAAAAAAAYAAAbxAAAJ4wAAChEAAAo7AAAKawAACnsAAAAac2dwZAEAAAByb2xsAAAAAgAAAAH//wAAABxzYmdwAAAAAHJvbGwAAAABAAAAIAAAAAEAAABhdWR0YQAAAFltZXRhAAAAAAAAACFoZGxyAAAAAAAAAABtZGlyYXBwbAAAAAAAAAAAAAAAACxpbHN0AAAAJKl0b28AAAAcZGF0YQAAAAEAAAAATGF2ZjYyLjMuMTAwAAAACGZyZWUAAAP+bWRhdN4CAExhdmM2Mi4xMS4xMDAAAjBADgAAAq4GBf//qtxF6b3m2Ui3lizYINkj7u94MjY0IC0gY29yZSAxNjUgcjMyMjIgYjM1NjA1YSAtIEguMjY0L01QRUctNCBBVkMgY29kZWMgLSBDb3B5bGVmdCAyMDAzLTIwMjUgLSBodHRwOi8vd3d3LnZpZGVvbGFuLm9yZy94MjY0Lmh0bWwgLSBvcHRpb25zOiBjYWJhYz0xIHJlZj0zIGRlYmxvY2s9MTowOjAgYW5hbHlzZT0weDM6MHgxMTMgbWU9aGV4IHN1Ym1lPTcgcHN5PTEgcHN5X3JkPTEuMDA6MC4wMCBtaXhlZF9yZWY9MSBtZV9yYW5nZT0xNiBjaHJvbWFfbWU9MSB0cmVsbGlzPTEgOHg4ZGN0PTEgY3FtPTAgZGVhZHpvbmU9MjEsMTEgZmFzdF9wc2tpcD0xIGNocm9tYV9xcF9vZmZzZXQ9LTIgdGhyZWFkcz0xIGxvb2thaGVhZF90aHJlYWRzPTEgc2xpY2VkX3RocmVhZHM9MCBucj0wIGRlY2ltYXRlPTEgaW50ZXJsYWNlZD0wIGJsdXJheV9jb21wYXQ9MCBjb25zdHJhaW5lZF9pbnRyYT0wIGJmcmFtZXM9MyBiX3B5cmFtaWQ9MiBiX2FkYXB0PTEgYl9iaWFzPTAgZGlyZWN0PTEgd2VpZ2h0Yj0xIG9wZW5fZ29wPTAgd2VpZ2h0cD0yIGtleWludD0yNTAga2V5aW50X21pbj0yNSBzY2VuZWN1dD00MCBpbnRyYV9yZWZyZXNoPTAgcmNfbG9va2FoZWFkPTQwIHJjPWNyZiBtYnRyZWU9MSBjcmY9MjMuMCBxY29tcD0wLjYwIHFwbWluPTAgcXBtYXg9NjkgcXBzdGVwPTQgaXBfcmF0aW89MS40MCBhcT0xOjEuMDAAgAAAAA9liIQAO//+906/AptUwmEAAAAIQZokbEN//uAAAAAIQZ5CeIX/wYEBGCAHAAAACAGeYXRCv8SAAAAACAGeY2pCv8SBAAAADkGaaEmoQWiZTAhn//7hARggBwAAAApBnoZFESwv/8GBAAAACAGepXRCv8SBAAAACAGep2pCv8SAARggBwAAAA5BmqxJqEFsmUwIV//+wAAAAApBnspFFSwv/8GBAAAACAGe6XRCv8SAARggBwAAAAgBnutqQr/EgAEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBw==";
@@ -5952,7 +8574,7 @@ function releaseWebVRWakeLock() {
   stopFallbackVideo();
 }
 function useWebVRWakeLock(enabled) {
-  useEffect17(() => {
+  useEffect18(() => {
     if (!enabled) {
       return;
     }
@@ -6000,24 +8622,24 @@ var WebVR = forwardRef4(function WebVR2({
   onDenied,
   onUnknownDevice
 }, ref) {
-  const runtime = useContext18(WebVRRuntimeContext);
-  const controlsRef = useContext18(PanoramaViewContext);
-  const eventBus = useContext18(PanoEventBusContext);
+  const runtime = useContext19(WebVRRuntimeContext);
+  const controlsRef = useContext19(PanoramaViewContext);
+  const eventBus = useContext19(PanoEventBusContext);
   const gl = useThree12((state) => state.gl);
-  const gyroRef = useRef17(null);
-  const capabilitiesRef = useRef17({
+  const gyroRef = useRef18(null);
+  const capabilitiesRef = useRef18({
     mobile: false,
     sensor: false,
     webxr: false
   });
-  const availableRef = useRef17(false);
-  const modeRef = useRef17(null);
-  const webXRSessionRef = useRef17(null);
+  const availableRef = useRef18(false);
+  const modeRef = useRef18(null);
+  const webXRSessionRef = useRef18(null);
   const [mode, setMode] = useState7(null);
   const [settings, setSettings] = useState7(
     () => initializeSettings(screensize, profile)
   );
-  const callbacksRef = useRef17({
+  const callbacksRef = useRef18({
     onAvailable,
     onDenied,
     onEnterVR,
@@ -6226,7 +8848,7 @@ var WebVR = forwardRef4(function WebVR2({
     }),
     [enterVR, exitVR, requestPermission, toggleVR]
   );
-  useEffect18(() => {
+  useEffect19(() => {
     let active = true;
     void detectWebVRCapabilities().then((capabilities) => {
       if (!active) {
@@ -6248,7 +8870,7 @@ var WebVR = forwardRef4(function WebVR2({
       active = false;
     };
   }, [desktopSupport, eventBus, fakeSupport, host, mobileVr]);
-  useEffect18(() => {
+  useEffect19(() => {
     host.controller = controller;
     return () => {
       if (host.controller === controller) {
@@ -6257,10 +8879,10 @@ var WebVR = forwardRef4(function WebVR2({
       }
     };
   }, [controller, host]);
-  useEffect18(() => {
+  useEffect19(() => {
     updateWebVRHost(host, { chrome, mode, settings });
   }, [chrome, host, mode, settings]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (mode !== "fake") {
       return;
     }
@@ -6284,7 +8906,7 @@ var WebVR = forwardRef4(function WebVR2({
       document.removeEventListener("mousemove", onMouseMove);
     };
   }, [controlsRef, gl.domElement, mode, mousePointerLock]);
-  useEffect18(
+  useEffect19(
     () => () => {
       const session2 = webXRSessionRef.current;
       if (session2) {
@@ -6338,12 +8960,12 @@ var WebVR = forwardRef4(function WebVR2({
 
 // src/sphere.tsx
 import { useThree as useThree13 } from "@react-three/fiber";
-import { useEffect as useEffect19, useMemo as useMemo12, useRef as useRef19, useState as useState8 } from "react";
+import { useEffect as useEffect20, useMemo as useMemo12, useRef as useRef20, useState as useState8 } from "react";
 import {
   BackSide as BackSide2,
   LinearFilter,
   LinearMipmapLinearFilter,
-  MathUtils as MathUtils4,
+  MathUtils as MathUtils5,
   RepeatWrapping,
   SRGBColorSpace,
   TextureLoader
@@ -6371,7 +8993,7 @@ function resolveUrlAgainstFile(fileUrl, path) {
 }
 
 // src/pano-filter/pano-basic-material.tsx
-import { useLayoutEffect as useLayoutEffect2, useMemo as useMemo11, useRef as useRef18 } from "react";
+import { useLayoutEffect as useLayoutEffect2, useMemo as useMemo11, useRef as useRef19 } from "react";
 
 // src/pano-filter/shaders.ts
 var GLSL_FILTER_COMMON = `
@@ -6531,9 +9153,9 @@ function PanoBasicMaterial({
   toneMapped = false
 }) {
   const snapshot = usePanoFilterSnapshot();
-  const materialRef = useRef18(null);
-  const intensityRef = useRef18(snapshot.intensity);
-  const intensityUniformRef = useRef18(null);
+  const materialRef = useRef19(null);
+  const intensityRef = useRef19(snapshot.intensity);
+  const intensityUniformRef = useRef19(null);
   intensityRef.current = snapshot.intensity;
   const active = isPanoFilterActive(snapshot);
   const preset = snapshot.preset;
@@ -6588,11 +9210,11 @@ function PanoBasicMaterial({
 import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function useEquirectTexture(url, anisotropy, generateMipmaps, onLoad, onError) {
   const [texture, setTexture] = useState8(null);
-  const onLoadRef = useRef19(onLoad);
-  const onErrorRef = useRef19(onError);
+  const onLoadRef = useRef20(onLoad);
+  const onErrorRef = useRef20(onError);
   onLoadRef.current = onLoad;
   onErrorRef.current = onError;
-  useEffect19(() => {
+  useEffect20(() => {
     if (!url) {
       setTexture(null);
       return;
@@ -6631,7 +9253,7 @@ function useEquirectTexture(url, anisotropy, generateMipmaps, onLoad, onError) {
       active = false;
     };
   }, [anisotropy, generateMipmaps, url]);
-  useEffect19(
+  useEffect20(
     () => () => {
       texture?.dispose();
     },
@@ -6670,11 +9292,11 @@ function Sphere({
     onPreviewError
   );
   const displayTexture = texture ?? previewTexture;
-  const readyRef = useRef19(false);
-  useEffect19(() => {
+  const readyRef = useRef20(false);
+  useEffect20(() => {
     readyRef.current = false;
   }, [resolvedPreviewUrl, src]);
-  useEffect19(() => {
+  useEffect20(() => {
     if (!displayTexture || readyRef.current) {
       return;
     }
@@ -6687,7 +9309,7 @@ function Sphere({
   return /* @__PURE__ */ jsxs9(
     "mesh",
     {
-      rotation: [0, MathUtils4.degToRad(90 + yawOffset), 0],
+      rotation: [0, MathUtils5.degToRad(90 + yawOffset), 0],
       visible,
       children: [
         /* @__PURE__ */ jsx15("sphereGeometry", { args: [DEFAULT_PANORAMA_RADIUS, 128, 64] }),
@@ -6708,18 +9330,18 @@ function Sphere({
 import { useThree as useThree14 } from "@react-three/fiber";
 import {
   useCallback as useCallback9,
-  useContext as useContext19,
-  useEffect as useEffect20,
+  useContext as useContext20,
+  useEffect as useEffect21,
   useLayoutEffect as useLayoutEffect3,
   useMemo as useMemo13,
-  useRef as useRef20,
+  useRef as useRef21,
   useState as useState9
 } from "react";
 import {
   BackSide as BackSide3,
   LinearFilter as LinearFilter2,
   LinearMipmapLinearFilter as LinearMipmapLinearFilter2,
-  MathUtils as MathUtils5,
+  MathUtils as MathUtils6,
   RepeatWrapping as RepeatWrapping2,
   SRGBColorSpace as SRGBColorSpace2,
   TextureLoader as TextureLoader2,
@@ -6811,9 +9433,9 @@ function applyEquirectangularLayout(texture, anisotropy) {
 function usePosterTexture(poster, onError) {
   const gl = useThree14((state) => state.gl);
   const [texture, setTexture] = useState9(null);
-  const onErrorRef = useRef20(onError);
+  const onErrorRef = useRef21(onError);
   onErrorRef.current = onError;
-  useEffect20(() => {
+  useEffect21(() => {
     let active = true;
     setTexture(null);
     if (!poster) {
@@ -6850,7 +9472,7 @@ function usePosterTexture(poster, onError) {
       active = false;
     };
   }, [gl, poster]);
-  useEffect20(
+  useEffect21(
     () => () => {
       texture?.dispose();
     },
@@ -6908,8 +9530,8 @@ function PanoVideo({
   onTrackChange
 }) {
   const gl = useThree14((state) => state.gl);
-  const host = useContext19(PanoVideoHostContext);
-  const overlay = useContext19(PanoChromeOverlayContext);
+  const host = useContext20(PanoVideoHostContext);
+  const overlay = useContext20(PanoChromeOverlayContext);
   const variants = useMemo13(
     () => resolvePanoVideoVariants({ poster, src, variants: variantsProp }),
     [poster, src, variantsProp]
@@ -6929,17 +9551,17 @@ function PanoVideo({
     () => captionsEnabled ? defaultPanoVideoTrackId(tracks) : null
   );
   const [ready, setReady] = useState9(false);
-  const autoPlayRef = useRef20(autoPlay);
+  const autoPlayRef = useRef21(autoPlay);
   autoPlayRef.current = autoPlay;
-  const blockedRef = useRef20(false);
-  const captionAppearanceOverrideRef = useRef20(
+  const blockedRef = useRef21(false);
+  const captionAppearanceOverrideRef = useRef21(
     {}
   );
-  const mediaCapabilitiesRef = useRef20({
+  const mediaCapabilitiesRef = useRef21({
     volumeAdjustable: true,
     playbackRates: [...DEFAULT_PANO_VIDEO_PLAYBACK_RATES]
   });
-  const storeRef = useRef20(null);
+  const storeRef = useRef21(null);
   if (!storeRef.current) {
     storeRef.current = {
       snapshot: {
@@ -6949,7 +9571,7 @@ function PanoVideo({
       listeners: /* @__PURE__ */ new Set()
     };
   }
-  const actionsRef = useRef20({
+  const actionsRef = useRef21({
     play: async () => {
     },
     pause: () => {
@@ -6969,12 +9591,12 @@ function PanoVideo({
     setCaptionAppearance: (_appearance) => {
     }
   });
-  const onLoadRef = useRef20(onLoad);
-  const onErrorRef = useRef20(onError);
-  const onPlaybackStateChangeRef = useRef20(onPlaybackStateChange);
-  const onEndedRef = useRef20(onEnded);
-  const onVariantChangeRef = useRef20(onVariantChange);
-  const onTrackChangeRef = useRef20(onTrackChange);
+  const onLoadRef = useRef21(onLoad);
+  const onErrorRef = useRef21(onError);
+  const onPlaybackStateChangeRef = useRef21(onPlaybackStateChange);
+  const onEndedRef = useRef21(onEnded);
+  const onVariantChangeRef = useRef21(onVariantChange);
+  const onTrackChangeRef = useRef21(onTrackChange);
   onLoadRef.current = onLoad;
   onErrorRef.current = onError;
   onPlaybackStateChangeRef.current = onPlaybackStateChange;
@@ -6998,7 +9620,7 @@ function PanoVideo({
     texture.generateMipmaps = false;
     return { video, texture };
   }, []);
-  useEffect20(
+  useEffect21(
     () => () => {
       if (!resource) {
         return;
@@ -7013,13 +9635,13 @@ function PanoVideo({
     },
     [resource]
   );
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource) {
       return;
     }
     resource.texture.anisotropy = gl.capabilities.getMaxAnisotropy();
   }, [gl, resource]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource || !overlay?.overlayElement) {
       return;
     }
@@ -7172,10 +9794,10 @@ function PanoVideo({
     };
     emitSnapshot();
   }, [emitSnapshot, playbackRates, resource]);
-  useEffect20(() => {
+  useEffect21(() => {
     emitSnapshot();
   }, [emitSnapshot]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource || !activeVariant || !mediaKey) {
       return;
     }
@@ -7232,7 +9854,7 @@ function PanoVideo({
       video.removeEventListener("error", handleError);
     };
   }, [mediaKey, resource]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource) {
       return;
     }
@@ -7322,7 +9944,7 @@ function PanoVideo({
       }
     };
   }, [emitSnapshot, resource]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource) {
       return;
     }
@@ -7335,7 +9957,7 @@ function PanoVideo({
     video.playsInline = playsInline;
     video.preload = preload;
   }, [loop, muted, playsInline, preload, resource, volume]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource) {
       return;
     }
@@ -7385,7 +10007,7 @@ function PanoVideo({
       video.removeEventListener("ratechange", handleVolume);
     };
   }, [emitSnapshot, resource]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!resource) {
       return;
     }
@@ -7420,7 +10042,7 @@ function PanoVideo({
       video.textTracks.removeEventListener("change", applyModes);
     };
   }, [emitSnapshot, resource, trackId, tracks]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (!captionsEnabled) {
       setTrackId(null);
       return;
@@ -7435,7 +10057,7 @@ function PanoVideo({
     activeTexture ? /* @__PURE__ */ jsxs10(
       "mesh",
       {
-        rotation: [0, MathUtils5.degToRad(90 + yawOffset), 0],
+        rotation: [0, MathUtils6.degToRad(90 + yawOffset), 0],
         visible,
         children: [
           /* @__PURE__ */ jsx16("sphereGeometry", { args: [DEFAULT_PANORAMA_RADIUS, 128, 64] }),
@@ -7459,10 +10081,10 @@ import { useFrame as useFrame12, useThree as useThree19 } from "@react-three/fib
 import {
   Fragment as Fragment6,
   useCallback as useCallback10,
-  useContext as useContext21,
-  useEffect as useEffect25,
+  useContext as useContext22,
+  useEffect as useEffect26,
   useMemo as useMemo18,
-  useRef as useRef24,
+  useRef as useRef25,
   useState as useState11
 } from "react";
 import {
@@ -7519,7 +10141,7 @@ function isSnapshotTransition(preset) {
 
 // src/scene-transitions/particle-overlay.tsx
 import { useFrame as useFrame9, useThree as useThree15 } from "@react-three/fiber";
-import { useEffect as useEffect21, useMemo as useMemo14, useRef as useRef21 } from "react";
+import { useEffect as useEffect22, useMemo as useMemo14, useRef as useRef22 } from "react";
 import {
   DoubleSide as DoubleSide2,
   InstancedBufferAttribute,
@@ -7527,7 +10149,7 @@ import {
   PlaneGeometry as PlaneGeometry3,
   ShaderMaterial as ShaderMaterial2,
   Vector2 as Vector24,
-  Vector3 as Vector38
+  Vector3 as Vector39
 } from "three";
 
 // src/scene-transitions/glsl.ts
@@ -7659,10 +10281,10 @@ function ParticleOverlay({
   onFinish
 }) {
   const { camera } = useThree15();
-  const meshRef = useRef21(null);
-  const startRef = useRef21(null);
-  const finishedRef = useRef21(false);
-  const directionRef = useRef21(new Vector38());
+  const meshRef = useRef22(null);
+  const startRef = useRef22(null);
+  const finishedRef = useRef22(false);
+  const directionRef = useRef22(new Vector39());
   const geometry = useMemo14(() => createParticleGeometry(), []);
   const material = useMemo14(
     () => new ShaderMaterial2({
@@ -7680,9 +10302,9 @@ function ParticleOverlay({
     }),
     [snapshot.texture]
   );
-  useEffect21(() => () => geometry.dispose(), [geometry]);
-  useEffect21(() => () => material.dispose(), [material]);
-  useEffect21(() => {
+  useEffect22(() => () => geometry.dispose(), [geometry]);
+  useEffect22(() => () => material.dispose(), [material]);
+  useEffect22(() => {
     startRef.current = null;
     finishedRef.current = false;
     material.uniforms.progress.value = 0;
@@ -7718,8 +10340,8 @@ function ParticleOverlay({
 
 // src/scene-transitions/snapshot-overlay.tsx
 import { useFrame as useFrame10, useThree as useThree16 } from "@react-three/fiber";
-import { useEffect as useEffect22, useMemo as useMemo15, useRef as useRef22 } from "react";
-import { Vector3 as Vector39 } from "three";
+import { useEffect as useEffect23, useMemo as useMemo15, useRef as useRef23 } from "react";
+import { Vector3 as Vector310 } from "three";
 
 // src/scene-transitions/snapshot-shaders.ts
 import { DoubleSide as DoubleSide3, ShaderMaterial as ShaderMaterial3, Vector2 as Vector25 } from "three";
@@ -8007,18 +10629,18 @@ function SnapshotOverlay({
   onFinish
 }) {
   const { camera, gl } = useThree16();
-  const meshRef = useRef22(null);
-  const startRef = useRef22(null);
-  const finishedRef = useRef22(false);
-  const directionRef = useRef22(new Vector39());
+  const meshRef = useRef23(null);
+  const startRef = useRef23(null);
+  const finishedRef = useRef23(false);
+  const directionRef = useRef23(new Vector310());
   const material = useMemo15(() => {
     if (!isSnapshotTransition(transition.preset)) {
       return null;
     }
     return createSnapshotMaterial(transition.preset, snapshot.texture);
   }, [snapshot.texture, transition.preset]);
-  useEffect22(() => () => material?.dispose(), [material]);
-  useEffect22(() => {
+  useEffect23(() => () => material?.dispose(), [material]);
+  useEffect23(() => {
     startRef.current = null;
     finishedRef.current = false;
     if (material) {
@@ -8102,8 +10724,8 @@ function TransitionOverlay(props) {
 import { useThree as useThree17 } from "@react-three/fiber";
 import {
   createContext as createContext11,
-  useContext as useContext20,
-  useEffect as useEffect23,
+  useContext as useContext21,
+  useEffect as useEffect24,
   useMemo as useMemo16
 } from "react";
 
@@ -8354,23 +10976,23 @@ function TileTextureManagerProvider({
     }),
     [anisotropy, maxConcurrentLoads, maxTextureMemoryMb]
   );
-  useEffect23(() => {
+  useEffect24(() => {
     manager.resume();
     return () => manager.dispose();
   }, [manager]);
   return /* @__PURE__ */ jsx20(TileTextureManagerContext.Provider, { value: manager, children });
 }
 function useSharedTileTextureManager() {
-  return useContext20(TileTextureManagerContext);
+  return useContext21(TileTextureManagerContext);
 }
 
 // src/tile/tile.tsx
 import { useFrame as useFrame11, useThree as useThree18 } from "@react-three/fiber";
 import {
   memo,
-  useEffect as useEffect24,
+  useEffect as useEffect25,
   useMemo as useMemo17,
-  useRef as useRef23,
+  useRef as useRef24,
   useState as useState10
 } from "react";
 import {
@@ -8382,7 +11004,7 @@ import {
   PerspectiveCamera as PerspectiveCamera4,
   SRGBColorSpace as SRGBColorSpace4,
   TextureLoader as TextureLoader4,
-  Vector3 as Vector311
+  Vector3 as Vector312
 } from "three";
 
 // src/tile/face-layout.ts
@@ -8390,7 +11012,7 @@ import {
   Box3,
   Euler as Euler3,
   Quaternion as Quaternion2,
-  Vector3 as Vector310
+  Vector3 as Vector311
 } from "three";
 var CUBE_FACES = ["f", "r", "b", "l", "u", "d"];
 var PREVIEW_FACE_ORDER = ["l", "f", "r", "b", "u", "d"];
@@ -8454,12 +11076,12 @@ function getTileBoundingBox(address, radius = CUBE_RADIUS) {
   const halfWidth = local.width / 2;
   const halfHeight = local.height / 2;
   const quaternion = getFaceQuaternion(address.face);
-  const position = new Vector310(...transform.position);
+  const position = new Vector311(...transform.position);
   const corners = [
-    new Vector310(local.x - halfWidth, local.y - halfHeight, 0),
-    new Vector310(local.x + halfWidth, local.y - halfHeight, 0),
-    new Vector310(local.x - halfWidth, local.y + halfHeight, 0),
-    new Vector310(local.x + halfWidth, local.y + halfHeight, 0)
+    new Vector311(local.x - halfWidth, local.y - halfHeight, 0),
+    new Vector311(local.x + halfWidth, local.y - halfHeight, 0),
+    new Vector311(local.x - halfWidth, local.y + halfHeight, 0),
+    new Vector311(local.x + halfWidth, local.y + halfHeight, 0)
   ];
   for (const corner of corners) {
     corner.applyQuaternion(quaternion).add(position);
@@ -8577,9 +11199,9 @@ var PREVIEW_RADIUS = CUBE_RADIUS + 0.05;
 var SHARED_TILE_GEOMETRY = new PlaneGeometry4(1, 1);
 function usePreviewTexture(url, anisotropy, onError) {
   const [texture, setTexture] = useState10(null);
-  const onErrorRef = useRef23(onError);
+  const onErrorRef = useRef24(onError);
   onErrorRef.current = onError;
-  useEffect24(() => {
+  useEffect25(() => {
     if (!url) {
       setTexture(null);
       return;
@@ -8616,7 +11238,7 @@ function usePreviewTexture(url, anisotropy, onError) {
       active = false;
     };
   }, [anisotropy, url]);
-  useEffect24(
+  useEffect25(
     () => () => {
       texture?.dispose();
     },
@@ -8647,7 +11269,7 @@ function PreviewFace({
     uv.needsUpdate = true;
     return nextGeometry;
   }, [face, faceOrder]);
-  useEffect24(
+  useEffect25(
     () => () => {
       geometry.dispose();
     },
@@ -8695,7 +11317,7 @@ function useManagedTexture(manager, key, url, address) {
     snapshot: manager.getSnapshot(key)
   }));
   const snapshot = managedState.manager === manager && managedState.key === key && managedState.url === url ? managedState.snapshot : manager.getSnapshot(key);
-  useEffect24(
+  useEffect25(
     () => manager.acquire(key, url, address, (nextSnapshot) => {
       setManagedState({
         manager,
@@ -8846,8 +11468,8 @@ function parentAddresses(child, parentLevel, parentFaceSize, tileSize) {
   return addresses;
 }
 function centerFacingAddress(candidates, camera) {
-  const direction = camera.getWorldDirection(new Vector311());
-  const center = new Vector311();
+  const direction = camera.getWorldDirection(new Vector312());
+  const center = new Vector312();
   let bestCandidate = candidates[0];
   let bestAlignment = -Infinity;
   for (const candidate of candidates) {
@@ -8930,9 +11552,9 @@ function Tile({
     onPreviewError
   );
   const sharedManager = useSharedTileTextureManager();
-  const progressRef = useRef23(onLoadProgress);
-  const errorRef = useRef23(onTileError);
-  const levelChangeRef = useRef23(onLevelChange);
+  const progressRef = useRef24(onLoadProgress);
+  const errorRef = useRef24(onTileError);
+  const levelChangeRef = useRef24(onLevelChange);
   progressRef.current = onLoadProgress;
   errorRef.current = onTileError;
   levelChangeRef.current = onLevelChange;
@@ -8957,7 +11579,7 @@ function Tile({
     ]
   );
   const manager = sharedManager ?? ownedManager;
-  useEffect24(() => {
+  useEffect25(() => {
     manager.resume();
     return () => {
       if (manager === ownedManager) {
@@ -8967,11 +11589,11 @@ function Tile({
       queueMicrotask(() => manager.releaseUnused());
     };
   }, [manager, ownedManager]);
-  const readyRef = useRef23(false);
-  useEffect24(() => {
+  const readyRef = useRef24(false);
+  useEffect25(() => {
     readyRef.current = false;
   }, [effectivePreviewUrl]);
-  useEffect24(() => {
+  useEffect25(() => {
     if (!previewTexture || readyRef.current) {
       return;
     }
@@ -8987,23 +11609,23 @@ function Tile({
     [baseUrl, resolveTileUrl, template]
   );
   const [layers, setLayers] = useState10([]);
-  const layerTokenRef = useRef23("");
-  const currentLevelRef = useRef23(1);
-  const lastUpdateAtRef = useRef23(-Infinity);
-  const visibilityDirtyRef = useRef23(true);
-  const lastVisibilityQuaternionRef = useRef23(camera.quaternion.clone());
-  const lastVisibilityFovRef = useRef23(Number.NaN);
-  const lastViewportRef = useRef23({ width: 0, height: 0, dpr: 0 });
-  const frustumRef = useRef23(new Frustum());
-  const projectionMatrixRef = useRef23(new Matrix4());
-  const visibilityCameraRef = useRef23(new PerspectiveCamera4());
-  useEffect24(() => {
+  const layerTokenRef = useRef24("");
+  const currentLevelRef = useRef24(1);
+  const lastUpdateAtRef = useRef24(-Infinity);
+  const visibilityDirtyRef = useRef24(true);
+  const lastVisibilityQuaternionRef = useRef24(camera.quaternion.clone());
+  const lastVisibilityFovRef = useRef24(Number.NaN);
+  const lastViewportRef = useRef24({ width: 0, height: 0, dpr: 0 });
+  const frustumRef = useRef24(new Frustum());
+  const projectionMatrixRef = useRef24(new Matrix4());
+  const visibilityCameraRef = useRef24(new PerspectiveCamera4());
+  useEffect25(() => {
     currentLevelRef.current = 1;
     layerTokenRef.current = "";
     visibilityDirtyRef.current = true;
     setLayers([]);
   }, [manager, multiresToken]);
-  useEffect24(() => {
+  useEffect25(() => {
     if (loadMode !== "preview") {
       return;
     }
@@ -9154,9 +11776,9 @@ function SnapshotCapture({
   onCaptured
 }) {
   const { camera, gl, scene, size } = useThree19();
-  const capturedRequestRef = useRef24(0);
-  const renderTargetRef = useRef24(null);
-  useEffect25(
+  const capturedRequestRef = useRef25(0);
+  const renderTargetRef = useRef25(null);
+  useEffect26(
     () => () => {
       renderTargetRef.current?.dispose();
       renderTargetRef.current = null;
@@ -9211,7 +11833,7 @@ function ScenesController({
   onTransitionError,
   snapshotMaxPixels = 3686400
 }) {
-  const controlsRef = useContext21(PanoramaViewContext);
+  const controlsRef = useContext22(PanoramaViewContext);
   const manager = useSharedTileTextureManager();
   const transition = useMemo18(
     () => resolveTransition(transitionInput),
@@ -9234,13 +11856,13 @@ function ScenesController({
   const [transitionRunId, setTransitionRunId] = useState11(0);
   const [snapshot, setSnapshot] = useState11(null);
   const [recoveryKey, setRecoveryKey] = useState11(0);
-  const requestedSceneIdRef = useRef24(activeSceneId);
-  const captureReasonRef = useRef24("start");
-  const interactionReleaseRef = useRef24(null);
-  const slotsRef = useRef24(slots);
-  const phaseRef = useRef24(phase);
-  const liveSlotRef = useRef24(liveSlot);
-  const transitionFromRef = useRef24(initialScene);
+  const requestedSceneIdRef = useRef25(activeSceneId);
+  const captureReasonRef = useRef25("start");
+  const interactionReleaseRef = useRef25(null);
+  const slotsRef = useRef25(slots);
+  const phaseRef = useRef25(phase);
+  const liveSlotRef = useRef25(liveSlot);
+  const transitionFromRef = useRef25(initialScene);
   slotsRef.current = slots;
   phaseRef.current = phase;
   liveSlotRef.current = liveSlot;
@@ -9262,7 +11884,7 @@ function ScenesController({
     setPendingSlot(nextSlot);
     setPhase("preloading");
   }, []);
-  useEffect25(() => {
+  useEffect26(() => {
     const requested = sceneMap.get(activeSceneId);
     if (!requested) {
       reportError(activeSceneId, new Error(`Unknown panorama scene: ${activeSceneId}`));
@@ -9364,12 +11986,12 @@ function ScenesController({
       });
     }
   }, [onTransitionEnd, pendingSlot, releaseInteraction, snapshot, transition.preset]);
-  useEffect25(() => () => {
+  useEffect26(() => () => {
     releaseInteraction();
     snapshot?.dispose();
   }, [releaseInteraction, snapshot]);
   const { gl } = useThree19();
-  useEffect25(() => {
+  useEffect26(() => {
     const canvas = gl.domElement;
     const onContextLost = (event) => {
       event.preventDefault();
@@ -9452,7 +12074,7 @@ function Scenes({
 
 // src/hotspot/image-hotspot.tsx
 import { useThree as useThree21 } from "@react-three/fiber";
-import { useEffect as useEffect28, useRef as useRef26, useState as useState14 } from "react";
+import { useEffect as useEffect29, useRef as useRef27, useState as useState14 } from "react";
 import {
   ClampToEdgeWrapping as ClampToEdgeWrapping3,
   LinearFilter as LinearFilter6,
@@ -9464,35 +12086,35 @@ import {
 // src/hotspot/hotspot-anchor.tsx
 import { useFrame as useFrame13, useThree as useThree20 } from "@react-three/fiber";
 import {
-  useContext as useContext23,
-  useEffect as useEffect27,
+  useContext as useContext24,
+  useEffect as useEffect28,
   useLayoutEffect as useLayoutEffect4,
   useMemo as useMemo20,
-  useRef as useRef25,
+  useRef as useRef26,
   useState as useState13
 } from "react";
 import {
   Box3 as Box33,
   EdgesGeometry,
-  MathUtils as MathUtils6,
+  MathUtils as MathUtils7,
   Matrix4 as Matrix42,
   Plane,
   PlaneGeometry as PlaneGeometry5,
   PerspectiveCamera as PerspectiveCamera5,
   Quaternion as Quaternion3,
   Ray,
-  Vector3 as Vector312
+  Vector3 as Vector313
 } from "three";
 
 // src/hotspot/hotspot-tooltip.tsx
-import { useEffect as useEffect26, useMemo as useMemo19, useState as useState12 } from "react";
+import { useEffect as useEffect27, useMemo as useMemo19, useState as useState12 } from "react";
 
 // src/webvr/stereo-html.tsx
 import { Html } from "@react-three/drei";
-import { useContext as useContext22, useSyncExternalStore as useSyncExternalStore6 } from "react";
+import { useContext as useContext23, useSyncExternalStore as useSyncExternalStore6 } from "react";
 import { Fragment as Fragment7, jsx as jsx23, jsxs as jsxs14 } from "react/jsx-runtime";
 function useFallbackStereoView() {
-  const runtime = useContext22(WebVRRuntimeContext);
+  const runtime = useContext23(WebVRRuntimeContext);
   const host = runtime?.host ?? null;
   const fallback = useSyncExternalStore6(
     (onStoreChange) => host ? subscribeWebVRHost(host, onStoreChange) : () => void 0,
@@ -9609,7 +12231,7 @@ function HotspotTooltip({
   appearance
 }) {
   const [imageFailed, setImageFailed] = useState12(false);
-  useEffect26(() => {
+  useEffect27(() => {
     setImageFailed(false);
   }, [content.image]);
   const showImage = Boolean(content.image) && !imageFailed;
@@ -9667,28 +12289,28 @@ var DEFAULT_REFERENCE_FOV = 75;
 var MIN_ANGULAR_SIZE = 0.01;
 var MAX_ANGULAR_SIZE = 179;
 var DRAG_EPSILON_DEGREES = 1e-3;
-var LOCAL_FORWARD = new Vector312(0, 0, 1);
+var LOCAL_FORWARD = new Vector313(0, 0, 1);
 var TOOLTIP_WORLD_BOX = new Box33();
 var TOOLTIP_LOCAL_BOX = new Box33();
-var TOOLTIP_CORNER = new Vector312();
+var TOOLTIP_CORNER = new Vector313();
 var TOOLTIP_INVERSE = new Matrix42();
-var TOOLTIP_WORLD_CORNER = new Vector312();
-var TOOLTIP_PROJECTED = new Vector312();
-var TOOLTIP_RAY_ORIGIN = new Vector312();
-var TOOLTIP_RAY_FAR = new Vector312();
-var TOOLTIP_RAY_DIRECTION = new Vector312();
+var TOOLTIP_WORLD_CORNER = new Vector313();
+var TOOLTIP_PROJECTED = new Vector313();
+var TOOLTIP_RAY_ORIGIN = new Vector313();
+var TOOLTIP_RAY_FAR = new Vector313();
+var TOOLTIP_RAY_DIRECTION = new Vector313();
 var TOOLTIP_RAY = new Ray();
 var TOOLTIP_PLANE = new Plane();
-var TOOLTIP_INTERSECTION = new Vector312();
-var TOOLTIP_PLANE_NORMAL = new Vector312();
-var TOOLTIP_PLANE_POINT = new Vector312();
+var TOOLTIP_INTERSECTION = new Vector313();
+var TOOLTIP_PLANE_NORMAL = new Vector313();
+var TOOLTIP_PLANE_POINT = new Vector313();
 var HOTSPOT_MODE_RENDERING = {
   surface: { orientation: "surface", placement: "surface" },
   billboard: { orientation: "billboard", placement: "floating" }
 };
 function angularSizeToWorldSize(size, radius) {
-  const safeSize = Number.isFinite(size) ? MathUtils6.clamp(Math.abs(size), MIN_ANGULAR_SIZE, MAX_ANGULAR_SIZE) : MIN_ANGULAR_SIZE;
-  return 2 * radius * Math.tan(MathUtils6.degToRad(safeSize) / 2);
+  const safeSize = Number.isFinite(size) ? MathUtils7.clamp(Math.abs(size), MIN_ANGULAR_SIZE, MAX_ANGULAR_SIZE) : MIN_ANGULAR_SIZE;
+  return 2 * radius * Math.tan(MathUtils7.degToRad(safeSize) / 2);
 }
 function resolveScale(scale) {
   return Number.isFinite(scale) && scale > 0 ? scale : 1;
@@ -9701,7 +12323,7 @@ function resolveDistance(placement, distance, width, height) {
   if (!Number.isFinite(distance)) {
     return DEFAULT_FLOATING_DISTANCE;
   }
-  return MathUtils6.clamp(Math.abs(distance), 0.1, maximumDistance);
+  return MathUtils7.clamp(Math.abs(distance), 0.1, maximumDistance);
 }
 function applyHotspotTransform(group, camera, orientation2, surfaceQuaternion3, rotation, scaleMode, referenceFov, useAngularScale, worldWidth, worldHeight) {
   if (orientation2 === "billboard") {
@@ -9709,7 +12331,7 @@ function applyHotspotTransform(group, camera, orientation2, surfaceQuaternion3,
   } else {
     group.quaternion.copy(surfaceQuaternion3);
   }
-  group.rotateOnAxis(LOCAL_FORWARD, MathUtils6.degToRad(-rotation));
+  group.rotateOnAxis(LOCAL_FORWARD, MathUtils7.degToRad(-rotation));
   const scaleFactor = scaleMode === "fixed" && camera instanceof PerspectiveCamera5 ? fixedScaleFactor(camera.fov, referenceFov) : 1;
   group.scale.set(
     (useAngularScale ? worldWidth : 1) * scaleFactor,
@@ -9719,33 +12341,33 @@ function applyHotspotTransform(group, camera, orientation2, surfaceQuaternion3,
   group.updateMatrixWorld();
 }
 function maximumHotspotDistance(width, height) {
-  const safeWidth = MathUtils6.clamp(
+  const safeWidth = MathUtils7.clamp(
     Math.abs(Number.isFinite(width) ? width : MIN_ANGULAR_SIZE),
     MIN_ANGULAR_SIZE,
     MAX_ANGULAR_SIZE
   );
-  const safeHeight = MathUtils6.clamp(
+  const safeHeight = MathUtils7.clamp(
     Math.abs(Number.isFinite(height) ? height : MIN_ANGULAR_SIZE),
     MIN_ANGULAR_SIZE,
     MAX_ANGULAR_SIZE
   );
   const cornerFactor = Math.hypot(
     1,
-    Math.tan(MathUtils6.degToRad(safeWidth) / 2),
-    Math.tan(MathUtils6.degToRad(safeHeight) / 2)
+    Math.tan(MathUtils7.degToRad(safeWidth) / 2),
+    Math.tan(MathUtils7.degToRad(safeHeight) / 2)
   );
   return (PANORAMA_RADIUS - PANORAMA_SURFACE_INSET) / cornerFactor;
 }
 function fixedScaleFactor(cameraFov, referenceFov) {
-  const safeReferenceFov = MathUtils6.clamp(referenceFov, 1, 179);
-  return Math.tan(MathUtils6.degToRad(cameraFov) / 2) / Math.tan(MathUtils6.degToRad(safeReferenceFov) / 2);
+  const safeReferenceFov = MathUtils7.clamp(referenceFov, 1, 179);
+  return Math.tan(MathUtils7.degToRad(cameraFov) / 2) / Math.tan(MathUtils7.degToRad(safeReferenceFov) / 2);
 }
 function createSurfaceQuaternion(position) {
   const outward = panoPositionToVector3(position).normalize();
   const inward = outward.clone().negate();
-  const pitch = MathUtils6.degToRad(position.pitch);
-  const yaw = MathUtils6.degToRad(position.yaw);
-  const localUp = new Vector312(
+  const pitch = MathUtils7.degToRad(position.pitch);
+  const yaw = MathUtils7.degToRad(position.yaw);
+  const localUp = new Vector313(
     -Math.sin(pitch) * Math.sin(yaw),
     Math.cos(pitch),
     Math.sin(pitch) * Math.cos(yaw)
@@ -9765,7 +12387,7 @@ function makeInteractionEvent(id, position, event) {
 function angularDistance(a, b) {
   const aVector = panoPositionToVector3(a);
   const bVector = panoPositionToVector3(b);
-  return MathUtils6.radToDeg(aVector.angleTo(bVector));
+  return MathUtils7.radToDeg(aVector.angleTo(bVector));
 }
 function isTooltipOpen(trigger, hovered, focused, pinned) {
   switch (trigger) {
@@ -9996,14 +12618,14 @@ function HotspotAnchor({
   onPositionChange,
   onDragEnd
 }) {
-  const controlsRef = useContext23(PanoramaViewContext);
-  const eventBus = useContext23(PanoEventBusContext);
+  const controlsRef = useContext24(PanoramaViewContext);
+  const eventBus = useContext24(PanoEventBusContext);
   const cursorApi = usePanoCursor();
   const { camera, size } = useThree20();
-  const groupRef = useRef25(null);
-  const tooltipAnchorRef = useRef25(null);
-  const dragStateRef = useRef25(null);
-  const suppressNextClickRef = useRef25(false);
+  const groupRef = useRef26(null);
+  const tooltipAnchorRef = useRef26(null);
+  const dragStateRef = useRef26(null);
+  const suppressNextClickRef = useRef26(false);
   const [hovered, setHovered] = useState13(false);
   const [dragging, setDragging] = useState13(false);
   const [pinned, setPinned] = useState13(false);
@@ -10060,14 +12682,14 @@ function HotspotAnchor({
   });
   const tooltipOpen = visible && tooltipContent !== null && isTooltipOpen(tooltipTrigger, hovered, focused, pinned);
   const cursorClaimId = hotspotCursorClaimId(id);
-  useEffect27(
+  useEffect28(
     () => () => {
       dragStateRef.current?.releaseInteractionLock();
       dragStateRef.current = null;
     },
     []
   );
-  useEffect27(() => {
+  useEffect28(() => {
     if (!cursorApi) {
       return;
     }
@@ -10089,14 +12711,14 @@ function HotspotAnchor({
     hovered,
     visible
   ]);
-  useEffect27(
+  useEffect28(
     () => () => {
       cursorApi?.release(cursorClaimId);
     },
     [cursorApi, cursorClaimId]
   );
-  useEffect27(() => () => focusGeometry.dispose(), [focusGeometry]);
-  useEffect27(() => {
+  useEffect28(() => () => focusGeometry.dispose(), [focusGeometry]);
+  useEffect28(() => {
     if (tooltipTrigger !== "click") {
       setPinned(false);
       return;
@@ -10105,12 +12727,12 @@ function HotspotAnchor({
       setPinned(false);
     });
   }, [eventBus, tooltipTrigger]);
-  useEffect27(() => {
+  useEffect28(() => {
     if (tooltipTrigger !== "hover") {
       setHovered(false);
     }
   }, [tooltipTrigger]);
-  useEffect27(() => {
+  useEffect28(() => {
     if (acceptsPointer) {
       return;
     }
@@ -10455,11 +13077,11 @@ import { jsx as jsx27 } from "react/jsx-runtime";
 function useHotspotImageTexture(src, onLoad, onError) {
   const gl = useThree21((state) => state.gl);
   const [texture, setTexture] = useState14(null);
-  const onLoadRef = useRef26(onLoad);
-  const onErrorRef = useRef26(onError);
+  const onLoadRef = useRef27(onLoad);
+  const onErrorRef = useRef27(onError);
   onLoadRef.current = onLoad;
   onErrorRef.current = onError;
-  useEffect28(() => {
+  useEffect29(() => {
     let active = true;
     setTexture(null);
     if (!src) {
@@ -10497,7 +13119,7 @@ function useHotspotImageTexture(src, onLoad, onError) {
       active = false;
     };
   }, [gl, src]);
-  useEffect28(
+  useEffect29(
     () => () => {
       texture?.dispose();
     },
@@ -10519,7 +13141,7 @@ function ImageHotspot({
 }
 
 // src/hotspot/polygon-hotspot.tsx
-import { useEffect as useEffect29, useMemo as useMemo21, useRef as useRef28 } from "react";
+import { useEffect as useEffect30, useMemo as useMemo21, useRef as useRef29 } from "react";
 import {
   BufferGeometry,
   DoubleSide as DoubleSide5,
@@ -10528,20 +13150,20 @@ import {
   Quaternion as Quaternion4,
   ShapeUtils,
   Vector2 as Vector27,
-  Vector3 as Vector314
+  Vector3 as Vector315
 } from "three";
 
 // src/hotspot/hotspot-stroke-line.tsx
 import { Line } from "@react-three/drei";
 import { useFrame as useFrame14, useThree as useThree22 } from "@react-three/fiber";
-import { useLayoutEffect as useLayoutEffect5, useRef as useRef27 } from "react";
+import { useLayoutEffect as useLayoutEffect5, useRef as useRef28 } from "react";
 import {
-  MathUtils as MathUtils7,
+  MathUtils as MathUtils8,
   PerspectiveCamera as PerspectiveCamera6,
-  Vector3 as Vector313
+  Vector3 as Vector314
 } from "three";
 import { jsx as jsx28 } from "react/jsx-runtime";
-var LINE_WORLD_POSITION = new Vector313();
+var LINE_WORLD_POSITION = new Vector314();
 function applyScreenSpaceDashScale(object, camera, viewportHeight) {
   const material = object?.material;
   if (!object || typeof material?.dashScale !== "number") {
@@ -10550,7 +13172,7 @@ function applyScreenSpaceDashScale(object, camera, viewportHeight) {
   object.getWorldPosition(LINE_WORLD_POSITION);
   const depth = Math.max(camera.position.distanceTo(LINE_WORLD_POSITION), 1);
   const fov = camera instanceof PerspectiveCamera6 ? camera.fov : 75;
-  material.dashScale = viewportHeight / (2 * Math.tan(MathUtils7.degToRad(fov) * 0.5) * depth);
+  material.dashScale = viewportHeight / (2 * Math.tan(MathUtils8.degToRad(fov) * 0.5) * depth);
 }
 function resolveDash(dashSize, gapSize) {
   if (dashSize === void 0 || !Number.isFinite(dashSize) || dashSize <= 0) {
@@ -10571,7 +13193,7 @@ function HotspotStrokeLine({
   dashSize,
   gapSize
 }) {
-  const lineRef = useRef27(null);
+  const lineRef = useRef28(null);
   const { camera, size } = useThree22();
   const dash = resolveDash(dashSize, gapSize);
   useLayoutEffect5(() => {
@@ -10680,7 +13302,7 @@ function polygonContainsDirection(vertices, direction) {
 }
 function fitsHemisphere(vertices) {
   const directions = vertices.map((vertex) => panoPositionToVector3(vertex).normalize());
-  const candidates = [new Vector314()];
+  const candidates = [new Vector315()];
   for (const direction of directions) {
     candidates[0].add(direction);
     candidates.push(direction.clone());
@@ -10704,7 +13326,7 @@ function validatePolygonVertices(vertices) {
   if (hasSelfIntersection(unwrapped)) {
     issues.push({ code: "self_intersection", message: "Polygon edges cannot cross." });
   }
-  if (polygonContainsDirection(normalized, new Vector314(0, 1, 0)) || polygonContainsDirection(normalized, new Vector314(0, -1, 0))) {
+  if (polygonContainsDirection(normalized, new Vector315(0, 1, 0)) || polygonContainsDirection(normalized, new Vector315(0, -1, 0))) {
     issues.push({ code: "contains_pole", message: "Polygons cannot contain a panorama pole." });
   }
   if (!fitsHemisphere(normalized)) {
@@ -10715,7 +13337,7 @@ function validatePolygonVertices(vertices) {
 function polygonCenter(vertices) {
   const sum = vertices.reduce(
     (total, vertex) => total.add(panoPositionToVector3(vertex).normalize()),
-    new Vector314()
+    new Vector315()
   );
   return sum.lengthSq() > 1e-8 ? vector3ToPanoPosition(sum) : normalizePanoPosition(vertices[0]);
 }
@@ -10724,7 +13346,7 @@ function surfaceQuaternion(position) {
   const inward = outward.clone().negate();
   const pitch = position.pitch * Math.PI / 180;
   const yaw = position.yaw * Math.PI / 180;
-  const localUp = new Vector314(
+  const localUp = new Vector315(
     -Math.sin(pitch) * Math.sin(yaw),
     Math.cos(pitch),
     Math.sin(pitch) * Math.cos(yaw)
@@ -10737,7 +13359,7 @@ function makeWorldToLocal(center) {
   return new Matrix43().compose(
     panoPositionToVector3(center, POLYGON_RADIUS),
     surfaceQuaternion(center),
-    new Vector314(1, 1, 1)
+    new Vector315(1, 1, 1)
   ).invert();
 }
 function projectedPoint(a, b, c, weightB, weightC, radius, worldToLocal) {
@@ -10876,12 +13498,12 @@ function PolygonHotspot({
     [center, valid, vertices]
   );
   const resolvedStrokeOpacity = Math.max(0, Math.min(strokeOpacity, 1));
-  const startVerticesRef = useRef28(null);
+  const startVerticesRef = useRef29(null);
   const issuesKey = issues.map((issue) => issue.code).join(",");
-  useEffect29(() => {
+  useEffect30(() => {
     if (!valid) onInvalid?.(issues);
   }, [issues, issuesKey, onInvalid, valid]);
-  useEffect29(() => () => fillGeometry?.dispose(), [fillGeometry]);
+  useEffect30(() => () => fillGeometry?.dispose(), [fillGeometry]);
   if (!valid || !center || !fillGeometry || !strokePoints || strokePoints.length < 2) {
     return null;
   }
@@ -10961,12 +13583,12 @@ function PolygonHotspot({
 }
 
 // src/hotspot/polyline-hotspot.tsx
-import { useEffect as useEffect30, useMemo as useMemo22, useRef as useRef29 } from "react";
+import { useEffect as useEffect31, useMemo as useMemo22, useRef as useRef30 } from "react";
 import {
-  MathUtils as MathUtils8,
+  MathUtils as MathUtils9,
   Matrix4 as Matrix44,
   Quaternion as Quaternion5,
-  Vector3 as Vector315
+  Vector3 as Vector316
 } from "three";
 import { jsx as jsx30 } from "react/jsx-runtime";
 var POLYLINE_RADIUS = 990;
@@ -10993,16 +13615,16 @@ function unwrapVertices(vertices) {
 function polylineCenter(vertices) {
   const sum = vertices.reduce(
     (total, vertex) => total.add(panoPositionToVector3(vertex).normalize()),
-    new Vector315()
+    new Vector316()
   );
   return sum.lengthSq() > 1e-8 ? vector3ToPanoPosition(sum) : normalizePanoPosition(vertices[0]);
 }
 function surfaceQuaternion2(position) {
   const outward = panoPositionToVector3(position).normalize();
   const inward = outward.clone().negate();
-  const pitch = MathUtils8.degToRad(position.pitch);
-  const yaw = MathUtils8.degToRad(position.yaw);
-  const localUp = new Vector315(
+  const pitch = MathUtils9.degToRad(position.pitch);
+  const yaw = MathUtils9.degToRad(position.yaw);
+  const localUp = new Vector316(
     -Math.sin(pitch) * Math.sin(yaw),
     Math.cos(pitch),
     Math.sin(pitch) * Math.cos(yaw)
@@ -11015,7 +13637,7 @@ function makeWorldToLocal2(center) {
   return new Matrix44().compose(
     panoPositionToVector3(center, POLYLINE_RADIUS),
     surfaceQuaternion2(center),
-    new Vector315(1, 1, 1)
+    new Vector316(1, 1, 1)
   ).invert();
 }
 function subdivisionSteps(vertices) {
@@ -11030,7 +13652,7 @@ function subdivisionSteps(vertices) {
   }
   return Math.min(
     8,
-    Math.max(1, Math.ceil(MathUtils8.radToDeg(maxAngle) / MAX_SEGMENT_DEGREES))
+    Math.max(1, Math.ceil(MathUtils9.radToDeg(maxAngle) / MAX_SEGMENT_DEGREES))
   );
 }
 function makeLinePositions(vertices, center) {
@@ -11093,8 +13715,8 @@ function PolylineHotspot({
     [center, valid, vertices]
   );
   const opacity = Math.max(0, Math.min(strokeOpacity, 1));
-  const startVerticesRef = useRef29(null);
-  useEffect30(() => {
+  const startVerticesRef = useRef30(null);
+  useEffect31(() => {
     if (!valid) onInvalid?.(issues);
   }, [issues, onInvalid, valid]);
   if (!valid || !center || !linePoints || linePoints.length < 2) return null;
@@ -11160,7 +13782,7 @@ function PolylineHotspot({
 }
 
 // src/hotspot/graphic-hotspot.tsx
-import { useEffect as useEffect31, useRef as useRef30, useState as useState15 } from "react";
+import { useEffect as useEffect32, useRef as useRef31, useState as useState15 } from "react";
 import {
   CanvasTexture,
   ClampToEdgeWrapping as ClampToEdgeWrapping4,
@@ -11358,11 +13980,11 @@ function createGraphicTexture(graphic, aspectWidth, aspectHeight) {
 }
 function useGraphicTexture(graphic, aspectWidth, aspectHeight, onLoad, onError) {
   const [texture, setTexture] = useState15(null);
-  const onLoadRef = useRef30(onLoad);
-  const onErrorRef = useRef30(onError);
+  const onLoadRef = useRef31(onLoad);
+  const onErrorRef = useRef31(onError);
   onLoadRef.current = onLoad;
   onErrorRef.current = onError;
-  useEffect31(() => {
+  useEffect32(() => {
     let nextTexture = null;
     try {
       nextTexture = createGraphicTexture(graphic, aspectWidth, aspectHeight);
@@ -11401,7 +14023,7 @@ function GraphicHotspot(props) {
 
 // src/hotspot/sequence-hotspot.tsx
 import { useFrame as useFrame15, useThree as useThree23 } from "@react-three/fiber";
-import { useEffect as useEffect32, useRef as useRef31, useState as useState16 } from "react";
+import { useEffect as useEffect33, useRef as useRef32, useState as useState16 } from "react";
 import {
   ClampToEdgeWrapping as ClampToEdgeWrapping5,
   LinearFilter as LinearFilter8,
@@ -11425,11 +14047,11 @@ function useSpriteTexture({
 }) {
   const gl = useThree23((state) => state.gl);
   const [texture, setTexture] = useState16(null);
-  const onErrorRef = useRef31(onError);
-  const onLoadProgressRef = useRef31(onLoadProgress);
+  const onErrorRef = useRef32(onError);
+  const onLoadProgressRef = useRef32(onLoadProgress);
   onErrorRef.current = onError;
   onLoadProgressRef.current = onLoadProgress;
-  useEffect32(() => {
+  useEffect33(() => {
     let active = true;
     setTexture(null);
     if (!src) {
@@ -11470,7 +14092,7 @@ function useSpriteTexture({
       active = false;
     };
   }, [gl, id, src]);
-  useEffect32(
+  useEffect33(
     () => () => {
       texture?.dispose();
     },
@@ -11500,23 +14122,23 @@ function SequenceHotspot({
   const frameCount = resolveFrameCount(requestedFrameCount);
   const safeFps = resolveFps(fps);
   const [frameIndex, setFrameIndex] = useState16(0);
-  const elapsedRef = useRef31(0);
-  const frameIndexRef = useRef31(0);
-  const endedRef = useRef31(false);
-  const lastPlaybackStateRef = useRef31(null);
-  const onFrameChangeRef = useRef31(onFrameChange);
-  const onPlaybackStateChangeRef = useRef31(onPlaybackStateChange);
-  const onEndedRef = useRef31(onEnded);
+  const elapsedRef = useRef32(0);
+  const frameIndexRef = useRef32(0);
+  const endedRef = useRef32(false);
+  const lastPlaybackStateRef = useRef32(null);
+  const onFrameChangeRef = useRef32(onFrameChange);
+  const onPlaybackStateChangeRef = useRef32(onPlaybackStateChange);
+  const onEndedRef = useRef32(onEnded);
   onFrameChangeRef.current = onFrameChange;
   onPlaybackStateChangeRef.current = onPlaybackStateChange;
   onEndedRef.current = onEnded;
-  useEffect32(() => {
+  useEffect33(() => {
     elapsedRef.current = 0;
     frameIndexRef.current = 0;
     endedRef.current = false;
     setFrameIndex(0);
   }, [frameCount, frameDirection, src]);
-  useEffect32(() => {
+  useEffect33(() => {
     if (!texture) {
       return;
     }
@@ -11530,13 +14152,13 @@ function SequenceHotspot({
     );
     texture.needsUpdate = true;
   }, [frameCount, frameDirection, frameIndex, texture]);
-  useEffect32(() => {
+  useEffect33(() => {
     if (!texture) {
       return;
     }
     onFrameChangeRef.current?.({ id, index: 0, src });
   }, [id, src, texture]);
-  useEffect32(() => {
+  useEffect33(() => {
     if (!texture) {
       return;
     }
@@ -11590,7 +14212,7 @@ function SequenceHotspot({
 
 // src/hotspot/video-hotspot.tsx
 import { useThree as useThree24 } from "@react-three/fiber";
-import { useEffect as useEffect33, useRef as useRef32, useState as useState17 } from "react";
+import { useEffect as useEffect34, useRef as useRef33, useState as useState17 } from "react";
 import {
   ClampToEdgeWrapping as ClampToEdgeWrapping6,
   LinearFilter as LinearFilter9,
@@ -11609,9 +14231,9 @@ function clampVolume2(volume) {
 function usePosterTexture2(id, poster, onError) {
   const gl = useThree24((state) => state.gl);
   const [texture, setTexture] = useState17(null);
-  const onErrorRef = useRef32(onError);
+  const onErrorRef = useRef33(onError);
   onErrorRef.current = onError;
-  useEffect33(() => {
+  useEffect34(() => {
     let active = true;
     setTexture(null);
     if (!poster) {
@@ -11648,7 +14270,7 @@ function usePosterTexture2(id, poster, onError) {
       active = false;
     };
   }, [gl, id, poster]);
-  useEffect33(
+  useEffect34(
     () => () => {
       texture?.dispose();
     },
@@ -11667,13 +14289,13 @@ function useVideoResource({
   src
 }) {
   const [resource, setResource] = useState17(null);
-  const onEndedRef = useRef32(onEnded);
-  const onErrorRef = useRef32(onError);
-  const onPlaybackStateChangeRef = useRef32(onPlaybackStateChange);
+  const onEndedRef = useRef33(onEnded);
+  const onErrorRef = useRef33(onError);
+  const onPlaybackStateChangeRef = useRef33(onPlaybackStateChange);
   onEndedRef.current = onEnded;
   onErrorRef.current = onError;
   onPlaybackStateChangeRef.current = onPlaybackStateChange;
-  useEffect33(() => {
+  useEffect34(() => {
     if (!src) {
       setResource(null);
       return;
@@ -11774,11 +14396,11 @@ function VideoHotspot({
     src
   });
   const posterTexture = usePosterTexture2(id, poster, onError);
-  const onPlaybackErrorRef = useRef32(onPlaybackError);
-  const onPlaybackStateChangeRef = useRef32(onPlaybackStateChange);
+  const onPlaybackErrorRef = useRef33(onPlaybackError);
+  const onPlaybackStateChangeRef = useRef33(onPlaybackStateChange);
   onPlaybackErrorRef.current = onPlaybackError;
   onPlaybackStateChangeRef.current = onPlaybackStateChange;
-  useEffect33(() => {
+  useEffect34(() => {
     if (!resource) {
       return;
     }
@@ -11788,7 +14410,7 @@ function VideoHotspot({
     resource.video.playsInline = playsInline;
     resource.video.preload = preload;
   }, [loop, muted, playsInline, preload, resource, volume]);
-  useEffect33(() => {
+  useEffect34(() => {
     if (!resource) {
       return;
     }
@@ -11814,16 +14436,314 @@ function VideoHotspot({
   return /* @__PURE__ */ jsx33(HotspotAnchor, { ...anchorProps, id, height, width, children: /* @__PURE__ */ jsx33(HotspotPlane, { map: activeTexture, opacity }) });
 }
 
-// src/hotspot/text-hotspot.tsx
-import { useEffect as useEffect34, useRef as useRef33, useState as useState18 } from "react";
+// src/hotspot/audio-hotspot.tsx
+import { useFrame as useFrame16, useThree as useThree25 } from "@react-three/fiber";
+import { useEffect as useEffect35, useRef as useRef34, useState as useState18 } from "react";
 import {
   CanvasTexture as CanvasTexture2,
   ClampToEdgeWrapping as ClampToEdgeWrapping7,
   LinearFilter as LinearFilter10,
   LinearMipmapLinearFilter as LinearMipmapLinearFilter7,
-  SRGBColorSpace as SRGBColorSpace9
+  SRGBColorSpace as SRGBColorSpace9,
+  TextureLoader as TextureLoader8
 } from "three";
 import { jsx as jsx34 } from "react/jsx-runtime";
+var SPEAKER_TEXTURE_SIZE = 512;
+function paintSpeakerBody(context, center) {
+  context.fillStyle = "#f5fbfc";
+  context.beginPath();
+  context.moveTo(center - 92, center - 36);
+  context.lineTo(center - 28, center - 36);
+  context.lineTo(center + 28, center - 96);
+  context.lineTo(center + 28, center + 96);
+  context.lineTo(center - 28, center + 36);
+  context.lineTo(center - 92, center + 36);
+  context.closePath();
+  context.fill();
+}
+function createSpeakerTexture(state) {
+  const canvas = document.createElement("canvas");
+  canvas.width = SPEAKER_TEXTURE_SIZE;
+  canvas.height = SPEAKER_TEXTURE_SIZE;
+  const context = canvas.getContext("2d");
+  if (!context) {
+    throw new Error("Canvas 2D is unavailable for this audio hotspot.");
+  }
+  const center = SPEAKER_TEXTURE_SIZE / 2;
+  context.clearRect(0, 0, SPEAKER_TEXTURE_SIZE, SPEAKER_TEXTURE_SIZE);
+  context.lineJoin = "round";
+  context.lineCap = "round";
+  context.beginPath();
+  context.arc(center, center, center - 18, 0, Math.PI * 2);
+  context.fillStyle = state === "playing" ? "#df6b42" : "#1a3a40";
+  context.fill();
+  context.strokeStyle = "#f5fbfc";
+  context.lineWidth = 22;
+  context.stroke();
+  paintSpeakerBody(context, center);
+  context.strokeStyle = "#f5fbfc";
+  context.lineWidth = 18;
+  switch (state) {
+    case "stopped":
+      break;
+    case "playing": {
+      context.beginPath();
+      context.arc(center + 44, center, 44, -Math.PI / 2.6, Math.PI / 2.6);
+      context.stroke();
+      context.beginPath();
+      context.arc(center + 44, center, 78, -Math.PI / 2.8, Math.PI / 2.8);
+      context.stroke();
+      break;
+    }
+    default: {
+      const exhaustive = state;
+      return exhaustive;
+    }
+  }
+  const texture = new CanvasTexture2(canvas);
+  texture.colorSpace = SRGBColorSpace9;
+  texture.wrapS = ClampToEdgeWrapping7;
+  texture.wrapT = ClampToEdgeWrapping7;
+  texture.magFilter = LinearFilter10;
+  texture.minFilter = LinearMipmapLinearFilter7;
+  texture.generateMipmaps = true;
+  texture.needsUpdate = true;
+  return texture;
+}
+function useSpeakerTextures(enabled) {
+  const [textures, setTextures] = useState18({ playing: null, stopped: null });
+  useEffect35(() => {
+    if (!enabled) {
+      setTextures({ playing: null, stopped: null });
+      return;
+    }
+    const playing = createSpeakerTexture("playing");
+    const stopped = createSpeakerTexture("stopped");
+    setTextures({ playing, stopped });
+    return () => {
+      playing.dispose();
+      stopped.dispose();
+    };
+  }, [enabled]);
+  return textures;
+}
+function useIconTexture(icon, enabled, onError, id) {
+  const gl = useThree25((state) => state.gl);
+  const [texture, setTexture] = useState18(null);
+  const onErrorRef = useRef34(onError);
+  onErrorRef.current = onError;
+  useEffect35(() => {
+    let active = true;
+    setTexture(null);
+    if (!enabled || !icon) {
+      return () => {
+        active = false;
+      };
+    }
+    const loader = new TextureLoader8();
+    loader.load(
+      icon,
+      (loadedTexture) => {
+        if (!active) {
+          loadedTexture.dispose();
+          return;
+        }
+        loadedTexture.colorSpace = SRGBColorSpace9;
+        loadedTexture.wrapS = ClampToEdgeWrapping7;
+        loadedTexture.wrapT = ClampToEdgeWrapping7;
+        loadedTexture.magFilter = LinearFilter10;
+        loadedTexture.minFilter = LinearMipmapLinearFilter7;
+        loadedTexture.generateMipmaps = true;
+        loadedTexture.anisotropy = gl.capabilities.getMaxAnisotropy();
+        loadedTexture.needsUpdate = true;
+        setTexture(loadedTexture);
+      },
+      void 0,
+      (error) => {
+        if (active) {
+          onErrorRef.current?.({ id, error });
+        }
+      }
+    );
+    return () => {
+      active = false;
+    };
+  }, [enabled, gl, icon, id]);
+  useEffect35(
+    () => () => {
+      texture?.dispose();
+    },
+    [texture]
+  );
+  return texture;
+}
+function useAudioHowl({
+  crossOrigin,
+  id,
+  loop,
+  onEnded,
+  onError,
+  onPlaybackError,
+  onPlaybackStateChange,
+  playing,
+  src
+}) {
+  const [howl, setHowl] = useState18(null);
+  const playingRef = useRef34(playing);
+  const loopRef = useRef34(loop ?? false);
+  const onEndedRef = useRef34(onEnded);
+  const onErrorRef = useRef34(onError);
+  const onPlaybackErrorRef = useRef34(onPlaybackError);
+  const onPlaybackStateChangeRef = useRef34(onPlaybackStateChange);
+  playingRef.current = playing;
+  loopRef.current = loop ?? false;
+  onEndedRef.current = onEnded;
+  onErrorRef.current = onError;
+  onPlaybackErrorRef.current = onPlaybackError;
+  onPlaybackStateChangeRef.current = onPlaybackStateChange;
+  const sourcesKey = sourceList(src).join("\0");
+  useEffect35(() => {
+    const sources = sourcesKey.length > 0 ? sourcesKey.split("\0") : [];
+    if (sources.length === 0) {
+      setHowl(null);
+      return;
+    }
+    let active = true;
+    const handle = createUnlockingHowl({
+      src: sources,
+      loop: loopRef.current,
+      crossOrigin,
+      isActive: () => active,
+      shouldRetryPlay: () => playingRef.current,
+      onEnded: () => {
+        onPlaybackStateChangeRef.current?.("ended");
+        onEndedRef.current?.();
+      },
+      onPlay: () => {
+        onPlaybackStateChangeRef.current?.("playing");
+      },
+      onPause: () => {
+        onPlaybackStateChangeRef.current?.("paused");
+      },
+      onLoadError: (error) => {
+        onErrorRef.current?.({ id, error });
+      },
+      onPlayError: (error) => {
+        onPlaybackStateChangeRef.current?.("blocked");
+        onPlaybackErrorRef.current?.(error);
+      }
+    });
+    setHowl(handle.howl);
+    return () => {
+      active = false;
+      handle.dispose();
+    };
+  }, [crossOrigin, id, sourcesKey]);
+  useEffect35(() => {
+    howl?.loop(loop ?? false);
+  }, [howl, loop]);
+  return howl;
+}
+function AudioHotspot({
+  id,
+  src,
+  playing,
+  loop = false,
+  muted = false,
+  volume = 1,
+  range = 360,
+  pauseWhenHidden = true,
+  icon,
+  playingIcon,
+  marker = true,
+  crossOrigin,
+  width = 8,
+  height = 8,
+  opacity,
+  onPlaybackStateChange,
+  onPlaybackError,
+  onEnded,
+  onError,
+  ...anchorProps
+}) {
+  const camera = useThree25((state) => state.camera);
+  const howl = useAudioHowl({
+    crossOrigin,
+    id,
+    loop,
+    onEnded,
+    onError,
+    onPlaybackError,
+    onPlaybackStateChange,
+    playing,
+    src
+  });
+  const speakerTextures = useSpeakerTextures(marker && !icon);
+  const stoppedIconTexture = useIconTexture(icon, marker, onError, id);
+  const playingIconTexture = useIconTexture(playingIcon, marker, onError, id);
+  const markerTexture = playing ? playingIconTexture ?? stoppedIconTexture ?? speakerTextures.playing : stoppedIconTexture ?? speakerTextures.stopped;
+  const playingRef = useRef34(playing);
+  playingRef.current = playing;
+  const mutedRef = useRef34(muted);
+  const volumeRef = useRef34(volume);
+  const rangeRef = useRef34(range);
+  mutedRef.current = muted;
+  volumeRef.current = volume;
+  rangeRef.current = range;
+  useEffect35(() => {
+    if (!howl) {
+      return;
+    }
+    if (!playing) {
+      howl.pause();
+      return;
+    }
+    howl.play();
+  }, [howl, playing]);
+  useEffect35(() => {
+    if (!howl || !pauseWhenHidden) {
+      return;
+    }
+    const handleVisibility = () => {
+      if (document.hidden) {
+        howl.pause();
+        return;
+      }
+      if (playingRef.current) {
+        howl.play();
+      }
+    };
+    document.addEventListener("visibilitychange", handleVisibility);
+    return () => {
+      document.removeEventListener("visibilitychange", handleVisibility);
+    };
+  }, [howl, pauseWhenHidden]);
+  useFrame16(() => {
+    if (!howl) {
+      return;
+    }
+    const spatial = audioSpatialFromView(
+      camera,
+      anchorProps.position,
+      clampLookRange(rangeRef.current)
+    );
+    howl.stereo(spatial.pan);
+    howl.mute(mutedRef.current);
+    howl.volume(clampAudioVolume(volumeRef.current) * spatial.gain);
+  });
+  return /* @__PURE__ */ jsx34(HotspotAnchor, { ...anchorProps, id, height, width, children: marker ? /* @__PURE__ */ jsx34(HotspotPlane, { map: markerTexture, opacity }) : null });
+}
+
+// src/hotspot/text-hotspot.tsx
+import { useEffect as useEffect36, useRef as useRef35, useState as useState19 } from "react";
+import {
+  CanvasTexture as CanvasTexture3,
+  ClampToEdgeWrapping as ClampToEdgeWrapping8,
+  LinearFilter as LinearFilter11,
+  LinearMipmapLinearFilter as LinearMipmapLinearFilter8,
+  SRGBColorSpace as SRGBColorSpace10
+} from "three";
+import { jsx as jsx35 } from "react/jsx-runtime";
 var TEXT_TEXTURE_LONG_SIDE = 1024;
 var DEFAULT_FONT_FAMILY = "system-ui, sans-serif";
 var DEFAULT_FONT_SIZE = 96;
@@ -12032,23 +14952,23 @@ function createTextTexture(text, width, height, style) {
     throw new Error("Canvas 2D is unavailable for this text hotspot.");
   }
   drawTextHotspot(context, canvasWidth, canvasHeight, text, style);
-  const texture = new CanvasTexture2(canvas);
-  texture.colorSpace = SRGBColorSpace9;
-  texture.wrapS = ClampToEdgeWrapping7;
-  texture.wrapT = ClampToEdgeWrapping7;
-  texture.magFilter = LinearFilter10;
-  texture.minFilter = LinearMipmapLinearFilter7;
+  const texture = new CanvasTexture3(canvas);
+  texture.colorSpace = SRGBColorSpace10;
+  texture.wrapS = ClampToEdgeWrapping8;
+  texture.wrapT = ClampToEdgeWrapping8;
+  texture.magFilter = LinearFilter11;
+  texture.minFilter = LinearMipmapLinearFilter8;
   texture.generateMipmaps = true;
   texture.needsUpdate = true;
   return texture;
 }
 function useTextTexture(text, width, height, style, onLoad, onError) {
-  const [texture, setTexture] = useState18(null);
-  const onLoadRef = useRef33(onLoad);
-  const onErrorRef = useRef33(onError);
+  const [texture, setTexture] = useState19(null);
+  const onLoadRef = useRef35(onLoad);
+  const onErrorRef = useRef35(onError);
   onLoadRef.current = onLoad;
   onErrorRef.current = onError;
-  useEffect34(() => {
+  useEffect36(() => {
     let cancelled = false;
     let nextTexture = null;
     const run = async () => {
@@ -12141,13 +15061,13 @@ function TextHotspot({
     whiteSpace
   };
   const texture = useTextTexture(text, width, height, style, onLoad, onError);
-  return /* @__PURE__ */ jsx34(HotspotAnchor, { ...anchorProps, height, width, children: /* @__PURE__ */ jsx34(HotspotPlane, { map: texture, opacity }) });
+  return /* @__PURE__ */ jsx35(HotspotAnchor, { ...anchorProps, height, width, children: /* @__PURE__ */ jsx35(HotspotPlane, { map: texture, opacity }) });
 }
 
 // src/hotspot/iframe-hotspot.tsx
 import { Html as Html2 } from "@react-three/drei";
 import { DoubleSide as DoubleSide6 } from "three";
-import { jsx as jsx35, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
 var IFRAME_LONG_SIDE = 800;
 var CSS3D_DISTANCE_FACTOR = 400;
 var DEFAULT_SANDBOX = "allow-scripts allow-popups allow-forms";
@@ -12214,8 +15134,8 @@ function IframeHotspot({
       width,
       children: [
         /* @__PURE__ */ jsxs19("mesh", { children: [
-          /* @__PURE__ */ jsx35("planeGeometry", { args: [1, 1] }),
-          /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36("planeGeometry", { args: [1, 1] }),
+          /* @__PURE__ */ jsx36(
             "meshBasicMaterial",
             {
               depthWrite: false,
@@ -12226,7 +15146,7 @@ function IframeHotspot({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx35(
+        /* @__PURE__ */ jsx36(
           Html2,
           {
             distanceFactor: CSS3D_DISTANCE_FACTOR,
@@ -12241,7 +15161,7 @@ function IframeHotspot({
             },
             transform: true,
             zIndexRange: [10, 0],
-            children: /* @__PURE__ */ jsx35(
+            children: /* @__PURE__ */ jsx36(
               "iframe",
               {
                 allow,
@@ -12262,7 +15182,9 @@ function IframeHotspot({
   );
 }
 export {
+  AudioHotspot,
   AutoRotate,
+  BackgroundAudio,
   DEFAULT_HOTSPOT_TOOLTIP_APPEARANCE,
   DEFAULT_HOTSPOT_TOOLTIP_OFFSET,
   DEFAULT_PANO_CURSORS,
@@ -12313,4 +15235,28 @@ export {
   validatePolylineVertices,
   vector3ToPanoPosition
 };
+/*! Bundled license information:
+
+howler/dist/howler.js:
+  (*!
+   *  howler.js v2.2.4
+   *  howlerjs.com
+   *
+   *  (c) 2013-2020, James Simpson of GoldFire Studios
+   *  goldfirestudios.com
+   *
+   *  MIT License
+   *)
+  (*!
+   *  Spatial Plugin - Adds support for stereo and 3D audio where Web Audio is supported.
+   *  
+   *  howler.js v2.2.4
+   *  howlerjs.com
+   *
+   *  (c) 2013-2020, James Simpson of GoldFire Studios
+   *  goldfirestudios.com
+   *
+   *  MIT License
+   *)
+*/
 //# sourceMappingURL=index.mjs.map