add input click away blur

lama_cleaner/app/src/components/Header/PromptInput.tsx

@@ -1,4 +1,5 @@
-import React, { FormEvent, useState } from 'react'
+import React, { FormEvent, useRef, useState } from 'react'
+import { useClickAway } from 'react-use'
 import { useRecoilState } from 'recoil'
 import emitter, { EVENT_PROMPT } from '../../event'
 import { appState, propmtState } from '../../store/Atoms'
@@ -9,6 +10,7 @@ import TextInput from '../shared/Input'
 const PromptInput = () => {
   const [app, setAppState] = useRecoilState(appState)
   const [prompt, setPrompt] = useRecoilState(propmtState)
+  const ref = useRef(null)
 
   const handleOnInput = (evt: FormEvent<HTMLInputElement>) => {
     evt.preventDefault()
@@ -23,9 +25,17 @@ const PromptInput = () => {
     }
   }
 
+  useClickAway<MouseEvent>(ref, () => {
+    if (ref?.current) {
+      const input = ref.current as HTMLInputElement
+      input.blur()
+    }
+  })
+
   return (
     <div className="prompt-wrapper">
       <TextInput
+        ref={ref}
         value={prompt}
         onInput={handleOnInput}
         placeholder="I want to repaint of..."