1 files changed, 67 insertions, 0 deletions
diff --git a/components/rich-text-editor/InlineStyleMenu.tsx b/components/rich-text-editor/InlineStyleMenu.tsx
new file mode 100644
index 00000000..02eac252
--- /dev/null
+++ b/components/rich-text-editor/InlineStyleMenu.tsx
@@ -0,0 +1,67 @@
+'use client'
+
+import React from 'react'
+import type { Editor } from '@tiptap/react'
+import { Toggle } from '@/components/ui/toggle'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
+import { Bold, Italic, Underline as UnderlineIcon, Strikethrough } from 'lucide-react'
+
+interface InlineStyleMenuProps {
+  editor: Editor | null
+  disabled?: boolean
+  isBold: boolean
+  isItalic: boolean
+  isUnderline: boolean
+  isStrike: boolean
+  executeCommand: (command: () => void) => void
+}
+
+export function InlineStyleMenu({ editor, disabled, isBold, isItalic, isUnderline, isStrike, executeCommand }: InlineStyleMenuProps) {
+  if (!editor) return null
+  return (
+    <>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Toggle size="sm" pressed={isBold} onPressedChange={() => executeCommand(() => editor.chain().focus().toggleBold().run())} disabled={disabled}>
+            <Bold className="h-4 w-4" />
+          </Toggle>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>굵게 (Ctrl+B)</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Toggle size="sm" pressed={isItalic} onPressedChange={() => executeCommand(() => editor.chain().focus().toggleItalic().run())} disabled={disabled}>
+            <Italic className="h-4 w-4" />
+          </Toggle>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>기울임 (Ctrl+I)</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Toggle size="sm" pressed={isUnderline} onPressedChange={() => executeCommand(() => editor.chain().focus().toggleUnderline().run())} disabled={disabled}>
+            <UnderlineIcon className="h-4 w-4" />
+          </Toggle>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>밑줄</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Toggle size="sm" pressed={isStrike} onPressedChange={() => executeCommand(() => editor.chain().focus().toggleStrike().run())} disabled={disabled}>
+            <Strikethrough className="h-4 w-4" />
+          </Toggle>
+        </TooltipTrigger>
+        <TooltipContent>
+          <p>취소선</p>
+        </TooltipContent>
+      </Tooltip>
+    </>
+  )
+}
+
+