From 65723235bfc8f55d44e09747f108646f175cdae4 Mon Sep 17 00:00:00 2001
From: UltraGhostie <38960155+UltraGhostie@users.noreply.github.com>
Date: Thu, 25 Apr 2024 11:35:13 +0200
Subject: [PATCH 1/3] Added delay before writing first word

---
 src/components/Typewriter.tsx |  2 ++
 src/hooks/useTypewriter.tsx   | 64 ++++++++++++++++++++++-------------
 2 files changed, 42 insertions(+), 24 deletions(-)

diff --git a/src/components/Typewriter.tsx b/src/components/Typewriter.tsx
index ac38f80..47e7396 100644
--- a/src/components/Typewriter.tsx
+++ b/src/components/Typewriter.tsx
@@ -16,6 +16,7 @@ export const Typewriter = ({
   typeSpeed = 80,
   deleteSpeed = 50,
   delaySpeed = 1500,
+  delayTime = 100,
   cursor = false,
   cursorStyle = '|',
   cursorColor = 'inherit',
@@ -30,6 +31,7 @@ export const Typewriter = ({
     loop,
     typeSpeed,
     deleteSpeed,
+    delayTime,
     delaySpeed,
     onLoopDone,
     onType,
diff --git a/src/hooks/useTypewriter.tsx b/src/hooks/useTypewriter.tsx
index bb1ebd5..927b0ff 100644
--- a/src/hooks/useTypewriter.tsx
+++ b/src/hooks/useTypewriter.tsx
@@ -20,6 +20,8 @@ export type TypewriterProps = {
   deleteSpeed?: number
   /** Delay time between the words in Milliseconds */
   delaySpeed?: number
+  /** Delay time before start */
+  delayTime?: number
 }
 
 export type TypewriterHelper = {
@@ -39,6 +41,7 @@ export const useTypewriter = ({
   typeSpeed = 80,
   deleteSpeed = 50,
   delaySpeed = 1500,
+  delayTime = 100,
   onLoopDone,
   onType,
   onDelete,
@@ -56,38 +59,51 @@ export const useTypewriter = ({
   const isDelete = useRef(false)
   const isType = useRef(false)
   const isDelay = useRef(false)
+  const isFirst = useRef(true)
+  const isFirstDone = useRef(false)
 
   const handleTyping = useCallback(() => {
     const index = count % words.length
     const fullWord = words[index]
-
-    if (!isDelete.current) {
-      dispatch({ type: 'TYPE', payload: fullWord, speed: typeSpeed })
-      isType.current = true
-
-      if (text === fullWord) {
-        dispatch({ type: 'DELAY', payload: delaySpeed })
-        isType.current = false
-        isDelay.current = true
-
-        setTimeout(() => {
-          isDelay.current = false
-          isDelete.current = true
-        }, delaySpeed)
-
-        if (loop > 0) {
-          loops.current += 1
-          if (loops.current / words.length === loop) {
+    if (!isFirst.current) {
+      if (!isDelete.current) {
+        dispatch({ type: 'TYPE', payload: fullWord, speed: typeSpeed })
+        isType.current = true
+  
+        if (text === fullWord) {
+          dispatch({ type: 'DELAY', payload: delaySpeed })
+          isType.current = false
+          isDelay.current = true
+  
+          setTimeout(() => {
             isDelay.current = false
-            isDone.current = true
+            isDelete.current = true
+          }, delaySpeed)
+  
+          if (loop > 0) {
+            loops.current += 1
+            if (loops.current / words.length === loop) {
+              isDelay.current = false
+              isDone.current = true
+            }
           }
         }
+      } else {
+        dispatch({ type: 'DELETE', payload: fullWord, speed: deleteSpeed })
+        if (text === '') {
+          isDelete.current = false
+          dispatch({ type: 'COUNT' })
+        }
       }
     } else {
-      dispatch({ type: 'DELETE', payload: fullWord, speed: deleteSpeed })
-      if (text === '') {
-        isDelete.current = false
-        dispatch({ type: 'COUNT' })
+      if (!isFirstDone.current) {
+        dispatch({ type: 'DELAY', payload: delayTime })
+        isDelay.current = true
+        setTimeout(() => {
+          isDelay.current = false
+          isFirst.current = false
+        }, delayTime)
+        isFirstDone.current = true
       }
     }
 
@@ -108,6 +124,7 @@ export const useTypewriter = ({
     deleteSpeed,
     loop,
     typeSpeed,
+    delayTime,
     words,
     text,
     onType,
@@ -119,7 +136,6 @@ export const useTypewriter = ({
     const typing = setTimeout(handleTyping, speed)
 
     if (isDone.current) clearTimeout(typing)
-
     return () => clearTimeout(typing)
   }, [handleTyping, speed])
 

From 14a96f83d0b3d259867165f61bf2774755b60686 Mon Sep 17 00:00:00 2001
From: UltraGhostie <38960155+UltraGhostie@users.noreply.github.com>
Date: Thu, 25 Apr 2024 11:39:42 +0200
Subject: [PATCH 2/3] Changed comment and variable name for clarity

---
 src/components/Typewriter.tsx |  4 ++--
 src/hooks/useTypewriter.tsx   | 12 ++++++------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/Typewriter.tsx b/src/components/Typewriter.tsx
index 47e7396..230de0e 100644
--- a/src/components/Typewriter.tsx
+++ b/src/components/Typewriter.tsx
@@ -16,7 +16,7 @@ export const Typewriter = ({
   typeSpeed = 80,
   deleteSpeed = 50,
   delaySpeed = 1500,
-  delayTime = 100,
+  delayStart = 100,
   cursor = false,
   cursorStyle = '|',
   cursorColor = 'inherit',
@@ -31,7 +31,7 @@ export const Typewriter = ({
     loop,
     typeSpeed,
     deleteSpeed,
-    delayTime,
+    delayStart,
     delaySpeed,
     onLoopDone,
     onType,
diff --git a/src/hooks/useTypewriter.tsx b/src/hooks/useTypewriter.tsx
index 927b0ff..de63a54 100644
--- a/src/hooks/useTypewriter.tsx
+++ b/src/hooks/useTypewriter.tsx
@@ -20,8 +20,8 @@ export type TypewriterProps = {
   deleteSpeed?: number
   /** Delay time between the words in Milliseconds */
   delaySpeed?: number
-  /** Delay time before start */
-  delayTime?: number
+  /** Delay time before start in Milliseconds */
+  delayStart?: number
 }
 
 export type TypewriterHelper = {
@@ -41,7 +41,7 @@ export const useTypewriter = ({
   typeSpeed = 80,
   deleteSpeed = 50,
   delaySpeed = 1500,
-  delayTime = 100,
+  delayStart = 100,
   onLoopDone,
   onType,
   onDelete,
@@ -97,12 +97,12 @@ export const useTypewriter = ({
       }
     } else {
       if (!isFirstDone.current) {
-        dispatch({ type: 'DELAY', payload: delayTime })
+        dispatch({ type: 'DELAY', payload: delayStart })
         isDelay.current = true
         setTimeout(() => {
           isDelay.current = false
           isFirst.current = false
-        }, delayTime)
+        }, delayStart)
         isFirstDone.current = true
       }
     }
@@ -124,7 +124,7 @@ export const useTypewriter = ({
     deleteSpeed,
     loop,
     typeSpeed,
-    delayTime,
+    delayStart,
     words,
     text,
     onType,

From da732bdeca1598b47e5eba6cc9b65445b72fffad Mon Sep 17 00:00:00 2001
From: UltraGhostie <38960155+UltraGhostie@users.noreply.github.com>
Date: Thu, 25 Apr 2024 11:50:03 +0200
Subject: [PATCH 3/3] Set default start delay to 0

---
 src/hooks/useTypewriter.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/hooks/useTypewriter.tsx b/src/hooks/useTypewriter.tsx
index de63a54..f60f53a 100644
--- a/src/hooks/useTypewriter.tsx
+++ b/src/hooks/useTypewriter.tsx
@@ -41,7 +41,7 @@ export const useTypewriter = ({
   typeSpeed = 80,
   deleteSpeed = 50,
   delaySpeed = 1500,
-  delayStart = 100,
+  delayStart = 0,
   onLoopDone,
   onType,
   onDelete,