Add loop to HookOptions

README.md

@@ -215,13 +215,15 @@ When calling `useSound`, you can pass it a variety of options:
 | playbackRate | number    |
 | interrupt    | boolean   |
 | soundEnabled | boolean   |
+| loop         | boolean   |
 | sprite       | SpriteMap |
 | [delegated]  | —         |
 
 - `volume` is a number from `0` to `1`, where `1` is full volume and `0` is comletely muted.
 - `playbackRate` is a number from `0.5` to `4`. It can be used to slow down or speed up the sample. Like a turntable, changes to speed also affect pitch.
 - `interrupt` specifies whether or not the sound should be able to "overlap" if the `play` function is called again before the sound has ended.
 - `soundEnabled` allows you to pass a value (typically from context or redux or something) to mute all sounds. Note that this can be overridden in the `PlayOptions`, see below
+- `loop` wether or not the sound should loop until the `stop` function is called
 - `sprite` allows you to use a single `useSound` hook for multiple sound effects. See [“Sprites”](https://github.com/joshwcomeau/use-sound#sprites) below.
 
 `[delegated]` refers to the fact that any additional argument you pass in `HookOptions` will be forwarded to the `Howl` constructor. See "Escape hatches" below for more information.

package.json

@@ -68,5 +68,9 @@
     "semi": true,
     "singleQuote": true,
     "trailingComma": "es5"
+  },
+  "volta": {
+    "node": "13.12.0",
+    "yarn": "1.22.22"
   }
 }

src/index.d.ts

@@ -6,6 +6,7 @@ export default function useSound(
     playbackRate,
     soundEnabled,
     interrupt,
+    loop,
     onload,
     ...delegated
   }?: HookOptions

src/index.ts

@@ -12,6 +12,7 @@ export default function useSound<T = any>(
     playbackRate = 1,
     soundEnabled = true,
     interrupt = false,
+    loop = false,
     onload,
     ...delegated
   }: HookOptions<T> = {} as HookOptions
@@ -53,6 +54,7 @@ export default function useSound<T = any>(
           volume,
           rate: playbackRate,
           onload: handleLoad,
+          loop,
           ...delegated,
         });
       }
@@ -73,6 +75,7 @@ export default function useSound<T = any>(
           src: Array.isArray(src) ? src : [src],
           volume,
           onload: handleLoad,
+          loop,
           ...delegated,
         })
       );
@@ -86,18 +89,19 @@ export default function useSound<T = any>(
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [JSON.stringify(src)]);
 
-  // Whenever volume/playbackRate are changed, change those properties
+  // Whenever volume/playbackRate/loop are changed, change those properties
   // on the sound instance.
   React.useEffect(() => {
     if (sound) {
       sound.volume(volume);
+      sound.loop(loop);
 
       // HACK: When a sprite is defined, `sound.rate()` throws an error, because Howler tries to reset the "_default" sprite, which doesn't exist. This is likely a bug within Howler, but I don’t have the bandwidth to investigate, so instead, we’re ignoring playbackRate changes when a sprite is defined.
       if (!delegated.sprite) {
         sound.rate(playbackRate);
       }
     }
-  }, [sound, volume, playbackRate]);
+  }, [sound, volume, playbackRate, loop]);
 
   const play: PlayFunction = React.useCallback(
     (options?: PlayOptions) => {

src/types.d.ts

@@ -9,6 +9,7 @@ export interface HookOptions {
   soundEnabled?: boolean;
   sprite?: SpriteMap;
   onload?: () => void;
+  loop?: boolean;
 }
 export interface PlayOptions {
   id?: string;

src/types.ts

@@ -10,6 +10,7 @@ export type HookOptions<T = any> = T & {
   soundEnabled?: boolean;
   sprite?: SpriteMap;
   onload?: () => void;
+  loop?: boolean;
 };
 
 export interface PlayOptions {