svelte-attach-sound 0.1.1 → 0.1.3

package/dist/index.cjs

@@ -1,38 +1,32 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let svelte_events = require("svelte/events");
 //#region src/index.ts
 /**
 * A class representing a synthetic sound.
 * Can be used standalone for programmatic playback without any DOM dependency.
 */
 var Sound = class {
-	config;
 	howl;
-	ready;
 	constructor(src, options = {}) {
-		this.config = {
+		this.howl = import("howler/src/howler.core").then(({ Howl }) => new Howl({
 			...options,
 			src
-		};
-		this.ready = this.create();
-	}
-	whenReady(fn) {
-		this.ready.then(fn).catch(() => {});
-	}
-	async create() {
-		const { Howl } = await import("howler/src/howler.core");
-		this.howl = new Howl(this.config);
+		})).catch((e) => {
+			console.warn("[svelte-attach-sound] Failed to load sound:", e);
+			throw e;
+		});
 	}
 	play() {
-		this.whenReady(() => this.howl?.play());
+		this.howl.then((h) => h.play()).catch(() => {});
 	}
 	stop() {
-		this.whenReady(() => this.howl?.stop());
+		this.howl.then((h) => h.stop()).catch(() => {});
 	}
 	destroy() {
-		this.whenReady(() => {
-			this.howl?.stop();
-			this.howl?.unload();
-		});
+		this.howl.then((h) => {
+			h.stop();
+			h.unload();
+		}).catch(() => {});
 	}
 };
 /**
@@ -58,11 +52,11 @@ function sound(options) {
 		const instance = new Sound(src, howlOptions);
 		const handlePlay = () => instance.play();
 		const handleStop = () => instance.stop();
-		element.addEventListener(playEvent, handlePlay);
-		if (stopEvent) element.addEventListener(stopEvent, handleStop);
+		const offPlay = (0, svelte_events.on)(element, playEvent, handlePlay);
+		const offStop = stopEvent ? (0, svelte_events.on)(element, stopEvent, handleStop) : null;
 		return () => {
-			element.removeEventListener(playEvent, handlePlay);
-			if (stopEvent) element.removeEventListener(stopEvent, handleStop);
+			offPlay();
+			offStop?.();
 			instance.destroy();
 		};
 	};

package/dist/index.d.cts

@@ -16,12 +16,8 @@ type Options = {
  * Can be used standalone for programmatic playback without any DOM dependency.
  */
 declare class Sound {
-  private config;
   private howl;
-  private ready;
   constructor(src: SoundSource, options?: SoundOptions);
-  private whenReady;
-  private create;
   play(): void;
   stop(): void;
   destroy(): void;

package/dist/index.d.mts

@@ -16,12 +16,8 @@ type Options = {
  * Can be used standalone for programmatic playback without any DOM dependency.
  */
 declare class Sound {
-  private config;
   private howl;
-  private ready;
   constructor(src: SoundSource, options?: SoundOptions);
-  private whenReady;
-  private create;
   play(): void;
   stop(): void;
   destroy(): void;

package/dist/index.mjs

@@ -1,37 +1,31 @@
+import { on } from "svelte/events";
 //#region src/index.ts
 /**
 * A class representing a synthetic sound.
 * Can be used standalone for programmatic playback without any DOM dependency.
 */
 var Sound = class {
-	config;
 	howl;
-	ready;
 	constructor(src, options = {}) {
-		this.config = {
+		this.howl = import("howler/src/howler.core").then(({ Howl }) => new Howl({
 			...options,
 			src
-		};
-		this.ready = this.create();
-	}
-	whenReady(fn) {
-		this.ready.then(fn).catch(() => {});
-	}
-	async create() {
-		const { Howl } = await import("howler/src/howler.core");
-		this.howl = new Howl(this.config);
+		})).catch((e) => {
+			console.warn("[svelte-attach-sound] Failed to load sound:", e);
+			throw e;
+		});
 	}
 	play() {
-		this.whenReady(() => this.howl?.play());
+		this.howl.then((h) => h.play()).catch(() => {});
 	}
 	stop() {
-		this.whenReady(() => this.howl?.stop());
+		this.howl.then((h) => h.stop()).catch(() => {});
 	}
 	destroy() {
-		this.whenReady(() => {
-			this.howl?.stop();
-			this.howl?.unload();
-		});
+		this.howl.then((h) => {
+			h.stop();
+			h.unload();
+		}).catch(() => {});
 	}
 };
 /**
@@ -57,11 +51,11 @@ function sound(options) {
 		const instance = new Sound(src, howlOptions);
 		const handlePlay = () => instance.play();
 		const handleStop = () => instance.stop();
-		element.addEventListener(playEvent, handlePlay);
-		if (stopEvent) element.addEventListener(stopEvent, handleStop);
+		const offPlay = on(element, playEvent, handlePlay);
+		const offStop = stopEvent ? on(element, stopEvent, handleStop) : null;
 		return () => {
-			element.removeEventListener(playEvent, handlePlay);
-			if (stopEvent) element.removeEventListener(stopEvent, handleStop);
+			offPlay();
+			offStop?.();
 			instance.destroy();
 		};
 	};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-attach-sound",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "A Svelte attachment for binding sound playback to DOM events using Howler.js",
   "keywords": [
     "attachment",
@@ -43,17 +43,17 @@
   "devDependencies": {
     "@types/howler": "^2.2.12",
     "@types/node": "^25.0.3",
-    "bumpp": "^10.3.2",
+    "bumpp": "^11.0.1",
     "howler": "^2.2.4",
-    "oxfmt": "^0.40.0",
-    "oxlint": "^1.50.0",
-    "svelte": "^5.53.11",
-    "tsdown": "^0.21.2",
-    "typescript": "^5.9.3",
-    "vitest": "^4.0.16"
+    "oxfmt": "^0.41.0",
+    "oxlint": "^1.56.0",
+    "svelte": "^5.55.0",
+    "tsdown": "^0.21.4",
+    "typescript": "^6.0.2",
+    "vitest": "^4.1.1"
   },
   "peerDependencies": {
     "howler": ">=2.0.0",
-    "svelte": ">=5.53.11"
+    "svelte": ">=5.55.0"
   }
 }