import { API, ToolConfig } from '@editorjs/editorjs/types';

interface CommentBlockData {
    id: string;
    count: number;
}
/**
 *  a unique id used to identify section of of comments
 *
 * @type {string|null}
 */
interface RenderBody {
    /**
     *  a unique id used to identify section of of comments
     *
     * @type {string|null}
     */
    commentBlockId: string | null;
    blockId: string | null;
    onClose: () => void;
    addCommentBlockData: (data: CommentBlockData) => void;
    removeBlockComments: () => void;
}
interface CommentConfig {
    markerColor?: string;
    activeColor?: string;
    editorjsId?: string;
    renderBody: ({ commentBlockId, blockId, addCommentBlockData, onClose, removeBlockComments, }: RenderBody) => HTMLElement | any;
}
/**
 *Comment Tool for Editor.js
 *
 * Allows to add comment to section of marked area.
 *
 * ```Typescript
 *  comment: {
    class: Comment,
    inlineToolbar: true,

    config: {
    
      renderBody: ({
        commentBlockId,
        blockId,
        onClose,
        addCommentBlockData,
      }: {
        commentBlockId: string;
        blockId: string;
        onClose: () => void;
        addCommentBlockData: (data: any) => void;
      }) => {
        return RenderItem({
          onClose,
          blockId,
          commentId: commentBlockId,
          setCommentBlockData: addCommentBlockData,
        });
      },
    },
  },
  * ```
 */
declare class Comment {
    /**
     *  a unique id used to identify section of of comments
     *
     * @type {string|null}
     */
    commentBlockId: string | null;
    /**
     * Class name for term-tag
     *
     * @type {string}
     */
    static get CSS(): string;
    /**
     * Color use to override the existing maker background color
     *
     * if added in the config , it will override the existing css color
     *
     * @type {string}
     */
    markerColor?: string;
    /**
     * Color use to override the existing  color for identifying which current  comment is open
     *
     * if added in the config , it will override the existing css color
     *
     * @type {string}
     */
    activeColor?: string;
    private get blockId();
    editorJsId: string;
    iconClasses: {
        base: string;
        active: string;
    };
    /**
     *  Editor.js API
     * @type {API}
     */
    api: API;
    /**
     * Toolbar Button
     *
     * @type {HTMLElement|null}
     */
    button: HTMLElement | null;
    /**
     * Renders the body of the comment tool.
     *
     * @param {RenderBody} params - Parameters for rendering the body
     * @param {string | null} params.commentBlockId - The comment block ID
     * @param {string | null} params.blockId - The block ID
     * @param {() => void} params.onClose - Function to close the comment
     * @param {(data: CommentBlockData) => void} params.addCommentBlockData - Function to add comment block data
     * @returns {HTMLElement  | JSX.Element} - The rendered body element
     */
    renderBody: ({ commentBlockId, blockId, onClose, addCommentBlockData, }: RenderBody) => HTMLElement | null | any;
    /**
     * Class name for term-tag
     *
     * @type {string}
     */
    tag: string;
    range: Range | null;
    constructor({ api, config, }: {
        api: API;
        config?: ToolConfig<CommentConfig>;
    });
    /**
     * Specifies Tool as Inline Toolbar Tool
     *
     * @return {boolean}
     */
    static get isInline(): boolean;
    /**
     * Create button element for Toolbar
     *
     * @return {HTMLElement}
     */
    render(): HTMLDivElement;
    onClose(): void;
    renderActions(): HTMLDivElement;
    /**
     * Wrap/Unwrap selected fragment
     *
     * @param {Range} range - selected fragment
     */
    surround(range: Range): void;
    customSurround(): void;
    /**
     * Wrap selection with term-tag
     *
     * @param {Range} range - selected fragment
     */
    wrap(range: Range): void;
    /**
     * Unwrap term-tag
     *
     * @param {HTMLElement} termWrapper - term wrapper tag
     */
    unwrap(termWrapper: HTMLElement): void;
    addCommentBlockData(data: CommentBlockData): void;
    removeBlockComments(): void;
    setCommentBlockId(element: HTMLElement): void;
    activeOnClick(): void;
    hideCommentComponent(): void;
    renderCommentComponent(): void;
    setActiveClass(): void;
    removeActiveClass(): void;
    elementByAttribute(attributeName: string, value: string): HTMLElement;
    /**
     * Check and change Term's state for current selection
     */
    checkState(): void;
    /**
     * Get Tool icon's SVG
     * @return {string}
     */
    get toolboxIcon(): string;
    /**
     * Sanitizer rule
     * @return {{mark: {class: string}}}
     */
    static get sanitize(): {
        mark: boolean;
    };
}

export { Comment, type CommentBlockData, type CommentConfig, type RenderBody, Comment as default };