koval-ui/dist/src/lib/TextToSpeech/useSpeechSynth.js

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";
import { useState as d, useRef as m, useEffect as o, useCallback as c } from "react";
const y = ({ language: u, ref: a, onEnd: l, onPause: f, onSpeak: i }) => {
  const [s, p] = d(), e = m();
  o(() => (e.current = window.speechSynthesis, () => {
    e.current?.cancel();
  }), []);
  const [h, r] = d(!1);
  o(() => {
    const t = new SpeechSynthesisUtterance(a.current?.innerText);
    t.lang = u, t.addEventListener("end", (n) => {
      l(n), p(t), r(!1);
    }), t.addEventListener("resume", (n) => {
      i(n), r(!0);
    }), t.addEventListener("start", (n) => {
      i(n), r(!0);
    }), t.addEventListener("pause", (n) => {
      f(n), r(!1);
    }), p(t);
  }, [u, a]);
  const S = c(() => {
    e.current?.paused === !0 ? e.current?.resume() : s && e.current?.speak(s);
  }, [s]), k = c(() => {
    e.current?.cancel(), s && e.current?.speak(s);
  }, [s]), E = c(() => {
    e.current?.pause();
  }, []);
  return { speak: S, pause: E, isSpeaking: h, restart: k };
};
export {
  y as useSpeechSynth
};
//# sourceMappingURL=useSpeechSynth.js.map