import React, { useContext } from 'react';
import classNames from 'classnames';
import TextEditorService from '../../text-editor-service';
import TextEditorContext from '../../text-editor-context';
import EditorButton from './editor-button';
import { jsx as _jsx } from "react/jsx-runtime";
function BlockButton({
  icon,
  format = null,
  tooltip = '',
  testId
}) {
  const {
    slate,
    slateReact
  } = useContext(TextEditorContext);
  const textEditorService = new TextEditorService(slate, slateReact);
  const editor = slateReact.useSlate();
  const isBlockActive = format ? textEditorService.isBlockActive(editor, format) : false;
  return /*#__PURE__*/_jsx(EditorButton, {
    className: classNames({
      active: isBlockActive
    }),
    tooltipText: tooltip,
    icon: icon,
    onClick: () => {
      if (format) {
        textEditorService.focus(editor);
        textEditorService.toggleBlock(editor, format);
      }
    },
    testId: testId
  });
}
export default BlockButton;