sketchmark 1.0.0 → 1.0.1

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -7178,6 +7178,7 @@ class AnimationController {
         this._pointerType = 'none';
         // ── TTS ──
         this._tts = false;
+        this._speechDone = null;
         this.drawTargetEdges = getDrawTargetEdgeIds(steps);
         this.drawTargetNodes = getDrawTargetNodeIds(steps);
         // Groups: non-edge draw steps whose target has a #group-{id} element in the SVG.
@@ -7308,7 +7309,11 @@ class AnimationController {
         while (this.canNext) {
             const nextStep = this.steps[this._step + 1];
             this.next();
-            await new Promise((r) => setTimeout(r, this._playbackWaitMs(nextStep, msPerStep)));
+            // Wait for timer AND speech to finish (whichever is longer)
+            await Promise.all([
+                new Promise((r) => setTimeout(r, this._playbackWaitMs(nextStep, msPerStep))),
+                this._speechDone ?? Promise.resolve(),
+            ]);
         }
     }
     goTo(index) {
@@ -7346,8 +7351,13 @@ class AnimationController {
         // Compute minimum time the step actually needs to finish
         let minNeeded = 0;
         if (step.action === "narrate") {
+            const text = step.value ?? "";
             // Typing effect: chars × typeMs + fade buffer
-            minNeeded = (step.value?.length ?? 0) * ANIMATION.narrationTypeMs + ANIMATION.narrationFadeMs;
+            const typingMs = text.length * ANIMATION.narrationTypeMs + ANIMATION.narrationFadeMs;
+            // TTS estimate: ~150ms per word + 500ms buffer for engine latency
+            const wordCount = text.split(/\s+/).filter(Boolean).length;
+            const ttsMs = this._tts ? wordCount * 150 + 500 : 0;
+            minNeeded = Math.max(typingMs, ttsMs);
         }
         else if (step.action === "circle" || step.action === "underline" ||
             step.action === "crossout" || step.action === "bracket") {
@@ -7892,8 +7902,8 @@ class AnimationController {
     }
     // ── narration ───────────────────────────────────────────
     _initCaption() {
-        if (!this._container)
-            return;
+        // Remove any leftover caption from a previous instance
+        document.querySelector('.skm-caption')?.remove();
         const cap = document.createElement("div");
         cap.className = "skm-caption";
         cap.style.cssText = `
@@ -7923,7 +7933,7 @@ class AnimationController {
             this._captionTextEl.textContent = text;
             return;
         }
-        // Fire TTS first — it has internal startup latency, so give it a head start
+        // Fire TTS as full sentence — play() waits for _speechDone
         if (this._tts && text)
             this._speak(text);
         // Typing effect
@@ -7946,11 +7956,17 @@ class AnimationController {
         utter.rate = 0.95;
         utter.pitch = 1;
         utter.lang = "en-US";
+        // Track when speech actually finishes
+        this._speechDone = new Promise((resolve) => {
+            utter.onend = () => resolve();
+            utter.onerror = () => resolve();
+        });
         speechSynthesis.speak(utter);
     }
     _cancelSpeech() {
         if (typeof speechSynthesis !== "undefined")
             speechSynthesis.cancel();
+        this._speechDone = null;
     }
     /** Pre-warm the speech engine with a silent utterance to eliminate cold-start delay */
     _warmUpSpeech() {
@@ -8457,12 +8473,10 @@ function render(options) {
             interactive: true,
             onNodeClick,
         });
-        // Create rough.js instance for annotations
+        // Create rough.js instance for annotations (same import as SVG renderer)
         let rc = null;
         try {
-            const roughMod = window.rough ?? (typeof require !== 'undefined' ? require('roughjs/bin/rough') : null);
-            if (roughMod?.svg)
-                rc = roughMod.svg(svg);
+            rc = rough.svg(svg);
         }
         catch { /* rough.js not available — annotations disabled */ }
         const containerEl = el instanceof SVGSVGElement ? undefined : el;
@@ -8471,7 +8485,7 @@ function render(options) {
     onReady?.(anim, svg);
     const instance = {
         scene, anim, svg, canvas,
-        update: (newDsl) => render({ ...options, dsl: newDsl }),
+        update: (newDsl) => { anim?.destroy(); return render({ ...options, dsl: newDsl }); },
         exportSVG: (filename = 'diagram.svg') => {
             if (svg) {
                 Promise.resolve().then(function () { return index; }).then(m => m.exportSVG(svg, { filename }));