import { Editor as TiptapEditor } from '@tiptap/core';
import { default as CxButton } from '../../../../../../../atoms/src/components/button/button.ts';
import { default as CxCheckbox } from '../../../../../../../atoms/src/components/checkbox/checkbox.ts';
import { default as CxColorPicker } from '../../../../../../../atoms/src/components/color-picker/color-picker.ts';
import { default as CxDialog } from '../../../../../../../atoms/src/components/dialog/dialog.ts';
import { default as CxDropdown } from '../../../../../../../atoms/src/components/dropdown/dropdown.ts';
import { default as CxIcon } from '../../../../../../../atoms/src/components/icon/icon.ts';
import { default as CxIconButton } from '../../../../../../../atoms/src/components/icon-button/icon-button.ts';
import { default as CxInput } from '../../../../../../../atoms/src/components/input/input.ts';
import { default as CxLineClamp } from '../../../../../../../atoms/src/components/line-clamp/line-clamp.ts';
import { default as CxMenu } from '../../../../../../../atoms/src/components/menu/menu.ts';
import { default as CxMenuItem } from '../../../../../../../atoms/src/components/menu-item/menu-item.ts';
import { default as CxOption } from '../../../../../../../atoms/src/components/option/option.ts';
import { default as CxPopup } from '../../../../../../../atoms/src/components/popup/popup.ts';
import { default as CxSelect } from '../../../../../../../atoms/src/components/select/select.ts';
import { default as CxSpace } from '../../../../../../../atoms/src/components/space/space.ts';
import { default as CxTypography } from '../../../../../../../atoms/src/components/typography/typography.ts';
import { default as CortexElement } from '../../../../../../../base/src/cortex-element.ts';
import { default as CxSpecialCharactersDialog } from '../../../../../special-characters-dialog/special-characters-dialog.ts';
import { Asset, AssetTypeString } from '../../../../../../../types/src/content-builder';
import { Component } from 'grapesjs';
import { TemplateResult } from 'lit';
import { default as CxAnchorDialog } from './anchor-dialog';
import { default as CxImageDialog } from './image-dialog';
import { CxSelectWithTooltip } from './select-with-tooltip';

