From 4402715914b12aa6f85dca7f9d3e6864e6a44244 Mon Sep 17 00:00:00 2001 From: CanisMinor Date: Thu, 16 Nov 2023 16:57:23 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20Fix=20options=20type=20ex?= =?UTF-8?q?port?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/release.yml | 2 +- src/core/const/polyfill.ts | 15 ++++++++-- src/react/hooks/useAudioPlayer.ts | 2 +- src/react/hooks/useStreamAudioPlayer.ts | 2 +- src/react/index.ts | 6 ++-- src/react/useMicrosoftSpeech/index.ts | 2 +- src/react/useSpeechSynthes/index.ts | 40 +++++++++++++++++-------- src/react/useTTS/index.ts | 2 +- 8 files changed, 48 insertions(+), 23 deletions(-) diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 0898e78..792ade8 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -30,4 +30,4 @@ jobs: run: bun run release env: GITHUB_TOKEN: ${{ secrets.GH_TOKEN }} - NPM_TOKEN: ${{ secrets.NPM_TOKEN }} \ No newline at end of file + NPM_TOKEN: ${{ secrets.NPM_TOKEN }} diff --git a/src/core/const/polyfill.ts b/src/core/const/polyfill.ts index f670bed..bcd0482 100644 --- a/src/core/const/polyfill.ts +++ b/src/core/const/polyfill.ts @@ -13,10 +13,21 @@ const getSpeechSynthesis = () => { return ( (globalThis as any)?.speechSynthesis || (window as any)?.speechSynthesis || - (window as any)?.speechSynthesis + (window as any)?.webkitSpeechSynthesis + ); + } catch {} +}; + +const getSpeechSynthesisUtterance = () => { + try { + return ( + (globalThis as any)?.SpeechSynthesisUtterance || + (window as any)?.SpeechSynthesisUtterance || + (window as any)?.webkitSpeechSynthesisUtterance ); } catch {} }; export const SpeechRecognition = getSpeechRecognition(); -export const speechSynthesis = getSpeechSynthesis(); +export const SpeechSynthesis = getSpeechSynthesis(); +export const SpeechSynthesisUtterance = getSpeechSynthesisUtterance(); diff --git a/src/react/hooks/useAudioPlayer.ts b/src/react/hooks/useAudioPlayer.ts index 6043c39..99c99ec 100644 --- a/src/react/hooks/useAudioPlayer.ts +++ b/src/react/hooks/useAudioPlayer.ts @@ -1,9 +1,9 @@ import { RefObject, useCallback, useEffect, useRef, useState } from 'react'; import useSWR from 'swr'; -import { AudioProps } from '@/react/AudioPlayer'; import { arrayBufferConvert } from '@/core/utils/arrayBufferConvert'; import { audioBufferToBlob } from '@/core/utils/audioBufferToBlob'; +import { AudioProps } from '@/react/AudioPlayer'; export interface AudioPlayerHook extends AudioProps { isLoading?: boolean; diff --git a/src/react/hooks/useStreamAudioPlayer.ts b/src/react/hooks/useStreamAudioPlayer.ts index ddf74db..a899604 100644 --- a/src/react/hooks/useStreamAudioPlayer.ts +++ b/src/react/hooks/useStreamAudioPlayer.ts @@ -1,7 +1,7 @@ import { RefObject, useCallback, useEffect, useRef, useState } from 'react'; -import { AudioProps } from '@/react/AudioPlayer'; import { audioBufferToBlob, audioBuffersToBlob } from '@/core/utils/audioBufferToBlob'; +import { AudioProps } from '@/react/AudioPlayer'; export interface StreamAudioPlayerHook extends AudioProps { download: () => void; diff --git a/src/react/index.ts b/src/react/index.ts index e949d6b..0f9322c 100644 --- a/src/react/index.ts +++ b/src/react/index.ts @@ -5,8 +5,8 @@ export { useAudioVisualizer } from './hooks/useAudioVisualizer'; export { useBlobUrl } from './hooks/useBlobUrl'; export { useStreamAudioPlayer } from './hooks/useStreamAudioPlayer'; export { useAudioRecorder } from './useAudioRecorder'; -export { useEdgeSpeech } from './useEdgeSpeech'; -export { useMicrosoftSpeech } from './useMicrosoftSpeech'; +export { type EdgeSpeechOptions,useEdgeSpeech } from './useEdgeSpeech'; +export { type MicrosoftSpeechOptions,useMicrosoftSpeech } from './useMicrosoftSpeech'; export { type OpenaiSpeechRecognitionOptions, type OpenAISTTConfig, @@ -21,4 +21,4 @@ export { type SpeechRecognitionOptions, useSpeechRecognition, } from './useSpeechRecognition/useSpeechRecognition'; -export { useSpeechSynthes } from './useSpeechSynthes'; +export { type SpeechSynthesOptions,useSpeechSynthes } from './useSpeechSynthes'; diff --git a/src/react/useMicrosoftSpeech/index.ts b/src/react/useMicrosoftSpeech/index.ts index aa3df13..a47e37e 100644 --- a/src/react/useMicrosoftSpeech/index.ts +++ b/src/react/useMicrosoftSpeech/index.ts @@ -3,7 +3,7 @@ import { useState } from 'react'; import { type MicrosoftSpeechPayload, MicrosoftSpeechTTS } from '@/core/MicrosoftSpeechTTS'; import { TTSConfig, useTTS } from '@/react/useTTS'; -interface MicrosoftSpeechOptions extends Pick, TTSConfig { +export interface MicrosoftSpeechOptions extends Pick, TTSConfig { api?: { url?: string; }; diff --git a/src/react/useSpeechSynthes/index.ts b/src/react/useSpeechSynthes/index.ts index 462d608..6f3cbc6 100644 --- a/src/react/useSpeechSynthes/index.ts +++ b/src/react/useSpeechSynthes/index.ts @@ -1,14 +1,22 @@ -import { useCallback, useMemo, useState } from 'react'; +import { useCallback, useEffect, useMemo, useState } from 'react'; -import { speechSynthesis } from '@/core/const/polyfill'; +import { SpeechSynthesis, SpeechSynthesisUtterance } from '@/core/const/polyfill'; import { SsmlOptions } from '@/core/utils/genSSML'; -export const useSpeechSynthes = (defaultText: string, { voice, rate, pitch }: SsmlOptions) => { - const [voiceList, setVoiceList] = useState(speechSynthesis.getVoices()); +export interface SpeechSynthesOptions extends Pick { + onStart?: () => void; + onStop?: () => void; +} +export const useSpeechSynthes = ( + defaultText: string, + { voice, rate, pitch, ...options }: SpeechSynthesOptions, +) => { + const [voiceList, setVoiceList] = useState(SpeechSynthesis?.getVoices()); const [text, setText] = useState(defaultText); const [isLoading, setIsLoading] = useState(false); const speechSynthesisUtterance = useMemo(() => { + if (!SpeechSynthesisUtterance) return; const utterance = new SpeechSynthesisUtterance(text); utterance.voice = voiceList.find((item: any) => item.name === voice) as any; if (pitch) utterance.pitch = pitch * 10; @@ -16,20 +24,26 @@ export const useSpeechSynthes = (defaultText: string, { voice, rate, pitch }: Ss return utterance; }, [text, voiceList, rate, pitch, voice]); - speechSynthesis.onvoiceschanged = () => { - setVoiceList(speechSynthesis.getVoices()); - }; - speechSynthesisUtterance.onstart = () => setIsLoading(true); - speechSynthesisUtterance.onend = () => setIsLoading(false); + useEffect(() => { + if (!SpeechSynthesis) return; + + SpeechSynthesis.onvoiceschanged = () => { + setVoiceList(SpeechSynthesis?.getVoices()); + }; + SpeechSynthesis.onstart = () => setIsLoading(true); + SpeechSynthesis.onend = () => setIsLoading(false); + }, []); const handleStart = useCallback(() => { - speechSynthesis.speak(speechSynthesisUtterance); - }, [speechSynthesis, speechSynthesisUtterance]); + options?.onStart?.(); + SpeechSynthesis?.speak(speechSynthesisUtterance); + }, [speechSynthesisUtterance]); const handleStop = useCallback(() => { - speechSynthesis.cancel(); + options?.onStop?.(); + speechSynthesis?.cancel(); setIsLoading(false); - }, [speechSynthesis]); + }, []); return { isLoading, diff --git a/src/react/useTTS/index.ts b/src/react/useTTS/index.ts index b0f4241..84d2bdb 100644 --- a/src/react/useTTS/index.ts +++ b/src/react/useTTS/index.ts @@ -1,9 +1,9 @@ import { useCallback, useEffect, useState } from 'react'; import useSWR, { type SWRConfiguration } from 'swr'; +import { splitTextIntoSegments } from '@/core/utils/splitTextIntoSegments'; import { AudioProps } from '@/react/AudioPlayer'; import { useStreamAudioPlayer } from '@/react/hooks/useStreamAudioPlayer'; -import { splitTextIntoSegments } from '@/core/utils/splitTextIntoSegments'; export interface TTSHook extends SWRConfiguration { audio: AudioProps;