chore: remove area focus

Aslam97 · Aug 30, 2024 · 545568d · 545568d
1 parent ebb6976
commit 545568d
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 36 deletions.
diff --git a/src/components/custom/minimal-tiptap-one.tsx b/src/components/custom/minimal-tiptap-one.tsx
@@ -35,12 +35,6 @@ export const MinimalTiptapOne = React.forwardRef<HTMLDivElement, MinimalTiptapPr
       ...props
     })
 
-    const handleClick = () => {
-      if (editor && !editor?.isFocused) {
-        editor?.chain().focus().run()
-      }
-    }
-
     if (!editor) {
       return null
     }
@@ -53,12 +47,8 @@ export const MinimalTiptapOne = React.forwardRef<HTMLDivElement, MinimalTiptapPr
           className
         )}
       >
-        <div className="h-full grow" onClick={handleClick}>
-          <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
-        </div>
-
+        <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
         <Toolbar editor={editor} />
-
         <LinkBubbleMenu editor={editor} />
         <ImageBubbleMenu editor={editor} />
       </div>

diff --git a/src/components/custom/minimal-tiptap-three.tsx b/src/components/custom/minimal-tiptap-three.tsx
@@ -71,12 +71,6 @@ export const MinimalTiptapThree = React.forwardRef<HTMLDivElement, MinimalTiptap
       ...props
     })
 
-    const handleClick = () => {
-      if (editor && !editor?.isFocused) {
-        editor?.chain().focus().run()
-      }
-    }
-
     if (!editor) {
       return null
     }
@@ -90,11 +84,7 @@ export const MinimalTiptapThree = React.forwardRef<HTMLDivElement, MinimalTiptap
         )}
       >
         <Toolbar editor={editor} />
-
-        <div className="h-full grow" onClick={handleClick}>
-          <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
-        </div>
-
+        <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
         <LinkBubbleMenu editor={editor} />
         <ImageBubbleMenu editor={editor} />
       </div>

diff --git a/src/components/custom/types.tsx b/src/components/custom/types.tsx
@@ -12,7 +12,7 @@ const features = [
       <MinimalTiptapOne
         throttleDelay={2000}
         className={cn('h-full min-h-0 w-full rounded-xl')}
-        editorContentClassName="some-class"
+        editorContentClassName="overflow-auto"
         output="html"
         placeholder="Comment here..."
         immediatelyRender={true}
@@ -29,7 +29,7 @@ const features = [
       <MinimalTiptapEditor
         throttleDelay={2000}
         className={cn('h-full min-h-0 w-full rounded-xl')}
-        editorContentClassName="some-class"
+        editorContentClassName="overflow-auto"
         output="html"
         placeholder="Type your description here..."
         immediatelyRender={true}
@@ -46,7 +46,7 @@ const features = [
       <MinimalTiptapThree
         throttleDelay={2000}
         className={cn('h-full min-h-0 w-full rounded-xl')}
-        editorContentClassName="some-class"
+        editorContentClassName="overflow-auto"
         output="html"
         placeholder="This is your placeholder..."
         immediatelyRender={true}

diff --git a/src/components/minimal-tiptap/minimal-tiptap.tsx b/src/components/minimal-tiptap/minimal-tiptap.tsx
@@ -57,12 +57,6 @@ export const MinimalTiptapEditor = React.forwardRef<HTMLDivElement, MinimalTipta
       ...props
     })
 
-    const handleClick = () => {
-      if (editor && !editor?.isFocused) {
-        editor?.chain().focus().run()
-      }
-    }
-
     if (!editor) {
       return null
     }
@@ -76,11 +70,7 @@ export const MinimalTiptapEditor = React.forwardRef<HTMLDivElement, MinimalTipta
         )}
       >
         <Toolbar editor={editor} />
-
-        <div className="h-full grow" onClick={handleClick}>
-          <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
-        </div>
-
+        <EditorContent editor={editor} className={cn('minimal-tiptap-editor', editorContentClassName)} />
         <LinkBubbleMenu editor={editor} />
         <ImageBubbleMenu editor={editor} />
       </div>