export default class CxRTEBubbleMenu extends CortexElement {
    static readonly styles: import('lit').CSSResult[];
    static readonly dependencies: {
        'cx-anchor-dialog': typeof CxAnchorDialog;
        'cx-button': typeof CxButton;
        'cx-checkbox': typeof CxCheckbox;
        'cx-color-picker': typeof CxColorPicker;
        'cx-dialog': typeof CxDialog;
        'cx-dropdown': typeof CxDropdown;
        'cx-icon': typeof CxIcon;
        'cx-icon-button': typeof CxIconButton;
        'cx-image-dialog': typeof CxImageDialog;
        'cx-input': typeof CxInput;
        'cx-line-clamp': typeof CxLineClamp;
        'cx-menu': typeof CxMenu;
        'cx-menu-item': typeof CxMenuItem;
        'cx-option': typeof CxOption;
        'cx-popup': typeof CxPopup;
        'cx-select': typeof CxSelect;
        'cx-select-with-tooltip': typeof CxSelectWithTooltip;
        'cx-space': typeof CxSpace;
        'cx-special-characters-dialog': typeof CxSpecialCharactersDialog;
        'cx-typography': typeof CxTypography;
    };
    private readonly localize;
    bubbleMenu: CxPopup;
    anchorDialog: CxAnchorDialog;
    specialCharDialog: CxSpecialCharactersDialog;
    assetDialog: CxImageDialog;
    bulletListDropdown?: CxDropdown;
    orderedListDropdown?: CxDropdown;
    tiptapEditor: TiptapEditor | null;
    model: Component | null;
    enableAll: boolean;
    /**
     * enable basic format: Bold, Italic, Underline, Strikethrough
     * @type {boolean}
     * @default true
     */
    basicFormat: boolean;
    /**
     * enable Superscript and Subscript
     * @type {boolean}
     * @default false
     */
    textScript: boolean;
    /**
     * enable Text Alignment
     * @type {boolean}
     * @default false
     */
    textAlignment: boolean;
    /**
     * enable Text Listing: Bulleted and Numbered
     * @type {boolean}
     * @default false
     */
    textListing: boolean;
    /**
     * enable Font Size
     * @type {boolean}
     * @default false
     * */
    fontSize: boolean;
    /**
     * enable Font Color
     * @type {boolean}
     * @default false
     * */
    fontColor: boolean;
    /**
     * enable paragraph formatting: Heading, Blockquote, Code,...
     * @type {boolean}
     * @default false
     * */
    blockFormatting: boolean;
    /**
     * enable Text Indentation
     * @type {boolean}
     * @default false
     * */
    textIndentation: boolean;
    /**
     * enable line height
     * @type {boolean}
     * @default false
     * */
    lineHeight: boolean;
    /**
     * enable Link
     * @type {boolean}
     * @default false
     * */
    link: boolean;
    /**
     * enable Highlight
     * @type {boolean}
     * @default false
     * */
    highlight: boolean;
    /**
     * The boundary property of the confirm popover's dropdown/dialog popup.
     */
    boundary: HTMLElement;
    /**
     * Function to request an asset.
     * This is used to open the asset picker dialog when the user selects an asset from the DAM.
     * The function should return a promise that resolves to an Asset object.
     * @param type - The type of asset to request (image, video, etc.).
     * @returns A promise that resolves to an Asset object.
     * @default undefined
     */
    onRequestAsset: ((type: AssetTypeString) => Promise<Asset>) | undefined;
    singleRow: boolean;
    private isBulletListOpen;
    private isOrderedListOpen;
    private isInvalidUrl;
    private previousTiptapEditor;
    get imageSelected(): boolean;
    constructor();
    runConnectedCallback(): void;
    disconnectedCallback(): void;
    onFontSizeChange(value: string | string[]): void;
    onBlockFormatChange(value: string | string[]): void;
    onLineHeightChange(value: string | string[]): void;
    private onKeydown;
    setTiptapEditor(tiptapEditor: TiptapEditor): void;
    setModel(model: Component): void;
    private addTiptapEditorEvents;
    private removeTiptapEditorEvents;
    handleTiptapEditorChange(): Promise<void>;
    getNearestListItem(): {
        pos: number;
        start: number;
        depth: number;
        node: import('prosemirror-model').Node;
    } | null | undefined;
    renderIconButton(icon: string, label?: string, onClick?: () => void, isActive?: () => boolean | undefined, isDisabled?: () => boolean | undefined, useIconScr?: boolean): TemplateResult<1>;
    renderDropdown(value: string, tooltip: string, options: string[] | Array<{
        label: string;
        renderer?: TemplateResult;
        value: string;
    }>, onChange?: (value: string | string[]) => void, selectClass?: {
        [name: string]: string | boolean | number;
    }, isDisabled?: () => boolean | undefined): TemplateResult<1>;
    renderBasicFormat(): TemplateResult<1>;
    renderTextScript(): TemplateResult<1>;
    renderTextAlignment(): TemplateResult<1>;
    renderList(): TemplateResult<1>;
    renderFontSize(): TemplateResult<1> | null;
    private renderBlockFormatOption;
    renderBlockFormatting(): TemplateResult<1>;
    renderLineHeight(): TemplateResult<1> | null;
    private handleFontColorChange;
    private handleFontColorClear;
    private handleOrderedListAfterHide;
    private handleOrderedListAfterShow;
    private handleBulletListAfterHide;
    private handleBulletListAfterShow;
    renderFontColor(): TemplateResult<1>;
    private handleHighlightChange;
    private handleHighlightClear;
    renderHighlight(): TemplateResult<1>;
    private readonly linkDialogRef;
    private readonly displayTextInputRef;
    private readonly linkUrlInputRef;
    private readonly titleInputRef;
    private readonly newTabCheckBoxRef;
    private setLink;
    private showDialog;
    private handleUnsetLink;
    renderLinkButton(advance?: boolean): TemplateResult<1>;
    renderLinkDialog(): TemplateResult<1>;
    renderTableControl(): TemplateResult<1>;
    private _openAnchorDialog;
    openAnchorDialog(): void;
    private closeAnchorDialog;
    private onConfirmAnchorProperties;
    renderAnchorControl(): TemplateResult<1>;
    private _openSpecialCharDialog;
    openSpecialCharDialog(): void;
    private closeSpecialCharDialog;
    private onConfirmSpecialCharProperties;
    renderSpecialCharControl(): TemplateResult<1>;
    private _openImageDialog;
    private lastSelection;
    openImageDialog(title?: string): void;
    private closeImageDialog;
    private onConfirmImageProperties;
    renderImageDialog(): TemplateResult<1>;
    isEnable(flag: boolean): boolean;
    /** Mirrors `shouldShow` in the RTE: allow the formatting/stacked menu when the selection is non-empty (with the same empty-block edge case) or when the caret is inside a table. */
    bubbleShowsFormattingMenu(): boolean;
    renderMenu(): TemplateResult<1>;
    render(): TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'cx-rte-bubble-menu': CxRTEBubbleMenu;
    }
}
