@mrmartineau/use-sound/dist/index.js

The web needs more (tasteful) sounds!

"use strict";
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 __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
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
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.ts
var index_exports = {};
__export(index_exports, {
  default: () => useSound,
  useSound: () => useSound
});
module.exports = __toCommonJS(index_exports);
var import_react = __toESM(require("react"));

// src/use-on-mount.ts
var React = __toESM(require("react"));
function useOnMount(callback) {
  React.useEffect(callback, []);
}

// src/index.ts
function useSound(src, {
  id,
  volume = 1,
  playbackRate = 1,
  soundEnabled = true,
  interrupt = false,
  onload,
  ...delegated
} = {}) {
  const HowlConstructor = import_react.default.useRef(null);
  const howlerGlobalRef = import_react.default.useRef(null);
  const isHowlerLoaded = import_react.default.useRef(false);
  const latestLoadId = import_react.default.useRef(0);
  const activeSoundRef = import_react.default.useRef(null);
  const activeSpritePlaybackIds = import_react.default.useRef(
    /* @__PURE__ */ new Map()
  );
  const isMounted = import_react.default.useRef(false);
  const hasSprite = Boolean(delegated.sprite);
  const [duration, setDuration] = import_react.default.useState(null);
  const [isReady, setIsReady] = import_react.default.useState(false);
  const [sound, setSound] = import_react.default.useState(null);
  useOnMount(() => {
    isMounted.current = true;
    import("howler").then((mod) => {
      if (!isMounted.current) {
        return;
      }
      HowlConstructor.current = mod.Howl ?? mod.default.Howl;
      howlerGlobalRef.current = mod.Howler ?? mod.default.Howler;
      isHowlerLoaded.current = true;
      setIsReady(true);
    });
    return () => {
      isMounted.current = false;
      isHowlerLoaded.current = false;
      latestLoadId.current += 1;
      if (activeSoundRef.current) {
        activeSoundRef.current.stop();
        activeSoundRef.current.unload();
        activeSoundRef.current = null;
      }
      activeSpritePlaybackIds.current.clear();
    };
  });
  import_react.default.useEffect(() => {
    if (!HowlConstructor.current || !isHowlerLoaded.current) {
      return;
    }
    const currentLoadId = latestLoadId.current + 1;
    latestLoadId.current = currentLoadId;
    const handleLoad = function() {
      if (typeof onload === "function") {
        onload.call(this);
      }
      if (!isMounted.current || currentLoadId !== latestLoadId.current) {
        return;
      }
      setDuration(this.duration() * 1e3);
    };
    const nextSound = new HowlConstructor.current({
      src: Array.isArray(src) ? src : [src],
      volume,
      rate: playbackRate,
      onload: handleLoad,
      ...delegated
    });
    const previousSound = activeSoundRef.current;
    if (previousSound) {
      previousSound.stop();
      previousSound.unload();
    }
    activeSpritePlaybackIds.current.clear();
    setSound(nextSound);
    activeSoundRef.current = nextSound;
  }, [JSON.stringify(src), isReady]);
  import_react.default.useEffect(() => {
    if (sound) {
      sound.volume(volume);
      if (!hasSprite) {
        sound.rate(playbackRate);
      }
    }
  }, [sound, volume, playbackRate, hasSprite]);
  const play = import_react.default.useCallback(
    (options) => {
      if (typeof options === "undefined") {
        options = {};
      }
      if (!sound || !soundEnabled && !options.forceSoundEnabled) {
        return;
      }
      if (interrupt) {
        sound.stop();
        activeSpritePlaybackIds.current.clear();
      }
      if (typeof options.playbackRate !== "undefined" && !hasSprite) {
        sound.rate(options.playbackRate);
      }
      const spriteKey = options.id ?? id;
      const playbackId = sound.play(spriteKey);
      if (typeof spriteKey === "string" && typeof playbackId === "number") {
        const playbackIdsForKey = activeSpritePlaybackIds.current.get(spriteKey) ?? /* @__PURE__ */ new Set();
        playbackIdsForKey.add(playbackId);
        activeSpritePlaybackIds.current.set(spriteKey, playbackIdsForKey);
        sound.once(
          "end",
          () => {
            const ids = activeSpritePlaybackIds.current.get(spriteKey);
            if (!ids) {
              return;
            }
            ids.delete(playbackId);
            if (ids.size === 0) {
              activeSpritePlaybackIds.current.delete(spriteKey);
            }
          },
          playbackId
        );
      }
    },
    [sound, soundEnabled, interrupt, hasSprite, id]
  );
  const stop = import_react.default.useCallback(
    (id2) => {
      if (!sound) {
        return;
      }
      if (typeof id2 === "string") {
        const playbackIds = activeSpritePlaybackIds.current.get(id2);
        if (playbackIds && playbackIds.size > 0) {
          playbackIds.forEach((playbackId) => {
            sound.stop(playbackId);
          });
          activeSpritePlaybackIds.current.delete(id2);
          return;
        }
      }
      sound.stop(id2);
      if (typeof id2 === "undefined") {
        activeSpritePlaybackIds.current.clear();
      }
    },
    [sound]
  );
  const pause = import_react.default.useCallback(
    (id2) => {
      if (!sound) {
        return;
      }
      if (typeof id2 === "string") {
        const playbackIds = activeSpritePlaybackIds.current.get(id2);
        if (playbackIds && playbackIds.size > 0) {
          playbackIds.forEach((playbackId) => {
            sound.pause(playbackId);
          });
          return;
        }
      }
      sound.pause(id2);
    },
    [sound]
  );
  const unlock = import_react.default.useCallback(() => {
    if (!howlerGlobalRef.current || !howlerGlobalRef.current.ctx) {
      return;
    }
    if (howlerGlobalRef.current.ctx.state === "suspended") {
      try {
        void howlerGlobalRef.current.ctx.resume().catch(() => {
        });
      } catch {
      }
    }
  }, []);
  const returnedValue = [
    play,
    {
      sound,
      stop,
      pause,
      unlock,
      duration
    }
  ];
  return returnedValue;
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  useSound
});
//# sourceMappingURL=index.js.map