import type { Editor } from "@tiptap/react"
import { ToolbarButton } from "./ToolbarButton"

interface IndentControlsProps {
  editor: Editor
}

export function IndentControls({ editor }: React.PropsWithChildren<IndentControlsProps>) {
  return (
    <div className="flex items-center gap-2">
      <ToolbarButton
        onClick={() => editor.chain().focus().decreaseIndent().run()}
        icon="mdi:format-indent-decrease"
        title="Decrease Indent"
      />
      <ToolbarButton
        onClick={() => editor.chain().focus().increaseIndent().run()}
        icon="mdi:format-indent-increase"
        title="Increase Indent"
      />
    </div>
  )
}