import { useState, useEffect } from 'react'; interface UseTypingEffectOptions { words: string[]; typingSpeed?: number; deletingSpeed?: number; pauseDuration?: number; } export function useTypingEffect({ words, typingSpeed = 100, deletingSpeed = 50, pauseDuration = 2000, }: UseTypingEffectOptions) { const [currentWordIndex, setCurrentWordIndex] = useState(0); const [currentText, setCurrentText] = useState(''); const [isDeleting, setIsDeleting] = useState(false); const [isPaused, setIsPaused] = useState(false); useEffect(() => { let timer: ReturnType; if (isPaused) { timer = setTimeout(() => { setIsPaused(false); setIsDeleting(true); }, pauseDuration); } else { const currentWord = words[currentWordIndex]; const isWordDeleted = isDeleting && currentText === ''; if (isWordDeleted) { setIsDeleting(false); setCurrentWordIndex((prev) => (prev + 1) % words.length); } else { const speed = isDeleting ? deletingSpeed : typingSpeed; timer = setTimeout(() => { if (isDeleting) { setCurrentText((prev) => prev.substring(0, prev.length - 1)); } else { const nextText = currentWord.substring(0, currentText.length + 1); setCurrentText(nextText); if (nextText === currentWord) { setIsPaused(true); } } }, speed); } } return () => clearTimeout(timer); }, [ currentText, isDeleting, isPaused, currentWordIndex, words, typingSpeed, deletingSpeed, pauseDuration, ]); return { text: currentText, isTyping: !isDeleting && !isPaused, isDeleting, currentWordIndex, }; }